fix: moved usesession hook to a reusable function, reworked the area …

…login

app/src/app/[lng]/[inventory]/page.tsx

@@ -9,6 +9,7 @@ import { CircleIcon } from "@/components/icons";
 import { NavigationBar } from "@/components/navigation-bar";
 import { useTranslation } from "@/i18n/client";
 import { api, useGetCityPopulationQuery } from "@/services/api";
+import { checkUserSession } from "@/util/check-user-session";
 import {
   formatPercent,
   getShortenNumberUnit,
@@ -78,12 +79,7 @@ export default function Home({ params: { lng } }: { params: { lng: string } }) {
   const toast = useToast();
   const router = useRouter();
   // Check if user is authenticated otherwise route to login page
-  const { data, status } = useSession({
-    required: true,
-    onUnauthenticated() {
-      router.push("/auth/login");
-    },
-  });
+  checkUserSession();
   const { inventory: inventoryParam } = useParams();
   let inventoryId = inventoryParam as string | null;
   if (inventoryId === "null" || inventoryId === "undefined") {
@@ -392,8 +388,8 @@ export default function Home({ params: { lng } }: { params: { lng: string } }) {
                     />
                     <Box>
                       <Box className="flex gap-1">
-                        {inventory?.city.area! == 0 ||
-                        inventory?.city.area === null ? (
+                        {inventory?.city.area === null ||
+                        inventory?.city.area! === 0 ? (
                           <Text
                             fontFamily="heading"
                             color="border.neutral"

app/src/app/[lng]/page.tsx

@@ -5,6 +5,7 @@ import { useRouter } from "next/navigation";
 import { useEffect } from "react";
 import { useTranslation } from "@/i18n/client";
 import { useSession } from "next-auth/react";
+import { checkUserSession } from "@/util/check-user-session";
 
 export default function HomePage({
   params: { lng },
@@ -17,13 +18,7 @@ export default function HomePage({
     api.useGetUserInfoQuery();
 
   // Check if user is authenticated otherwise route to login page
-  const { data, status } = useSession({
-    required: true,
-    onUnauthenticated() {
-      router.push("/auth/login");
-    },
-  });
-
+  checkUserSession();
   useEffect(() => {
     const defaultInventoryAvailable = !!userInfo?.defaultInventoryId;
     const defaultInventoryPath = `/${userInfo?.defaultInventoryId}`;

app/src/util/check-user-session.ts

@@ -0,0 +1,13 @@
+import { useSession } from "next-auth/react";
+import { useRouter } from "next/navigation";
+
+export const checkUserSession = () => {
+  const router = useRouter();
+
+  const { data, status } = useSession({
+    required: true,
+    onUnauthenticated() {
+      router.push("/auth/login");
+    },
+  });
+};