feat: add-product page

src/app/add/page.tsx

@@ -0,0 +1,57 @@
+'use client'
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+
+export default function AddPage() {
+  const [url, setUrl] = useState('')
+  const [submitting, setSubmitting] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+  const router = useRouter()
+
+  async function submit(e: React.FormEvent) {
+    e.preventDefault()
+    setSubmitting(true)
+    setError(null)
+    try {
+      const res = await fetch('/api/products', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ url }),
+      })
+      if (!res.ok) {
+        const j = await res.json().catch(() => ({ error: 'unknown' }))
+        setError(j.error || `HTTP ${res.status}`)
+        return
+      }
+      const { id } = await res.json()
+      router.push(`/products/${id}`)
+    } finally {
+      setSubmitting(false)
+    }
+  }
+
+  return (
+    <main className="mx-auto max-w-xl p-6">
+      <h1 className="mb-4 text-2xl font-bold">Produkt hinzufügen</h1>
+      <form onSubmit={submit} className="space-y-3">
+        <input
+          type="url"
+          required
+          value={url}
+          onChange={(e) => setUrl(e.target.value)}
+          placeholder="https://www.amazon.de/dp/..."
+          className="w-full rounded border border-zinc-700 bg-zinc-900 px-3 py-2 text-sm"
+        />
+        <p className="text-xs text-zinc-500">Unterstützt: Amazon, Idealo, Geizhals</p>
+        {error && <div className="rounded bg-red-950 px-3 py-2 text-sm text-red-300">{error}</div>}
+        <button
+          type="submit"
+          disabled={submitting}
+          className="rounded bg-emerald-600 px-4 py-2 text-sm font-medium hover:bg-emerald-500 disabled:opacity-50"
+        >
+          {submitting ? 'Wird abgerufen…' : 'Hinzufügen'}
+        </button>
+      </form>
+    </main>
+  )
+}