@gigamusic/admin 0.1.0

package/src/components/ReleaseForm.tsx

@@ -0,0 +1,556 @@
+"use client";
+
+import React, { useState } from "react";
+import { useRouter } from "next/navigation";
+import { useSlot } from "@gigamusic/ui/client";
+import { slugify } from "@gigamusic/core";
+import { combinedName, deriveTrackArtistTitle } from "@gigamusic/audio/track-name";
+
+interface ExistingTrack {
+  id: number;
+  name: string;
+  artist: string | null;
+  genre: string | null;
+  slug: string;
+  price: number;
+  trackNumber: number;
+  inRadio: boolean;
+  files: {
+    format: string;
+    fileName: string;
+    storageKey: string;
+    fileSize: number | null;
+  }[];
+}
+
+export interface ReleaseFormProps {
+  release?: {
+    id: number;
+    name: string;
+    slug: string;
+    description: string | null;
+    price: number;
+    type: "album" | "single";
+    coverImageUrl: string | null;
+    releasedAt: Date | string | null;
+    isPublished: boolean;
+    inRadio: boolean;
+    tracks?: ExistingTrack[];
+  };
+}
+
+interface TrackInput {
+  existingId?: number;
+  artist: string;
+  title: string;
+  genre: string;
+  slug: string;
+  priceStr: string;
+  trackNumber: number;
+  inRadio: boolean;
+  wavFile: File | null;
+  existingWavName?: string;
+  existingWavStorageKey?: string;
+  existingMp3Name?: string;
+  existingMp3StorageKey?: string;
+}
+
+/**
+ * The release create/edit form. Talks to the admin API surface the consumer
+ * wires up — every fetch hits a stable `/api/admin/...` path so the only
+ * binding between this form and the backend is the network shape.
+ *
+ * Uploads happen client-side via presigned URLs from `/api/admin/upload/presign`;
+ * server-side transcoding + tagging is triggered by `/api/admin/upload/process`.
+ */
+export function ReleaseForm({ release }: ReleaseFormProps) {
+  const Button = useSlot("Button");
+  const router = useRouter();
+  const [loading, setLoading] = useState(false);
+  const [status, setStatus] = useState("");
+  const [error, setError] = useState("");
+  const [fieldErrors, setFieldErrors] = useState<Record<string, string>>({});
+
+  const [name, setName] = useState(release?.name ?? "");
+  const [slug, setSlug] = useState(release?.slug ?? "");
+  const [description, setDescription] = useState(release?.description ?? "");
+  const [priceStr, setPriceStr] = useState(
+    release ? (release.price / 100).toFixed(2) : "",
+  );
+  const [type, setType] = useState<"album" | "single">(release?.type ?? "single");
+  const [releasedAt, setReleasedAt] = useState(() => {
+    if (!release?.releasedAt) return "";
+    const d = new Date(release.releasedAt);
+    return d.toISOString().slice(0, 10);
+  });
+  const [isPublished, setIsPublished] = useState(release?.isPublished ?? false);
+  const [coverImage, setCoverImage] = useState<File | null>(null);
+  const [tracks, setTracks] = useState<TrackInput[]>(() => {
+    if (release?.tracks?.length) {
+      return release.tracks.map((t) => {
+        const wav = t.files.find((f) => f.format === "wav");
+        const mp3 = t.files.find((f) => f.format === "mp3");
+        const split = deriveTrackArtistTitle(t.name, t.artist);
+        return {
+          existingId: t.id,
+          artist: split.artist,
+          title: split.title,
+          genre: t.genre ?? "",
+          slug: t.slug,
+          priceStr: (t.price / 100).toFixed(2),
+          trackNumber: t.trackNumber,
+          inRadio: t.inRadio,
+          wavFile: null,
+          existingWavName: wav?.fileName,
+          existingWavStorageKey: wav?.storageKey,
+          existingMp3Name: mp3?.fileName,
+          existingMp3StorageKey: mp3?.storageKey,
+        };
+      });
+    }
+    return [
+      {
+        artist: "",
+        title: "",
+        genre: "",
+        slug: "",
+        priceStr: "1.99",
+        trackNumber: 1,
+        inRadio: true,
+        wavFile: null,
+      },
+    ];
+  });
+
+  function updateTrack(index: number, patch: Partial<TrackInput>) {
+    setTracks((prev) => prev.map((t, i) => (i === index ? { ...t, ...patch } : t)));
+  }
+
+  function addTrack() {
+    setTracks((prev) => [
+      ...prev,
+      {
+        artist: "",
+        title: "",
+        genre: "",
+        slug: "",
+        priceStr: "1.99",
+        trackNumber: prev.length + 1,
+        inRadio: true,
+        wavFile: null,
+      },
+    ]);
+  }
+
+  function removeTrack(index: number) {
+    setTracks((prev) =>
+      prev
+        .filter((_, i) => i !== index)
+        .map((t, i) => ({ ...t, trackNumber: i + 1 })),
+    );
+  }
+
+  async function presignAndUpload(file: File, key: string): Promise<string> {
+    const contentType = file.type || "application/octet-stream";
+    const presignRes = await fetch("/api/admin/upload/presign", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ key, contentType }),
+    });
+    if (!presignRes.ok) {
+      throw new Error(`Failed to get upload URL (${presignRes.status})`);
+    }
+    const { url, publicUrl } = (await presignRes.json()) as {
+      url: string;
+      publicUrl: string;
+    };
+    const uploadRes = await fetch(url, {
+      method: "PUT",
+      headers: { "Content-Type": contentType },
+      body: file,
+    });
+    if (!uploadRes.ok) throw new Error("Upload failed");
+    return publicUrl;
+  }
+
+  async function handleSubmit(e: React.FormEvent) {
+    e.preventDefault();
+    setLoading(true);
+    setError("");
+    setFieldErrors({});
+    setStatus("");
+
+    try {
+      const parsedPrice = parseFloat(priceStr);
+      const price = isNaN(parsedPrice) ? 0 : Math.round(parsedPrice * 100);
+      if (isPublished && price <= 0) {
+        setError("Please enter a valid release price.");
+        setLoading(false);
+        return;
+      }
+
+      let coverImageUrl: string | null = release?.coverImageUrl ?? null;
+      if (coverImage) {
+        setStatus("Uploading cover image...");
+        coverImageUrl = await presignAndUpload(
+          coverImage,
+          `images/covers/${coverImage.name}`,
+        );
+      }
+
+      const trackData = [];
+      for (const track of tracks) {
+        const trackName = combinedName(track.artist, track.title);
+        const parsedTrackPrice = parseFloat(track.priceStr);
+        const trackPrice = isNaN(parsedTrackPrice)
+          ? 0
+          : Math.round(parsedTrackPrice * 100);
+
+        let wavUrl = track.existingWavStorageKey ?? null;
+        let mp3Url = track.existingMp3StorageKey ?? null;
+        let wavName = track.existingWavName ?? "";
+
+        if (track.wavFile) {
+          setStatus(`Uploading & transcoding "${trackName || track.wavFile.name}"...`);
+          const key = `audio/${slug}/${track.trackNumber}/${track.wavFile.name}`;
+          await presignAndUpload(track.wavFile, key);
+
+          const processRes = await fetch("/api/admin/upload/process", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({
+              key,
+              trackId: track.existingId ?? null,
+              metadata: {
+                title: track.title || undefined,
+                artist: track.artist || undefined,
+                album: name || undefined,
+                genre: track.genre || undefined,
+                trackNumber: track.trackNumber,
+                trackTotal: tracks.length,
+                year: releasedAt
+                  ? new Date(releasedAt + "T00:00:00Z").getUTCFullYear()
+                  : undefined,
+              },
+              coverImageUrl,
+            }),
+          });
+          const processBody = (await processRes.json()) as {
+            wavUrl?: string;
+            mp3Url?: string;
+            error?: string;
+          };
+          if (!processRes.ok) {
+            throw new Error(processBody.error ?? "Transcoding failed");
+          }
+          wavUrl = processBody.wavUrl ?? null;
+          mp3Url = processBody.mp3Url ?? null;
+          wavName = track.wavFile.name;
+        }
+
+        const files: Array<{
+          format: string;
+          fileName: string;
+          storageKey: string;
+          fileSize: number;
+        }> = [];
+        if (wavUrl) {
+          files.push({
+            format: "wav",
+            fileName: wavName || "track.wav",
+            storageKey: wavUrl,
+            fileSize: 0,
+          });
+        }
+        if (mp3Url) {
+          files.push({
+            format: "mp3",
+            fileName: (wavName || "track.wav").replace(/\.wav$/i, ".mp3"),
+            storageKey: mp3Url,
+            fileSize: 0,
+          });
+        }
+
+        trackData.push({
+          id: track.existingId,
+          name: trackName,
+          artist: track.artist || null,
+          genre: track.genre || null,
+          slug: track.slug || slugify(trackName) || `track-${track.trackNumber}`,
+          price: trackPrice,
+          trackNumber: track.trackNumber,
+          inRadio: track.inRadio,
+          files,
+        });
+      }
+
+      setStatus("Saving release...");
+      const url = release
+        ? `/api/admin/releases/${release.id}`
+        : "/api/admin/releases";
+      const res = await fetch(url, {
+        method: release ? "PUT" : "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          name,
+          slug,
+          description: description || null,
+          price,
+          type,
+          coverImageUrl,
+          releasedAt: releasedAt
+            ? new Date(releasedAt + "T00:00:00Z").toISOString()
+            : null,
+          isPublished,
+          tracks: trackData,
+        }),
+      });
+
+      if (!res.ok) {
+        const data = (await res.json().catch(() => ({}))) as {
+          error?: string;
+          fieldErrors?: Record<string, string[]>;
+        };
+        setError(data.error ?? "Something went wrong");
+        if (data.fieldErrors) {
+          const flat: Record<string, string> = {};
+          for (const [k, msgs] of Object.entries(data.fieldErrors)) {
+            if (Array.isArray(msgs) && msgs[0]) flat[k] = msgs[0];
+          }
+          setFieldErrors(flat);
+        }
+        setLoading(false);
+        setStatus("");
+        return;
+      }
+
+      const saved = (await res.json()) as { id: number };
+      setLoading(false);
+      setStatus("");
+      router.push(`/admin/releases/${saved.id}/edit`);
+      router.refresh();
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Something went wrong");
+      setLoading(false);
+      setStatus("");
+    }
+  }
+
+  return (
+    <form onSubmit={handleSubmit} className="gm-admin-form space-y-6 rounded-lg border border-border p-6">
+      <Field label="Release Name" id="name" error={fieldErrors.name}>
+        <input
+          id="name"
+          value={name}
+          onChange={(e) => {
+            setName(e.target.value);
+            if (!release) setSlug(slugify(e.target.value));
+          }}
+          required
+          className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+        />
+      </Field>
+
+      <Field label="Slug" id="slug" error={fieldErrors.slug}>
+        <input
+          id="slug"
+          value={slug}
+          onChange={(e) => setSlug(e.target.value)}
+          required
+          className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+        />
+      </Field>
+
+      <Field label="Description" id="description">
+        <textarea
+          id="description"
+          value={description}
+          onChange={(e) => setDescription(e.target.value)}
+          rows={3}
+          className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+        />
+      </Field>
+
+      <div className="grid grid-cols-2 gap-4">
+        <Field label="Release Price (USD)" id="price" error={fieldErrors.price}>
+          <input
+            id="price"
+            type="number"
+            step="0.01"
+            min="0"
+            value={priceStr}
+            onChange={(e) => setPriceStr(e.target.value)}
+            className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+          />
+        </Field>
+        <Field label="Type" id="type">
+          <select
+            id="type"
+            value={type}
+            onChange={(e) => setType(e.target.value as "album" | "single")}
+            className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+          >
+            <option value="single">Single</option>
+            <option value="album">Album</option>
+          </select>
+        </Field>
+      </div>
+
+      <Field label="Release Date" id="releasedAt">
+        <input
+          id="releasedAt"
+          type="date"
+          value={releasedAt}
+          onChange={(e) => setReleasedAt(e.target.value)}
+          className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+        />
+      </Field>
+
+      <Field label="Cover Image" id="cover">
+        <input
+          id="cover"
+          type="file"
+          accept="image/*"
+          onChange={(e) => setCoverImage(e.target.files?.[0] ?? null)}
+          className="block text-sm"
+        />
+      </Field>
+
+      <div className="space-y-3">
+        <p className="text-sm font-medium">Tracks</p>
+        {tracks.map((track, index) => (
+          <div key={index} className="space-y-3 rounded border border-border p-4">
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium">Track {track.trackNumber}</span>
+              {tracks.length > 1 && (
+                <Button variant="ghost" size="sm" onClick={() => removeTrack(index)}>
+                  Remove
+                </Button>
+              )}
+            </div>
+            <div className="grid grid-cols-2 gap-3">
+              <Field label="Artist" id={`artist-${index}`} error={fieldErrors[`tracks[${index}].artist`]}>
+                <input
+                  value={track.artist}
+                  onChange={(e) => {
+                    const value = e.target.value;
+                    updateTrack(index, {
+                      artist: value,
+                      slug:
+                        track.existingId == null
+                          ? slugify(combinedName(value, track.title))
+                          : track.slug,
+                    });
+                  }}
+                  className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+                />
+              </Field>
+              <Field label="Track Title" id={`title-${index}`} error={fieldErrors[`tracks[${index}].name`]}>
+                <input
+                  value={track.title}
+                  onChange={(e) => {
+                    const value = e.target.value;
+                    updateTrack(index, {
+                      title: value,
+                      slug:
+                        track.existingId == null
+                          ? slugify(combinedName(track.artist, value))
+                          : track.slug,
+                    });
+                  }}
+                  className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+                />
+              </Field>
+            </div>
+            <div className="grid grid-cols-2 gap-3">
+              <Field label="Price (USD)" id={`price-${index}`} error={fieldErrors[`tracks[${index}].price`]}>
+                <input
+                  type="number"
+                  step="0.01"
+                  min="0"
+                  value={track.priceStr}
+                  onChange={(e) => updateTrack(index, { priceStr: e.target.value })}
+                  className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+                />
+              </Field>
+              <Field label="Slug" id={`slug-${index}`}>
+                <input
+                  value={track.slug}
+                  onChange={(e) => updateTrack(index, { slug: e.target.value })}
+                  className="block w-full rounded border border-border bg-background px-3 py-2 text-sm"
+                />
+              </Field>
+            </div>
+            <Field label="WAV File" id={`wav-${index}`} error={fieldErrors[`tracks[${index}].files`]}>
+              <input
+                type="file"
+                accept=".wav"
+                onChange={(e) => updateTrack(index, { wavFile: e.target.files?.[0] ?? null })}
+                className="block text-sm"
+              />
+              {track.existingWavName && !track.wavFile && (
+                <p className="text-xs text-muted-foreground">
+                  Current: {track.existingWavName}
+                  {track.existingMp3StorageKey && " (320k mp3 generated)"}
+                </p>
+              )}
+            </Field>
+          </div>
+        ))}
+        <Button variant="outline" size="sm" onClick={addTrack}>
+          Add Track
+        </Button>
+      </div>
+
+      <label className="flex items-center gap-2 text-sm">
+        <input
+          type="checkbox"
+          checked={isPublished}
+          onChange={(e) => setIsPublished(e.target.checked)}
+        />
+        Published
+      </label>
+
+      {loading && status && (
+        <p className="text-sm text-muted-foreground">{status}</p>
+      )}
+      {error && <p className="text-sm text-destructive">{error}</p>}
+
+      <div className="flex gap-3">
+        <Button type="submit" disabled={loading}>
+          {loading ? "Saving..." : release ? "Update Release" : "Save Release"}
+        </Button>
+        <Button variant="outline" onClick={() => router.back()}>
+          Cancel
+        </Button>
+      </div>
+    </form>
+  );
+}
+
+function Field({
+  label,
+  id,
+  error,
+  children,
+}: {
+  label: string;
+  id: string;
+  error?: string;
+  children: React.ReactNode;
+}) {
+  // Clone the single form control child so callers don't have to repeat
+  // `id={...}` on the input — the label's htmlFor stays the source of truth.
+  const child = React.isValidElement(children)
+    ? React.cloneElement(children as React.ReactElement<{ id?: string }>, { id })
+    : children;
+  return (
+    <div className="space-y-1">
+      <label htmlFor={id} className="text-sm font-medium">
+        {label}
+      </label>
+      {child}
+      {error && <p className="text-xs text-destructive">{error}</p>}
+    </div>
+  );
+}

package/src/handlers/auth.ts

@@ -0,0 +1,58 @@
+import { verifyAdminPassword } from "@gigamusic/core";
+import type { Queries } from "@gigamusic/db";
+import {
+  clearAdminSessionCookie,
+  writeAdminSessionCookie,
+} from "../lib/session";
+import type { RouteHandler } from "../lib/types";
+import { json, unauthorized } from "../lib/responses";
+import { clientIp, consumeAdminLoginAttempt } from "../lib/rate-limit";
+
+interface LoginDeps {
+  adminPasswordHash: string;
+  adminSessionSecret: string;
+  /** Optional — supply to gate brute-force login attempts. */
+  queries?: Queries;
+}
+
+/**
+ * Build the `POST /api/admin/auth` handler. Verifies the supplied password
+ * against the consumer's bcrypt hash, mints a session cookie on success, and
+ * rate-limits per-IP attempts when `queries` is provided.
+ */
+export function createAdminLoginHandler(deps: LoginDeps): RouteHandler {
+  return async (req) => {
+    if (deps.queries) {
+      const result = await consumeAdminLoginAttempt(deps.queries, clientIp(req));
+      if (!result.ok) {
+        return json(
+          { error: "Too many attempts. Please try again later." },
+          { status: 429 },
+        );
+      }
+    }
+
+    let password: string;
+    try {
+      const body = (await req.json()) as { password?: unknown };
+      password = typeof body.password === "string" ? body.password : "";
+    } catch {
+      return unauthorized();
+    }
+
+    if (!password) return unauthorized();
+    const ok = await verifyAdminPassword(password, deps.adminPasswordHash);
+    if (!ok) return unauthorized();
+
+    await writeAdminSessionCookie(deps.adminSessionSecret);
+    return json({ ok: true });
+  };
+}
+
+/** Build the `POST /api/admin/auth/logout` handler. Clears the session cookie. */
+export function createAdminLogoutHandler(): RouteHandler {
+  return async () => {
+    await clearAdminSessionCookie();
+    return json({ ok: true });
+  };
+}