auth_useContext.js

// Auth.js
const AuthContext = createContext({username: '', role: ''});
export function useAuth() {
  const context = useContext(AuthContext);
  if (!context) {
    throw new Error('useAuth must be used within a AuthProvider');
  }
  return context;
}
export function AuthProvider({ children }) {
  const [user, setUser] = useState({username: '', role: ''});
  return (
    <AuthContext.Provider value={{ user }}>
      {children}
    </AuthContext.Provider>
  );
}
// App.js
export function App() {
  return (
    <AuthProvider>
      <Component />
    </AuthProvider>
  );
}
// Component.js
export function Component() {
  const { user } = useAuth()
  if (user?.role === 'ADMIN') {
    return <AdminView />
  } else {
    return <UserView />
  }
}