Add a toast for missing clipboard permissions. (#4117)
Shows a toast notifying the user that pasting failed due to clipboard permissions. Resolves https://github.com/orgs/tldraw/projects/53?pane=issue&itemId=70294454 ![image](https://github.com/tldraw/tldraw/assets/2523721/704aaca2-a087-4b5b-a0bc-dd710960a318) ### Change type - [ ] `bugfix` - [x] `improvement` - [ ] `feature` - [ ] `api` - [ ] `other` ### Test plan 1. Open a new private window. 2. Copy some shapes and paste them. Make sure you don't allow the clipboard access. 3. You should see the toast. ### Release notes - Show a toast when pasting failed due to missing clipboard permissions.
This commit is contained in:
parent
9a3afa2e2a
commit
ec0ec71c69
5 changed files with 26 additions and 9 deletions
|
@ -59,6 +59,8 @@
|
|||
"action.open-file": "Open file",
|
||||
"action.pack": "Pack",
|
||||
"action.paste": "Paste",
|
||||
"action.paste-error-title": "Pasting failed",
|
||||
"action.paste-error-description": "Could not paste due to missing clipboard permissions. Please enable the permissions and try again.",
|
||||
"action.print": "Print",
|
||||
"action.redo": "Redo",
|
||||
"action.remove-frame": "Remove frame",
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -86,7 +86,7 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
|
|||
const editor = useEditor()
|
||||
|
||||
const { addDialog, clearDialogs } = useDialogs()
|
||||
const { clearToasts } = useToasts()
|
||||
const { clearToasts, addToast } = useToasts()
|
||||
const msg = useTranslation()
|
||||
|
||||
const insertMedia = useInsertMedia()
|
||||
|
@ -944,13 +944,22 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
|
|||
label: 'action.paste',
|
||||
kbd: '$v',
|
||||
onSelect(source) {
|
||||
navigator.clipboard?.read().then((clipboardItems) => {
|
||||
paste(
|
||||
clipboardItems,
|
||||
source,
|
||||
source === 'context-menu' ? editor.inputs.currentPagePoint : undefined
|
||||
)
|
||||
})
|
||||
navigator.clipboard
|
||||
?.read()
|
||||
.then((clipboardItems) => {
|
||||
paste(
|
||||
clipboardItems,
|
||||
source,
|
||||
source === 'context-menu' ? editor.inputs.currentPagePoint : undefined
|
||||
)
|
||||
})
|
||||
.catch(() => {
|
||||
addToast({
|
||||
title: msg('action.paste-error-title'),
|
||||
description: msg('action.paste-error-description'),
|
||||
severity: 'error',
|
||||
})
|
||||
})
|
||||
},
|
||||
},
|
||||
{
|
||||
|
@ -1427,6 +1436,7 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
|
|||
trackEvent,
|
||||
overrides,
|
||||
addDialog,
|
||||
addToast,
|
||||
insertMedia,
|
||||
exportAs,
|
||||
copyAs,
|
||||
|
|
|
@ -63,6 +63,8 @@ export type TLUiTranslationKey =
|
|||
| 'action.open-file'
|
||||
| 'action.pack'
|
||||
| 'action.paste'
|
||||
| 'action.paste-error-title'
|
||||
| 'action.paste-error-description'
|
||||
| 'action.print'
|
||||
| 'action.redo'
|
||||
| 'action.remove-frame'
|
||||
|
|
|
@ -63,6 +63,9 @@ export const DEFAULT_TRANSLATION = {
|
|||
'action.open-file': 'Open file',
|
||||
'action.pack': 'Pack',
|
||||
'action.paste': 'Paste',
|
||||
'action.paste-error-title': 'Pasting failed',
|
||||
'action.paste-error-description':
|
||||
'Could not paste due to missing clipboard permissions. Please enable the permissions and try again.',
|
||||
'action.print': 'Print',
|
||||
'action.redo': 'Redo',
|
||||
'action.remove-frame': 'Remove frame',
|
||||
|
|
Loading…
Reference in a new issue