ami/tl-vikunja
1
0
Fork 0
Code

fix(editor): don't prevent typing editor focus shortcut when other instance of an editor is focused already

Browse Source
This commit is contained in:
kolaente 2023-10-22 10:47:13 +02:00
parent a453449fea
commit 2864854cd4
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
2 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/input/editor/TipTap.vue
View File

@ -162,6 +162,7 @@ import BaseButton from '@/components/base/BaseButton.vue'
import XButton from '@/components/input/button.vue'
import {Placeholder} from '@tiptap/extension-placeholder'
import {eventToHotkeyString} from '@github/hotkey'
import {useBaseStore} from '@/stores/base'
const {t} = useI18n()
@ -205,6 +206,8 @@ const {
editShortcut?: string,
}>()
const baseStore = useBaseStore()
const emit = defineEmits(['update:modelValue', 'save'])
const inputHTML = ref('')
@ -363,6 +366,12 @@ const editor = useEditor({
// JSON
// this.$emit('update:modelValue', this.editor.getJSON())
},
onFocus() {
baseStore.setEditorFocused(true)
},
onBlur() {
baseStore.setEditorFocused(false)
},
})
watch(inputHTML, (value) => {
@ -475,7 +484,7 @@ function handleImagePaste(event) {
function setFocusToEditor(event) {
const hotkeyString = eventToHotkeyString(event)
if (!hotkeyString) return
if (hotkeyString !== editShortcut || editor.value?.isFocused) return
if (hotkeyString !== editShortcut || baseStore.editorFocused) return
event.preventDefault()
editor.value?.commands.focus()

7
src/stores/base.ts
View File

@ -30,6 +30,7 @@ export const useBaseStore = defineStore('base', () => {
const quickActionsActive = ref(false)
const logoVisible = ref(true)
const updateAvailable = ref(false)
const editorFocused = ref(false) // To allow tracking over multiple instances of the editor
function setLoading(newLoading: boolean) {
loading.value = newLoading
@ -92,6 +93,10 @@ export const useBaseStore = defineStore('base', () => {
updateAvailable.value = value
}
function setEditorFocused(value: boolean) {
editorFocused.value = value
}
async function handleSetCurrentProject(
{project, forceUpdate = false}: {project: IProject | null, forceUpdate?: boolean},
) {
@ -150,6 +155,7 @@ export const useBaseStore = defineStore('base', () => {
quickActionsActive: readonly(quickActionsActive),
logoVisible: readonly(logoVisible),
updateAvailable: readonly(updateAvailable),
editorFocused: readonly(editorFocused),
setLoading,
setReady,
@ -161,6 +167,7 @@ export const useBaseStore = defineStore('base', () => {
setBlurHash,
setLogoVisible,
setUpdateAvailable,
setEditorFocused,
handleSetCurrentProject,
loadApp,