tone/tonePage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 前端添加user状态管理

Browse Source
This commit is contained in:
tone
2025-12-17 15:36:22 +08:00
parent f69d79a0ff
commit 86086a7054
3 changed files with 70 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
apps/frontend/app/ClientProvider.tsx Normal file
View File

@@ -0,0 +1,25 @@
'use client';
import { useEffect } from 'react';
import { useUserStore } from '@/store/useUserStore';
import { User } from '@/lib/types/user';
export function ClientProvider({
initialUser,
children,
}: {
initialUser: User | null;
children: React.ReactNode;
}) {
const setUser = useUserStore((state) => state.setUser);
const setInitialized = useUserStore((state) => state.setInitialized);
useEffect(() => {
if (initialUser) {
setUser(initialUser);
}
setInitialized();
}, [initialUser, setUser, setInitialized]);
return <>{children}</>;
}

30
apps/frontend/app/layout.tsx
View File

@@ -3,6 +3,8 @@ import "./globals.css";
import { ThemeProvider } from "../components/theme-provider";
import { metadata } from "./config/metadata";
import { Toaster } from "sonner";
import { UserAPI } from "@/lib/api/server";
import { ClientProvider } from "./ClientProvider";
const geistSans = Geist({
variable: "--font-geist-sans",
@@ -16,28 +18,32 @@ const geistMono = Geist_Mono({
export { metadata };
export default function RootLayout({
export default async function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
const user = await UserAPI.me().catch(() => null);
return (
<html lang="en" suppressHydrationWarning>
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased min-h-screen flex flex-col`}
suppressHydrationWarning
>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
<main className="flex-1 flex flex-col bg-zinc-50">
{children}
<Toaster />
</main>
</ThemeProvider>
<ClientProvider initialUser={user}>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
<main className="flex-1 flex flex-col bg-zinc-50">
{children}
<Toaster />
</main>
</ThemeProvider>
</ClientProvider>
</body>
</html>
);

27
apps/frontend/store/useUserStore.ts Normal file
View File

@@ -0,0 +1,27 @@
// store/useUserStore.ts
import { User } from '@/lib/types/user';
import { create } from 'zustand';
import { devtools } from 'zustand/middleware';
interface UserState {
user: User | null;
isLoading: boolean;
initialized: boolean;
// Actions
setInitialized: () => void;
setUser: (user: User | null) => void;
clearUser: () => void;
}
export const useUserStore = create<UserState>()(
devtools((set, get) => ({
user: null,
isLoading: false,
initialized: false,
setInitialized: () => set({ initialized: true }),
setUser: (user) => set({ user, isLoading: false }),
clearUser: () => set({ user: null }),
}))
);