Janady13/missionmatch / frontend/src/components/AppShell.tsx

Source identity

Field	Recorded value
Source type	GitHub source
Original record	Janady13/missionmatch / frontend/src/components/AppShell.tsx
Date	Not specified in source
Repository	Janady13/missionmatch
Revision	09015496d565a172bcaa15cfe9a8e4b072b13df0
Branch	workstream-b-screenmatch
Path or archive member	frontend/src/components/AppShell.tsx
Original SHA-256	27eabf532abce01ff2b33a7f14ade840d794ee7719185141f371540a62ba7155
Git blob SHA	30d772be90de75bedc69c7ae983327a26121b538
Reading-copy SHA-256	27eabf532abce01ff2b33a7f14ade840d794ee7719185141f371540a62ba7155

Original source ↗

Every recorded occurrence

These 15 records contain identical original source bytes. Their paths and revisions remain part of the archive.

Original record	Branch or archive	Revision / identifier	Original location
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-b-screenmatch	09015496d565a172bcaa15cfe9a8e4b072b13df0	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-a-opportunity-intelligence	1675031db74316e100782d063e9eda1a597fe3a1	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-d-command-center	255e7d1d420abf5e277d0cd8c9b14f6f72b6acb9	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-e-commercial-stubs	4437da660539284a400ee380b9b427a300c369ee	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-c-slatematch	5cd60c918301b46ecd6ed3e03e20c395da0062e2	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	ruthless-debug-sweep	b7d742f8f032984be3817efffa3eb8b13b651c1f	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-b-sam-contract-awards	d5101cceb98e70000cebb31d3e7ac73d747d3a6d	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-a-shared-core	e0de03ac3a1ec826bd15d0e048e3b02baa23eeff	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-c-slatematch	5cd60c918301b46ecd6ed3e03e20c395da0062e2	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-d-command-center	255e7d1d420abf5e277d0cd8c9b14f6f72b6acb9	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	ruthless-debug-sweep	b7d742f8f032984be3817efffa3eb8b13b651c1f	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-a-opportunity-intelligence	1675031db74316e100782d063e9eda1a597fe3a1	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-b-screenmatch	09015496d565a172bcaa15cfe9a8e4b072b13df0	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-e-commercial-stubs	4437da660539284a400ee380b9b427a300c369ee	Open original
Janady13/missionmatch / frontend/src/components/AppShell.tsx	workstream-b-sam-contract-awards	d5101cceb98e70000cebb31d3e7ac73d747d3a6d	Open original

Recovered source transcript

Download complete source text ↓117 lines · 4.5 KB

import type { ComponentType } from 'react'
import { NavLink, Outlet, useLocation } from 'react-router-dom'
import {
  ClipboardList,
  Crosshair,
  GitBranch,
  Layers,
  LayoutDashboard,
  LogOut,
  Radar,
  Scale,
  Settings,
  ShieldCheck,
  Users,
} from 'lucide-react'
import { useAuth } from '../lib/useAuth'

type Item = { to: string; label: string; icon: ComponentType<{ size?: number; className?: string }> }

const NAV: Item[] = [
  { to: '/', label: 'Dashboard', icon: LayoutDashboard },
  { to: '/screen', label: 'Screen Candidate', icon: Crosshair },
  { to: '/requirements', label: 'Opportunities', icon: ClipboardList },
  { to: '/candidates', label: 'Candidates', icon: Users },
  { to: '/slate', label: 'Candidate Slate', icon: Layers },
  { to: '/pipeline', label: 'Talent Pipeline', icon: GitBranch },
  { to: '/compliance', label: 'Compliance', icon: Scale },
  { to: '/command-center', label: 'Command Center', icon: Radar },
  { to: '/settings', label: 'Settings', icon: Settings },
]

function title(path: string): string {
  const m = NAV.find((n) => (n.to === '/' ? path === '/' : path.startsWith(n.to)))
  return m?.label ?? 'missionMATCH'
}

export function AppShell() {
  const { pathname } = useLocation()
  const { principal, logout } = useAuth()
  return (
    <div className="grid h-full grid-cols-[248px_1fr]">
      <aside className="flex flex-col border-r border-line/70 bg-navy-950/70 backdrop-blur">
        <div className="flex items-center gap-2.5 px-5 py-5">
          <span className="grid size-9 place-items-center rounded-lg bg-gradient-to-br from-blue to-navy-700 text-gold">
            <ShieldCheck size={20} />
          </span>
          <div className="leading-tight">
            <div className="text-[15px] font-extrabold tracking-tight">
              mission<span className="text-gold">MATCH</span>
              <span className="align-super text-[9px]">™</span>
            </div>
            <div className="text-[10px] uppercase tracking-[0.16em] text-faint">Mission Workforce</div>
          </div>
        </div>

        <nav className="mt-2 flex-1 space-y-0.5 px-3">
          {NAV.map(({ to, label, icon: Icon }) => (
            <NavLink
              key={to}
              to={to}
              end={to === '/'}
              className={({ isActive }) =>
                `flex items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-colors ${
                  isActive
                    ? 'bg-blue/15 text-ink shadow-[inset_2px_0_0_0_var(--color-gold)]'
                    : 'text-muted hover:bg-navy-800/60 hover:text-ink'
                }`
              }
            >
              <Icon size={17} />
              {label}
            </NavLink>
          ))}
        </nav>

        <div className="m-3 rounded-xl border border-line/60 bg-gradient-to-br from-navy-800/80 to-navy-950 p-3.5">
          <div className="flex items-center gap-2 text-[11px] font-bold uppercase tracking-widest text-gold">
            <Radar size={14} /> Mission Readiness™
          </div>
          <p className="mt-1.5 text-xs leading-relaxed text-muted">
            “Intelligence that connects people to missions they can execute.”
          </p>
        </div>
      </aside>

      <div className="flex min-w-0 flex-col">
        <header className="flex items-center justify-between border-b border-line/70 bg-navy-950/40 px-6 py-3.5 backdrop-blur">
          <div>
            <h1 className="text-lg font-bold tracking-tight">{title(pathname)}</h1>
            <p className="text-xs text-faint">Workforce and Proposal Staffing Intelligence</p>
          </div>
          <div className="flex items-center gap-3">
            <span className="rounded-full border border-line/70 px-3 py-1 text-[11px] font-semibold text-muted">
              FIPS 140-3 • RLS isolated
            </span>
            {principal && (
              <span className="rounded-full bg-blue/20 px-2.5 py-1 text-[11px] font-semibold uppercase tracking-wide text-blue-soft">
                {principal.role}
              </span>
            )}
            <button
              onClick={() => void logout()}
              title="Sign out"
              className="grid size-8 place-items-center rounded-md border border-line/70 text-muted hover:border-risk/60 hover:text-risk"
            >
              <LogOut size={15} />
            </button>
          </div>
        </header>
        <main className="min-h-0 flex-1 overflow-y-auto p-6">
          <Outlet />
        </main>
      </div>
    </div>
  )
}