External/OpenCut
1
0
Fork 0
mirror of https://github.com/OpenCut-app/OpenCut.git synced 2026-07-13 21:52:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: remove development debug

Browse Source
This commit is contained in:
Maze Winther
2025-07-15 14:58:08 +02:00
parent ce851e52ce
commit ebad05f17b
2 changed files with 0 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/app/layout.tsx
-2
View File
@@ -4,7 +4,6 @@ import Script from "next/script";
import "./globals.css"; import "./globals.css";
import { Toaster } from "../components/ui/sonner"; import { Toaster } from "../components/ui/sonner";
import { TooltipProvider } from "../components/ui/tooltip"; import { TooltipProvider } from "../components/ui/tooltip";
import { DevelopmentDebug } from "../components/development-debug";
import { StorageProvider } from "../components/storage-provider"; import { StorageProvider } from "../components/storage-provider";
import { baseMetaData } from "./metadata"; import { baseMetaData } from "./metadata";
import { defaultFont } from "../lib/font-config"; import { defaultFont } from "../lib/font-config";
@@ -24,7 +23,6 @@ export default function RootLayout({
<StorageProvider>{children}</StorageProvider> <StorageProvider>{children}</StorageProvider>
<Analytics /> <Analytics />
<Toaster /> <Toaster />
<DevelopmentDebug />
<Script <Script
src="https://cdn.databuddy.cc/databuddy.js" src="https://cdn.databuddy.cc/databuddy.js"
strategy="afterInteractive" strategy="afterInteractive"
apps/web/src/components/development-debug.tsx
-109
View File
@@ -1,109 +0,0 @@
"use client";
import { useTimelineStore } from "@/stores/timeline-store";
import { useMediaStore, type MediaItem } from "@/stores/media-store";
import { TimelineTrack } from "@/types/timeline";
import { usePlaybackStore } from "@/stores/playback-store";
import { Button } from "@/components/ui/button";
import { useState } from "react";
import type { TimelineElement } from "@/types/timeline";
import { env } from "@/env";
// Only show in development
const SHOW_DEBUG_INFO = env.NODE_ENV === "development";
interface ActiveElement {
element: TimelineElement;
track: TimelineTrack;
mediaItem: MediaItem | null;
}
export function DevelopmentDebug() {
const { tracks } = useTimelineStore();
const { mediaItems } = useMediaStore();
const { currentTime } = usePlaybackStore();
const [showDebug, setShowDebug] = useState(false);
// Don't render anything in production
if (!SHOW_DEBUG_INFO) return null;
// Get active elements at current time
const getActiveElements = (): ActiveElement[] => {
const activeElements: ActiveElement[] = [];
tracks.forEach((track) => {
track.elements.forEach((element) => {
const elementStart = element.startTime;
const elementEnd =
element.startTime +
(element.duration - element.trimStart - element.trimEnd);
if (currentTime >= elementStart && currentTime < elementEnd) {
const mediaItem =
element.type === "media"
? mediaItems.find((item) => item.id === element.mediaId) || null
: null; // Text elements don't have media items
activeElements.push({ element, track, mediaItem });
}
});
});
return activeElements;
};
const activeElements = getActiveElements();
return (
<div className="fixed bottom-4 right-4 z-50">
<div className="flex flex-col items-end gap-2">
{/* Toggle Button */}
<Button
variant="outline"
size="sm"
onClick={() => setShowDebug(!showDebug)}
className="text-xs backdrop-blur-md bg-background/80 border-border/50"
>
Debug {showDebug ? "ON" : "OFF"}
</Button>
{/* Debug Info Panel */}
{showDebug && (
<div className="backdrop-blur-md bg-background/90 border border-border/50 rounded-lg p-3 max-w-sm">
<div className="text-xs font-medium mb-2 text-foreground">
Active Elements ({activeElements.length})
</div>
<div className="space-y-1 max-h-40 overflow-y-auto">
{activeElements.map((elementData, index) => (
<div
key={elementData.element.id}
className="flex items-center gap-2 px-2 py-1 bg-muted/60 rounded text-xs"
>
<span className="w-4 h-4 bg-primary/20 rounded text-center text-xs leading-4 flex-shrink-0">
{index + 1}
</span>
<div className="min-w-0 flex-1">
<div className="truncate">{elementData.element.name}</div>
<div className="text-muted-foreground text-[10px]">
{elementData.element.type === "media"
? elementData.mediaItem?.type || "media"
: "text"}
</div>
</div>
</div>
))}
{activeElements.length === 0 && (
<div className="text-muted-foreground text-xs py-2 text-center">
No active elements
</div>
)}
</div>
<div className="mt-2 pt-2 border-t border-border/30 text-[10px] text-muted-foreground">
Time: {currentTime.toFixed(2)}s
</div>
</div>
)}
</div>
</div>
);
}