移除 next.config.js 中的 standalone 输出配置,添加 lib/api-client.ts 封装 fetch 请求, 自动为所有 API 调用添加配置的 basePath。更新所有页面和组件中的 fetch 调用以使用新的 fetchApi 函数, 确保在部署到子路径时 API 请求能正确工作。同时调整 tsconfig.json 的格式并修复项目创建时的字段名。
130 lines
3.8 KiB
TypeScript
130 lines
3.8 KiB
TypeScript
'use client';
|
|
|
|
import { createContext, useContext, useState, useEffect, useCallback, ReactNode } from 'react';
|
|
import type { User } from '@/types/database';
|
|
import { fetchApi } from '@/lib/api-client';
|
|
|
|
interface UserContextType {
|
|
currentUser: User | null;
|
|
users: User[];
|
|
isLoading: boolean;
|
|
isInitialized: boolean;
|
|
isAuthenticated: boolean;
|
|
setCurrentUserId: (id: string) => void;
|
|
logout: () => void;
|
|
refreshUsers: () => Promise<void>;
|
|
refreshMe: () => Promise<User | null>;
|
|
}
|
|
|
|
const UserContext = createContext<UserContextType | undefined>(undefined);
|
|
|
|
export function UserProvider({ children }: { children: ReactNode }) {
|
|
const [currentUser, setCurrentUser] = useState<User | null>(null);
|
|
const [users, setUsers] = useState<User[]>([]);
|
|
const [isLoading, setIsLoading] = useState(true);
|
|
const [isInitialized, setIsInitialized] = useState(false);
|
|
const [isAuthenticated, setIsAuthenticated] = useState(false);
|
|
|
|
const refreshUsers = useCallback(async () => {
|
|
try {
|
|
const res = await fetchApi('/api/users');
|
|
if (res.ok) {
|
|
const data = await res.json();
|
|
setUsers(data);
|
|
return data;
|
|
}
|
|
} catch (error) {
|
|
console.error('Failed to fetch users:', error);
|
|
}
|
|
return [];
|
|
}, []);
|
|
|
|
const refreshMe = useCallback(async () => {
|
|
try {
|
|
const meRes = await fetchApi('/api/auth/me', { cache: 'no-store' });
|
|
const meData = await meRes.json().catch(() => ({}));
|
|
const me = meData?.user as User | null | undefined;
|
|
|
|
if (me && me.id) {
|
|
setCurrentUser(me);
|
|
setIsAuthenticated(true);
|
|
localStorage.setItem('okrAuthUserId', me.id);
|
|
localStorage.setItem('currentUserId', me.id);
|
|
await refreshUsers();
|
|
return me;
|
|
}
|
|
|
|
localStorage.removeItem('okrAuthUserId');
|
|
localStorage.removeItem('currentUserId');
|
|
setCurrentUser(null);
|
|
setIsAuthenticated(false);
|
|
setUsers([]);
|
|
return null;
|
|
} catch (error) {
|
|
console.error('Failed to refresh auth:', error);
|
|
localStorage.removeItem('okrAuthUserId');
|
|
localStorage.removeItem('currentUserId');
|
|
setCurrentUser(null);
|
|
setIsAuthenticated(false);
|
|
setUsers([]);
|
|
return null;
|
|
}
|
|
}, [refreshUsers]);
|
|
|
|
useEffect(() => {
|
|
async function init() {
|
|
setIsLoading(true);
|
|
try {
|
|
await refreshMe();
|
|
} catch (error) {
|
|
console.error('Failed to initialize auth:', error);
|
|
localStorage.removeItem('okrAuthUserId');
|
|
localStorage.removeItem('currentUserId');
|
|
setCurrentUser(null);
|
|
setIsAuthenticated(false);
|
|
setUsers([]);
|
|
} finally {
|
|
setIsInitialized(true);
|
|
setIsLoading(false);
|
|
}
|
|
}
|
|
|
|
init();
|
|
}, [refreshMe]);
|
|
|
|
const setCurrentUserId = useCallback((id: string) => {
|
|
const authUserId = localStorage.getItem('okrAuthUserId');
|
|
if (!authUserId) return;
|
|
if (authUserId !== id) return;
|
|
const user = users.find(u => u.id === id);
|
|
if (user) {
|
|
setCurrentUser(user);
|
|
localStorage.setItem('currentUserId', id);
|
|
setIsAuthenticated(true);
|
|
}
|
|
}, [users]);
|
|
|
|
const logout = useCallback(() => {
|
|
localStorage.removeItem('okrAuthUserId');
|
|
localStorage.removeItem('currentUserId');
|
|
setCurrentUser(null);
|
|
setIsAuthenticated(false);
|
|
setUsers([]);
|
|
fetchApi('/api/auth/logout', { method: 'POST' }).catch(() => {});
|
|
}, []);
|
|
|
|
return (
|
|
<UserContext.Provider value={{ currentUser, users, isLoading, isInitialized, isAuthenticated, setCurrentUserId, logout, refreshUsers, refreshMe }}>
|
|
{children}
|
|
</UserContext.Provider>
|
|
);
|
|
}
|
|
|
|
export function useUser() {
|
|
const context = useContext(UserContext);
|
|
if (context === undefined) {
|
|
throw new Error('useUser must be used within a UserProvider');
|
|
}
|
|
return context;
|
|
}
|