diff --git a/src/components/layouts/applicant-nav.tsx b/src/components/layouts/applicant-nav.tsx index e6d27a1..dbbeaa9 100644 --- a/src/components/layouts/applicant-nav.tsx +++ b/src/components/layouts/applicant-nav.tsx @@ -12,6 +12,9 @@ export function ApplicantNav({ user }: ApplicantNavProps) { const { data: flags } = trpc.applicant.getNavFlags.useQuery(undefined, { staleTime: 60_000, }) + const { data: featureFlags } = trpc.settings.getFeatureFlags.useQuery(undefined, { + staleTime: 60_000, + }) const navigation: NavItem[] = [ { name: 'Dashboard', href: '/applicant', icon: Home }, @@ -33,6 +36,7 @@ export function ApplicantNav({ user }: ApplicantNavProps) { roleName="Applicant" user={user} basePath="/applicant" + helpEmail={featureFlags?.supportEmail || undefined} /> ) } diff --git a/src/components/layouts/jury-nav.tsx b/src/components/layouts/jury-nav.tsx index 56f5597..82ae3bd 100644 --- a/src/components/layouts/jury-nav.tsx +++ b/src/components/layouts/jury-nav.tsx @@ -46,6 +46,9 @@ export function JuryNav({ user }: JuryNavProps) { undefined, { refetchInterval: 60000 } ) + const { data: flags } = trpc.settings.getFeatureFlags.useQuery() + + const useExternal = flags?.learningHubExternal && flags.learningHubExternalUrl const navigation: NavItem[] = [ { @@ -69,8 +72,9 @@ export function JuryNav({ user }: JuryNavProps) { : []), { name: 'Learning Hub', - href: '/jury/learning', + href: useExternal ? flags.learningHubExternalUrl : '/jury/learning', icon: BookOpen, + external: !!useExternal, }, ] diff --git a/src/components/layouts/mentor-nav.tsx b/src/components/layouts/mentor-nav.tsx index d925224..c3c7c39 100644 --- a/src/components/layouts/mentor-nav.tsx +++ b/src/components/layouts/mentor-nav.tsx @@ -2,12 +2,17 @@ import { BookOpen, Home, Users } from 'lucide-react' import { RoleNav, type NavItem, type RoleNavUser } from '@/components/layouts/role-nav' +import { trpc } from '@/lib/trpc/client' interface MentorNavProps { user: RoleNavUser } export function MentorNav({ user }: MentorNavProps) { + const { data: flags } = trpc.settings.getFeatureFlags.useQuery() + + const useExternal = flags?.learningHubExternal && flags.learningHubExternalUrl + const navigation: NavItem[] = [ { name: 'Dashboard', @@ -21,8 +26,9 @@ export function MentorNav({ user }: MentorNavProps) { }, { name: 'Learning Hub', - href: '/mentor/resources', + href: useExternal ? flags.learningHubExternalUrl : '/mentor/resources', icon: BookOpen, + external: !!useExternal, }, ] diff --git a/src/components/layouts/role-nav.tsx b/src/components/layouts/role-nav.tsx index faed7e9..ec31227 100644 --- a/src/components/layouts/role-nav.tsx +++ b/src/components/layouts/role-nav.tsx @@ -20,6 +20,7 @@ import type { LucideIcon } from 'lucide-react' import { LogOut, Menu, Moon, Settings, Sun, User, X, LayoutDashboard, Scale, Handshake, Eye, ArrowRightLeft, + ExternalLink as ExternalLinkIcon, HelpCircle, Mail, } from 'lucide-react' import type { UserRole } from '@prisma/client' import { useTheme } from 'next-themes' @@ -30,6 +31,7 @@ export type NavItem = { name: string href: string icon: LucideIcon + external?: boolean } export type RoleNavUser = { @@ -47,6 +49,8 @@ type RoleNavProps = { statusBadge?: React.ReactNode /** Optional slot rendered in the mobile hamburger menu (between nav links and sign out) and desktop header */ editionSelector?: React.ReactNode + /** Optional support email — when provided, shows a Help button in the header */ + helpEmail?: string } // Role switcher config — maps roles to their dashboard views @@ -62,7 +66,7 @@ function isNavItemActive(pathname: string, href: string, basePath: string): bool return pathname === href || (href !== basePath && pathname.startsWith(href)) } -export function RoleNav({ navigation, roleName, user, basePath, statusBadge, editionSelector }: RoleNavProps) { +export function RoleNav({ navigation, roleName, user, basePath, statusBadge, editionSelector, helpEmail }: RoleNavProps) { const pathname = usePathname() const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false) const { data: session, status: sessionStatus } = useSession() @@ -94,18 +98,24 @@ export function RoleNav({ navigation, roleName, user, basePath, statusBadge, edi {/* Desktop nav */}