refactor: tanstack & zustand overhaul

Signed-off-by: Adam Setch <adam.setch@outlook.com>

Author: setchy

biome.json

@@ -1,10 +1,7 @@
 {
   "$schema": "https://biomejs.dev/schemas/2.4.3/schema.json",
   "files": {
-    "includes": [
-      "**",
-      "!**/generated/**/*"
-    ]
+    "includes": ["**", "!**/generated/**/*"]
   },
   "assist": {
     "actions": {
@@ -15,33 +12,21 @@
             "groups": [
               ":NODE:",
               ":BLANK_LINE:",
-              [
-                "react*",
-                "@testing-library/**"
-              ],
+              ["react*", "@testing-library/**"],
               ":BLANK_LINE:",
-              [
-                "*electron*",
-                "menubar"
-              ],
+              ["*electron*", "menubar"],
               ":BLANK_LINE:",
               "@primer/**",
               ":BLANK_LINE:",
               "@octokit/**",
               ":BLANK_LINE:",
               ":PACKAGE:",
               ":BLANK_LINE:",
-              [
-                "**/__mocks__/**",
-                "**/__helpers__/**"
-              ],
+              ["**/__mocks__/**", "**/__helpers__/**"],
               ":BLANK_LINE:",
               "**/shared/**",
               ":BLANK_LINE:",
-              [
-                "**/constants",
-                "**/constants/**"
-              ],
+              ["**/constants", "**/constants/**"],
               ":BLANK_LINE:",
               [
                 "**/context/**",
@@ -95,10 +80,7 @@
         "useHookAtTopLevel": {
           "level": "error",
           "options": {
-            "ignore": [
-              "useAlternateIdleIcon",
-              "useUnreadActiveIcon"
-            ]
+            "ignore": ["useAlternateIdleIcon", "useUnreadActiveIcon"]
           }
         }
       },
@@ -151,4 +133,4 @@
     "clientKind": "git",
     "useIgnoreFile": true
   }
-}
+}

package.json

@@ -143,4 +143,4 @@
     "*": "biome check --no-errors-on-unmatched",
     "*.{js,ts,tsx}": "pnpm test --changed --passWithNoTests --update"
   }
-}
+}

src/renderer/__helpers__/test-utils.tsx

@@ -3,31 +3,37 @@ import { type ReactElement, type ReactNode, useMemo } from 'react';
 
 import { BaseStyles, ThemeProvider } from '@primer/react';
 
-import { mockAuth, mockSettings } from '../__mocks__/state-mocks';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
 import { AppContext, type AppContextState } from '../context/App';
 
 export type DeepPartial<T> = { [K in keyof T]?: DeepPartial<T[K]> };
 
+const EMPTY_APP_CONTEXT: Partial<AppContextState> = {};
+
+/**
+ * Test context (settings removed as it's no longer in context)
+ */
+type TestAppContext = Partial<AppContextState>;
+
 /**
  * Props for the AppContextProvider wrapper
  */
 interface AppContextProviderProps {
   readonly children: ReactNode;
-  readonly value?: Partial<AppContextState>;
+  readonly value?: TestAppContext;
 }
 
 /**
  * Wrapper component that provides ThemeProvider, BaseStyles, and AppContext
  * with sensible defaults for testing.
  */
-function AppContextProvider({ children, value = {} }: AppContextProviderProps) {
+function AppContextProvider({
+  children,
+  value = EMPTY_APP_CONTEXT,
+}: AppContextProviderProps) {
   const defaultValue: AppContextState = useMemo(() => {
     return {
-      auth: mockAuth,
-      settings: mockSettings,
-      isLoggedIn: true,
-
       notifications: [],
       notificationCount: 0,
       unreadNotificationCount: 0,
@@ -52,11 +58,6 @@ function AppContextProvider({ children, value = {} }: AppContextProviderProps) {
       markNotificationsAsDone: vi.fn(),
       unsubscribeNotification: vi.fn(),
 
-      clearFilters: vi.fn(),
-      resetSettings: vi.fn(),
-      updateSetting: vi.fn(),
-      updateFilter: vi.fn(),
-
       ...value,
     } as AppContextState;
   }, [value]);
@@ -82,9 +83,21 @@ export function renderWithAppContext(
   ui: ReactElement,
   context: Partial<AppContextState> = {},
 ) {
+  const queryClient = new QueryClient({
+    defaultOptions: {
+      queries: {
+        retry: false,
+        refetchOnWindowFocus: false,
+        refetchInterval: false,
+      },
+    },
+  });
+
   return render(ui, {
     wrapper: ({ children }) => (
-      <AppContextProvider value={context}>{children}</AppContextProvider>
+      <QueryClientProvider client={queryClient}>
+        <AppContextProvider value={context}>{children}</AppContextProvider>
+      </QueryClientProvider>
     ),
   });
 }

src/renderer/components/AllRead.test.tsx

@@ -4,9 +4,9 @@ import {
   ensureStableEmojis,
   renderWithAppContext,
 } from '../__helpers__/test-utils';
-import { mockSettings } from '../__mocks__/state-mocks';
 
 import { useFiltersStore } from '../stores';
+
 import { AllRead } from './AllRead';
 
 describe('renderer/components/AllRead.tsx', () => {
@@ -18,11 +18,7 @@ describe('renderer/components/AllRead.tsx', () => {
     let tree: ReturnType<typeof renderWithAppContext> | null = null;
 
     await act(async () => {
-      tree = renderWithAppContext(<AllRead />, {
-        settings: {
-          ...mockSettings,
-        },
-      });
+      tree = renderWithAppContext(<AllRead />);
     });
 
     expect(tree.container).toMatchSnapshot();
@@ -34,11 +30,7 @@ describe('renderer/components/AllRead.tsx', () => {
     let tree: ReturnType<typeof renderWithAppContext> | null = null;
 
     await act(async () => {
-      tree = renderWithAppContext(<AllRead />, {
-        settings: {
-          ...mockSettings,
-        },
-      });
+      tree = renderWithAppContext(<AllRead />);
     });
 
     expect(tree.container).toMatchSnapshot();

src/renderer/components/AllRead.tsx

@@ -2,10 +2,10 @@ import { type FC, useMemo } from 'react';
 
 import { Constants } from '../constants';
 
-import { EmojiSplash } from './layout/EmojiSplash';
-
 import { useFiltersStore } from '../stores';
 
+import { EmojiSplash } from './layout/EmojiSplash';
+
 interface AllReadProps {
   fullHeight?: boolean;
 }