rythondev/dsec-notebook
1
0
Fork 0
mirror of https://github.com/dsec-hub/dsec-notebook.git synced 2026-09-22 07:24:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #19 from dsec-hub/feature/prompt-unsaved-changes

Browse source 
added prompt to display unsaved changes before leaving post
This commit is contained in:
RythonDev 2026-09-04 20:15:39 +08:00 committed by GitHub
commit b6dc5e22b5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 56 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/routes/post/note/+page.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { query, mutation } from "$lib/api";
import { isAuthenticated, getToken, initAuth } from "$lib/stores/auth";
import { goto } from "$app/navigation";
import { beforeNavigate, goto } from "$app/navigation";
import { onMount } from "svelte";
import { get } from "svelte/store";
import MarkdownEditor from "$lib/components/MarkdownEditor.svelte";
@ -19,6 +19,30 @@
let useCustomUnit = $state(false);
let error = $state("");
let loading = $state(false);
let allowLeave = $state(false);
const isDirty = $derived(
Boolean(
title.trim() ||
content.trim() ||
selectedTopicId ||
selectedUnitId ||
customUnit.trim(),
),
);
beforeNavigate(({ cancel, type }) => {
if (allowLeave || !isDirty || type === "leave") return;
if (!confirm("Are you sure? You have unsaved changes.")) {
cancel();
}
});
function handleBeforeUnload(event: BeforeUnloadEvent) {
if (allowLeave || !isDirty) return;
event.preventDefault();
event.returnValue = "";
}
const topicOptions = $derived(
topics.map((topic) => ({
@ -93,6 +117,7 @@
unitId,
})) as string;
allowLeave = true;
goto(unitCode ? postPath(unitCode, id) : `/notes/${id}`);
} catch (err: any) {
error = err.message ?? "Failed to publish note";
@ -106,6 +131,8 @@
<title>Post a note — Notebook</title>
</svelte:head>
<svelte:window onbeforeunload={handleBeforeUnload} />
<div class="page">
<h1 class="text-ink font-serif text-4xl font-medium">Post a note</h1>
<p class="text-muted mt-2 mb-10 text-[15px]">Share study notes with the Deakin community.</p>

29
src/routes/post/question/+page.svelte
View file

@ -1,7 +1,7 @@
<script lang="ts">
import { query, mutation } from "$lib/api";
import { isAuthenticated, getToken, initAuth } from "$lib/stores/auth";
import { goto } from "$app/navigation";
import { beforeNavigate, goto } from "$app/navigation";
import { onMount } from "svelte";
import { get } from "svelte/store";
import MarkdownEditor from "$lib/components/MarkdownEditor.svelte";
@ -19,6 +19,30 @@
let useCustomUnit = $state(false);
let error = $state("");
let loading = $state(false);
let allowLeave = $state(false);
const isDirty = $derived(
Boolean(
title.trim() ||
content.trim() ||
selectedTopicId ||
selectedUnitId ||
customUnit.trim(),
),
);
beforeNavigate(({ cancel, type }) => {
if (allowLeave || !isDirty || type === "leave") return;
if (!confirm("Are you sure? You have unsaved changes.")) {
cancel();
}
});
function handleBeforeUnload(event: BeforeUnloadEvent) {
if (allowLeave || !isDirty) return;
event.preventDefault();
event.returnValue = "";
}
const topicOptions = $derived(
topics.map((topic) => ({
@ -93,6 +117,7 @@
unitId,
})) as string;
allowLeave = true;
goto(unitCode ? postPath(unitCode, id) : `/questions/${id}`);
} catch (err: any) {
error = err.message ?? "Failed to post question";
@ -106,6 +131,8 @@
<title>Ask a question — Notebook</title>
</svelte:head>
<svelte:window onbeforeunload={handleBeforeUnload} />
<div class="page">
<h1 class="text-ink font-serif text-4xl font-medium">Ask a question</h1>
<p class="text-muted mt-2 mb-10 text-[15px]">