feat(ux): shared PageTitle/SectionTitle primitive, adopt app-wide

- new components/ui/page-title.tsx (PageHeader/PageTitle/SectionTitle)
- every page heading routed through PageTitle (one source of truth
  for the page-title style; identical render)
- members restricted-directory screen now uses the standard
  PageHeader bar instead of an off-style mono heading
This commit is contained in:
Moheeb Zara
2026-05-15 22:12:52 -07:00
parent 3360f54232
commit 92ba6fb390
22 changed files with 96 additions and 29 deletions
+2 -1
View File
@@ -7,6 +7,7 @@ import { ArrowLeft, Pin, Lock } from 'lucide-react'
import { createKbEntry, updateKbEntry } from '@/lib/actions'
import { toast } from 'sonner'
import type { Tables } from '@/types/database'
import { PageTitle } from '@/components/ui/page-title'
interface Props {
entry?: Tables<'knowledge_base'>
@@ -50,7 +51,7 @@ export default function KbEntryEditor({ entry, member }: Props) {
<Link href="/ops" className="text-sidebar-foreground/70 hover:text-sidebar-foreground transition">
<ArrowLeft className="w-4 h-4" />
</Link>
<h1 className="text-white font-sans text-lg font-semibold">{isEdit ? 'Edit Entry' : 'New KB Entry'}</h1>
<PageTitle>{isEdit ? 'Edit Entry' : 'New KB Entry'}</PageTitle>
</div>
<div className="p-6 max-w-3xl">
+2 -1
View File
@@ -11,6 +11,7 @@ import { OpsAclEditor } from '@/components/ops/ops-acl-editor'
import { createClient } from '@/lib/supabase/client'
import { toast } from 'sonner'
import type { Tables, TablesInsert } from '@/types/database'
import { PageTitle } from '@/components/ui/page-title'
type KbEntry = Tables<'knowledge_base'>
type AreaLead = Tables<'area_leads'>
@@ -614,7 +615,7 @@ export function OpsClient({ member, spaceId, kbEntries: initial, areaLeads: init
<div className="min-h-screen bg-background">
{/* Header */}
<div className="bg-sidebar px-4 md:px-6 py-3 flex items-center justify-between">
<h1 className="text-white font-sans text-lg font-semibold">Ops & Facilities</h1>
<PageTitle>Ops & Facilities</PageTitle>
<div className="flex items-center gap-2">
{(activeTab === 'kb' || activeTab === 'processes') && (
<button