From f3332d2f3cc94310d63badb4c5551d525b937c9a Mon Sep 17 00:00:00 2001 From: Huakun Shen Date: Fri, 28 Mar 2025 07:00:04 -0400 Subject: [PATCH] Refactor window handling to improve safety and consistency - Introduced optional chaining for `data.win` to prevent potential runtime errors when accessing window methods. - Updated various components to ensure proper handling of window focus and visibility. - Enhanced the layout and extension pages to utilize the current webview window more effectively, improving overall user experience. --- apps/desktop/src/lib/stores/appConfig.ts | 3 +-- apps/desktop/src/routes/+layout.ts | 7 +++++-- apps/desktop/src/routes/app/+layout.svelte | 2 +- .../app/extension/key-displayer/+page.svelte | 2 +- .../app/extension/pin-screenshot/+page.svelte | 14 ++++++++------ .../routes/app/extension/ui-iframe/+page.svelte | 12 ++++++------ apps/desktop/src/routes/splashscreen/+page.svelte | 2 +- 7 files changed, 23 insertions(+), 19 deletions(-) diff --git a/apps/desktop/src/lib/stores/appConfig.ts b/apps/desktop/src/lib/stores/appConfig.ts index b49de39..f4e380a 100644 --- a/apps/desktop/src/lib/stores/appConfig.ts +++ b/apps/desktop/src/lib/stores/appConfig.ts @@ -5,9 +5,9 @@ import { LoadingAnimation, PersistedAppConfig, type AppConfigState } from "@kksh import { debug, error, info } from "@tauri-apps/plugin-log" import * as os from "@tauri-apps/plugin-os" import { load } from "@tauri-apps/plugin-store" +import { Store } from "@tauri-store/svelte" import { toast } from "svelte-sonner" import { get, writable } from "svelte/store" -import { Store } from "@tauri-store/svelte" import * as v from "valibot" export const defaultAppConfig: AppConfigState = { @@ -105,6 +105,5 @@ class AppConfigStore extends Store implements AppConfigAPI { } } - // export const appConfig = createAppConfig() export const appConfig = new AppConfigStore() diff --git a/apps/desktop/src/routes/+layout.ts b/apps/desktop/src/routes/+layout.ts index 96078e6..cc6d9dd 100644 --- a/apps/desktop/src/routes/+layout.ts +++ b/apps/desktop/src/routes/+layout.ts @@ -1,4 +1,5 @@ import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow" +import { browser } from "$app/environment" // Tauri doesn't have a Node.js server to do proper SSR // so we will use adapter-static to prerender the app (SSG) @@ -7,6 +8,8 @@ export const prerender = true export const ssr = false export const load = () => { - const win = getCurrentWebviewWindow() - return { win } + if (browser) { + const win = getCurrentWebviewWindow() + return { win } + } } diff --git a/apps/desktop/src/routes/app/+layout.svelte b/apps/desktop/src/routes/app/+layout.svelte index baaf21b..51457ea 100644 --- a/apps/desktop/src/routes/app/+layout.svelte +++ b/apps/desktop/src/routes/app/+layout.svelte @@ -101,7 +101,7 @@ }) ) } - data.win.setFocus() + data.win?.show().then(() => data.win?.setFocus()) }) diff --git a/apps/desktop/src/routes/app/extension/key-displayer/+page.svelte b/apps/desktop/src/routes/app/extension/key-displayer/+page.svelte index 21c009a..8dce509 100644 --- a/apps/desktop/src/routes/app/extension/key-displayer/+page.svelte +++ b/apps/desktop/src/routes/app/extension/key-displayer/+page.svelte @@ -99,7 +99,7 @@ } $effect(() => { - data.win.show().then(() => data.win.setFocus()) + data.win?.show().then(() => data.win?.setFocus()) userInput.setEventTypes([userInput.EventTypeEnum.KeyPress, userInput.EventTypeEnum.KeyRelease]) userInput.startListening((evt: InputEvent) => { diff --git a/apps/desktop/src/routes/app/extension/pin-screenshot/+page.svelte b/apps/desktop/src/routes/app/extension/pin-screenshot/+page.svelte index d7db6bd..ef04a5a 100644 --- a/apps/desktop/src/routes/app/extension/pin-screenshot/+page.svelte +++ b/apps/desktop/src/routes/app/extension/pin-screenshot/+page.svelte @@ -2,6 +2,7 @@ import { Button } from "@kksh/svelte5" import { Layouts } from "@kksh/ui" import { LogicalSize } from "@tauri-apps/api/dpi" + import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow" import { CircleX } from "lucide-svelte" import { onMount } from "svelte" import * as clipboard from "tauri-plugin-clipboard-api" @@ -14,16 +15,17 @@ let currentSize = $derived( originalSize ? { width: originalSize.width * scale, height: originalSize.height * scale } : null ) + const win = getCurrentWebviewWindow() $effect(() => { if (currentSize) { - data.win.setSize(new LogicalSize(currentSize.width, currentSize.height)) + win.setSize(new LogicalSize(currentSize.width, currentSize.height)) } }) async function getWindowSize() { - const size = await data.win.outerSize() - const scaleFactor = originalScaleFactor ?? (await data.win.scaleFactor()) + const size = await win.outerSize() + const scaleFactor = originalScaleFactor ?? (await win.scaleFactor()) const logicalSize = size.toLogical(scaleFactor) return { logicalSize, scaleFactor } } @@ -35,7 +37,7 @@ image = b64 }) .finally(() => { - data.win.show().then(() => data.win.setFocus()) + data.win?.show().then(() => data.win?.setFocus()) }) const { logicalSize, scaleFactor } = await getWindowSize() originalSize = { width: logicalSize.width, height: logicalSize.height } @@ -66,11 +68,11 @@ { if (e.key === "Escape") { - data.win.close() + win.close() } }} /> -
diff --git a/apps/desktop/src/routes/app/extension/ui-iframe/+page.svelte b/apps/desktop/src/routes/app/extension/ui-iframe/+page.svelte index 52f94dd..8674f6d 100644 --- a/apps/desktop/src/routes/app/extension/ui-iframe/+page.svelte +++ b/apps/desktop/src/routes/app/extension/ui-iframe/+page.svelte @@ -64,7 +64,7 @@ if (isInMainWindow()) { goto(i18n.resolveRoute("/app/")) } else { - data.win.close() + data.win?.close() } }, hideBackButton: async () => { @@ -130,7 +130,7 @@ }, getSpawnedProcesses: () => Promise.resolve(extSpawnedProcesses), paste: async () => { - await data.win.hide() + await data.win?.hide() await sleep(200) return paste() } @@ -154,7 +154,7 @@ if (isInMainWindow()) { goHome() } else { - data.win.close() + data.win?.close() } } @@ -169,7 +169,7 @@ onMount(() => { appState.setFullScreenLoading(true) setTimeout(() => { - data.win.setFocus() + data.win?.setFocus() }, 200) if (iframeRef?.contentWindow) { const io = new IframeParentIO(iframeRef.contentWindow) @@ -195,7 +195,7 @@ }) onDestroy(() => { - winExtMap.unregisterExtensionFromWindow(data.win.label) + winExtMap.unregisterExtensionFromWindow(data.win?.label ?? "") }) @@ -208,7 +208,7 @@ onclick={onBackBtnClicked} style={`${positionToCssStyleString(uiControl.backBtnPosition)}`} > - {#if data.win.label === "main"} + {#if data.win?.label === "main"} {:else} diff --git a/apps/desktop/src/routes/splashscreen/+page.svelte b/apps/desktop/src/routes/splashscreen/+page.svelte index 9b95107..b746a8a 100644 --- a/apps/desktop/src/routes/splashscreen/+page.svelte +++ b/apps/desktop/src/routes/splashscreen/+page.svelte @@ -5,7 +5,7 @@ let { data } = $props() onMount(() => { - data.win.show().then(() => data.win.setFocus()) + data.win?.show().then(() => data.win?.setFocus()) })