So in my layout.tsx i have a useState

  const [activeChatId, setActiveChatId] = useState<string | null>(null);

  return (
    <TabsProvider
      user={user}
      messages={messages}
      users={users}
      activeChatId={activeChatId}
      setActiveChatId={setActiveChatId}
    >
      <ChatProvider
        currentUser={user}
        users={users}
        activeChatId={activeChatId}
      >
        <SidebarProvider>
          <AppSidebar selfUser={user} users={users} />
          <main className="h-full w-full">
            {children}
            <Toaster position="top-center" />
          </main>
        </SidebarProvider>
      </ChatProvider>
    </TabsProvider>
  );

ok in tabsProvider i set the activeChatId and then in ChatProvider when i check activeChatId its null? why is this and how do i fix it