From 3e89d2998588f8e35c524e523ba2ee853f0f6475 Mon Sep 17 00:00:00 2001 From: Maze Winther Date: Mon, 20 Apr 2026 11:31:17 +0200 Subject: refactor: restructure files to their domains, new preview overlay system, and dep graph --- apps/web/src/lib/guides/definitions/custom.tsx | 24 -- apps/web/src/lib/guides/definitions/grid.tsx | 125 -------- apps/web/src/lib/guides/definitions/platforms.tsx | 65 ---- .../src/lib/guides/definitions/tiktok-layout.tsx | 335 --------------------- 4 files changed, 549 deletions(-) delete mode 100644 apps/web/src/lib/guides/definitions/custom.tsx delete mode 100644 apps/web/src/lib/guides/definitions/grid.tsx delete mode 100644 apps/web/src/lib/guides/definitions/platforms.tsx delete mode 100644 apps/web/src/lib/guides/definitions/tiktok-layout.tsx (limited to 'apps/web/src/lib/guides/definitions') diff --git a/apps/web/src/lib/guides/definitions/custom.tsx b/apps/web/src/lib/guides/definitions/custom.tsx deleted file mode 100644 index fe7944cb..00000000 --- a/apps/web/src/lib/guides/definitions/custom.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { PlusSignIcon, RulerIcon } from "@hugeicons/core-free-icons"; -import { HugeiconsIcon } from "@hugeicons/react"; -import { Button } from "@/components/ui/button"; -import type { GuideDefinition } from "@/lib/guides/types"; - -function CustomGuideOptions() { - return ( -
- -
- ); -} - -export const customGuide = { - id: "custom", - label: "Custom", - renderPreview: () => , - renderTriggerIcon: () => , - renderOverlay: () => null, - renderOptions: () => , -} as const satisfies GuideDefinition; diff --git a/apps/web/src/lib/guides/definitions/grid.tsx b/apps/web/src/lib/guides/definitions/grid.tsx deleted file mode 100644 index 7677a1d9..00000000 --- a/apps/web/src/lib/guides/definitions/grid.tsx +++ /dev/null @@ -1,125 +0,0 @@ -import { - GridTableIcon, - LayoutThreeColumnIcon, - LayoutThreeRowIcon, -} from "@hugeicons/core-free-icons"; -import { HugeiconsIcon } from "@hugeicons/react"; -import { NumberField } from "@/components/ui/number-field"; -import { - GRID_MIN, - GRID_MAX, - DEFAULT_GRID_CONFIG, -} from "@/lib/guides/grid"; -import { usePreviewStore } from "@/stores/preview-store"; -import { clampRound } from "@/utils/math"; -import { cn } from "@/utils/ui"; -import type { GuideDefinition } from "@/lib/guides/types"; - -function GridLines({ - rows, - cols, - color, -}: { - rows: number; - cols: number; - color: string; -}) { - const verticals = Array.from( - { length: cols - 1 }, - (_, i) => ((i + 1) / cols) * 100, - ); - const horizontals = Array.from( - { length: rows - 1 }, - (_, i) => ((i + 1) / rows) * 100, - ); - - return ( - <> - {verticals.map((pct) => ( -
- ))} - {horizontals.map((pct) => ( -
- ))} - - ); -} - -function GridGuidePreview() { - return ( -
- -
- ); -} - -function GridGuideOverlay() { - const { rows, cols } = usePreviewStore((s) => s.gridConfig); - - return ( -
- -
- ); -} - -function GridGuideOptions() { - const rows = usePreviewStore((s) => s.gridConfig.rows); - const cols = usePreviewStore((s) => s.gridConfig.cols); - const setGridConfig = usePreviewStore((s) => s.setGridConfig); - - const clampGridValue = (value: number) => - clampRound({ value, min: GRID_MIN, max: GRID_MAX }); - - return ( -
- } - value={rows} - min={GRID_MIN} - max={GRID_MAX} - isDefault={rows === DEFAULT_GRID_CONFIG.rows} - onReset={() => setGridConfig({ rows: DEFAULT_GRID_CONFIG.rows })} - onScrub={(value) => setGridConfig({ rows: clampGridValue(value) })} - onChange={(event) => { - const parsed = Number.parseInt(event.target.value, 10); - if (!Number.isNaN(parsed)) - setGridConfig({ rows: clampGridValue(parsed) }); - }} - className="flex-1" - /> - } - value={cols} - min={GRID_MIN} - max={GRID_MAX} - isDefault={cols === DEFAULT_GRID_CONFIG.cols} - onReset={() => setGridConfig({ cols: DEFAULT_GRID_CONFIG.cols })} - onScrub={(value) => setGridConfig({ cols: clampGridValue(value) })} - onChange={(event) => { - const parsed = Number.parseInt(event.target.value, 10); - if (!Number.isNaN(parsed)) - setGridConfig({ cols: clampGridValue(parsed) }); - }} - className="flex-1" - /> -
- ); -} - -export const gridGuide = { - id: "grid", - label: "Grid", - renderPreview: () => , - renderTriggerIcon: () => , - renderOverlay: () => , - renderOptions: () => , -} as const satisfies GuideDefinition; diff --git a/apps/web/src/lib/guides/definitions/platforms.tsx b/apps/web/src/lib/guides/definitions/platforms.tsx deleted file mode 100644 index 8c403eb1..00000000 --- a/apps/web/src/lib/guides/definitions/platforms.tsx +++ /dev/null @@ -1,65 +0,0 @@ -import Image from "next/image"; -import type { GuideDefinition } from "@/lib/guides/types"; -import { TikTokLayout } from "./tiktok-layout"; - -function PlatformLogo({ - domain, - className = "size-4", -}: { - domain: string; - className?: string; -}) { - return ( - - ); -} - -function PlatformGuidePreview({ domain }: { domain: string }) { - return ; -} - -function platformGuide({ - id, - label, - domain, -}: { - id: string; - label: string; - domain: string; -}): GuideDefinition { - return { - id, - label, - renderPreview: () => , - renderTriggerIcon: () => , - renderOverlay: () => null, - }; -} - -export const tiktokGuide: GuideDefinition = { - ...platformGuide({ id: "tiktok", label: "TikTok", domain: "tiktok.com" }), - renderOverlay: () => , -}; -export const igReelsGuide = platformGuide({ - id: "ig-reels", - label: "Reels", - domain: "instagram.com", -}); -export const ytShortsGuide = platformGuide({ - id: "yt-shorts", - label: "Shorts", - domain: "youtube.com", -}); -export const spotlightGuide = platformGuide({ - id: "spotlight", - label: "Spotlight", - domain: "snapchat.com", -}); diff --git a/apps/web/src/lib/guides/definitions/tiktok-layout.tsx b/apps/web/src/lib/guides/definitions/tiktok-layout.tsx deleted file mode 100644 index b7513bac..00000000 --- a/apps/web/src/lib/guides/definitions/tiktok-layout.tsx +++ /dev/null @@ -1,335 +0,0 @@ -export function TikTokLayout() { - return ( - - TikTok Layout - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ); -} -- cgit v1.3.1