feat: editor language menu, title field, header actions, publish dialogs, read-only rendering and draft recovery

web/src/composables/useUnsavedChangesGuard.ts

@@ -1,4 +1,4 @@
-import { onBeforeRouteLeave } from 'vue-router'
+import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router'
 import { t } from '@/i18n'
 import { useLocalizedOverlay } from '@/i18n/presentation'
 import ConfirmDialog from '@/components/ConfirmDialog.vue'
@@ -7,12 +7,13 @@ import { authRedirectPending } from '@/composables/useApi'
 interface UnsavedChangesOptions {
 	isDirty: () => boolean
 	title: () => string
+	onDiscard?: () => void
 }
 
-export function useUnsavedChangesGuard({ isDirty, title }: UnsavedChangesOptions) {
+export function useUnsavedChangesGuard({ isDirty, title, onDiscard }: UnsavedChangesOptions) {
 	const overlay = useLocalizedOverlay()
 
-	onBeforeRouteLeave(async () => {
+	async function allowsLeaving() {
 		if (authRedirectPending.value || !isDirty()) {
 			return true
 		}
@@ -40,6 +41,13 @@ export function useUnsavedChangesGuard({ isDirty, title }: UnsavedChangesOptions
 				},
 			})
 			.open()
-		return !confirmed
-	})
+		if (confirmed) {
+			return false
+		}
+		onDiscard?.()
+		return true
+	}
+
+	onBeforeRouteLeave(allowsLeaving)
+	onBeforeRouteUpdate((to, from) => (to.params.id === from.params.id ? true : allowsLeaving()))
 }