nextjs-hackathon-stack 0.1.11 → 0.1.13

package/template/src/shared/__tests__/supabase-server.test.ts

@@ -1,22 +1,95 @@
 import { describe, it, expect, vi } from "vitest";
 
+const mockSet = vi.fn();
+const mockGetAll = vi.fn().mockReturnValue([]);
+const mockCreateServerClient = vi.fn();
+
 vi.mock("@supabase/ssr", () => ({
-  createServerClient: vi.fn(() => ({ auth: {} })),
+  createServerClient: (...args: unknown[]) => mockCreateServerClient(...args),
 }));
 
 vi.mock("next/headers", () => ({
   cookies: vi.fn(() =>
     Promise.resolve({
-      getAll: () => [],
-      set: vi.fn(),
+      getAll: mockGetAll,
+      set: mockSet,
     })
   ),
 }));
 
 describe("supabase server", () => {
   it("createClient returns a supabase client", async () => {
+    // Arrange
+    mockCreateServerClient.mockReturnValue({ auth: {} });
     const { createClient } = await import("../lib/supabase/server");
+
+    // Act
     const client = await createClient();
+
+    // Assert
     expect(client).toBeDefined();
   });
+
+  it("passes cookie getAll to server client config", async () => {
+    // Arrange
+    let capturedGetAll: (() => unknown) | undefined;
+    mockCreateServerClient.mockImplementation(
+      (_u: unknown, _k: unknown, opts: { cookies: { getAll: () => unknown } }) => {
+        capturedGetAll = opts.cookies.getAll;
+        return { auth: {} };
+      }
+    );
+    const { createClient } = await import("../lib/supabase/server");
+
+    // Act
+    await createClient();
+    capturedGetAll!();
+
+    // Assert
+    expect(mockGetAll).toHaveBeenCalled();
+  });
+
+  it("setAll sets cookies via cookieStore", async () => {
+    // Arrange
+    let capturedSetAll:
+      | ((cookies: { name: string; value: string; options: object }[]) => void)
+      | undefined;
+    mockCreateServerClient.mockImplementation(
+      (_u: unknown, _k: unknown, opts: { cookies: { setAll: (c: { name: string; value: string; options: object }[]) => void } }) => {
+        capturedSetAll = opts.cookies.setAll;
+        return { auth: {} };
+      }
+    );
+    const { createClient } = await import("../lib/supabase/server");
+    await createClient();
+
+    // Act
+    capturedSetAll!([{ name: "token", value: "abc", options: { path: "/" } }]);
+
+    // Assert
+    expect(mockSet).toHaveBeenCalledWith("token", "abc", { path: "/" });
+  });
+
+  it("setAll silently swallows errors from server components", async () => {
+    // Arrange
+    mockSet.mockImplementation(() => {
+      throw new Error("Cannot set cookie");
+    });
+    let capturedSetAll:
+      | ((cookies: { name: string; value: string; options: object }[]) => void)
+      | undefined;
+    mockCreateServerClient.mockImplementation(
+      (_u: unknown, _k: unknown, opts: { cookies: { setAll: (c: { name: string; value: string; options: object }[]) => void } }) => {
+        capturedSetAll = opts.cookies.setAll;
+        return { auth: {} };
+      }
+    );
+    const { createClient } = await import("../lib/supabase/server");
+    await createClient();
+
+    // Act + Assert
+    expect(() =>
+      capturedSetAll!([{ name: "token", value: "abc", options: {} }])
+    ).not.toThrow();
+  });
 });

package/template/src/shared/__tests__/ui-button.test.tsx

@@ -0,0 +1,52 @@
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+
+import { Button } from "../components/ui/button";
+
+describe("Button", () => {
+  it("renders with default variant", () => {
+    // Arrange + Act
+    render(<Button>Click me</Button>);
+
+    // Assert
+    expect(screen.getByRole("button", { name: /click me/i })).toBeInTheDocument();
+  });
+
+  it("renders as disabled when disabled prop is set", () => {
+    // Arrange + Act
+    render(<Button disabled>Submit</Button>);
+
+    // Assert
+    expect(screen.getByRole("button")).toBeDisabled();
+  });
+
+  it("renders with custom className", () => {
+    // Arrange + Act
+    render(<Button className="custom-class">Click</Button>);
+
+    // Assert
+    expect(screen.getByRole("button")).toHaveClass("custom-class");
+  });
+
+  it("renders as a Slot (asChild) when asChild is true", () => {
+    // Arrange + Act
+    render(
+      <Button asChild>
+        <a href="/home">Go home</a>
+      </Button>
+    );
+
+    // Assert
+    expect(screen.getByRole("link", { name: /go home/i })).toBeInTheDocument();
+  });
+
+  it("renders with destructive variant", () => {
+    // Arrange + Act
+    render(<Button variant="destructive">Delete</Button>);
+
+    // Assert
+    const btn = screen.getByRole("button", { name: /delete/i });
+    expect(btn).toBeInTheDocument();
+    expect(btn.className).toContain("destructive");
+  });
+});

package/template/src/shared/__tests__/ui-card.test.tsx

@@ -0,0 +1,78 @@
+import { render, screen } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+
+import {
+  Card,
+  CardAction,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "../components/ui/card";
+
+describe("Card components", () => {
+  it("renders Card with children", () => {
+    // Arrange + Act
+    render(<Card data-testid="card">content</Card>);
+
+    // Assert
+    expect(screen.getByTestId("card")).toBeInTheDocument();
+  });
+
+  it("renders CardHeader", () => {
+    // Arrange + Act
+    render(<CardHeader data-testid="header">header</CardHeader>);
+
+    // Assert
+    expect(screen.getByTestId("header")).toBeInTheDocument();
+  });
+
+  it("renders CardTitle", () => {
+    // Arrange + Act
+    render(<CardTitle>My Title</CardTitle>);
+
+    // Assert
+    expect(screen.getByText("My Title")).toBeInTheDocument();
+  });
+
+  it("renders CardDescription", () => {
+    // Arrange + Act
+    render(<CardDescription>My Description</CardDescription>);
+
+    // Assert
+    expect(screen.getByText("My Description")).toBeInTheDocument();
+  });
+
+  it("renders CardContent", () => {
+    // Arrange + Act
+    render(<CardContent data-testid="content">body</CardContent>);
+
+    // Assert
+    expect(screen.getByTestId("content")).toBeInTheDocument();
+  });
+
+  it("renders CardAction", () => {
+    // Arrange + Act
+    render(<CardAction data-testid="action">action</CardAction>);
+
+    // Assert
+    expect(screen.getByTestId("action")).toBeInTheDocument();
+  });
+
+  it("renders CardFooter", () => {
+    // Arrange + Act
+    render(<CardFooter data-testid="footer">footer</CardFooter>);
+
+    // Assert
+    expect(screen.getByTestId("footer")).toBeInTheDocument();
+  });
+
+  it("applies custom className to Card", () => {
+    // Arrange + Act
+    render(<Card className="custom-class" data-testid="card">content</Card>);
+
+    // Assert
+    expect(screen.getByTestId("card")).toHaveClass("custom-class");
+  });
+});

package/template/src/shared/__tests__/utils.test.ts

@@ -0,0 +1,30 @@
+import { describe, it, expect } from "vitest";
+
+import { cn } from "../lib/utils";
+
+describe("cn", () => {
+  it("merges multiple class names", () => {
+    // Arrange + Act + Assert
+    expect(cn("foo", "bar")).toBe("foo bar");
+  });
+
+  it("omits falsy conditional classes", () => {
+    // Arrange + Act + Assert
+    expect(cn("foo", false && "bar", "baz")).toBe("foo baz");
+  });
+
+  it("handles undefined values", () => {
+    // Arrange + Act + Assert
+    expect(cn("foo", undefined, "bar")).toBe("foo bar");
+  });
+
+  it("deduplicates conflicting tailwind classes (last one wins)", () => {
+    // Arrange + Act + Assert
+    expect(cn("p-2", "p-4")).toBe("p-4");
+  });
+
+  it("handles empty call", () => {
+    // Arrange + Act + Assert
+    expect(cn()).toBe("");
+  });
+});

package/template/src/shared/lib/ai.ts

@@ -1,8 +1,8 @@
 import { createOpenAI } from "@ai-sdk/openai";
 
 const provider = createOpenAI({
-  baseURL: process.env.AI_BASE_URL ?? "https://api.minimaxi.chat/v1",
+  baseURL: process.env.AI_GATEWAY_URL ?? "https://gateway.ai.vercel.app/v1",
   apiKey: process.env.AI_API_KEY ?? "",
 });
 
-export const aiModel = provider(process.env.AI_MODEL ?? "MiniMax-M1");
+export const aiModel = provider(process.env.AI_MODEL ?? "google/gemini-2.0-flash");

package/template/vitest.config.ts

@@ -5,8 +5,10 @@ import { resolve } from "path";
 export default defineConfig({
   plugins: [react()],
   test: {
+    globals: true,
     environment: "jsdom",
     setupFiles: ["./src/test-setup.ts"],
+    exclude: ["node_modules/**", "src/e2e/**"],
     coverage: {
       provider: "v8",
       thresholds: {
@@ -22,6 +24,9 @@ export default defineConfig({
         "**/*.config.*",
         "**/index.ts",
         "src/app/globals.css",
+        ".next/**",
+        "next-env.d.ts",
+        "**/*.d.ts",
       ],
     },
   },

package/template/src/features/tts/__tests__/route.test.ts

@@ -1,13 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-
-vi.mock("@/shared/lib/minimax-media", () => ({
-  synthesizeSpeech: vi.fn().mockResolvedValue("https://example.com/audio.mp3"),
-}));
-
-describe("tts route", () => {
-  it("module is importable", async () => {
-    const mod = await import("../api/route");
-    expect(mod.runtime).toBe("edge");
-    expect(typeof mod.POST).toBe("function");
-  });
-});

package/template/src/features/tts/__tests__/tts-player.test.tsx

@@ -1,21 +0,0 @@
-import { render, screen } from "@testing-library/react";
-import { describe, it, expect } from "vitest";
-
-import { TtsPlayer } from "../components/tts-player";
-
-describe("TtsPlayer", () => {
-  it("renders text input", () => {
-    render(<TtsPlayer />);
-    expect(screen.getByPlaceholderText(/enter text to speak/i)).toBeInTheDocument();
-  });
-
-  it("renders speak button", () => {
-    render(<TtsPlayer />);
-    expect(screen.getByRole("button", { name: /speak/i })).toBeInTheDocument();
-  });
-
-  it("button disabled when input empty", () => {
-    render(<TtsPlayer />);
-    expect(screen.getByRole("button", { name: /speak/i })).toBeDisabled();
-  });
-});

package/template/src/features/tts/api/route.ts

@@ -1,14 +0,0 @@
-import { synthesizeSpeech } from "@/shared/lib/minimax-media";
-
-export const runtime = "edge";
-
-export async function POST(req: Request) {
-  const { text, voiceId } = (await req.json()) as { text: string; voiceId?: string };
-
-  if (!text || typeof text !== "string") {
-    return Response.json({ error: "text is required" }, { status: 400 });
-  }
-
-  const audioFile = await synthesizeSpeech(text, voiceId);
-  return Response.json({ audioFile });
-}

package/template/src/features/tts/components/tts-player.tsx

@@ -1,59 +0,0 @@
-"use client";
-
-import { useState } from "react";
-
-export function TtsPlayer() {
-  const [text, setText] = useState("");
-  const [audioUrl, setAudioUrl] = useState<string | null>(null);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const handleSubmit = async (e: React.SyntheticEvent) => {
-    e.preventDefault();
-    setIsLoading(true);
-    setError(null);
-
-    const response = await fetch("/features/tts/api", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ text }),
-    });
-
-    if (!response.ok) {
-      setError("Failed to synthesize speech");
-      setIsLoading(false);
-      return;
-    }
-
-    const data = (await response.json()) as { audioFile: string };
-    setAudioUrl(data.audioFile);
-    setIsLoading(false);
-  };
-
-  return (
-    <div className="space-y-4" data-testid="tts-player">
-      <form onSubmit={(e) => { void handleSubmit(e); }} className="flex gap-2">
-        <textarea
-          value={text}
-          onChange={(e) => { setText(e.target.value); }}
-          placeholder="Enter text to speak..."
-          className="flex-1 rounded border px-3 py-2"
-          rows={3}
-        />
-        <button
-          type="submit"
-          disabled={isLoading || !text.trim()}
-          className="rounded bg-primary px-4 py-2 text-primary-foreground disabled:opacity-50"
-        >
-          {isLoading ? "Synthesizing..." : "Speak"}
-        </button>
-      </form>
-      {error && <p className="text-sm text-red-600">{error}</p>}
-      {audioUrl && (
-        <audio controls src={audioUrl} className="w-full">
-          <track kind="captions" />
-        </audio>
-      )}
-    </div>
-  );
-}

package/template/src/features/video/__tests__/route.test.ts

@@ -1,13 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-
-vi.mock("@/shared/lib/minimax-media", () => ({
-  generateVideo: vi.fn().mockResolvedValue("task-abc"),
-}));
-
-describe("video route", () => {
-  it("module is importable", async () => {
-    const mod = await import("../api/route");
-    expect(mod.runtime).toBe("edge");
-    expect(typeof mod.POST).toBe("function");
-  });
-});

package/template/src/features/video/__tests__/video-generator.test.tsx

@@ -1,21 +0,0 @@
-import { render, screen } from "@testing-library/react";
-import { describe, it, expect } from "vitest";
-
-import { VideoGenerator } from "../components/video-generator";
-
-describe("VideoGenerator", () => {
-  it("renders prompt input", () => {
-    render(<VideoGenerator />);
-    expect(screen.getByPlaceholderText(/describe a video/i)).toBeInTheDocument();
-  });
-
-  it("renders generate button", () => {
-    render(<VideoGenerator />);
-    expect(screen.getByRole("button", { name: /generate/i })).toBeInTheDocument();
-  });
-
-  it("button disabled when input empty", () => {
-    render(<VideoGenerator />);
-    expect(screen.getByRole("button", { name: /generate/i })).toBeDisabled();
-  });
-});

package/template/src/features/video/api/route.ts

@@ -1,14 +0,0 @@
-import { generateVideo } from "@/shared/lib/minimax-media";
-
-export const runtime = "edge";
-
-export async function POST(req: Request) {
-  const { prompt } = (await req.json()) as { prompt: string };
-
-  if (!prompt || typeof prompt !== "string") {
-    return Response.json({ error: "prompt is required" }, { status: 400 });
-  }
-
-  const taskId = await generateVideo(prompt);
-  return Response.json({ taskId });
-}

package/template/src/features/video/components/video-generator.tsx

@@ -1,56 +0,0 @@
-"use client";
-
-import { useState } from "react";
-
-export function VideoGenerator() {
-  const [prompt, setPrompt] = useState("");
-  const [taskId, setTaskId] = useState<string | null>(null);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const handleSubmit = async (e: React.SyntheticEvent) => {
-    e.preventDefault();
-    setIsLoading(true);
-    setError(null);
-
-    const response = await fetch("/features/video/api", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ prompt }),
-    });
-
-    if (!response.ok) {
-      setError("Failed to generate video");
-      setIsLoading(false);
-      return;
-    }
-
-    const data = (await response.json()) as { taskId: string };
-    setTaskId(data.taskId);
-    setIsLoading(false);
-  };
-
-  return (
-    <div className="space-y-4" data-testid="video-generator">
-      <form onSubmit={(e) => { void handleSubmit(e); }} className="flex gap-2">
-        <input
-          value={prompt}
-          onChange={(e) => { setPrompt(e.target.value); }}
-          placeholder="Describe a video..."
-          className="flex-1 rounded border px-3 py-2"
-        />
-        <button
-          type="submit"
-          disabled={isLoading || !prompt.trim()}
-          className="rounded bg-primary px-4 py-2 text-primary-foreground disabled:opacity-50"
-        >
-          {isLoading ? "Generating..." : "Generate"}
-        </button>
-      </form>
-      {error && <p className="text-sm text-red-600">{error}</p>}
-      {taskId && (
-        <p className="text-sm text-muted-foreground">Task ID: {taskId}</p>
-      )}
-    </div>
-  );
-}

package/template/src/shared/__tests__/minimax-media.test.ts

@@ -1,58 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from "vitest";
-
-import { generateVideo, synthesizeSpeech } from "../lib/minimax-media";
-
-const mockFetch = vi.fn();
-global.fetch = mockFetch;
-
-describe("generateVideo", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it("returns task_id when API responds successfully", async () => {
-    // Arrange
-    mockFetch.mockResolvedValue({
-      ok: true,
-      json: () => Promise.resolve({ task_id: "abc123" }),
-    });
-
-    // Act
-    const taskId = await generateVideo("A cat on the moon");
-
-    // Assert
-    expect(taskId).toBe("abc123");
-  });
-
-  it("throws when API returns non-ok response", async () => {
-    // Arrange
-    mockFetch.mockResolvedValue({ ok: false, statusText: "Bad Request" });
-
-    // Act + Assert
-    await expect(generateVideo("test")).rejects.toThrow("Video generation failed");
-  });
-});
-
-describe("synthesizeSpeech", () => {
-  it("returns audio_file URL when API responds successfully", async () => {
-    // Arrange
-    mockFetch.mockResolvedValue({
-      ok: true,
-      json: () => Promise.resolve({ audio_file: "https://example.com/audio.mp3" }),
-    });
-
-    // Act
-    const url = await synthesizeSpeech("Hello world");
-
-    // Assert
-    expect(url).toBe("https://example.com/audio.mp3");
-  });
-
-  it("throws when API returns non-ok response", async () => {
-    // Arrange
-    mockFetch.mockResolvedValue({ ok: false, statusText: "Server Error" });
-
-    // Act + Assert
-    await expect(synthesizeSpeech("test")).rejects.toThrow("TTS failed");
-  });
-});

package/template/src/shared/lib/minimax-media.ts

@@ -1,63 +0,0 @@
-const MINIMAX_API_BASE = "https://api.minimaxi.chat/v1";
-
-interface VideoGenerationRequest {
-  model: string;
-  prompt: string;
-}
-
-interface VideoGenerationResponse {
-  task_id: string;
-}
-
-interface TtsRequest {
-  model: string;
-  text: string;
-  voice_id: string;
-}
-
-interface TtsResponse {
-  audio_file: string;
-}
-
-export async function generateVideo(prompt: string): Promise<string> {
-  const response = await fetch(`${MINIMAX_API_BASE}/video_generation`, {
-    method: "POST",
-    headers: {
-      Authorization: `Bearer ${process.env.MINIMAX_API_KEY ?? ""}`,
-      "Content-Type": "application/json",
-    },
-    body: JSON.stringify({
-      model: "video-01",
-      prompt,
-    } satisfies VideoGenerationRequest),
-  });
-
-  if (!response.ok) {
-    throw new Error(`Video generation failed: ${response.statusText}`);
-  }
-
-  const data = (await response.json()) as VideoGenerationResponse;
-  return data.task_id;
-}
-
-export async function synthesizeSpeech(text: string, voiceId = "female-shaonv"): Promise<string> {
-  const response = await fetch(`${MINIMAX_API_BASE}/t2a_v2`, {
-    method: "POST",
-    headers: {
-      Authorization: `Bearer ${process.env.MINIMAX_API_KEY ?? ""}`,
-      "Content-Type": "application/json",
-    },
-    body: JSON.stringify({
-      model: "speech-02-hd",
-      text,
-      voice_id: voiceId,
-    } satisfies TtsRequest),
-  });
-
-  if (!response.ok) {
-    throw new Error(`TTS failed: ${response.statusText}`);
-  }
-
-  const data = (await response.json()) as TtsResponse;
-  return data.audio_file;
-}