why isauth is not getting called???
'use client'
import { useEffect } from 'react';
export const getToken = () => {
    if (typeof window === 'undefined') return null;
    return localStorage.getItem('token'); // Adjust based on your token storage strategy
};
export default function IsAuth() {
    useEffect(() => {
        const token = localStorage.getItem("token");
        if (!token) {
            // Clear all related data if there's no token
            localStorage.removeItem("userData");
            localStorage.removeItem("addresses");
            localStorage.removeItem("userId");
            return;
        }

        async function checkAuth() {
            try {
                const response = await fetch(`${process.env.NEXT_PUBLIC_API}/user/check-auth`, {
                    headers: {
                        "Content-Type": "application/json",
                        Authorization: `Bearer ${token}`,
                    }
                });
                const data = await response.json();

                if (data.isAuthenticated) {
                    // Store addresses and userId separately
                    localStorage.setItem("addresses", JSON.stringify(data.addresses));
                    console.log(data)
                    console.log(data.userId )
                    localStorage.setItem("userId", data.userId);

                    // Store the rest of the user data
                    const { addresses, userId, ...restUserData } = data;
                    localStorage.setItem("userData", JSON.stringify(restUserData));

                    // Keep the token in localStorage
                    localStorage.setItem("token", token);
                } else {
                    // Clear data if not authenticated
                    localStorage.removeItem("userData");
                    localStorage.removeItem("addresses");
                    localStorage.removeItem("userId");
                    localStorage.removeItem("token");
                }
            } catch (error) {
                console.error("Error checking authentication:", error);
                // Optionally clear data on error
                localStorage.removeItem("userData");
                localStorage.removeItem("userId");
                localStorage.removeItem("token");
            }
        }

        checkAuth();
    }, []);

    return null;
}
layout.js:
// app/layout.js
import "./globals.css";
import localFont from "next/font/local";
import { Figtree } from "next/font/google";
import NextTopLoader from 'nextjs-toploader';
import Head from "next/head";
import React from "react";
import IsAuth from "../components/isAuth"
import {Provider} from "react-redux";
import StoreProvider from "@/app/StoreProvider";
export const figtree = Figtree({ subsets: ["latin"], variable: "--fig", display: "swap" });
const nnFont = localFont({
    src: [
        {
            path: "./fonts/nn-regular.woff2",
            weight: "400",
            style: "normal",
        },
        {
            path: "./fonts/nn-medium.woff2",
            weight: "500",
            style: "normal",
        },
    ],
    variable: "--nn-font",
    display: "swap"
});

export const metadata = {
    title: "NaayIraq",
    description: "An Iraqi store for skin care products",
};

export default function RootLayout({ children }) {
    return (
        <html lang="en">
        <Head>
            <title>NaayIraq</title>
            <meta name="viewport" content="width=device-width, initial-scale=1"/>
        </Head>
        <body className={`m-4 box-border overflow-x-hidden ${nnFont.variable} ${figtree.variable}`}>
        <NextTopLoader
            color="#3B5345"
            initialPosition={0.08}
            crawlSpeed={200}
            height={2}
            crawl={true}
            showSpinner={false}
            speed={300}
            shadow="0 0 10px #2299DD,0 0 5px #2299DD"
        />
        <IsAuth />
        <StoreProvider>
            {children}
        </StoreProvider>
        </body>
        </html>
    );
}