Files
hackerspace.sh/app/(app)/forms/forms-client.tsx
T
Moheeb Zara 73eef7293a feat(forms): obvious publish flow, member Forms surface, templates (P8)
- builder: draft/published/closed status banners; creating a form now
  lands on its edit page so Publish is immediately visible; a
  members-only form shows a "no public link" note instead of a dead URL
- member-facing forms: /my-forms list + /my-forms/[id] fill
  (MemberFillClient), "Forms" sidebar item for all members. Fixes the
  long-standing gap where members-only forms had no fill surface
- starter templates: lib/form-templates.ts + a picker on /forms/new
  (Liability waiver, Membership application, Event RSVP, Photo release,
  Blank) that seeds builder state (no table)
- forms-client relabels members-only forms (was showing a misleading
  /f/<space>/<slug> that always 404s for members-only)
- docs corrected per the audit pass: DATABASE_SCHEMA / DB_SCHEMA_MAP /
  ARCHITECTURE / API_REFERENCE now reflect migrations 014-029, per-space
  slug, /f/[space]/[slug], getPublicForm({space,slug}), invite roles;
  HANDOFF pass-19 added with residual gaps

337 tests; build verified (Compiled successfully, exit 0). No deploy.
2026-05-16 17:41:16 -07:00

94 lines
3.1 KiB
TypeScript

'use client'
import Link from 'next/link'
import { FileText, Plus } from 'lucide-react'
import { PageHeader, PageTitle } from '@/components/ui/page-title'
import { Button } from '@/components/ui/button'
import { Badge } from '@/components/ui/badge'
import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription } from '@/components/ui/empty'
type FormRow = {
id: string
slug: string
title: string
kind: string
visibility: string
status: string
version: number
created_at: string
}
const VIS_LABEL: Record<string, string> = {
members: 'Members only',
public_auth: 'Signed in',
public_anon: 'Public',
}
export function FormsClient({ forms, spaceSlug }: { forms: FormRow[]; spaceSlug: string }) {
return (
<>
<PageHeader>
<PageTitle>Forms &amp; waivers</PageTitle>
<Button asChild size="sm">
<Link href="/forms/new">
<Plus className="size-4" /> New form
</Link>
</Button>
</PageHeader>
<div className="p-4 md:p-6">
{forms.length === 0 ? (
<Empty>
<EmptyHeader>
<EmptyMedia variant="icon">
<FileText />
</EmptyMedia>
<EmptyTitle>No forms yet</EmptyTitle>
<EmptyDescription>
Build a custom form or a signable waiver. Members-only or public, your choice.
</EmptyDescription>
</EmptyHeader>
<Button asChild>
<Link href="/forms/new">
<Plus className="size-4" /> Create your first form
</Link>
</Button>
</Empty>
) : (
<div className="divide-y rounded-lg border">
{forms.map(f => (
<div key={f.id} className="flex flex-wrap items-center gap-3 p-3">
<div className="min-w-0 flex-1">
<div className="flex items-center gap-2">
<Link href={`/forms/${f.id}/edit`} className="font-medium hover:underline">
{f.title}
</Link>
{f.kind === 'waiver' && <Badge variant="secondary">Waiver</Badge>}
</div>
<p className="font-mono text-xs text-muted-foreground">
{f.visibility === 'members'
? 'Members-only (filled from the in-app Forms page)'
: `/f/${spaceSlug}/${f.slug}`}
</p>
</div>
<Badge variant="outline">{VIS_LABEL[f.visibility] ?? f.visibility}</Badge>
<Badge variant={f.status === 'published' ? 'default' : 'secondary'}>
{f.status}
</Badge>
<div className="flex gap-2">
<Button asChild size="sm" variant="ghost">
<Link href={`/forms/${f.id}/results`}>Results</Link>
</Button>
<Button asChild size="sm" variant="secondary">
<Link href={`/forms/${f.id}/edit`}>Edit</Link>
</Button>
</div>
</div>
))}
</div>
)}
</div>
</>
)
}