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
@@ -6,6 +6,7 @@ import { addMember, updateMember, approveMember, removeMember, assignAreaLead }
import { toast } from 'sonner'
import { useRouter } from 'next/navigation'
import type { Tables } from '@/types/database'
import { PageTitle } from '@/components/ui/page-title'
type Member = Tables<'space_members'>
type AreaLeadRole = { id: string; area_name: string; lead_id: string | null }
@@ -194,7 +195,7 @@ export function MembersClient({ members: initialMembers, currentRole, areaLeadRo
<div className="min-h-screen bg-background">
<div className="bg-sidebar px-4 md:px-6 py-3 flex items-center justify-between">
<div className="flex items-center gap-3">
<h1 className="text-white font-sans text-lg font-semibold">Members</h1>
<PageTitle>Members</PageTitle>
<span className="font-mono text-xs text-white/50">{total} total</span>
</div>
{isAdmin(currentRole) && (
+13 -8
View File
@@ -1,4 +1,5 @@
import { createClient } from '@/lib/supabase/server'
import { PageHeader, PageTitle } from '@/components/ui/page-title'
import { MembersClient } from './members-client'
// member_directory_visibility values come from space settings:
@@ -38,14 +39,18 @@ export default async function MembersPage() {
if (!allowed) {
return (
<div className="p-8 max-w-2xl">
<h1 className="font-mono text-sm tracking-widest uppercase text-muted-foreground mb-3">Members</h1>
<div className="bg-card border border-border rounded p-6">
<p className="font-sans text-sm text-foreground mb-2">The member directory is restricted in this space.</p>
<p className="font-sans text-sm text-muted-foreground">
A space admin has set member directory visibility to <code className="font-mono text-xs px-1 py-0.5 bg-muted rounded">{visibility}</code>.
Contact an admin if you need access.
</p>
<div>
<PageHeader>
<PageTitle>Members</PageTitle>
</PageHeader>
<div className="p-8 max-w-2xl">
<div className="bg-card border border-border rounded p-6">
<p className="font-sans text-sm text-foreground mb-2">The member directory is restricted in this space.</p>
<p className="font-sans text-sm text-muted-foreground">
A space admin has set member directory visibility to <code className="font-mono text-xs px-1 py-0.5 bg-muted rounded">{visibility}</code>.
Contact an admin if you need access.
</p>
</div>
</div>
</div>
)