#777 frontend: Adjusted w/ league navigation validate search params

Author: Ivareh

src/frontend/src/routes/_layout.tsx

@@ -5,8 +5,6 @@ import useTurnstileValidation, {
   hasCompletedCaptcha,
 } from "../hooks/validation/turnstileValidation";
 
-import { useGraphInputStore } from "../store/GraphInputStore";
-
 const security_ip = localStorage.getItem("security_ip");
 
 export const Route = createFileRoute("/_layout")({
@@ -17,14 +15,6 @@ export const Route = createFileRoute("/_layout")({
         to: "/captcha",
       });
     }
-    try {
-      const searchParams = new URLSearchParams(location.hash.slice(1));
-      useGraphInputStore.getState().getStoreFromHash(searchParams);
-    } catch (err) {
-      throw redirect({
-        to: "/"
-      })
-    }
   },
 });
 

src/frontend/src/routes/_layout/index.tsx

@@ -5,18 +5,12 @@ import { MainPage } from '../../components/Common/MainPage'
 import { useGraphInputStore } from '../../store/GraphInputStore'
 import { useGetGroupedModifiers } from '../../hooks/getData/prefetchGroupedModifiers'
 import { useGetItemBaseTypes } from '../../hooks/getData/getBaseTypeCategories'
+import { validateAndSetSearchParams } from '../../utils'
 
 export const Route = createFileRoute("/_layout/")({
   beforeLoad: async () => {
     const searchParams = new URLSearchParams(location.hash.slice(1))
-    const state = useGraphInputStore.getState()
-    if (searchParams.size > 0) {
-      state.getStoreFromHash(searchParams)
-    } else {
-      // This happens when being redirected from login
-      state.setHashFromStore()
-      state.setStateHash(undefined)
-    }
+    validateAndSetSearchParams(searchParams)
   },
   component: Index,
 })

src/frontend/src/store/StateInterface.tsx

@@ -117,6 +117,7 @@ export interface GraphInputState {
 
   addLeague: (league: string) => void;
   removeLeague: (league: string) => void;
+  removeAllLeagues: () => void;
 
 
   setItemName: (name: string | undefined) => void;

src/frontend/src/utils.ts

@@ -1,5 +1,7 @@
 import type { ApiError } from "./client";
 import { Toast } from "./hooks/useCustomToast";
+import { DEFAULT_LEAGUES } from "./config";
+import { useGraphInputStore } from "./store/GraphInputStore";
 
 export const emailPattern = {
   value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
@@ -82,3 +84,27 @@ export const setupHourlyUpdate = (setCurrentTime: SetDateFunction) => {
 
   return () => clearTimeout(timeoutId);
 };
+
+const validateLeagues = (searchParams: URLSearchParams) => {
+  const leagues = searchParams.get("league");
+  if (searchParams.size === 1 && leagues) {
+    if (leagues.length > 1 || !leagues.includes(DEFAULT_LEAGUES[0])) {
+      throw "default league not in simple url";
+    }
+  } else if (!leagues || leagues.length === 0) {
+    throw "leagues not set in url";
+  }
+};
+
+export const validateAndSetSearchParams = (searchParams: URLSearchParams) => {
+  try {
+    validateLeagues(searchParams);
+  } catch (error) {
+    const graphState = useGraphInputStore.getState();
+    graphState.removeAllLeagues();
+    graphState.addLeague(DEFAULT_LEAGUES[0]);
+    const searchParams = new URLSearchParams();
+    searchParams.set("league", DEFAULT_LEAGUES[0]);
+    location.hash = searchParams.toString();
+  }
+};