From d99b42324eb16aa2c4e941cfcea6de98f4474189 Mon Sep 17 00:00:00 2001
From: Jannis Mattheis <contact@jmattheis.de>
Date: Fri, 8 Aug 2025 10:24:39 +0200
Subject: [PATCH] fix: refetch data on reconnect

---
 ui/src/CurrentUser.ts    | 2 ++
 ui/src/layout/Layout.tsx | 5 ++++-
 ui/src/reactions.ts      | 1 +
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/ui/src/CurrentUser.ts b/ui/src/CurrentUser.ts
index 39409cd..c642348 100644
--- a/ui/src/CurrentUser.ts
+++ b/ui/src/CurrentUser.ts
@@ -12,6 +12,7 @@ export class CurrentUser {
     private reconnectTimeoutId: number | null = null;
     private reconnectTime = 7500;
     public loggedIn = false;
+    public refreshKey = 0;
     public authenticating = true;
     public user: IUser = {name: 'unknown', admin: false, id: -1};
     public connectionErrorMessage: string | null = null;
@@ -22,6 +23,7 @@ export class CurrentUser {
             authenticating: observable,
             user: observable,
             connectionErrorMessage: observable,
+            refreshKey: observable,
         });
     }
 
diff --git a/ui/src/layout/Layout.tsx b/ui/src/layout/Layout.tsx
index bb5e652..0f24c87 100644
--- a/ui/src/layout/Layout.tsx
+++ b/ui/src/layout/Layout.tsx
@@ -58,6 +58,7 @@ const Layout = observer(() => {
             logout,
             tryReconnect,
             connectionErrorMessage,
+            refreshKey,
         },
     } = useStores();
     const {classes} = useStyles();
@@ -84,7 +85,9 @@ const Layout = observer(() => {
         <StyledEngineProvider injectFirst>
             <ThemeProvider theme={theme}>
                 <HashRouter>
-                    <div>
+                    {/* This forces all components to fully rerender including useEffects.
+                        The refreshKey is updated when store data was cleaned and pages should refetch their data. */}
+                    <div key={refreshKey}>
                         {!connectionErrorMessage ? null : (
                             <ConnectionErrorBanner
                                 height={64}
diff --git a/ui/src/reactions.ts b/ui/src/reactions.ts
index 0f980bd..81e292b 100644
--- a/ui/src/reactions.ts
+++ b/ui/src/reactions.ts
@@ -40,6 +40,7 @@ export const registerReactions = (stores: StoreMapping) => {
             if (!connectionErrorMessage) {
                 clearAll();
                 loadAll();
+                stores.currentUser.refreshKey++;
             }
         }
     );