From 3a6bc6ebf71475a19b9202061ab08f93d1a67b9f Mon Sep 17 00:00:00 2001
From: enkeii64 <imenkei64@gmail.com>
Date: Mon, 4 Aug 2025 17:38:02 +1000
Subject: feat: add panel presets

---
 apps/web/src/components/editor/audio-waveform.tsx     | 10 +++++-----
 apps/web/src/components/editor/media-panel/tabbar.tsx |  4 +++-
 apps/web/src/components/editor/preview-panel.tsx      | 18 ++++++++++--------
 3 files changed, 18 insertions(+), 14 deletions(-)

(limited to 'apps/web/src/components/editor')

diff --git a/apps/web/src/components/editor/audio-waveform.tsx b/apps/web/src/components/editor/audio-waveform.tsx
index 372a31c5..79bf401d 100644
--- a/apps/web/src/components/editor/audio-waveform.tsx
+++ b/apps/web/src/components/editor/audio-waveform.tsx
@@ -20,7 +20,7 @@ const AudioWaveform: React.FC<AudioWaveformProps> = ({
   useEffect(() => {
     let mounted = true;
     let ws = wavesurfer.current;
-    
+
     const initWaveSurfer = async () => {
       if (!waveformRef.current || !audioUrl) return;
 
@@ -90,7 +90,7 @@ const AudioWaveform: React.FC<AudioWaveformProps> = ({
       const wsToDestroy = ws;
       // Detach from ref immediately
       wavesurfer.current = null;
-      
+
       // Wait a tick to destroy so any pending operations can complete
       requestAnimationFrame(() => {
         try {
@@ -111,13 +111,13 @@ const AudioWaveform: React.FC<AudioWaveformProps> = ({
     return () => {
       // Mark component as unmounted
       mounted = false;
-      
+
       // Store reference to current wavesurfer instance
       const wsToDestroy = wavesurfer.current;
-      
+
       // Immediately clear the ref to prevent accessing it after unmount
       wavesurfer.current = null;
-      
+
       // If we have an instance to clean up, do it safely
       if (wsToDestroy) {
         // Delay destruction to avoid race conditions
diff --git a/apps/web/src/components/editor/media-panel/tabbar.tsx b/apps/web/src/components/editor/media-panel/tabbar.tsx
index fc4f677d..6fab0abf 100644
--- a/apps/web/src/components/editor/media-panel/tabbar.tsx
+++ b/apps/web/src/components/editor/media-panel/tabbar.tsx
@@ -77,7 +77,9 @@ export function TabBar() {
             <div
               className={cn(
                 "flex flex-col gap-0.5 items-center cursor-pointer opacity-100 hover:opacity-75",
-                activeTab === tabKey ? "text-primary !opacity-100" : "text-muted-foreground"
+                activeTab === tabKey
+                  ? "text-primary !opacity-100"
+                  : "text-muted-foreground"
               )}
               onClick={() => setActiveTab(tabKey)}
               key={tabKey}
diff --git a/apps/web/src/components/editor/preview-panel.tsx b/apps/web/src/components/editor/preview-panel.tsx
index 58cc5d5b..96166d43 100644
--- a/apps/web/src/components/editor/preview-panel.tsx
+++ b/apps/web/src/components/editor/preview-panel.tsx
@@ -350,18 +350,20 @@ export function PreviewPanel() {
           style={{
             left: `${
               50 +
-              ((dragState.isDragging && dragState.elementId === element.id
-                ? dragState.currentX
-                : element.x) /
-                canvasSize.width) *
+              (
+                (dragState.isDragging && dragState.elementId === element.id
+                  ? dragState.currentX
+                  : element.x) / canvasSize.width
+              ) *
                 100
             }%`,
             top: `${
               50 +
-              ((dragState.isDragging && dragState.elementId === element.id
-                ? dragState.currentY
-                : element.y) /
-                canvasSize.height) *
+              (
+                (dragState.isDragging && dragState.elementId === element.id
+                  ? dragState.currentY
+                  : element.y) / canvasSize.height
+              ) *
                 100
             }%`,
             transform: `translate(-50%, -50%) rotate(${element.rotation}deg) scale(${scaleRatio})`,
-- 
cgit v1.3.1