diff --git a/ui/src/hooks/stores.ts b/ui/src/hooks/stores.ts index c56cb5f8..0be28425 100644 --- a/ui/src/hooks/stores.ts +++ b/ui/src/hooks/stores.ts @@ -603,6 +603,9 @@ export interface UpdateState { updateErrorMessage: string | null; setUpdateErrorMessage: (errorMessage: string) => void; + + shouldReload: boolean; + setShouldReload: (reloadRequired: boolean) => void; } export const useUpdateStore = create(set => ({ @@ -640,6 +643,9 @@ export const useUpdateStore = create(set => ({ updateErrorMessage: null, setUpdateErrorMessage: (errorMessage: string) => set({ updateErrorMessage: errorMessage }), + + shouldReload: false, + setShouldReload: (reloadRequired: boolean) => set({ shouldReload: reloadRequired }), })); export type UsbConfigModalViews = "updateUsbConfig" | "updateUsbConfigSuccess"; @@ -850,12 +856,12 @@ export interface MacrosState { loadMacros: () => Promise; saveMacros: (macros: KeySequence[]) => Promise; sendFn: - | (( - method: string, - params: unknown, - callback?: ((resp: JsonRpcResponse) => void) | undefined, - ) => void) - | null; + | (( + method: string, + params: unknown, + callback?: ((resp: JsonRpcResponse) => void) | undefined, + ) => void) + | null; setSendFn: ( sendFn: ( method: string, diff --git a/ui/src/routes/devices.$id.settings.general.update.tsx b/ui/src/routes/devices.$id.settings.general.update.tsx index 285ce940..dd800011 100644 --- a/ui/src/routes/devices.$id.settings.general.update.tsx +++ b/ui/src/routes/devices.$id.settings.general.update.tsx @@ -18,20 +18,24 @@ export default function SettingsGeneralUpdateRoute() { const location = useLocation(); const { updateSuccess } = location.state || {}; - const { setModalView, otaState } = useUpdateStore(); + const { setModalView, otaState, shouldReload, setShouldReload } = useUpdateStore(); const { send } = useJsonRpc(); const onClose = useCallback(async () => { navigate(".."); // back to the devices.$id.settings page - // Add 1s delay between navigation and calling reload() to prevent reload from interrupting the navigation. - await sleep(1000); - window.location.reload(); // force a full reload to ensure the current device/cloud UI version is loaded - }, [navigate]); + + if (shouldReload) { + setShouldReload(false); + await sleep(1000); // Add 1s delay between navigation and calling reload() to prevent reload from interrupting the navigation. + window.location.reload(); // force a full reload to ensure the current device/cloud UI version is loaded + } + }, [navigate, setShouldReload, shouldReload]); const onConfirmUpdate = useCallback(() => { + setShouldReload(true); send("tryUpdate", {}); setModalView("updating"); - }, [send, setModalView]); + }, [send, setModalView, setShouldReload]); useEffect(() => { if (otaState.updating) { @@ -133,6 +137,7 @@ function LoadingState({ const { setModalView } = useUpdateStore(); const progressBarRef = useRef(null); + useEffect(() => { abortControllerRef.current = new AbortController(); const signal = abortControllerRef.current.signal;