feat: add admin content module pages

2026-07-12 15:27:07 +02:00
1 parent f422bb4a0b
commit 2606092337
@@ -0,0 +1,143 @@
+'use client'
+
+import { useForm } from 'react-hook-form'
+import { createPoll, updatePoll } from '@/actions/polls'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { DateTimePicker } from '@/components/ui/date-time-picker'
+import { Input } from '@/components/ui/input'
+import { Label } from '@/components/ui/label'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select'
+import { Switch } from '@/components/ui/switch'
+import { Textarea } from '@/components/ui/textarea'
+import { useServerAction } from '@/hooks/use-server-action'
+import type { CreatePollInput } from '@/lib/validators/poll'
+
+interface PollFormProps {
+  defaultValues?: Partial<CreatePollInput> & { id?: number }
+}
+
+export function PollForm({ defaultValues }: PollFormProps) {
+  const { run, isPending } = useServerAction()
+  const isEditing = !!defaultValues?.id
+
+  const form = useForm({
+    defaultValues: {
+      title: '',
+      description: '',
+      status: 'draft',
+      showResults: 1,
+      multipleChoice: 0,
+      ...defaultValues,
+    },
+  })
+
+  // biome-ignore lint/suspicious/noExplicitAny: explicitly chosen here, see surrounding code
+  function onSubmit(data: any) {
+    if (isEditing) {
+      run(() => updatePoll({ id: defaultValues!.id!, ...data }), {
+        successMessage: 'Poll updated!',
+      })
+    } else {
+      run(() => createPoll(data), {
+        successMessage: 'Poll created!',
+        onSuccess: (result) => {
+          const data = result.data as Record<string, unknown> | undefined
+          if (data?.id) {
+            window.location.href = `/admin/polls/${data.id}`
+          }
+        },
+      })
+    }
+  }
+
+  return (
+    <form onSubmit={form.handleSubmit(onSubmit)}>
+      <Card>
+        <CardHeader>
+          <CardTitle>{isEditing ? 'Edit Poll' : 'Poll Details'}</CardTitle>
+        </CardHeader>
+        <CardContent className="space-y-4">
+          <div className="space-y-2">
+            <Label htmlFor="title">Title</Label>
+            <Input id="title" {...form.register('title')} />
+            {form.formState.errors.title && (
+              <p className="text-sm text-destructive">{form.formState.errors.title.message}</p>
+            )}
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="description">Description</Label>
+            <Textarea id="description" rows={3} {...form.register('description')} />
+          </div>
+
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+            <div className="space-y-2">
+              <Label htmlFor="status">Status</Label>
+              <Select
+                value={form.watch('status')}
+                onValueChange={(v) => form.setValue('status', v as CreatePollInput['status'])}
+              >
+                <SelectTrigger>
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="draft">Draft</SelectItem>
+                  <SelectItem value="active">Active</SelectItem>
+                  <SelectItem value="closed">Closed</SelectItem>
+                </SelectContent>
+              </Select>
+            </div>
+            <div className="space-y-2">
+              <Label>Starts At</Label>
+              <DateTimePicker
+                value={form.watch('startsAt')}
+                // biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
+                onChange={(d) => form.setValue('startsAt', d as any, { shouldDirty: true })}
+                placeholder="Select start date"
+              />
+            </div>
+            <div className="space-y-2">
+              <Label>Ends At</Label>
+              <DateTimePicker
+                value={form.watch('endsAt')}
+                // biome-ignore lint/suspicious/noExplicitAny: form value type inferred loose; runtime validated by zod on submit
+                onChange={(d) => form.setValue('endsAt', d as any, { shouldDirty: true })}
+                placeholder="Select end date"
+              />
+            </div>
+          </div>
+
+          <div className="flex gap-6">
+            <div className="flex items-center gap-2">
+              <Switch
+                checked={form.watch('showResults') === 1}
+                onCheckedChange={(v) => form.setValue('showResults', v ? 1 : 0)}
+              />
+              <Label>Show results to voters</Label>
+            </div>
+            <div className="flex items-center gap-2">
+              <Switch
+                checked={form.watch('multipleChoice') === 1}
+                onCheckedChange={(v) => form.setValue('multipleChoice', v ? 1 : 0)}
+              />
+              <Label>Allow multiple answers</Label>
+            </div>
+          </div>
+
+          <div className="flex justify-end">
+            <Button type="submit" disabled={isPending}>
+              {isPending ? 'Saving...' : isEditing ? 'Update Poll' : 'Create Poll'}
+            </Button>
+          </div>
+        </CardContent>
+      </Card>
+    </form>
+  )
+}