david
e3895d30b4
Site admins can now temporarily view the site as a player, tournament admin, or club admin to understand the experience for each role. Changes: - Added RoleSwitcher context and provider for client-side role simulation - Added role switcher dropdown in Navigation (visible only to site admins) - Added yellow banner showing current viewing-as role with reset button - Navigation links and wordmark href now use effective role for conditional display - Added BDD feature file with 5 scenarios covering all role transitions - Added step definitions for site admin login and role switcher interactions The view-as feature is purely UI-level - server-side permissions remain unchanged. 5 scenarios, 27 steps, all passing.
38 lines
1020 B
TypeScript
38 lines
1020 B
TypeScript
"use client"
|
|
|
|
import { createContext, useContext, useState, useCallback, ReactNode } from "react"
|
|
|
|
type ViewAsRole = "player" | "tournament_admin" | "club_admin" | null
|
|
|
|
interface RoleSwitcherContextType {
|
|
viewAsRole: ViewAsRole
|
|
setViewAsRole: (role: ViewAsRole) => void
|
|
effectiveRole: string | null
|
|
}
|
|
|
|
const RoleSwitcherContext = createContext<RoleSwitcherContextType | undefined>(undefined)
|
|
|
|
export function RoleSwitcherProvider({ children }: { children: ReactNode }) {
|
|
const [viewAsRole, setViewAsRole] = useState<ViewAsRole>(null)
|
|
|
|
const value = {
|
|
viewAsRole,
|
|
setViewAsRole: useCallback((role: ViewAsRole) => setViewAsRole(role), []),
|
|
effectiveRole: viewAsRole,
|
|
}
|
|
|
|
return (
|
|
<RoleSwitcherContext.Provider value={value}>
|
|
{children}
|
|
</RoleSwitcherContext.Provider>
|
|
)
|
|
}
|
|
|
|
export function useRoleSwitcher() {
|
|
const context = useContext(RoleSwitcherContext)
|
|
if (!context) {
|
|
throw new Error("useRoleSwitcher must be used within RoleSwitcherProvider")
|
|
}
|
|
return context
|
|
}
|