Recipe-app main

2026-04-09 09:14:39 +02:00
commit 962f4e4be5
10015 changed files with 2445177 additions and 0 deletions
@@ -0,0 +1,58 @@
+'use client';
+
+import { useState, useTransition } from 'react';
+import { createProduct } from './actions';
+
+export default function ProductForm() {
+  const [isPending, startTransition] = useTransition();
+  const [error, setError] = useState<string | null>(null);
+
+  return (
+    <form
+      onSubmit={(e) => {
+        e.preventDefault();
+        setError(null);
+
+        const form = e.currentTarget;
+        const formData = new FormData(form);
+
+        startTransition(async () => {
+          try {
+            await createProduct(formData);
+            form.reset();
+          } catch (err) {
+            setError(err instanceof Error ? err.message : 'Okänt fel');
+          }
+        });
+      }}
+      style={{
+        display: 'grid',
+        gap: '0.75rem',
+        padding: '1rem',
+        border: '1px solid #ddd',
+        borderRadius: '8px',
+        marginBottom: '1.5rem',
+      }}
+    >
+      <h2 style={{ margin: 0 }}>Skapa produkt</h2>
+
+      <label>
+        Produktnamn
+        <br />
+        <input
+          name="name"
+          type="text"
+          required
+          placeholder="Till exempel Rödkål"
+          style={{ width: '100%', padding: '0.5rem' }}
+        />
+      </label>
+
+      <button type="submit" disabled={isPending} style={{ padding: '0.75rem' }}>
+        {isPending ? 'Sparar...' : 'Skapa produkt'}
+      </button>
+
+      {error ? <p style={{ color: 'crimson', margin: 0 }}>{error}</p> : null}
+    </form>
+  );
+}