Browse Source

Merge pull request #3690 from nocodb/fix/copy-to-clipboard

Fix: Add a fallback function copy to clipboard
pull/3701/head
navi 2 years ago committed by GitHub
parent
commit
42be7ece8b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 1
      packages/nc-gui/components.d.ts
  2. 4
      packages/nc-gui/components/smartsheet-toolbar/ShareView.vue
  3. 4
      packages/nc-gui/components/smartsheet-toolbar/SharedViewList.vue
  4. 4
      packages/nc-gui/components/smartsheet/ApiSnippet.vue
  5. 4
      packages/nc-gui/components/smartsheet/Grid.vue
  6. 4
      packages/nc-gui/components/tabs/auth/ApiTokenManagement.vue
  7. 4
      packages/nc-gui/components/tabs/auth/UserManagement.vue
  8. 4
      packages/nc-gui/components/tabs/auth/user-management/ShareBase.vue
  9. 4
      packages/nc-gui/components/tabs/auth/user-management/UsersModal.vue
  10. 1
      packages/nc-gui/composables/index.ts
  11. 1
      packages/nc-gui/composables/useColumnCreateStore.ts
  12. 26
      packages/nc-gui/composables/useCopy.ts
  13. 4
      packages/nc-gui/pages/[projectType]/[projectId]/index.vue

1
packages/nc-gui/components.d.ts vendored

@ -232,6 +232,7 @@ declare module '@vue/runtime-core' {
MdiUpload: typeof import('~icons/mdi/upload')['default']
MdiUploadOutline: typeof import('~icons/mdi/upload-outline')['default']
MdiViewListOutline: typeof import('~icons/mdi/view-list-outline')['default']
MdiWarning: typeof import('~icons/mdi/warning')['default']
MdiWhatsapp: typeof import('~icons/mdi/whatsapp')['default']
MdiXml: typeof import('~icons/mdi/xml')['default']
MiCircleWarning: typeof import('~icons/mi/circle-warning')['default']

4
packages/nc-gui/components/smartsheet-toolbar/ShareView.vue

@ -4,7 +4,7 @@ import { message } from 'ant-design-vue'
import {
computed,
extractSdkResponseErrorMsg,
useClipboard,
useCopy,
useI18n,
useNuxtApp,
useProject,
@ -17,7 +17,7 @@ const { t } = useI18n()
const { view, $api } = useSmartsheetStoreOrThrow()
const { copy } = useClipboard()
const { copy } = useCopy()
const { $e } = useNuxtApp()

4
packages/nc-gui/components/smartsheet-toolbar/SharedViewList.vue

@ -1,7 +1,7 @@
<script lang="ts" setup>
import { ViewTypes } from 'nocodb-sdk'
import { Empty, message } from 'ant-design-vue'
import { extractSdkResponseErrorMsg, onMounted, useClipboard, useI18n, useSmartsheetStoreOrThrow } from '#imports'
import { extractSdkResponseErrorMsg, onMounted, useCopy, useI18n, useSmartsheetStoreOrThrow } from '#imports'
import MdiVisibilityOnIcon from '~icons/mdi/visibility'
import MdiVisibilityOffIcon from '~icons/mdi/visibility-off'
import MdiCopyIcon from '~icons/mdi/content-copy'
@ -20,7 +20,7 @@ const { t } = useI18n()
const { $api, meta } = useSmartsheetStoreOrThrow()
const { copy } = useClipboard()
const { copy } = useCopy()
const { dashboardUrl } = useDashboard()

4
packages/nc-gui/components/smartsheet/ApiSnippet.vue

@ -5,7 +5,7 @@ import {
ActiveViewInj,
MetaInj,
inject,
useClipboard,
useCopy,
useGlobal,
useI18n,
useProject,
@ -36,7 +36,7 @@ const { xWhere } = useSmartsheetStoreOrThrow()
const { queryParams } = $(useViewData($$(meta), $$(view), xWhere))
const { copy } = useClipboard()
const { copy } = useCopy()
let vModel = $(useVModel(props, 'modelValue', emits))

4
packages/nc-gui/components/smartsheet/Grid.vue

@ -23,7 +23,7 @@ import {
provide,
reactive,
ref,
useClipboard,
useCopy,
useEventListener,
useGridViewColumnWidth,
useI18n,
@ -97,7 +97,7 @@ const {
const { loadGridViewColumns, updateWidth, resizingColWidth, resizingCol } = useGridViewColumnWidth(view)
const { copy } = useClipboard()
const { copy } = useCopy()
onMounted(loadGridViewColumns)

4
packages/nc-gui/components/tabs/auth/ApiTokenManagement.vue

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { ApiTokenType } from 'nocodb-sdk'
import { message } from 'ant-design-vue'
import { extractSdkResponseErrorMsg, useClipboard, useI18n } from '#imports'
import { extractSdkResponseErrorMsg, useCopy, useI18n } from '#imports'
import KebabIcon from '~icons/ic/baseline-more-vert'
import MdiPlusIcon from '~icons/mdi/plus'
import CloseIcon from '~icons/material-symbols/close-rounded'
@ -21,7 +21,7 @@ const { $api, $e } = useNuxtApp()
const { project } = $(useProject())
const { copy } = useClipboard()
const { copy } = useCopy()
let tokensInfo = $ref<ApiToken[] | undefined>([])

4
packages/nc-gui/components/tabs/auth/UserManagement.vue

@ -8,7 +8,7 @@ import {
onBeforeMount,
ref,
useApi,
useClipboard,
useCopy,
useDashboard,
useI18n,
useNuxtApp,
@ -26,7 +26,7 @@ const { api } = useApi()
const { project } = useProject()
const { copy } = useClipboard()
const { copy } = useCopy()
const { isUIAllowed } = useUIPermission()

4
packages/nc-gui/components/tabs/auth/user-management/ShareBase.vue

@ -1,6 +1,6 @@
<script setup lang="ts">
import { message } from 'ant-design-vue'
import { extractSdkResponseErrorMsg, onMounted, useClipboard, useI18n, useNuxtApp, useProject } from '#imports'
import { extractSdkResponseErrorMsg, onMounted, useCopy, useI18n, useNuxtApp, useProject } from '#imports'
interface ShareBase {
uuid?: string
@ -25,7 +25,7 @@ const showEditBaseDropdown = $ref(false)
const { project } = useProject()
const { copy } = useClipboard()
const { copy } = useCopy()
const url = $computed(() => (base && base.uuid ? `${dashboardUrl}#/base/${base.uuid}` : null))

4
packages/nc-gui/components/tabs/auth/user-management/UsersModal.vue

@ -9,7 +9,7 @@ import {
projectRoleTagColors,
projectRoles,
ref,
useClipboard,
useCopy,
useDashboard,
useI18n,
useNuxtApp,
@ -37,7 +37,7 @@ const { t } = useI18n()
const { project } = useProject()
const { $api, $e } = useNuxtApp()
const { copy } = useClipboard()
const { copy } = useCopy()
const { dashboardUrl } = $(useDashboard())
const usersData = $ref<Users>({ emails: undefined, role: ProjectRole.Viewer, invitationToken: undefined })

1
packages/nc-gui/composables/index.ts

@ -25,3 +25,4 @@ export * from './useLTARStore'
export * from './useExpandedFormStore'
export * from './useSharedFormViewStore'
export * from './useCellUrlConfig'
export * from './useCopy'

1
packages/nc-gui/composables/useColumnCreateStore.ts

@ -4,7 +4,6 @@ import type { ColumnType, TableType } from 'nocodb-sdk'
import { UITypes } from 'nocodb-sdk'
import type { Ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useColumn } from './useColumn'
import { computed, createInjectionState, extractSdkResponseErrorMsg, useNuxtApp } from '#imports'
const useForm = Form.useForm

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

@ -0,0 +1,26 @@
import { useClipboard } from '#imports'
export const useCopy = () => {
/** fallback for copy if clipboard api is not supported */
const copyFallback = (text: string) => {
const textAreaEl = document.createElement('textarea')
textAreaEl.innerHTML = text
document.body.appendChild(textAreaEl)
textAreaEl.select()
const result = document.execCommand('copy')
document.body.removeChild(textAreaEl)
return result
}
const { copy: _copy, isSupported } = useClipboard()
const copy = async (text: string) => {
if (isSupported) {
await _copy(text)
} else {
copyFallback(text)
}
}
return { copy }
}

4
packages/nc-gui/pages/[projectType]/[projectId]/index.vue

@ -12,7 +12,7 @@ import {
projectThemeColors,
provide,
ref,
useClipboard,
useCopy,
useGlobal,
useI18n,
useProject,
@ -42,7 +42,7 @@ const { clearTabs, addTab } = useTabs()
const { isUIAllowed } = useUIPermission()
const { copy } = useClipboard()
const { copy } = useCopy()
const isLocked = ref(false)

Loading…
Cancel
Save