Comprehensive admin + user dashboards (production-ready)

components/app/repurpose-client.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useState } from "react";
-import { FileText, Hash, Mail, Loader2, Copy, Sparkles } from "lucide-react";
+import { FileText, Hash, Mail, Loader2, Copy, Sparkles, Download } from "lucide-react";
 import { toast } from "sonner";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
@@ -16,6 +16,27 @@ const FORMATS: { key: Format; label: string; icon: React.ComponentType<{ classNa
   { key: "newsletter", label: "Newsletter", icon: Mail },
 ];
 
+function wordCount(text: string): number {
+  const t = text.trim();
+  return t ? t.split(/\s+/).length : 0;
+}
+
+function slugify(s: string): string {
+  return s.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "").slice(0, 60) || "content";
+}
+
+function downloadMarkdown(filename: string, markdown: string) {
+  const blob = new Blob([markdown], { type: "text/markdown;charset=utf-8" });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+  URL.revokeObjectURL(url);
+}
+
 export function RepurposeClient({
   episodeId,
   initial,
@@ -64,13 +85,29 @@ export function RepurposeClient({
             <CardContent className="flex-1">
               {c ? (
                 <div className="space-y-3">
-                  <p className="font-medium">{c.title}</p>
+                  <div className="flex items-start justify-between gap-2">
+                    <p className="font-medium">{c.title}</p>
+                    <span className="shrink-0 whitespace-nowrap text-xs text-muted-foreground">
+                      {wordCount(c.body).toLocaleString()} words · {c.body.length.toLocaleString()} chars
+                    </span>
+                  </div>
                   <div className="max-h-96 overflow-y-auto whitespace-pre-wrap rounded-md bg-muted/40 p-3 text-sm text-muted-foreground">
                     {c.body}
                   </div>
-                  <Button size="sm" variant="ghost" onClick={() => copy(`${c.title}\n\n${c.body}`)}>
-                    <Copy className="h-4 w-4" /> Copy
-                  </Button>
+                  <div className="flex items-center gap-1">
+                    <Button size="sm" variant="ghost" onClick={() => copy(`${c.title}\n\n${c.body}`)}>
+                      <Copy className="h-4 w-4" /> Copy
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      onClick={() =>
+                        downloadMarkdown(`${slugify(c.title)}.md`, `# ${c.title}\n\n${c.body}\n`)
+                      }
+                    >
+                      <Download className="h-4 w-4" /> Download .md
+                    </Button>
+                  </div>
                 </div>
               ) : (
                 <p className="py-8 text-center text-sm text-muted-foreground">