feat: lunch picker on attending-members card + admin slide-over

LunchPickForm shared between applicant dashboard rows (member-self /
team-lead context) and the admin manifest's edit-pencil slide-over.
Adds lunch.getMemberPick read for the per-row hydration.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Matt
2026-04-29 02:49:08 +02:00
parent ec24d404c5
commit df95867465
5 changed files with 350 additions and 30 deletions

View File

@@ -8,6 +8,14 @@ import { Switch } from '@/components/ui/switch'
import { Label } from '@/components/ui/label'
import { Button } from '@/components/ui/button'
import { Badge } from '@/components/ui/badge'
import {
Sheet,
SheetContent,
SheetHeader,
SheetTitle,
SheetDescription,
} from '@/components/ui/sheet'
import { LunchPickForm } from '@/components/applicant/lunch-pick-form'
import { Pencil, Download } from 'lucide-react'
import { toast } from 'sonner'
@@ -53,15 +61,17 @@ function DownloadCsvButton({ programId }: { programId: string }) {
export function LunchManifest({
programId,
onEditExternal,
onEditMember,
}: {
programId: string
onEditExternal?: (externalId: string) => void
onEditMember?: (attendingMemberId: string) => void
}) {
const { data } = trpc.lunch.getManifest.useQuery({ programId })
const [search, setSearch] = useState('')
const [missingOnly, setMissingOnly] = useState(false)
const [editingMemberId, setEditingMemberId] = useState<string | null>(null)
const editingMember = data?.members.find(
(m) => m.attendingMemberId === editingMemberId,
)
type Row =
| (NonNullable<typeof data>['members'][number] & { sortKey: string })
@@ -192,7 +202,7 @@ export function LunchManifest({
if (r.kind === 'EXTERNAL') {
onEditExternal?.(r.externalId)
} else {
onEditMember?.(r.attendingMemberId)
setEditingMemberId(r.attendingMemberId)
}
}}
>
@@ -213,6 +223,32 @@ export function LunchManifest({
</table>
</div>
</CardContent>
<Sheet
open={!!editingMemberId}
onOpenChange={(o) => { if (!o) setEditingMemberId(null) }}
>
<SheetContent side="right" className="w-full sm:max-w-md">
<SheetHeader>
<SheetTitle>Edit lunch pick</SheetTitle>
{editingMember && (
<SheetDescription>
{editingMember.name} · {editingMember.project?.name}
</SheetDescription>
)}
</SheetHeader>
{editingMemberId && data?.event && (
<div className="mt-6">
<LunchPickForm
attendingMemberId={editingMemberId}
programId={programId}
lunchEventId={data.event.id}
canEdit
/>
</div>
)}
</SheetContent>
</Sheet>
</Card>
)
}