diff --git a/frontend/app/components/chronicle/ChroniclePanels.test.tsx b/frontend/app/components/chronicle/ChroniclePanels.test.tsx index 4e21871e..93713936 100644 --- a/frontend/app/components/chronicle/ChroniclePanels.test.tsx +++ b/frontend/app/components/chronicle/ChroniclePanels.test.tsx @@ -130,6 +130,10 @@ describe("ChroniclePlaybackPanel", () => { onGifSizeChange={noop} gifStampDay={false} onGifStampDayChange={noop} + gifWatermark + onGifWatermarkChange={noop} + gifDiscordLink + onGifDiscordLinkChange={noop} onExportGif={noop} gifStatus={null} gifError={null} @@ -138,6 +142,9 @@ describe("ChroniclePlaybackPanel", () => { /> ); expect(container.textContent).toContain("2026-08-01"); + expect(container.textContent).toContain("Watermark"); + expect(container.textContent).toContain("Discord link"); + expect(container.textContent).toContain("Stamp the date"); }); }); diff --git a/frontend/app/components/chronicle/ChroniclePanels.tsx b/frontend/app/components/chronicle/ChroniclePanels.tsx index 1da81b9b..ba726ace 100644 --- a/frontend/app/components/chronicle/ChroniclePanels.tsx +++ b/frontend/app/components/chronicle/ChroniclePanels.tsx @@ -359,6 +359,37 @@ export function ChronicleBuildPanel({ export const CHRONICLE_SPEEDS = [1, 2, 4, 8, 16] as const; +function ExportCheck({ + label, + checked, + disabled, + onChange, +}: { + label: string; + checked: boolean; + disabled: boolean; + onChange: (checked: boolean) => void; +}) { + return ( + + ); +} + export function ChroniclePlaybackPanel({ days, activeIndex, @@ -378,6 +409,10 @@ export function ChroniclePlaybackPanel({ onGifSizeChange, gifStampDay, onGifStampDayChange, + gifWatermark, + onGifWatermarkChange, + gifDiscordLink, + onGifDiscordLinkChange, onExportGif, gifStatus, gifError, @@ -413,6 +448,12 @@ export function ChroniclePlaybackPanel({ */ gifStampDay: boolean; onGifStampDayChange: (stamp: boolean) => void; + /** The TFMC logo in the corner of the file. Independent of the Discord line. */ + gifWatermark: boolean; + onGifWatermarkChange: (watermark: boolean) => void; + /** The discord.gg/tfmc line. Independent of the logo. */ + gifDiscordLink: boolean; + onGifDiscordLinkChange: (discordLink: boolean) => void; onExportGif: () => void; /** * What the export is doing right now, or null when idle. Non-null is also @@ -535,22 +576,24 @@ export function ChroniclePlaybackPanel({ ))} - + + +