More Tanstack Query stuff

frontend/src/pages/admin/activity/AdminActivity.tsx

@@ -1,24 +1,20 @@
-import { useState } from 'react';
-import { z } from 'zod';
 import getAdminActivity from '@/api/admin/getAdminActivity.ts';
 import { getEmptyPaginationSet } from '@/api/axios.ts';
 import AdminContentContainer from '@/elements/containers/AdminContentContainer.tsx';
 import Table from '@/elements/Table.tsx';
 import { queryKeys } from '@/lib/queryKeys.ts';
-import { activitySchema } from '@/lib/schemas/activity.ts';
 import { adminActivityColumns } from '@/lib/tableColumns.ts';
 import { useSearchablePaginatedTable } from '@/plugins/useSearchablePageableTable.ts';
 import ActivityRow from './ActivityRow.tsx';
 
 export default function AdminActivity() {
-  const [activities, setActivities] = useState<Pagination<z.infer<typeof activitySchema>>>(getEmptyPaginationSet());
-
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.activity.all(),
     fetcher: getAdminActivity,
-    setStoreData: setActivities,
   });
 
+  const activities = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   return (
     <AdminContentContainer title='Activity' search={search} setSearch={setSearch}>
       <Table columns={adminActivityColumns} loading={loading} pagination={activities} onPageSelect={setPage}>

frontend/src/pages/admin/backupConfigurations/AdminBackupConfigurations.tsx

@@ -1,30 +1,32 @@
 import { faPlus } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Route, Routes, useNavigate } from 'react-router';
+import { z } from 'zod';
 import getBackupConfigurations from '@/api/admin/backup-configurations/getBackupConfigurations.ts';
+import { getEmptyPaginationSet } from '@/api/axios.ts';
 import Button from '@/elements/Button.tsx';
 import { AdminCan } from '@/elements/Can.tsx';
 import AdminContentContainer from '@/elements/containers/AdminContentContainer.tsx';
 import Table from '@/elements/Table.tsx';
 import { queryKeys } from '@/lib/queryKeys.ts';
+import { adminBackupConfigurationSchema } from '@/lib/schemas/admin/backupConfigurations.ts';
 import { backupConfigurationTableColumns } from '@/lib/tableColumns.ts';
 import BackupConfigurationCreateOrUpdate from '@/pages/admin/backupConfigurations/BackupConfigurationCreateOrUpdate.tsx';
 import BackupConfigurationRow from '@/pages/admin/backupConfigurations/BackupConfigurationRow.tsx';
 import BackupConfigurationView from '@/pages/admin/backupConfigurations/BackupConfigurationView.tsx';
 import { useSearchablePaginatedTable } from '@/plugins/useSearchablePageableTable.ts';
 import AdminPermissionGuard from '@/routers/guards/AdminPermissionGuard.tsx';
-import { useAdminStore } from '@/stores/admin.tsx';
 
 function BackupConfigurationsContainer() {
   const navigate = useNavigate();
-  const { backupConfigurations, setBackupConfigurations } = useAdminStore();
 
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.backupConfigurations.all(),
     fetcher: getBackupConfigurations,
-    setStoreData: setBackupConfigurations,
   });
 
+  const backupConfigurations = data ?? getEmptyPaginationSet<z.infer<typeof adminBackupConfigurationSchema>>();
+
   return (
     <AdminContentContainer
       title='Backup Configurations'

frontend/src/pages/admin/backupConfigurations/backups/AdminBackupConfigurationBackups.tsx

@@ -1,4 +1,3 @@
-import { useState } from 'react';
 import { z } from 'zod';
 import getBackupConfigurationBackups from '@/api/admin/backup-configurations/backups/getBackupConfigurationBackups.ts';
 import { getEmptyPaginationSet } from '@/api/axios.ts';
@@ -16,16 +15,13 @@ export default function AdminBackupConfigurationBackups({
 }: {
   backupConfiguration: z.infer<typeof adminBackupConfigurationSchema>;
 }) {
-  const [backupConfigurationBackups, setBackupConfigurationBackups] = useState<
-    Pagination<z.infer<typeof adminNodeServerBackupSchema>>
-  >(getEmptyPaginationSet());
-
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.backupConfigurations.backups(backupConfiguration.uuid),
     fetcher: (page, search) => getBackupConfigurationBackups(backupConfiguration.uuid, page, search),
-    setStoreData: setBackupConfigurationBackups,
   });
 
+  const backupConfigurationBackups = data ?? getEmptyPaginationSet<z.infer<typeof adminNodeServerBackupSchema>>();
+
   return (
     <AdminSubContentContainer title={`Backup Config Backups`} titleOrder={2} search={search} setSearch={setSearch}>
       <ContextMenuProvider>

frontend/src/pages/admin/backupConfigurations/locations/AdminBackupConfigurationLocations.tsx

@@ -1,12 +1,10 @@
-import { useState } from 'react';
 import { z } from 'zod';
 import getBackupConfigurationLocations from '@/api/admin/backup-configurations/locations/getBackupConfigurationLocations.ts';
 import { getEmptyPaginationSet } from '@/api/axios.ts';
 import AdminSubContentContainer from '@/elements/containers/AdminSubContentContainer.tsx';
 import Table from '@/elements/Table.tsx';
 import { queryKeys } from '@/lib/queryKeys.ts';
 import { adminBackupConfigurationSchema } from '@/lib/schemas/admin/backupConfigurations.ts';
-import { adminLocationSchema } from '@/lib/schemas/admin/locations.ts';
 import { locationTableColumns } from '@/lib/tableColumns.ts';
 import LocationRow from '@/pages/admin/locations/LocationRow.tsx';
 import { useSearchablePaginatedTable } from '@/plugins/useSearchablePageableTable.ts';
@@ -16,16 +14,13 @@ export default function AdminBackupConfigurationLocations({
 }: {
   backupConfiguration: z.infer<typeof adminBackupConfigurationSchema>;
 }) {
-  const [backupConfigurationLocations, setBackupConfigurationLocations] = useState<
-    Pagination<z.infer<typeof adminLocationSchema>>
-  >(getEmptyPaginationSet());
-
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.backupConfigurations.locations(backupConfiguration.uuid),
     fetcher: (page, search) => getBackupConfigurationLocations(backupConfiguration.uuid, page, search),
-    setStoreData: setBackupConfigurationLocations,
   });
 
+  const backupConfigurationLocations = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   return (
     <AdminSubContentContainer title={`Backup Config Locations`} titleOrder={2} search={search} setSearch={setSearch}>
       <Table

frontend/src/pages/admin/backupConfigurations/nodes/AdminBackupConfigurationNodes.tsx

@@ -1,4 +1,3 @@
-import { useState } from 'react';
 import { z } from 'zod';
 import getBackupConfigurationNodes from '@/api/admin/backup-configurations/nodes/getBackupConfigurationNodes.ts';
 import { getEmptyPaginationSet } from '@/api/axios.ts';
@@ -16,16 +15,13 @@ export default function AdminBackupConfigurationNodes({
 }: {
   backupConfiguration: z.infer<typeof adminBackupConfigurationSchema>;
 }) {
-  const [backupConfigurationNodes, setBackupConfigurationNodes] = useState<Pagination<z.infer<typeof adminNodeSchema>>>(
-    getEmptyPaginationSet(),
-  );
-
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.backupConfigurations.nodes(backupConfiguration.uuid),
     fetcher: (page, search) => getBackupConfigurationNodes(backupConfiguration.uuid, page, search),
-    setStoreData: setBackupConfigurationNodes,
   });
 
+  const backupConfigurationNodes = data ?? getEmptyPaginationSet<z.infer<typeof adminNodeSchema>>();
+
   return (
     <AdminSubContentContainer title={`Backup Config Nodes`} titleOrder={2} search={search} setSearch={setSearch}>
       <Table columns={nodeTableColumns} loading={loading} pagination={backupConfigurationNodes} onPageSelect={setPage}>

frontend/src/pages/admin/backupConfigurations/servers/AdminBackupConfigurationServers.tsx

@@ -1,4 +1,3 @@
-import { useState } from 'react';
 import { z } from 'zod';
 import getBackupConfigurationServers from '@/api/admin/backup-configurations/servers/getBackupConfigurationServers.ts';
 import { getEmptyPaginationSet } from '@/api/axios.ts';
@@ -16,16 +15,13 @@ export default function AdminBackupConfigurationServers({
 }: {
   backupConfiguration: z.infer<typeof adminBackupConfigurationSchema>;
 }) {
-  const [backupConfigurationServers, setBackupConfigurationServers] = useState<
-    Pagination<z.infer<typeof adminServerSchema>>
-  >(getEmptyPaginationSet());
-
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.backupConfigurations.servers(backupConfiguration.uuid),
     fetcher: (page, search) => getBackupConfigurationServers(backupConfiguration.uuid, page, search),
-    setStoreData: setBackupConfigurationServers,
   });
 
+  const backupConfigurationServers = data ?? getEmptyPaginationSet<z.infer<typeof adminServerSchema>>();
+
   return (
     <AdminSubContentContainer title={`Backup Config Servers`} titleOrder={2} search={search} setSearch={setSearch}>
       <Table

frontend/src/pages/admin/databaseHosts/AdminDatabaseHosts.tsx

@@ -2,6 +2,7 @@ import { faPlus } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Route, Routes, useNavigate } from 'react-router';
 import getDatabaseHosts from '@/api/admin/database-hosts/getDatabaseHosts.ts';
+import { getEmptyPaginationSet } from '@/api/axios.ts';
 import Button from '@/elements/Button.tsx';
 import { AdminCan } from '@/elements/Can.tsx';
 import AdminContentContainer from '@/elements/containers/AdminContentContainer.tsx';
@@ -10,21 +11,20 @@ import { queryKeys } from '@/lib/queryKeys.ts';
 import { databaseHostTableColumns } from '@/lib/tableColumns.ts';
 import { useSearchablePaginatedTable } from '@/plugins/useSearchablePageableTable.ts';
 import AdminPermissionGuard from '@/routers/guards/AdminPermissionGuard.tsx';
-import { useAdminStore } from '@/stores/admin.tsx';
 import DatabaseHostCreateOrUpdate from './DatabaseHostCreateOrUpdate.tsx';
 import DatabaseHostRow from './DatabaseHostRow.tsx';
 import DatabaseHostView from './DatabaseHostView.tsx';
 
 function DatabaseHostsContainer() {
   const navigate = useNavigate();
-  const { databaseHosts, setDatabaseHosts } = useAdminStore();
 
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.databaseHosts.all(),
     fetcher: getDatabaseHosts,
-    setStoreData: setDatabaseHosts,
   });
 
+  const databaseHosts = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   return (
     <AdminContentContainer
       title='Database Hosts'

frontend/src/pages/admin/databaseHosts/databases/AdminDatabaseHostDatabases.tsx

@@ -1,4 +1,3 @@
-import { useState } from 'react';
 import { z } from 'zod';
 import getDatabaseHostDatabases from '@/api/admin/database-hosts/getDatabaseHostDatabases.ts';
 import { getEmptyPaginationSet } from '@/api/axios.ts';
@@ -16,16 +15,13 @@ export default function AdminDatabaseHostDatabases({
 }: {
   databaseHost: z.infer<typeof adminDatabaseHostSchema>;
 }) {
-  const [databaseHostDatabases, setDatabaseHostDatabases] = useState<
-    Pagination<z.infer<typeof adminServerDatabaseSchema>>
-  >(getEmptyPaginationSet());
-
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.databaseHosts.databases(databaseHost.uuid),
     fetcher: (page, search) => getDatabaseHostDatabases(databaseHost.uuid, page, search),
-    setStoreData: setDatabaseHostDatabases,
   });
 
+  const databaseHostDatabases = data ?? getEmptyPaginationSet<z.infer<typeof adminServerDatabaseSchema>>();
+
   return (
     <AdminSubContentContainer title={`Database Host Databases`} titleOrder={2} search={search} setSearch={setSearch}>
       <Table

frontend/src/pages/admin/eggConfigurations/AdminEggConfigurations.tsx

@@ -2,6 +2,7 @@ import { faPlus } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Route, Routes, useNavigate } from 'react-router';
 import getEggConfigurations from '@/api/admin/egg-configurations/getEggConfigurations.ts';
+import { getEmptyPaginationSet } from '@/api/axios.ts';
 import Button from '@/elements/Button.tsx';
 import { AdminCan } from '@/elements/Can.tsx';
 import AdminContentContainer from '@/elements/containers/AdminContentContainer.tsx';
@@ -10,21 +11,20 @@ import { queryKeys } from '@/lib/queryKeys.ts';
 import { eggConfigurationTableColumns } from '@/lib/tableColumns.ts';
 import { useSearchablePaginatedTable } from '@/plugins/useSearchablePageableTable.ts';
 import AdminPermissionGuard from '@/routers/guards/AdminPermissionGuard.tsx';
-import { useAdminStore } from '@/stores/admin.tsx';
 import EggConfigurationCreateOrUpdate from './EggConfigurationCreateOrUpdate.tsx';
 import EggConfigurationRow from './EggConfigurationRow.tsx';
 import EggConfigurationView from './EggConfigurationView.tsx';
 
 function EggConfigurationsContainer() {
   const navigate = useNavigate();
-  const { eggConfigurations, setEggConfigurations } = useAdminStore();
 
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.eggConfigurations.all(),
     fetcher: getEggConfigurations,
-    setStoreData: setEggConfigurations,
   });
 
+  const eggConfigurations = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   return (
     <AdminContentContainer
       title='Egg Configurations'

frontend/src/pages/admin/eggRepositories/AdminEggRepositories.tsx

@@ -2,6 +2,7 @@ import { faPlus } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Route, Routes, useNavigate } from 'react-router';
 import getEggRepositories from '@/api/admin/egg-repositories/getEggRepositories.ts';
+import { getEmptyPaginationSet } from '@/api/axios.ts';
 import Button from '@/elements/Button.tsx';
 import { AdminCan } from '@/elements/Can.tsx';
 import AdminContentContainer from '@/elements/containers/AdminContentContainer.tsx';
@@ -10,21 +11,20 @@ import { queryKeys } from '@/lib/queryKeys.ts';
 import { eggRepositoryTableColumns } from '@/lib/tableColumns.ts';
 import { useSearchablePaginatedTable } from '@/plugins/useSearchablePageableTable.ts';
 import AdminPermissionGuard from '@/routers/guards/AdminPermissionGuard.tsx';
-import { useAdminStore } from '@/stores/admin.tsx';
 import EggRepositoryCreateOrUpdate from './EggRepositoryCreateOrUpdate.tsx';
 import EggRepositoryRow from './EggRepositoryRow.tsx';
 import EggRepositoryView from './EggRepositoryView.tsx';
 
 function EggRepositoriesContainer() {
   const navigate = useNavigate();
-  const { eggRepositories, setEggRepositories } = useAdminStore();
 
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.eggRepositories.all(),
     fetcher: getEggRepositories,
-    setStoreData: setEggRepositories,
   });
 
+  const eggRepositories = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   return (
     <AdminContentContainer
       title='Egg Repositories'

frontend/src/pages/admin/eggRepositories/eggs/EggRepositoryEggs.tsx

@@ -19,9 +19,6 @@ export default function EggRepositoryEggs({
 }: {
   contextEggRepository: z.infer<typeof adminEggRepositorySchema>;
 }) {
-  const [eggRepositoryEggs, setEggRepositoryEggs] = useState(
-    getEmptyPaginationSet<z.infer<typeof adminEggRepositoryEggSchema>>(),
-  );
   const [selectedEggs, setSelectedEggs] = useState(
     new ObjectSet<z.infer<typeof adminEggRepositoryEggSchema>, 'uuid'>('uuid'),
   );
@@ -57,12 +54,13 @@ export default function EggRepositoryEggs({
     [],
   );
 
-  const { loading, search, setSearch, setPage } = useSearchablePaginatedTable({
+  const { data, loading, search, setSearch, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.eggRepositories.eggs(contextEggRepository.uuid),
     fetcher: (page, search) => getEggRepositoryEggs(contextEggRepository.uuid, page, search),
-    setStoreData: setEggRepositoryEggs,
   });
 
+  const eggRepositoryEggs = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   useKeyboardShortcuts({
     shortcuts: [
       {

frontend/src/pages/admin/home/health/AdminOverviewHealth.tsx

@@ -10,7 +10,7 @@ import { Title } from '@mantine/core';
 import { useEffect, useState } from 'react';
 import getGeneralHealth from '@/api/admin/system/health/getGeneralHealth.ts';
 import getNodesHealth from '@/api/admin/system/health/getNodesHealth.ts';
-import { httpErrorToHuman } from '@/api/axios.ts';
+import { getEmptyPaginationSet, httpErrorToHuman } from '@/api/axios.ts';
 import Card from '@/elements/Card.tsx';
 import Code from '@/elements/Code.tsx';
 import Spinner from '@/elements/Spinner.tsx';
@@ -26,15 +26,15 @@ export default function AdminOverviewHealth() {
   const { addToast } = useToast();
 
   const [general, setGeneral] = useState<Awaited<ReturnType<typeof getGeneralHealth>> | null>(null);
-  const [nodes, setNodes] = useState<Awaited<ReturnType<typeof getNodesHealth>> | null>(null);
 
-  const { loading, setPage } = useSearchablePaginatedTable({
+  const { data, loading, setPage } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.health.nodes(),
     fetcher: (page) => getNodesHealth(page),
-    setStoreData: setNodes,
     paginationKey: 'desyncNodes',
   });
 
+  const nodes = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   useEffect(() => {
     getGeneralHealth()
       .then(setGeneral)

frontend/src/pages/admin/home/updates/AdminOverviewUpdates.tsx

@@ -13,7 +13,7 @@ import { z } from 'zod';
 import getNodeUpdates from '@/api/admin/system/updates/getNodeUpdates.ts';
 import getUpdateHistory from '@/api/admin/system/updates/getUpdateHistory.ts';
 import recheckUpdates from '@/api/admin/system/updates/recheckUpdates.ts';
-import { httpErrorToHuman } from '@/api/axios.ts';
+import { getEmptyPaginationSet, httpErrorToHuman } from '@/api/axios.ts';
 import Alert from '@/elements/Alert.tsx';
 import Anchor from '@/elements/Anchor.tsx';
 import Button from '@/elements/Button.tsx';
@@ -39,15 +39,13 @@ export default function AdminOverviewUpdates() {
   const { addToast } = useToast();
   const { updateInformation, setUpdateInformation } = useAdminStore();
 
-  const [nodes, setNodes] = useState<Awaited<ReturnType<typeof getNodeUpdates>> | null>(null);
   const [updateHistory, setUpdateHistory] = useState<Awaited<ReturnType<typeof getUpdateHistory>> | null>(null);
   const [selectedUpdateHistory, setSelectedUpdateHistory] = useState<string | null>(null);
   const [recheckLoading, setRecheckLoading] = useState(false);
 
-  const { loading, setPage, refetch } = useSearchablePaginatedTable({
+  const { data, loading, setPage, refetch } = useSearchablePaginatedTable({
     queryKey: queryKeys.admin.updates.nodes(),
     fetcher: (page) => getNodeUpdates(page),
-    setStoreData: setNodes,
     paginationKey: 'outdatedNodes',
   });
 
@@ -59,6 +57,8 @@ export default function AdminOverviewUpdates() {
       });
   }, []);
 
+  const nodes = (data ?? getEmptyPaginationSet()) as NonNullable<typeof data>;
+
   const extensionUpdates = useMemo(
     () =>
       Object.entries(updateInformation?.extensions || {}).filter(