fix: reshared posts should be shown in feed

app/feedback/page.tsx

@@ -0,0 +1,180 @@
+"use client";
+
+/**
+ * /feedback — single-page form for bug reports, feature requests, and
+ * general comments. Submissions persist to the BFF and trigger an
+ * admin notification email. No follow-up UI beyond a success toast
+ * and a redirect back to /.
+ *
+ * Authed visitors don't see the contact-email field — the BFF reads
+ * their account email from the session cookie. Anonymous visitors get
+ * the field and must fill it in so we have a reply path.
+ */
+
+import { useState } from "react";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
+import { ArrowLeft, MessageSquare, Send } from "lucide-react";
+import { toast } from "sonner";
+import { feedback as feedbackAPI, SocialError } from "@/lib/social";
+import { useAuth } from "@/components/auth/auth-provider";
+
+type Category = "bug" | "feature" | "general" | "other";
+
+const CATEGORIES: { value: Category; label: string; description: string }[] = [
+  { value: "general", label: "General feedback", description: "Thoughts, impressions, suggestions — anything else." },
+  { value: "bug", label: "Bug report", description: "Something is broken or behaving unexpectedly." },
+  { value: "feature", label: "Feature request", description: "An idea for something new on the site." },
+  { value: "other", label: "Other", description: "Doesn't fit the above? Use this." },
+];
+
+export default function FeedbackPage() {
+  const router = useRouter();
+  const { user, loading } = useAuth();
+  const authed = !loading && !!user;
+
+  const [category, setCategory] = useState<Category>("general");
+  const [message, setMessage] = useState("");
+  const [contactEmail, setContactEmail] = useState("");
+  const [submitting, setSubmitting] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  async function submit(e: React.FormEvent) {
+    e.preventDefault();
+    setError(null);
+    const trimmed = message.trim();
+    if (!trimmed) {
+      setError("Message is required.");
+      return;
+    }
+    if (!authed && !contactEmail.trim()) {
+      setError("Email is required so we can reply.");
+      return;
+    }
+    setSubmitting(true);
+    try {
+      await feedbackAPI.submit({
+        category,
+        message: trimmed,
+        contact_email: authed ? undefined : contactEmail.trim(),
+      });
+      toast.success("Thanks for the feedback!", {
+        description: "We've forwarded it to the team.",
+        duration: 5000,
+      });
+      setMessage("");
+      setContactEmail("");
+      router.push("/");
+    } catch (err) {
+      setError(err instanceof SocialError ? err.message : "Could not send feedback.");
+    } finally {
+      setSubmitting(false);
+    }
+  }
+
+  const selected = CATEGORIES.find((c) => c.value === category);
+
+  return (
+    <main className="flex-1 max-w-xl w-full mx-auto px-4 sm:px-6 py-10 sm:py-14">
+      <Link
+        href="/"
+        className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground"
+      >
+        <ArrowLeft className="size-4" /> Back to home
+      </Link>
+
+      <header className="mt-6 mb-6 flex items-start gap-3">
+        <span
+          aria-hidden
+          className="inline-flex size-11 items-center justify-center rounded-full bg-primary/10 text-primary shrink-0"
+        >
+          <MessageSquare className="size-5" />
+        </span>
+        <div>
+          <h1 className="font-[family-name:var(--font-title)] font-semibold text-2xl text-foreground leading-tight">
+            Send feedback
+          </h1>
+          <p className="mt-1 text-sm text-muted-foreground">
+            Tell us what&apos;s working, what&apos;s broken, or what you&apos;d like to see next. We read every message.
+          </p>
+        </div>
+      </header>
+
+      <form
+        onSubmit={submit}
+        className="space-y-5 rounded-2xl bg-card ring-1 ring-foreground/10 p-5"
+      >
+        <div>
+          <label htmlFor="category" className="text-sm font-medium text-foreground">
+            What&apos;s this about?
+          </label>
+          <select
+            id="category"
+            value={category}
+            onChange={(e) => setCategory(e.target.value as Category)}
+            className="mt-1.5 h-10 w-full rounded-lg border border-border bg-card px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+            disabled={submitting}
+          >
+            {CATEGORIES.map((c) => (
+              <option key={c.value} value={c.value}>{c.label}</option>
+            ))}
+          </select>
+          <p className="mt-1 text-xs text-muted-foreground">
+            {selected?.description}
+          </p>
+        </div>
+
+        <div>
+          <label htmlFor="message" className="text-sm font-medium text-foreground">
+            Message
+          </label>
+          <textarea
+            id="message"
+            value={message}
+            onChange={(e) => setMessage(e.target.value)}
+            placeholder="Share as much detail as you'd like…"
+            rows={6}
+            maxLength={5000}
+            disabled={submitting}
+            className="mt-1.5 w-full rounded-lg border border-border bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring resize-y"
+          />
+          <p className="mt-1 text-xs text-muted-foreground text-right tabular-nums">
+            {message.length}/5000
+          </p>
+        </div>
+
+        {!loading && !authed ? (
+          <div>
+            <label htmlFor="contact_email" className="text-sm font-medium text-foreground">
+              Your email
+            </label>
+            <input
+              id="contact_email"
+              type="email"
+              value={contactEmail}
+              onChange={(e) => setContactEmail(e.target.value)}
+              placeholder="you@example.com"
+              required
+              disabled={submitting}
+              className="mt-1.5 h-10 w-full rounded-lg border border-border bg-card px-3 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+            />
+            <p className="mt-1 text-xs text-muted-foreground">
+              So we can write back if needed. We don&apos;t add you to a mailing list.
+            </p>
+          </div>
+        ) : null}
+
+        {error ? <p className="text-sm text-destructive">{error}</p> : null}
+
+        <button
+          type="submit"
+          disabled={submitting || !message.trim()}
+          className="w-full h-11 inline-flex items-center justify-center gap-2 rounded-lg bg-primary text-primary-foreground text-base font-medium hover:bg-primary/90 transition-colors disabled:opacity-60"
+        >
+          <Send className="size-4" />
+          {submitting ? "Sending…" : "Send feedback"}
+        </button>
+      </form>
+    </main>
+  );
+}

app/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import Link from "next/link";
-import { Compass, LogIn, Sparkles } from "lucide-react";
+import { Compass, LogIn, MessageSquare, Sparkles } from "lucide-react";
 import { useAuth } from "@/components/auth/auth-provider";
 
 /**
@@ -78,6 +78,14 @@ export default function HomePage() {
             — it's free.
           </p>
         ) : null}
+
+        <Link
+          href="/feedback"
+          className="mt-8 inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground underline-offset-4 hover:underline"
+        >
+          <MessageSquare className="size-3.5" />
+          Send feedback
+        </Link>
       </div>
     </main>
   );