Polish: imperial, clear-bed, keyboard nudging, empty states (#18)

Co-authored-by: Steve Dudenhoeffer <[email protected]>
2026-07-19 04:44:26 +00:00
parent c2dd93a93d
commit 245e0cbe71
14 changed files with 268 additions and 11 deletions
@@ -0,0 +1,43 @@
+import { Modal } from '@/components/ui/Modal'
+import { Button } from '@/components/ui/Button'
+import { useClearObject } from '@/lib/objects'
+
+/** Confirm clearing every active plop from a focused bed (soft-remove — the rows
+ *  are kept with removed_at, so history survives). */
+export function ClearBedModal({
+  objectName,
+  plops,
+  gardenId,
+  onClose,
+}: {
+  objectName: string
+  plops: { id: number; version: number }[]
+  gardenId: number
+  onClose: () => void
+}) {
+  const clear = useClearObject(gardenId)
+  const n = plops.length
+  return (
+    <Modal title="Clear bed" onClose={onClose} busy={clear.isPending}>
+      <div className="flex flex-col gap-4">
+        <p className="text-sm text-muted">
+          Remove all <span className="font-medium text-fg">{n}</span> {n === 1 ? 'plant' : 'plants'} from{' '}
+          <span className="font-medium text-fg">{objectName}</span>? They're marked removed but kept in history.
+        </p>
+        <div className="flex justify-end gap-2">
+          <Button type="button" variant="ghost" onClick={onClose} disabled={clear.isPending}>
+            Cancel
+          </Button>
+          <Button
+            type="button"
+            variant="danger"
+            disabled={clear.isPending || n === 0}
+            onClick={() => clear.mutate(plops, { onSuccess: onClose })}
+          >
+            {clear.isPending ? 'Clearing…' : 'Clear bed'}
+          </Button>
+        </div>
+      </div>
+    </Modal>
+  )
+}