The “window” and “document” are client-side APIs and because Next pre-renders each page — server-side, we can’t access those APIs simply because they don’t exist (server-side) yet.

share the code that is causing it

which file code do I have to share?

user / dashboard / page.tsx? or what?

somewhere in your code you are trying to access the window. if you didnt intentionally do it then maybe it is an npm lib you are using? i have no idea without seeing your code

I never use window object in my code.
From the error message, Is this error in the /user/dashboard/page?

its happening on the root '/' and '/user/dashboard'

yeah, I know but I've never used windows object there.
This is "/"

Do you think there is an issue in this code?

all i can see are two components but no actual code. what is in default layout and dashboard?

default layout is not problem because this code is working before and did not updated.

So If there is an issue, that is just dashboard.
Shall I share the dashboard code?

Its working well in the dev mode.
But I got this error when building.

share code?

yes

I did not still solve this problem.

are you going to share the code?

How to share it? file or copy and pase here?

yes

can i see the header and sidebar?

looks fine so far, show me the sidebar and header

yes

this is sidebar

header

ok the issue is in the sidebar

you are accessing the document there

sidebar?

Aha

yeap, right

You need to make sure the client has mounted before you access the document

  const [mounted, setMounted] = useState(false);

  useEffect(() => {
    setMounted(true);
  }, []);

  if (!mounted) return null;

let me know how you get on

sec

sorry just removed my first suggestion as it didnt work

I add this code as you guide.

put it before everything else

before the first useEffect in your code

I've tried it. then I got this.

ok instead try this:

const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
  const pathname = usePathname();
  const trigger = useRef<any>(null);
  const sidebar = useRef<any>(null);
  const { data: session } = useSession();

  // useState initialization moved inside useEffect for server-side safety
  const [sidebarExpanded, setSidebarExpanded] = useState(false);

  // Effect for localStorage access
  useEffect(() => {
    const storedSidebarExpanded = localStorage.getItem("sidebar-expanded") === "true";
    setSidebarExpanded(storedSidebarExpanded);
  }, []);

  // Close on click outside
  useEffect(() => {
    const clickHandler = ({ target }: MouseEvent) => {
      if (!sidebar.current || !trigger.current) return;
      if (
        !sidebarOpen ||
        sidebar.current.contains(target) ||
        trigger.current.contains(target)
      )
        return;
      setSidebarOpen(false);
    };
    document.addEventListener("click", clickHandler);
    return () => document.removeEventListener("click", clickHandler);
  }, [sidebarOpen]);

  // Close if the Esc key is pressed
  useEffect(() => {
    const keyHandler = ({ key }: KeyboardEvent) => {
      if (!sidebarOpen || key !== "Escape") return;
      setSidebarOpen(false);
    };
    document.addEventListener("keydown", keyHandler);
    return () => document.removeEventListener("keydown", keyHandler);
  }, [sidebarOpen]);

  // UseEffect for handling class addition/removal on body
  useEffect(() => {
    localStorage.setItem("sidebar-expanded", sidebarExpanded.toString());
    if (sidebarExpanded) {
      document.querySelector("body")?.classList.add("sidebar-expanded");
    } else {
      document.querySelector("body")?.classList.remove("sidebar-expanded");
    }
  }, [sidebarExpanded]);

  // Your component's return statement goes here
};

still not working

Same error?

yes

That should do it

If I success the build with this code, then I think any actions will not work on the browser.

btw, it's not working

you know the cause of the issue now - trying to access document before it has mounted. i'll look over your code again and see if i can find a solution but essentially you cannot access document before it is mounted on the client, even if you add 'use client'

will you access to my pc and solve it?

Hello

That is working.

you got it working?

sorry, i'll be in 20

I've open the new post.
https://nextjs-forum.com/post/1220282635147022367#message-1220282635147022367
Will you go through this?