useCopyToClipboard

    0

    0

    The CopyFn function takes in a text argument and must return a boolean value. If the function is successful, the returned value will be true, otherwise false will be returned.

    Library: react

    import { useState } from 'react'
    
    type CopiedValue = string | null
    type CopyFn = (text: string) => Promise<boolean>
    
    function useCopyToClipboard(): [CopiedValue, CopyFn] {
      const [copiedText, setCopiedText] = useState<CopiedValue>(null)
    
      const copy: CopyFn = async text => {
        if (!navigator?.clipboard) {
          console.warn('Clipboard not supported')
          return false
        }
    
        try {
          await navigator.clipboard.writeText(text)
          setCopiedText(text)
          return true
        } catch (error) {
          console.warn('Copy failed', error)
          setCopiedText(null)
          return false
        }
      }
    
      return [copiedText, copy]
    }
    
    export default useCopyToClipboard
    Codiga Logo
    Codiga Hub
    • Rulesets
    • Playground
    • Snippets
    • Cookbooks
    soc-2 icon

    We are SOC-2 Compliance Certified

    G2 high performer medal

    Codiga – All rights reserved 2022.