Reload on year change

frontend/src/components/TopBar.tsx

@@ -11,8 +11,15 @@ type SelectValue = {
   label: string
 }
 
-const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; color: string}, ) => {
-  const linkClass = ({ isActive }: { isActive: boolean }) => isActive ? 'underline font-bold' : ''
+const TopBar = ({
+  routes,
+  color,
+}: {
+  routes: { name: string; path: string }[]
+  color: string
+}) => {
+  const linkClass = ({ isActive }: { isActive: boolean }) =>
+    isActive ? 'underline font-bold' : ''
 
   const [yearGroupId, setYearGroupId] = useLocalStorageState('yearGroupId', {
     defaultValue: -1,
@@ -21,11 +28,10 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
     defaultValue: 'coordinator',
   })
   const [yearGroupOptions, setYearGroupOptions] = useState<SelectValue[]>()
-  const [name, setName] = useState("")
-
 
   const onYearChange = (v: any) => {
     setYearGroupId(v?.value)
+    window.location.reload()
   }
   useQuery('year_groups', () => getYearGroups({ per_page: 100 }), {
     onSuccess: (data) => {
@@ -41,7 +47,7 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
   })
 
   return (
-    <div className={"flex items-center py-6 px-10 shadow " + color}>
+    <div className={'flex items-center py-6 px-10 shadow ' + color}>
       <h1 className="text-xl font-bold">System PRI</h1>
       <div className="flex ml-10 gap-3">
         {routes.map(({ path, name }) => (
@@ -51,7 +57,8 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
         ))}
       </div>
       <div className="m-auto flex-col">
-      {userType == 'coordinator' ? <Select
+        {userType === 'coordinator' ? (
+          <Select
             closeMenuOnSelect={true}
             options={yearGroupOptions}
             placeholder="Wybierz rok"
@@ -63,7 +70,9 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
                 borderRadius: '0.5rem',
               }),
             }}
-        /> : null}
+            value={yearGroupOptions?.find((year) => year.value === yearGroupId)}
+          />
+        ) : null}
       </div>
       <NavLink className="ml-auto" to="/">
         Wyloguj