Coderabbit fixes

richiemcilroy · richiemcilroy · commit 514e66294455 · 2025-09-08T15:39:24.000+01:00
diff --git a/apps/desktop/src/routes/editor/ConfigSidebar.tsx b/apps/desktop/src/routes/editor/ConfigSidebar.tsx
@@ -1532,66 +1532,64 @@ function BackgroundConfig(props: { scrollRef: HTMLDivElement }) {
 					/>
 				}
 			/>
-			{project.background.border?.enabled && (
-				<>
-					<Field name="Border Width" icon={<IconCapEnlarge class="size-4" />}>
-						<Slider
-							value={[project.background.border?.width ?? 5.0]}
-							onChange={(v) =>
-								setProject("background", "border", {
-									...(project.background.border ?? {
-										enabled: true,
-										width: 5.0,
-										color: [255, 255, 255],
-										opacity: 80.0,
-									}),
-									width: v[0],
-								})
-							}
-							minValue={1}
-							maxValue={20}
-							step={0.1}
-							formatTooltip="px"
-						/>
-					</Field>
-					<Field name="Border Color" icon={<IconCapImage class="size-4" />}>
-						<RgbInput
-							value={project.background.border?.color ?? [255, 255, 255]}
-							onChange={(color) =>
-								setProject("background", "border", {
-									...(project.background.border ?? {
-										enabled: true,
-										width: 5.0,
-										color: [255, 255, 255],
-										opacity: 80.0,
-									}),
-									color,
-								})
-							}
-						/>
-					</Field>
-					<Field name="Border Opacity" icon={<IconCapShadow class="size-4" />}>
-						<Slider
-							value={[project.background.border?.opacity ?? 80.0]}
-							onChange={(v) =>
-								setProject("background", "border", {
-									...(project.background.border ?? {
-										enabled: true,
-										width: 5.0,
-										color: [255, 255, 255],
-										opacity: 80.0,
-									}),
-									opacity: v[0],
-								})
-							}
-							minValue={0}
-							maxValue={100}
-							step={0.1}
-							formatTooltip="%"
-						/>
-					</Field>
-				</>
-			)}
+			<Show when={project.background.border?.enabled}>
+				<Field name="Border Width" icon={<IconCapEnlarge class="size-4" />}>
+					<Slider
+						value={[project.background.border?.width ?? 5.0]}
+						onChange={(v) =>
+							setProject("background", "border", {
+								...(project.background.border ?? {
+									enabled: true,
+									width: 5.0,
+									color: [255, 255, 255],
+									opacity: 80.0,
+								}),
+								width: v[0],
+							})
+						}
+						minValue={1}
+						maxValue={20}
+						step={0.1}
+						formatTooltip="px"
+					/>
+				</Field>
+				<Field name="Border Color" icon={<IconCapImage class="size-4" />}>
+					<RgbInput
+						value={project.background.border?.color ?? [255, 255, 255]}
+						onChange={(color) =>
+							setProject("background", "border", {
+								...(project.background.border ?? {
+									enabled: true,
+									width: 5.0,
+									color: [255, 255, 255],
+									opacity: 80.0,
+								}),
+								color,
+							})
+						}
+					/>
+				</Field>
+				<Field name="Border Opacity" icon={<IconCapShadow class="size-4" />}>
+					<Slider
+						value={[project.background.border?.opacity ?? 80.0]}
+						onChange={(v) =>
+							setProject("background", "border", {
+								...(project.background.border ?? {
+									enabled: true,
+									width: 5.0,
+									color: [255, 255, 255],
+									opacity: 80.0,
+								}),
+								opacity: v[0],
+							})
+						}
+						minValue={0}
+						maxValue={100}
+						step={0.1}
+						formatTooltip="%"
+					/>
+				</Field>
+			</Show>
 			<Field name="Shadow" icon={<IconCapShadow class="size-4" />}>
 				<Slider
 					value={[project.background.shadow!]}
@@ -1921,9 +1919,7 @@ function ZoomSegmentPreview(props: {
 	const video = document.createElement("video");
 	createEffect(() => {
 		const path = convertFileSrc(
-			`${
-				editorInstance.path
-			}/content/segments/segment-${segmentIndex()}/display.mp4`,
+			`${editorInstance.path}/content/segments/segment-${segmentIndex()}/display.mp4`,
 		);
 		video.src = path;
 		video.preload = "auto";
diff --git a/apps/desktop/src/utils/tauri.ts b/apps/desktop/src/utils/tauri.ts
@@ -331,8 +331,9 @@ start_time?: number | null }
 export type AuthSecret = { api_key: string } | { token: string; expires: number }
 export type AuthStore = { secret: AuthSecret; user_id: string | null; plan: Plan | null; intercom_hash: string | null }
 export type AuthenticationInvalid = null
-export type BackgroundConfiguration = { source: BackgroundSource; blur: number; padding: number; rounding: number; inset: number; crop: Crop | null; shadow?: number; advancedShadow?: ShadowConfiguration | null }
+export type BackgroundConfiguration = { source: BackgroundSource; blur: number; padding: number; rounding: number; inset: number; crop: Crop | null; shadow?: number; advancedShadow?: ShadowConfiguration | null; border?: BorderConfiguration | null }
 export type BackgroundSource = { type: "wallpaper"; path: string | null } | { type: "image"; path: string | null } | { type: "color"; value: [number, number, number] } | { type: "gradient"; from: [number, number, number]; to: [number, number, number]; angle?: number }
+export type BorderConfiguration = { enabled: boolean; width: number; color: [number, number, number]; opacity: number }
 export type Camera = { hide: boolean; mirror: boolean; position: CameraPosition; size: number; zoom_size: number | null; rounding?: number; shadow?: number; advanced_shadow?: ShadowConfiguration | null; shape?: CameraShape }
 export type CameraInfo = { device_id: string; model_id: ModelIDType | null; display_name: string }
 export type CameraPosition = { x: CameraXPosition; y: CameraYPosition }
diff --git a/crates/rendering-skia/src/bin/test_background.rs b/crates/rendering-skia/src/bin/test_background.rs
@@ -70,6 +70,7 @@ fn test_color_background(
         let uniforms = SkiaProjectUniforms {
             output_size: (width, height),
             background: BackgroundSource::Color { value: color },
+            border: None,
         };
 
         let frame_data = FrameData {
@@ -133,6 +134,7 @@ fn test_gradient_background(
             to: [0, 0, 65535],   // Blue
             angle: 45,
         },
+        border: None,
     };
 
     let frame_data = FrameData {
@@ -197,6 +199,7 @@ fn test_gradient_angles(
                 to: [32768, 0, 65535],   // Purple
                 angle,
             },
+            border: None,
         };
 
         let frame_data = FrameData {
@@ -261,6 +264,7 @@ fn test_caching(
             to: [0, 0, 65535],
             angle: 90,
         },
+        border: None,
     };
 
     let frame_data = FrameData {
@@ -306,6 +310,7 @@ fn test_caching(
             to: [65535, 65535, 0],
             angle: 45,
         },
+        border: None,
     };
 
     let new_frame_data = FrameData {
diff --git a/crates/rendering-skia/src/layers/background.rs b/crates/rendering-skia/src/layers/background.rs
@@ -134,8 +134,8 @@ impl BackgroundLayer {
         let border_rect = Rect::from_xywh(
             bounds.left() + inset,
             bounds.top() + inset,
-            bounds.width() - border.width,
-            bounds.height() - border.width,
+            (bounds.width() - border.width).max(0.0),
+            (bounds.height() - border.width).max(0.0),
         );
 
         canvas.draw_rect(border_rect, &paint);
diff --git a/crates/rendering/src/composite_frame.rs b/crates/rendering/src/composite_frame.rs
@@ -74,6 +74,10 @@ impl CompositeVideoFrameUniforms {
             }),
         )
     }
+
+    pub fn write_to_buffer(&self, queue: &wgpu::Queue, buffer: &wgpu::Buffer) {
+        queue.write_buffer(buffer, 0, bytemuck::bytes_of(self));
+    }
 }
 
 // pub struct CompositeFrameResources {
diff --git a/crates/rendering/src/layers/display.rs b/crates/rendering/src/layers/display.rs
@@ -75,13 +75,8 @@ impl DisplayLayer {
             },
         );
 
-        self.uniforms_buffer = uniforms.to_buffer(device);
-
-        self.bind_group = Some(self.pipeline.bind_group(
-            device,
-            &self.uniforms_buffer,
-            &self.frame_texture_view,
-        ));
+        // Update existing uniform buffer in place; bind group remains valid.
+        uniforms.write_to_buffer(queue, &self.uniforms_buffer);
     }
 
     pub fn render(&self, pass: &mut wgpu::RenderPass<'_>) {
diff --git a/crates/rendering/src/lib.rs b/crates/rendering/src/lib.rs
@@ -635,7 +635,7 @@ impl ProjectUniforms {
                     .advanced_shadow
                     .as_ref()
                     .map_or(50.0, |s| s.blur),
-                opacity: layout.screen_opacity as f32,
+                opacity: scene.screen_opacity as f32,
                 border_enabled: if project
                     .background
                     .border
@@ -650,26 +650,17 @@ impl ProjectUniforms {
                 _padding0: 0.0,
                 _padding1: [0.0; 2],
                 _padding1b: [0.0; 2],
-                border_color: {
-                    let border = project.background.border.as_ref().unwrap_or(
-                        &cap_project::BorderConfiguration {
-                            enabled: false,
-                            width: 5.0,
-                            color: [255, 255, 255],
-                            opacity: 80.0,
-                        },
-                    );
-
+                border_color: if let Some(b) = project.background.border.as_ref() {
                     [
-                        border.color[0] as f32 / 255.0,
-                        border.color[1] as f32 / 255.0,
-                        border.color[2] as f32 / 255.0,
-                        (border.opacity / 100.0).clamp(0.0, 1.0),
+                        b.color[0] as f32 / 255.0,
+                        b.color[1] as f32 / 255.0,
+                        b.color[2] as f32 / 255.0,
+                        (b.opacity / 100.0).clamp(0.0, 1.0),
                     ]
+                } else {
+                    [1.0, 1.0, 1.0, 0.8]
                 },
                 _padding2: [0.0; 4],
-                opacity: scene.screen_opacity as f32,
-                _padding: [0.0; 3],
             }
         };
 
@@ -777,16 +768,14 @@ impl ProjectUniforms {
                         .advanced_shadow
                         .as_ref()
                         .map_or(50.0, |s| s.blur),
-                    opacity: layout.regular_camera_transition_opacity() as f32,
+                    opacity: scene.regular_camera_transition_opacity() as f32,
                     border_enabled: 0.0,
                     border_width: 0.0,
                     _padding0: 0.0,
                     _padding1: [0.0; 2],
                     _padding1b: [0.0; 2],
                     border_color: [0.0, 0.0, 0.0, 0.0],
                     _padding2: [0.0; 4],
-                    opacity: scene.regular_camera_transition_opacity() as f32,
-                    _padding: [0.0; 3],
                 }
             });
 
@@ -848,16 +837,14 @@ impl ProjectUniforms {
                     shadow_size: 0.0,
                     shadow_opacity: 0.0,
                     shadow_blur: 0.0,
-                    opacity: layout.camera_only_transition_opacity() as f32,
+                    opacity: scene.camera_only_transition_opacity() as f32,
                     border_enabled: 0.0,
                     border_width: 0.0,
                     _padding0: 0.0,
                     _padding1: [0.0; 2],
                     _padding1b: [0.0; 2],
                     border_color: [0.0, 0.0, 0.0, 0.0],
                     _padding2: [0.0; 4],
-                    opacity: scene.camera_only_transition_opacity() as f32,
-                    _padding: [0.0; 3],
                 }
             });
 

Original file line number	Diff line number	Diff line change
`@@ -74,6 +74,10 @@ impl CompositeVideoFrameUniforms {`
`74`	`74`	`}),`
`75`	`75`	`)`
`76`	`76`	`}`
	`77`	`+`
	`78`	`+ pub fn write_to_buffer(&self, queue: &wgpu::Queue, buffer: &wgpu::Buffer) {`
	`79`	`+ queue.write_buffer(buffer, 0, bytemuck::bytes_of(self));`
	`80`	`+ }`
`77`	`81`	`}`
`78`	`82`
`79`	`83`	`// pub struct CompositeFrameResources {`