From a86536562a22373c2ae64b5026156a1482cee584 Mon Sep 17 00:00:00 2001 From: Jarrod Servilla Date: Wed, 1 Jul 2026 11:26:16 -0400 Subject: [PATCH 1/5] feat(deck): add deck collaboration (issue #27) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Owners can now let people they follow propose card add/remove/quantity changes to a deck, which the owner approves or rejects as a whole proposal — PR-style, no per-line review. Disabled by default per deck. Key changes: - Deck.collaborationEnabled toggle + DeckProposal model (PENDING/ APPROVED/REJECTED), reusing the existing RevisionDelta shape for proposal payloads - canCollaborateOnDeck/requireDeckCollaborator: eligibility is "owner follows the candidate", 404s on both missing-deck and ineligible so callers can't probe deck state - Server actions to toggle collaboration, submit/list/approve/reject proposals; approval replays changes through the existing applyChanges pipeline and attributes the resulting DeckRevision to the proposer, not the approving owner - Approving a stale proposal (deck drifted since submission) throws cleanly instead of partially applying - New /deck/[id]/collaborate (owner review list, collaborator entry point) and /deck/[id]/propose (mainboard draft builder) pages, plus a Collaborate entry in the deck action row with a pending-count badge for owners - Extracted groupDeltasByZone shared by the history list and the new proposal review list --- app/(ui)/deck/[id]/collaborate/page.tsx | 105 ++++++ app/(ui)/deck/[id]/page.tsx | 13 + app/(ui)/deck/[id]/propose/page.tsx | 73 +++++ .../deck/__tests__/collaboration.test.ts | 309 ++++++++++++++++++ app/_actions/deck/collaboration.ts | 234 +++++++++++++ app/_components/deck/deck-action-row.tsx | 44 +++ .../deck/deck-collaboration-toggle.tsx | 56 ++++ app/_components/deck/deck-header.tsx | 16 +- app/_components/deck/deck-history-list.tsx | 38 +-- .../deck/deck-proposal-review-list.tsx | 210 ++++++++++++ app/_components/deck/deck-propose-draft.tsx | 263 +++++++++++++++ lib/auth/__tests__/deck-access.test.ts | 160 ++++++++- lib/auth/deck-access.ts | 43 +++ lib/deck/cache-tags.ts | 5 + lib/deck/group-deltas.ts | 37 +++ lib/deck/io/__tests__/serialize.test.ts | 1 + lib/deck/mutation/index.ts | 1 + lib/deck/queries.ts | 1 + lib/deck/revision.ts | 2 +- .../migration.sql | 33 ++ prisma/schema.prisma | 113 ++++--- 21 files changed, 1678 insertions(+), 79 deletions(-) create mode 100644 app/(ui)/deck/[id]/collaborate/page.tsx create mode 100644 app/(ui)/deck/[id]/propose/page.tsx create mode 100644 app/_actions/deck/__tests__/collaboration.test.ts create mode 100644 app/_actions/deck/collaboration.ts create mode 100644 app/_components/deck/deck-collaboration-toggle.tsx create mode 100644 app/_components/deck/deck-proposal-review-list.tsx create mode 100644 app/_components/deck/deck-propose-draft.tsx create mode 100644 lib/deck/group-deltas.ts create mode 100644 prisma/migrations/20260701150501_deck_collaboration/migration.sql diff --git a/app/(ui)/deck/[id]/collaborate/page.tsx b/app/(ui)/deck/[id]/collaborate/page.tsx new file mode 100644 index 0000000..5e4e4b6 --- /dev/null +++ b/app/(ui)/deck/[id]/collaborate/page.tsx @@ -0,0 +1,105 @@ +import { Suspense } from "react"; +import { notFound } from "next/navigation"; +import { ChevronLeft, PencilLine } from "lucide-react"; +import Link from "@/app/_components/link"; +import { Button } from "@/components/ui/button"; +import { prisma } from "@/lib/db"; +import { getSession } from "@/lib/auth/session"; +import { canCollaborateOnDeck } from "@/lib/auth/deck-access"; +import { listDeckProposals } from "@/app/_actions/deck/collaboration"; +import { DeckProposalReviewList } from "@/app/_components/deck/deck-proposal-review-list"; + +interface DeckCollaboratePageProps { + params: Promise<{ id: string }>; +} + +async function DeckCollaborateContent({ id }: { id: string }) { + const [deck, session] = await Promise.all([ + prisma.deck.findUnique({ + where: { id }, + select: { + id: true, + name: true, + userId: true, + collaborationEnabled: true, + }, + }), + getSession(), + ]); + if (!deck) notFound(); + + const isOwner = session?.userId === deck.userId; + const isCollaborator = + !isOwner && (await canCollaborateOnDeck(deck, session?.userId)); + if (!isOwner && !isCollaborator) notFound(); + + return ( +
+
+ + + Back to deck + +

+ {deck.name} · Collaborate +

+

+ {isOwner + ? "Review proposed changes from people you follow. Approving applies the whole proposal at once." + : "Propose card changes for the owner to review. They can approve or reject the whole proposal."} +

+
+ + {isOwner ? ( + + ) : ( +
+

+ Build a set of add/remove/quantity changes, then submit it for the + owner to approve or reject. +

+ +
+ )} +
+ ); +} + +async function DeckOwnerReview({ deckId }: { deckId: string }) { + const proposals = await listDeckProposals(deckId); + return ; +} + +export default function DeckCollaboratePage({ + params, +}: DeckCollaboratePageProps) { + return ( +
+ +
+
+
+ } + > + + +
+ ); +} + +async function CollaborateLoader({ + params, +}: { + params: Promise<{ id: string }>; +}) { + const { id } = await params; + return ; +} diff --git a/app/(ui)/deck/[id]/page.tsx b/app/(ui)/deck/[id]/page.tsx index 1083947..694be1b 100644 --- a/app/(ui)/deck/[id]/page.tsx +++ b/app/(ui)/deck/[id]/page.tsx @@ -9,6 +9,9 @@ import { getTokensForDeck } from "@/lib/deck/token-queries"; import { isDeckSavedByUser } from "@/lib/deck/saved-queries"; import { getViewerHoldingsForDeck } from "@/lib/inventory/queries"; import { getSession } from "@/lib/auth/session"; +import { canCollaborateOnDeck } from "@/lib/auth/deck-access"; +import { prisma } from "@/lib/db"; +import { ProposalStatus } from "@/lib/generated/prisma/enums"; import { NOT_FOUND_METADATA, buildDeckJsonLd, @@ -151,6 +154,14 @@ async function DeckContent({ ? await getViewerHoldingsForDeck(deck.id, session.userId) : []; + const pendingProposalCount = isOwner + ? await prisma.deckProposal.count({ + where: { deckId: deck.id, status: ProposalStatus.PENDING }, + }) + : 0; + const canCollaborate = + !isOwner && (await canCollaborateOnDeck(deck, session?.userId)); + return (
@@ -174,6 +185,8 @@ async function DeckContent({ isPrivate={deck.visibility === "PRIVATE"} viewerLoggedIn={session !== null} initialSaved={initialSaved} + showCollaborate={isOwner || canCollaborate} + pendingProposalCount={pendingProposalCount} {...(canLike && { like: { likeCount: deck.likeCount, liked: viewerLiked }, })} diff --git a/app/(ui)/deck/[id]/propose/page.tsx b/app/(ui)/deck/[id]/propose/page.tsx new file mode 100644 index 0000000..f719cd4 --- /dev/null +++ b/app/(ui)/deck/[id]/propose/page.tsx @@ -0,0 +1,73 @@ +import { Suspense } from "react"; +import { ChevronLeft } from "lucide-react"; +import Link from "@/app/_components/link"; +import { requireDeckCollaborator } from "@/lib/auth/deck-access"; +import { getDeckById } from "@/lib/deck/queries"; +import { DeckProposeDraft } from "@/app/_components/deck/deck-propose-draft"; + +interface DeckProposePageProps { + params: Promise<{ id: string }>; +} + +async function DeckProposeContent({ id }: { id: string }) { + await requireDeckCollaborator(id); + const deck = await getDeckById(id); + + const mainboard = (deck?.cards ?? []) + .filter((c) => c.zone === "MAINBOARD") + .map((c) => ({ + cardId: c.cardId, + cardName: c.card.name, + category: c.category, + quantity: c.quantity, + })); + + return ( +
+
+ + + Back to collaborate + +

+ Propose changes to {deck?.name} +

+

+ Adjust mainboard quantities or add new cards, then submit for the + owner to review. +

+
+ + +
+ ); +} + +export default function DeckProposePage({ params }: DeckProposePageProps) { + return ( +
+ +
+
+
+ } + > + + +
+ ); +} + +async function ProposeLoader({ + params, +}: { + params: Promise<{ id: string }>; +}) { + const { id } = await params; + return ; +} diff --git a/app/_actions/deck/__tests__/collaboration.test.ts b/app/_actions/deck/__tests__/collaboration.test.ts new file mode 100644 index 0000000..cce664a --- /dev/null +++ b/app/_actions/deck/__tests__/collaboration.test.ts @@ -0,0 +1,309 @@ +import { beforeEach, describe, expect, it, vi } from "vitest"; +import { Zone } from "@/lib/generated/prisma/enums"; + +vi.mock("next/cache", () => ({ updateTag: vi.fn() })); +vi.mock("next/navigation", () => ({ + notFound: vi.fn(() => { + throw new Error("NEXT_NOT_FOUND"); + }), +})); +vi.mock("@/lib/auth/session", () => ({ + requireSession: vi.fn(), + getSession: vi.fn(), +})); +vi.mock("@/lib/deck/mutation", async () => { + const actual = await vi.importActual( + "@/lib/deck/mutation", + ); + return { + ...actual, + applyChanges: vi.fn(async () => undefined), + }; +}); +vi.mock("@/lib/db", () => ({ + prisma: { + deck: { + findUnique: vi.fn(), + update: vi.fn(), + }, + follow: { + findUnique: vi.fn(), + }, + deckCard: { + findMany: vi.fn(), + }, + card: { + findMany: vi.fn(), + }, + deckProposal: { + create: vi.fn(), + findUnique: vi.fn(), + update: vi.fn(), + }, + }, +})); + +import { prisma } from "@/lib/db"; +import { requireSession } from "@/lib/auth/session"; +import { applyChanges } from "@/lib/deck/mutation"; +import { + approveDeckProposal, + rejectDeckProposal, + submitDeckProposal, + toggleDeckCollaboration, +} from "../collaboration"; + +const mockDeckFindUnique = vi.mocked(prisma.deck.findUnique); +const mockDeckUpdate = vi.mocked(prisma.deck.update); +const mockFollowFindUnique = vi.mocked(prisma.follow.findUnique); +const mockDeckCardFindMany = vi.mocked(prisma.deckCard.findMany); +const mockCardFindMany = vi.mocked(prisma.card.findMany); +const mockProposalCreate = vi.mocked(prisma.deckProposal.create); +const mockProposalFindUnique = vi.mocked(prisma.deckProposal.findUnique); +const mockProposalUpdate = vi.mocked(prisma.deckProposal.update); +const mockRequireSession = vi.mocked(requireSession); +const mockApplyChanges = vi.mocked(applyChanges); + +const OWNER_ID = "owner-1"; +const PROPOSER_ID = "proposer-1"; +const DECK_ID = "deck-1"; + +// Superset fixture satisfying both requireDeckOwner/requireDeckCollaborator's +// select and loadSnapshotForDeck's select — mocks ignore `select`, so one +// object can stand in for every prisma.deck.findUnique call in a test. +function deckRow(overrides?: Partial>) { + return { + id: DECK_ID, + userId: OWNER_ID, + collaborationEnabled: true, + format: "COMMANDER", + cards: [], + categories: [], + ...overrides, + }; +} + +beforeEach(() => { + vi.clearAllMocks(); + mockCardFindMany.mockResolvedValue([ + { + id: 1, + name: "Sol Ring", + typeLine: "Artifact", + colorIdentity: [], + legalities: {}, + }, + ] as never); +}); + +describe("toggleDeckCollaboration", () => { + it("updates collaborationEnabled when the caller owns the deck", async () => { + mockRequireSession.mockResolvedValue({ userId: OWNER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + + await toggleDeckCollaboration(DECK_ID, true); + + expect(mockDeckUpdate).toHaveBeenCalledWith({ + where: { id: DECK_ID }, + data: { collaborationEnabled: true }, + }); + }); + + it("404s for a non-owner", async () => { + mockRequireSession.mockResolvedValue({ userId: PROPOSER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + + await expect(toggleDeckCollaboration(DECK_ID, true)).rejects.toThrow( + "NEXT_NOT_FOUND", + ); + expect(mockDeckUpdate).not.toHaveBeenCalled(); + }); +}); + +describe("submitDeckProposal", () => { + const addSolRing = [ + { + cardId: 1, + cardName: "Sol Ring", + zone: Zone.MAINBOARD, + category: null, + delta: 1, + }, + ]; + + it("creates a pending proposal for an eligible collaborator", async () => { + mockRequireSession.mockResolvedValue({ userId: PROPOSER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + mockFollowFindUnique.mockResolvedValue({ followerId: OWNER_ID } as never); + mockDeckCardFindMany.mockResolvedValue([] as never); + mockProposalCreate.mockResolvedValue({ id: "prop-1" } as never); + + const id = await submitDeckProposal(DECK_ID, addSolRing, "please add this"); + + expect(id).toBe("prop-1"); + expect(mockProposalCreate).toHaveBeenCalledWith({ + data: { + deckId: DECK_ID, + proposerId: PROPOSER_ID, + status: "PENDING", + changes: addSolRing, + message: "please add this", + }, + select: { id: true }, + }); + }); + + it("404s a submission from a viewer collaboration is disabled for", async () => { + mockRequireSession.mockResolvedValue({ userId: PROPOSER_ID } as never); + mockDeckFindUnique.mockResolvedValue( + deckRow({ collaborationEnabled: false }) as never, + ); + + await expect(submitDeckProposal(DECK_ID, addSolRing)).rejects.toThrow( + "NEXT_NOT_FOUND", + ); + expect(mockProposalCreate).not.toHaveBeenCalled(); + }); + + it("rejects an empty changes array before touching the deck", async () => { + mockRequireSession.mockResolvedValue({ userId: PROPOSER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + mockFollowFindUnique.mockResolvedValue({ followerId: OWNER_ID } as never); + + await expect(submitDeckProposal(DECK_ID, [])).rejects.toThrow(); + expect(mockProposalCreate).not.toHaveBeenCalled(); + }); +}); + +describe("submit → approve happy path", () => { + const addSolRing = [ + { + cardId: 1, + cardName: "Sol Ring", + zone: Zone.MAINBOARD, + category: null, + delta: 1, + }, + ]; + + it("approves a pending proposal, applies it, and attributes the resulting revision to the proposer", async () => { + mockRequireSession.mockResolvedValue({ userId: OWNER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + mockProposalFindUnique.mockResolvedValue({ + id: "prop-1", + deckId: DECK_ID, + proposerId: PROPOSER_ID, + status: "PENDING", + changes: addSolRing, + } as never); + mockDeckCardFindMany.mockResolvedValue([] as never); + + await approveDeckProposal(DECK_ID, "prop-1"); + + expect(mockApplyChanges).toHaveBeenCalledTimes(1); + const [appliedDeckId, actorId] = mockApplyChanges.mock.calls[0]!; + expect(appliedDeckId).toBe(DECK_ID); + // Attributed to the proposer, not the approving owner. + expect(actorId).toBe(PROPOSER_ID); + expect(mockProposalUpdate).toHaveBeenCalledWith({ + where: { id: "prop-1" }, + data: expect.objectContaining({ + status: "APPROVED", + resolvedById: OWNER_ID, + }), + }); + }); + + it("404s when a non-owner tries to approve", async () => { + mockRequireSession.mockResolvedValue({ userId: PROPOSER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + + await expect(approveDeckProposal(DECK_ID, "prop-1")).rejects.toThrow( + "NEXT_NOT_FOUND", + ); + expect(mockApplyChanges).not.toHaveBeenCalled(); + }); +}); + +describe("submit → reject", () => { + it("marks a pending proposal rejected and never touches the deck", async () => { + mockRequireSession.mockResolvedValue({ userId: OWNER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + mockProposalFindUnique.mockResolvedValue({ + id: "prop-1", + deckId: DECK_ID, + proposerId: PROPOSER_ID, + status: "PENDING", + changes: [], + } as never); + + await rejectDeckProposal(DECK_ID, "prop-1"); + + expect(mockApplyChanges).not.toHaveBeenCalled(); + expect(mockDeckCardFindMany).not.toHaveBeenCalled(); + expect(mockProposalUpdate).toHaveBeenCalledWith({ + where: { id: "prop-1" }, + data: expect.objectContaining({ + status: "REJECTED", + resolvedById: OWNER_ID, + }), + }); + }); + + it("404s when a non-owner tries to reject", async () => { + mockRequireSession.mockResolvedValue({ userId: PROPOSER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + + await expect(rejectDeckProposal(DECK_ID, "prop-1")).rejects.toThrow( + "NEXT_NOT_FOUND", + ); + expect(mockProposalUpdate).not.toHaveBeenCalled(); + }); +}); + +describe("approveDeckProposal on a stale or already-resolved proposal", () => { + it("throws without applying changes or resolving the proposal, when the targeted card is no longer on the deck", async () => { + mockRequireSession.mockResolvedValue({ userId: OWNER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + mockProposalFindUnique.mockResolvedValue({ + id: "prop-1", + deckId: DECK_ID, + proposerId: PROPOSER_ID, + status: "PENDING", + changes: [ + { + cardId: 1, + cardName: "Sol Ring", + zone: Zone.MAINBOARD, + category: null, + delta: -1, + }, + ], + } as never); + // Deck no longer has this card — the proposal has gone stale. + mockDeckCardFindMany.mockResolvedValue([] as never); + + await expect(approveDeckProposal(DECK_ID, "prop-1")).rejects.toThrow( + /no longer on the deck/, + ); + expect(mockApplyChanges).not.toHaveBeenCalled(); + expect(mockProposalUpdate).not.toHaveBeenCalled(); + }); + + it("throws when the proposal has already been resolved", async () => { + mockRequireSession.mockResolvedValue({ userId: OWNER_ID } as never); + mockDeckFindUnique.mockResolvedValue(deckRow() as never); + mockProposalFindUnique.mockResolvedValue({ + id: "prop-1", + deckId: DECK_ID, + proposerId: PROPOSER_ID, + status: "APPROVED", + changes: [], + } as never); + + await expect(approveDeckProposal(DECK_ID, "prop-1")).rejects.toThrow( + /already been resolved/, + ); + expect(mockApplyChanges).not.toHaveBeenCalled(); + }); +}); diff --git a/app/_actions/deck/collaboration.ts b/app/_actions/deck/collaboration.ts new file mode 100644 index 0000000..a24adfa --- /dev/null +++ b/app/_actions/deck/collaboration.ts @@ -0,0 +1,234 @@ +"use server"; + +import "server-only"; +import { z } from "zod"; +import { prisma } from "@/lib/db"; +import { requireDeckOwner, requireDeckCollaborator } from "@/lib/auth/deck-access"; +import { withActionLogging } from "@/lib/telemetry"; +import { + applyChanges, + loadSnapshotForDeck, + planMutation, + type ExistingDeckCard, + type PlannedChange, +} from "@/lib/deck/mutation"; +import { StructuralViolation } from "@/lib/deck/mutation/errors"; +import { + deltaKey, + deltasToBulkChanges, + revisionDeltaSchema, + type RevisionDelta, +} from "@/lib/deck/revision"; +import { ProposalStatus } from "@/lib/generated/prisma/enums"; +import { + deckProposalsTag, + deckTag, + invalidateTags, +} from "@/lib/deck/cache-tags"; + +const proposalChangesSchema = z.array(revisionDeltaSchema).min(1); + +export const toggleDeckCollaboration = withActionLogging( + "deck.toggleCollaboration", + async (deckId: string, enabled: boolean): Promise => { + await requireDeckOwner(deckId); + + await prisma.deck.update({ + where: { id: deckId }, + data: { collaborationEnabled: enabled }, + }); + + invalidateTags([deckTag(deckId)]); + }, +); + +/** + * Builds the write plan for a set of revision deltas against the deck's + * current state. Shared by submit (dry run, nothing committed) and approve + * (the real application), so both see the exact same "is this still valid" + * answer relative to whatever the deck looks like right now. + */ +async function planProposalChanges( + deckId: string, + deltas: readonly RevisionDelta[], +): Promise { + const rows = await prisma.deckCard.findMany({ + where: { deckId }, + select: { + id: true, + cardId: true, + zone: true, + category: true, + quantity: true, + }, + }); + + const existing: ExistingDeckCard[] = rows.map((r) => ({ + deckCardId: r.id, + cardId: r.cardId, + zone: r.zone, + category: r.category, + quantity: r.quantity, + })); + + const existingByKey = new Map(existing.map((e) => [deltaKey(e), e])); + for (const d of deltas) { + if (d.delta < 0 && !existingByKey.has(deltaKey(d))) { + throw new Error( + `Proposal is stale — "${d.cardName}" is no longer on the deck.`, + ); + } + } + + return deltasToBulkChanges(deltas, existing); +} + +export const submitDeckProposal = withActionLogging( + "deck.submitProposal", + async ( + deckId: string, + changes: RevisionDelta[], + message?: string, + ): Promise => { + const { userId } = await requireDeckCollaborator(deckId); + const deltas = proposalChangesSchema.parse(changes); + + const plannedChanges = await planProposalChanges(deckId, deltas); + const before = await loadSnapshotForDeck(deckId, plannedChanges); + const { structural, missingDeckCardId } = planMutation( + before, + plannedChanges, + ); + if (structural.length > 0) { + throw new StructuralViolation(structural); + } + if (missingDeckCardId !== null) { + throw new Error("Proposal references a card that is no longer on the deck."); + } + + const proposal = await prisma.deckProposal.create({ + data: { + deckId, + proposerId: userId, + status: ProposalStatus.PENDING, + changes: deltas, + message: message?.trim() || null, + }, + select: { id: true }, + }); + + invalidateTags([deckProposalsTag(deckId)]); + return proposal.id; + }, +); + +export type DeckProposalView = { + id: string; + status: ProposalStatus; + changes: RevisionDelta[]; + message: string | null; + createdAt: Date; + resolvedAt: Date | null; + proposer: { id: string; username: string; image: string | null }; +}; + +export const listDeckProposals = withActionLogging( + "deck.listProposals", + async (deckId: string): Promise => { + await requireDeckOwner(deckId); + + const rows = await prisma.deckProposal.findMany({ + where: { deckId }, + orderBy: [{ status: "asc" }, { createdAt: "desc" }], + select: { + id: true, + status: true, + changes: true, + message: true, + createdAt: true, + resolvedAt: true, + proposer: { select: { id: true, username: true, image: true } }, + }, + }); + + // PENDING sorts first: enum declaration order (PENDING, APPROVED, + // REJECTED) already matches `status: "asc"` on the Postgres enum type. + return rows.map((r) => ({ + id: r.id, + status: r.status, + changes: revisionDeltaSchema.array().parse(r.changes), + message: r.message, + createdAt: r.createdAt, + resolvedAt: r.resolvedAt, + proposer: r.proposer, + })); + }, +); + +async function loadPendingProposal(deckId: string, proposalId: string) { + const proposal = await prisma.deckProposal.findUnique({ + where: { id: proposalId }, + select: { + id: true, + deckId: true, + proposerId: true, + status: true, + changes: true, + }, + }); + if (!proposal || proposal.deckId !== deckId) { + throw new Error("Proposal not found"); + } + if (proposal.status !== ProposalStatus.PENDING) { + throw new Error("Proposal has already been resolved"); + } + return proposal; +} + +export const approveDeckProposal = withActionLogging( + "deck.approveProposal", + async (deckId: string, proposalId: string): Promise => { + const { userId: ownerId } = await requireDeckOwner(deckId); + const proposal = await loadPendingProposal(deckId, proposalId); + const deltas = revisionDeltaSchema.array().parse(proposal.changes); + + // Re-validated against current deck state (may have drifted since + // submission); a stale proposal throws here instead of partially + // applying, so the owner can reject it. + const plannedChanges = await planProposalChanges(deckId, deltas); + + // Attributed to the proposer, not the owner, so the resulting + // DeckRevision credits the contributor who made the change. + await applyChanges(deckId, proposal.proposerId, plannedChanges); + + await prisma.deckProposal.update({ + where: { id: proposalId }, + data: { + status: ProposalStatus.APPROVED, + resolvedById: ownerId, + resolvedAt: new Date(), + }, + }); + + invalidateTags([deckProposalsTag(deckId)]); + }, +); + +export const rejectDeckProposal = withActionLogging( + "deck.rejectProposal", + async (deckId: string, proposalId: string): Promise => { + const { userId: ownerId } = await requireDeckOwner(deckId); + await loadPendingProposal(deckId, proposalId); + + await prisma.deckProposal.update({ + where: { id: proposalId }, + data: { + status: ProposalStatus.REJECTED, + resolvedById: ownerId, + resolvedAt: new Date(), + }, + }); + + invalidateTags([deckProposalsTag(deckId)]); + }, +); diff --git a/app/_components/deck/deck-action-row.tsx b/app/_components/deck/deck-action-row.tsx index 7dbc373..ec1555a 100644 --- a/app/_components/deck/deck-action-row.tsx +++ b/app/_components/deck/deck-action-row.tsx @@ -11,6 +11,7 @@ import { Swords, Trash2, Upload, + Users, } from "lucide-react"; import { Button } from "@/components/ui/button"; import { @@ -47,6 +48,13 @@ interface DeckActionRowProps { likeCount: number; liked: boolean; }; + /** + * True when this viewer should see the "Collaborate" entry — the owner + * (reviews proposals) or an eligible collaborator (proposes changes). + */ + showCollaborate?: boolean; + /** Owner-only: count of PENDING proposals awaiting review. */ + pendingProposalCount?: number; } export function DeckActionRow({ @@ -57,6 +65,8 @@ export function DeckActionRow({ viewerLoggedIn, initialSaved, like, + showCollaborate, + pendingProposalCount, }: DeckActionRowProps) { const router = useRouter(); const [menuOpen, setMenuOpen] = useState(false); @@ -138,6 +148,7 @@ export function DeckActionRow({ Compare + {showCollaborate && } {like && ( + {showCollaborate && ( + + )} + ); } + +function CollaborateButton({ + deckId, + pendingProposalCount, +}: { + deckId: string; + pendingProposalCount?: number | undefined; +}) { + const router = useRouter(); + return ( + + ); +} diff --git a/app/_components/deck/deck-collaboration-toggle.tsx b/app/_components/deck/deck-collaboration-toggle.tsx new file mode 100644 index 0000000..0b62fec --- /dev/null +++ b/app/_components/deck/deck-collaboration-toggle.tsx @@ -0,0 +1,56 @@ +"use client"; + +import { useOptimistic, useTransition } from "react"; +import { Users } from "lucide-react"; +import { toggleDeckCollaboration } from "@/app/_actions/deck/collaboration"; +import { cn } from "@/lib/utils"; + +interface DeckCollaborationToggleProps { + deckId: string; + enabled: boolean; +} + +export function DeckCollaborationToggle({ + deckId, + enabled, +}: DeckCollaborationToggleProps) { + const [optimistic, setOptimistic] = useOptimistic( + enabled, + (_, next) => next, + ); + const [, startTransition] = useTransition(); + + function handleClick() { + const next = !optimistic; + startTransition(async () => { + setOptimistic(next); + try { + await toggleDeckCollaboration(deckId, next); + } catch { + // Server state is authoritative — on failure the optimistic value + // unwinds and the stored value shows through on refresh. + } + }); + } + + return ( + + ); +} diff --git a/app/_components/deck/deck-header.tsx b/app/_components/deck/deck-header.tsx index dc954a8..60fbfbc 100644 --- a/app/_components/deck/deck-header.tsx +++ b/app/_components/deck/deck-header.tsx @@ -1,6 +1,7 @@ import type { ReactNode } from "react"; import { Globe, Link2, Lock } from "lucide-react"; import { DeckVisibilityPicker } from "@/app/_components/deck/deck-visibility-picker"; +import { DeckCollaborationToggle } from "@/app/_components/deck/deck-collaboration-toggle"; import { computeDeckPrice } from "@/lib/deck/price"; import { computeAverageMV, @@ -153,10 +154,17 @@ export function DeckHeader({ · {isOwner ? ( - + <> + + · + + ) : ( diff --git a/app/_components/deck/deck-history-list.tsx b/app/_components/deck/deck-history-list.tsx index 46f945d..ab297ad 100644 --- a/app/_components/deck/deck-history-list.tsx +++ b/app/_components/deck/deck-history-list.tsx @@ -7,7 +7,8 @@ import { Checkbox } from "@/components/ui/checkbox"; import { ConfirmDialog } from "@/components/ui/confirm-dialog"; import { revertDeckRevision } from "@/app/_actions/deck/revisions"; import type { RevisionView } from "@/app/_actions/deck/revisions"; -import { deltaKey, type RevisionDelta } from "@/lib/deck/revision"; +import { deltaKey } from "@/lib/deck/revision"; +import { groupDeltasByZone } from "@/lib/deck/group-deltas"; import type { Zone } from "@/lib/generated/prisma/enums"; interface DeckHistoryListProps { @@ -64,7 +65,10 @@ function RevisionCard({ () => new Date(revision.updatedAt), [revision.updatedAt], ); - const grouped = useMemo(() => groupByZone(revision.changes), [revision.changes]); + const grouped = useMemo( + () => groupDeltasByZone(revision.changes), + [revision.changes], + ); const [selected, setSelected] = useState>(new Set()); const toggle = (key: string, checked: boolean) => { @@ -202,36 +206,6 @@ function RevertButton({ ); } -function groupByZone( - deltas: RevisionDelta[], -): Array<{ zone: Zone; deltas: RevisionDelta[] }> { - const byZone = new Map(); - for (const d of deltas) { - const list = byZone.get(d.zone) ?? []; - list.push(d); - byZone.set(d.zone, list); - } - const zones: Zone[] = [ - "COMMANDER", - "COMPANION", - "MAINBOARD", - "SIDEBOARD", - "CONSIDERING", - ]; - return zones - .filter((z) => byZone.has(z)) - .map((zone) => ({ - zone, - deltas: (byZone.get(zone) ?? []) - .slice() - .sort((a, b) => { - const signDiff = Math.sign(b.delta) - Math.sign(a.delta); - if (signDiff !== 0) return signDiff; - return a.cardName.localeCompare(b.cardName); - }), - })); -} - function relativeTime(date: Date): string { const diffMs = Date.now() - date.getTime(); const abs = Math.abs(diffMs); diff --git a/app/_components/deck/deck-proposal-review-list.tsx b/app/_components/deck/deck-proposal-review-list.tsx new file mode 100644 index 0000000..1b9fd22 --- /dev/null +++ b/app/_components/deck/deck-proposal-review-list.tsx @@ -0,0 +1,210 @@ +"use client"; + +import { useState, useTransition } from "react"; +import { useRouter } from "next/navigation"; +import { Check, X } from "lucide-react"; +import { Button } from "@/components/ui/button"; +import { + approveDeckProposal, + rejectDeckProposal, + type DeckProposalView, +} from "@/app/_actions/deck/collaboration"; +import { groupDeltasByZone } from "@/lib/deck/group-deltas"; +import type { Zone } from "@/lib/generated/prisma/enums"; + +interface DeckProposalReviewListProps { + deckId: string; + proposals: DeckProposalView[]; +} + +const ZONE_LABEL: Record = { + MAINBOARD: "Mainboard", + SIDEBOARD: "Sideboard", + CONSIDERING: "Considering", + COMMANDER: "Commander", + COMPANION: "Companion", +}; + +const STATUS_LABEL: Record = { + PENDING: "Pending", + APPROVED: "Approved", + REJECTED: "Rejected", +}; + +export function DeckProposalReviewList({ + deckId, + proposals, +}: DeckProposalReviewListProps) { + const pending = proposals.filter((p) => p.status === "PENDING"); + const resolved = proposals.filter((p) => p.status !== "PENDING"); + + if (proposals.length === 0) { + return ( +
+ No proposals yet +
+ ); + } + + return ( +
+
+

+ Pending ({pending.length}) +

+ {pending.length === 0 ? ( +

Nothing to review.

+ ) : ( +
    + {pending.map((p) => ( + + ))} +
+ )} +
+ + {resolved.length > 0 && ( +
+

+ Resolved +

+
    + {resolved.map((p) => ( + + ))} +
+
+ )} +
+ ); +} + +function ProposalCard({ + deckId, + proposal, +}: { + deckId: string; + proposal: DeckProposalView; +}) { + const router = useRouter(); + const [pending, startTransition] = useTransition(); + const [error, setError] = useState(null); + const grouped = groupDeltasByZone(proposal.changes); + + function handleApprove() { + setError(null); + startTransition(async () => { + try { + await approveDeckProposal(deckId, proposal.id); + router.refresh(); + } catch (e) { + setError( + e instanceof Error ? e.message : "Could not approve this proposal.", + ); + } + }); + } + + function handleReject() { + setError(null); + startTransition(async () => { + try { + await rejectDeckProposal(deckId, proposal.id); + router.refresh(); + } catch (e) { + setError( + e instanceof Error ? e.message : "Could not reject this proposal.", + ); + } + }); + } + + return ( +
  • +
    +
    + + {proposal.proposer.username} + + +
    + {proposal.status === "PENDING" ? ( +
    + + +
    + ) : ( + + {STATUS_LABEL[proposal.status]} + + )} +
    + +
    + {proposal.message && ( +

    + “{proposal.message}” +

    + )} + {error && ( +

    {error}

    + )} + {grouped.map(({ zone, deltas }) => ( +
    + {grouped.length > 1 && ( +
    + {ZONE_LABEL[zone]} +
    + )} +
      + {deltas.map((d) => ( +
    • + 0 + ? "text-emerald-600 dark:text-emerald-400 font-medium" + : "text-red-600 dark:text-red-400 font-medium" + } + > + {d.delta > 0 ? `+${d.delta}` : d.delta} + + {d.cardName || `Card #${d.cardId}`} + {d.category && ( + + ({d.category}) + + )} +
      • + ))} +
    +
    + ))} +
    +
    • + ); +} diff --git a/app/_components/deck/deck-propose-draft.tsx b/app/_components/deck/deck-propose-draft.tsx new file mode 100644 index 0000000..32a6774 --- /dev/null +++ b/app/_components/deck/deck-propose-draft.tsx @@ -0,0 +1,263 @@ +"use client"; + +import { useMemo, useState, useTransition } from "react"; +import { useRouter } from "next/navigation"; +import { Minus, Plus } from "lucide-react"; +import { Button } from "@/components/ui/button"; +import { Input } from "@/components/ui/input"; +import { Textarea } from "@/components/ui/textarea"; +import { submitDeckProposal } from "@/app/_actions/deck/collaboration"; +import { useCardBrowser } from "@/app/_components/builder/card-browser/use-card-browser"; +import type { RevisionDelta } from "@/lib/deck/revision"; + +interface ExistingMainboardCard { + cardId: number; + cardName: string; + category: string | null; + quantity: number; +} + +interface DeckProposeDraftProps { + deckId: string; + existingCards: ExistingMainboardCard[]; +} + +export function DeckProposeDraft({ + deckId, + existingCards, +}: DeckProposeDraftProps) { + const router = useRouter(); + const [query, setQuery] = useState(""); + const { results, loading } = useCardBrowser(query); + + const [quantities, setQuantities] = useState>( + () => new Map(existingCards.map((c) => [c.cardId, c.quantity])), + ); + const [added, setAdded] = useState< + Map + >(new Map()); + const [message, setMessage] = useState(""); + const [pending, startTransition] = useTransition(); + const [error, setError] = useState(null); + + const existingByCardId = useMemo( + () => new Map(existingCards.map((c) => [c.cardId, c])), + [existingCards], + ); + + function setQuantity(cardId: number, next: number) { + setQuantities((prev) => { + const map = new Map(prev); + map.set(cardId, Math.max(0, next)); + return map; + }); + } + + function addCard(cardId: number, cardName: string) { + if (existingByCardId.has(cardId)) return; + setAdded((prev) => { + const map = new Map(prev); + const current = map.get(cardId); + map.set(cardId, { cardName, quantity: (current?.quantity ?? 0) + 1 }); + return map; + }); + } + + function setAddedQuantity(cardId: number, next: number) { + setAdded((prev) => { + const map = new Map(prev); + const current = map.get(cardId); + if (!current) return prev; + if (next <= 0) { + map.delete(cardId); + } else { + map.set(cardId, { ...current, quantity: next }); + } + return map; + }); + } + + const deltas: RevisionDelta[] = useMemo(() => { + const out: RevisionDelta[] = []; + for (const c of existingCards) { + const next = quantities.get(c.cardId) ?? c.quantity; + const delta = next - c.quantity; + if (delta !== 0) { + out.push({ + cardId: c.cardId, + cardName: c.cardName, + zone: "MAINBOARD", + category: c.category, + delta, + }); + } + } + for (const [cardId, entry] of added) { + out.push({ + cardId, + cardName: entry.cardName, + zone: "MAINBOARD", + category: null, + delta: entry.quantity, + }); + } + return out; + }, [existingCards, quantities, added]); + + function handleSubmit() { + if (deltas.length === 0) return; + setError(null); + startTransition(async () => { + try { + await submitDeckProposal(deckId, deltas, message.trim() || undefined); + router.push(`/deck/${deckId}/collaborate`); + } catch (e) { + setError( + e instanceof Error ? e.message : "Could not submit proposal.", + ); + } + }); + } + + return ( +
    +
    +

    + Mainboard +

    + {existingCards.length === 0 ? ( +

    + No mainboard cards yet. +

    + ) : ( +
      + {existingCards.map((c) => ( +
    • + setQuantity(c.cardId, n)} + /> + {c.cardName} +
      • + ))} +
    + )} +
    + +
    +

    + Add cards +

    + setQuery(e.target.value)} + placeholder="Search cards to add…" + /> + {loading && ( +

    Searching…

    + )} + {results.length > 0 && ( +
      + {results.map((r) => ( +
    • + {r.name} + {existingByCardId.has(r.id) ? ( + + Already in deck + + ) : ( + + )} +
      • + ))} +
    + )} + {added.size > 0 && ( +
      + {[...added.entries()].map(([cardId, entry]) => ( +
    • + setAddedQuantity(cardId, n)} + /> + {entry.cardName} +
      • + ))} +
    + )} +
    + +
    + +