refactor: restructure files to their domains, new preview overlay system, and dep graph

1 files changed, 85 insertions, 0 deletions

diff --git a/apps/web/src/timeline/bookmarks/preview-overlay-source.tsx b/apps/web/src/timeline/bookmarks/preview-overlay-source.tsx
new file mode 100644
index 00000000..8e2b4bcf
--- /dev/null
+++ b/apps/web/src/timeline/bookmarks/preview-overlay-source.tsx
@@ -0,0 +1,85 @@
+import type { Bookmark } from "@/timeline";
+import {
+	EMPTY_PREVIEW_OVERLAY_SOURCE_RESULT,
+	type PreviewOverlayDefinition,
+	type PreviewOverlaySourceResult,
+} from "@/preview/overlays";
+import { getBookmarksActiveAtTime } from "./utils";
+
+export const bookmarkNotesPreviewOverlay: PreviewOverlayDefinition = {
+	id: "bookmark-notes",
+	label: "Show bookmark notes",
+	defaultVisible: true,
+};
+
+function BookmarkNotesOverlay({
+	bookmarks,
+}: {
+	bookmarks: Array<{ time: number; note: string; color?: string }>;
+}) {
+	return (
+		<div className="flex flex-col gap-1.5" aria-live="polite">
+			{bookmarks.map((bookmark) => (
+				<div
+					key={bookmark.time}
+					className="flex max-w-[min(200px,50vw)] px-2.5 py-1.5 text-left text-white text-xs shadow-md backdrop-blur-sm"
+					style={{
+						backgroundColor: "rgb(0 0 0 / 0.5)",
+						borderLeft: bookmark.color
+							? `3px solid ${bookmark.color}`
+							: "3px solid var(--primary)",
+					}}
+				>
+					{bookmark.note}
+				</div>
+			))}
+		</div>
+	);
+}
+
+export function getBookmarkPreviewOverlaySource({
+	bookmarks,
+	time,
+	isVisible,
+}: {
+	bookmarks: Bookmark[];
+	time: number;
+	isVisible: boolean;
+}): PreviewOverlaySourceResult {
+	const bookmarksWithNotes = getBookmarksActiveAtTime({
+		bookmarks,
+		time,
+	}).flatMap((bookmark) => {
+		if (bookmark.note == null || bookmark.note.trim() === "") {
+			return [];
+		}
+
+		return [
+			{
+				time: bookmark.time,
+				note: bookmark.note,
+				color: bookmark.color,
+			},
+		];
+	});
+
+	if (!isVisible || bookmarksWithNotes.length === 0) {
+		return {
+			...EMPTY_PREVIEW_OVERLAY_SOURCE_RESULT,
+			definitions: [bookmarkNotesPreviewOverlay],
+		};
+	}
+
+	return {
+		definitions: [bookmarkNotesPreviewOverlay],
+		instances: [
+			{
+				id: bookmarkNotesPreviewOverlay.id,
+				mount: { kind: "hud", anchor: "top-left", order: 0 },
+				plane: "over-interaction",
+				pointerEvents: "none",
+				render: () => <BookmarkNotesOverlay bookmarks={bookmarksWithNotes} />,
+			},
+		],
+	};
+}