added supabase

2026-02-20 09:12:47 -06:00
parent 3c293159ff
commit 76f1241761
54 changed files with 3162 additions and 445 deletions
@@ -0,0 +1,100 @@
+import { createClient } from "@/utils/supabase/server";
+import Link from "next/link";
+import { deleteAuthor } from "./actions";
+
+export default async function AdminAuthorsPage() {
+  const supabase = await createClient();
+
+  const { data: authors } = await supabase
+    .from("authors")
+    .select("name, bio, x_link, fb_link, insta_link, pfp_link")
+    .order("name");
+
+  return (
+    <div>
+      <div className="flex justify-between items-center mb-8">
+        <h1 className="text-3xl font-bold">Authors</h1>
+        <Link
+          href="/admin/authors/new"
+          className="bg-accent text-white px-4 py-2 rounded-md hover:bg-accent-dark"
+        >
+          New Author
+        </Link>
+      </div>
+
+      <div className="bg-white rounded-lg shadow-sm overflow-hidden">
+        <table className="min-w-full divide-y divide-gray-200">
+          <thead className="bg-gray-50">
+            <tr>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                Name
+              </th>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                Bio
+              </th>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                Links
+              </th>
+              <th className="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">
+                Actions
+              </th>
+            </tr>
+          </thead>
+          <tbody className="bg-white divide-y divide-gray-200">
+            {authors?.map((author) => (
+              <tr key={author.name} className="hover:bg-gray-50">
+                <td className="px-6 py-4 font-medium">{author.name}</td>
+                <td className="px-6 py-4">
+                  <p className="text-gray-600 line-clamp-2 max-w-md">
+                    {author.bio}
+                  </p>
+                </td>
+                <td className="px-6 py-4">
+                  <div className="flex gap-2">
+                    {author.x_link && (
+                      <span className="text-xs bg-gray-100 px-2 py-1 rounded">
+                        X
+                      </span>
+                    )}
+                    {author.fb_link && (
+                      <span className="text-xs bg-gray-100 px-2 py-1 rounded">
+                        FB
+                      </span>
+                    )}
+                    {author.insta_link && (
+                      <span className="text-xs bg-gray-100 px-2 py-1 rounded">
+                        IG
+                      </span>
+                    )}
+                  </div>
+                </td>
+                <td className="px-6 py-4 text-right space-x-2">
+                  <Link
+                    href={`/admin/authors/${encodeURIComponent(author.name)}/edit`}
+                    className="text-sm text-accent hover:text-accent-dark"
+                  >
+                    Edit
+                  </Link>
+                  <form
+                    action={deleteAuthor.bind(null, author.name)}
+                    className="inline"
+                  >
+                    <button
+                      type="submit"
+                      className="text-sm text-red-600 hover:text-red-800"
+                    >
+                      Delete
+                    </button>
+                  </form>
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+        {(!authors || authors.length === 0) && (
+          <p className="text-gray-500 text-center py-8">No authors found.</p>
+        )}
+      </div>
+    </div>
+  );
+}