holy cow

apps/web/src/components/editor/assets-panel/views/captions.tsx

@@ -95,8 +95,6 @@ export function Captions() {
 
       const { text, segments } = await transcriptionResponse.json();
 
-      console.log("Transcription completed:", { text, segments });
-
       const shortCaptions: Array<{
         text: string;
         startTime: number;
@@ -132,7 +130,10 @@ export function Captions() {
         });
       });
 
-      const captionTrackId = editor.timeline.addTrack({ type: "text", index: 0 });
+      const captionTrackId = editor.timeline.addTrack({
+        type: "text",
+        index: 0,
+      });
 
       shortCaptions.forEach((caption, index) => {
         editor.timeline.addElementToTrack({
@@ -148,14 +149,10 @@ export function Captions() {
           } as TextElement,
         });
       });
-
-      console.log(
-        `✅ ${shortCaptions.length} short-form caption chunks added to timeline!`
-      );
     } catch (error) {
       console.error("Transcription failed:", error);
       setError(
-        error instanceof Error ? error.message : "An unexpected error occurred"
+        error instanceof Error ? error.message : "An unexpected error occurred",
       );
     } finally {
       setIsProcessing(false);
@@ -164,7 +161,10 @@ export function Captions() {
   };
 
   return (
-    <BaseView ref={containerRef} className="flex flex-col justify-between h-full">
+    <BaseView
+      ref={containerRef}
+      className="flex h-full flex-col justify-between"
+    >
       <PropertyGroup title="Language">
         <LanguageSelect
           selectedCountry={selectedCountry}
@@ -176,8 +176,8 @@ export function Captions() {
 
       <div className="flex flex-col gap-4">
         {error && (
-          <div className="p-3 bg-destructive/10 border border-destructive/20 rounded-md">
-            <p className="text-sm text-destructive">{error}</p>
+          <div className="bg-destructive/10 border-destructive/20 rounded-md border p-3">
+            <p className="text-destructive text-sm">{error}</p>
           </div>
         )}
 
@@ -192,7 +192,7 @@ export function Captions() {
           }}
           disabled={isProcessing}
         >
-          {isProcessing && <Loader2 className="mr-1 size-4 animate-spin" />}
+          {isProcessing && <Loader2 className="mr-1 animate-spin" />}
           {isProcessing ? processingStep : "Generate transcript"}
         </Button>
 
@@ -243,7 +243,7 @@ export function Captions() {
                   </div>
                 </div>
 
-                <p className="text-xs text-muted-foreground">
+                <p className="text-muted-foreground text-xs">
                   <strong>True zero-knowledge privacy:</strong> Encryption keys
                   are generated randomly in your browser and never stored
                   anywhere. It's cryptographically impossible for us, our cloud

apps/web/src/components/editor/assets-panel/views/media.tsx

@@ -231,9 +231,9 @@ export function MediaView() {
               className="w-full"
             >
               {isProcessing ? (
-                <Loader2 className="size-4 animate-spin" />
+                <Loader2 className="animate-spin" />
               ) : (
-                <CloudUpload className="size-4" />
+                <CloudUpload />
               )}
               <span>Upload</span>
             </Button>

apps/web/src/components/editor/assets-panel/views/sounds.tsx

@@ -239,7 +239,7 @@ function SoundEffectsView() {
               size="icon"
               className={cn(showCommercialOnly && "text-primary")}
             >
-              <ListFilter className="w-4 h-4" />
+              <ListFilter />
             </Button>
           </DropdownMenuTrigger>
           <DropdownMenuContent align="end" className="w-56">
@@ -521,9 +521,9 @@ function AudioItem({
       <div className="relative w-12 h-12 bg-accent rounded-md flex items-center justify-center overflow-hidden shrink-0">
         <div className="absolute inset-0 bg-gradient-to-br from-primary/20 to-transparent" />
         {isPlaying ? (
-          <PauseIcon className="w-5 h-5" />
+          <PauseIcon className="size-5" />
         ) : (
-          <PlayIcon className="w-5 h-5" />
+          <PlayIcon className="size-5" />
         )}
       </div>
 
@@ -542,7 +542,7 @@ function AudioItem({
           onClick={handleAddToTimeline}
           title="Add to timeline"
         >
-          <PlusIcon className="w-4 h-4" />
+          <PlusIcon />
         </Button>
         <Button
           variant="text"
@@ -555,7 +555,7 @@ function AudioItem({
           onClick={handleSaveClick}
           title={isSaved ? "Remove from saved" : "Save sound"}
         >
-          <HeartIcon className={`w-4 h-4 ${isSaved ? "fill-current" : ""}`} />
+          <HeartIcon className={`${isSaved ? "fill-current" : ""}`} />
         </Button>
       </div>
     </div>