nocodb/packages/nc-gui/composables/useCopy.ts

import { Modal } from 'ant-design-vue'
import { useClipboard, useI18n } from '#imports'

export const useCopy = (showDialogIfFailed = false) => {
  const { t } = useI18n()

  /** fallback for copy if clipboard api is not supported */
  const copyFallback = async (text: string, retryCount = 0): Promise<boolean> => {
    try {
      const textAreaEl = document.createElement('textarea')
      textAreaEl.innerHTML = text
      document.body.appendChild(textAreaEl)
      textAreaEl.select()
      const result = document.execCommand('copy')
      document.body.removeChild(textAreaEl)
      if (!result && retryCount < 3) {
        // retry if copy failed
        return new Promise((resolve, reject) =>
          setTimeout(
            () =>
              copyFallback(text, retryCount + 1)
                .then(resolve)
                .catch(reject),
            100,
          ),
        )
      }

      if (!result) {
        throw new Error('failed')
      }
      return result
    } catch (e) {
      if (!showDialogIfFailed) throw new Error(t('msg.error.copyToClipboardError'))

      Modal.info({
        title: 'Copy failed, please manually copy it from here',
        content: text,
        class: 'nc-copy-failed-modal',
        width: '550px',
      })
      return false
    }
  }

  const { copy: _copy, isSupported } = useClipboard()

  const copy = async (text: string) => {
    try {
      if (isSupported.value) {
        await _copy(text)
        return true
      }
    } catch {}

    return copyFallback(text)
  }

  return { copy }
}