fix(ai-edition): fall back to VirtualPreview for the screen stage

The refactor that swapped the screen preview from the legacy CSS+<video>
approach (VirtualPreview) to a Pixi v8 WebGL compositor
(preview-compositor/PreviewCompositor) regressed the editor preview.
The Pixi path needs the <video> to stay as a hidden decode source
for a VideoSource; combined with setPixiReady firing while canvasSize is
still {0,0} on first mount, the canvas init'd at 1x1, the resize effect
bailed, and the user got an empty stage (wallpaper showing through) or
a black rectangle where the screen should be.

Restore the VirtualPreview path until the Pixi port has tests and
its own QA. The Pixi files stay in the codebase under
preview-compositor/ for the next attempt. Inline comment in
PreviewCanvas.tsx records the failure write-up.

Author: EtienneLescot

src/components/ai-edition/PreviewCanvas.tsx

@@ -49,17 +49,14 @@ import { getCssClipPath } from "@/lib/webcamMaskShapes";
 import { getAspectRatioValue } from "@/utils/aspectRatioUtils";
 import { AnnotationLayer } from "./AnnotationLayer";
 import styles from "./NewEditorShell.module.css";
-import {
-	PreviewCompositor,
-	type VideoSourceDescriptor,
-} from "./preview-compositor/PreviewCompositor";
+import { type VideoSource, VirtualPreview } from "./VirtualPreview";
 import { WebcamOverlay } from "./WebcamOverlay";
 import { ZoomFocusOverlay } from "./ZoomFocusOverlay";
 
 type BlurData = NonNullable<AxcutAnnotationRegion["blurData"]>;
 
 interface PreviewCanvasProps {
-	videoSources: VideoSourceDescriptor[];
+	videoSources: VideoSource[];
 	clips: AxcutClip[];
 	zoomRegions?: AxcutZoomRegion[];
 	speedRegions?: SpeedRegion[];
@@ -271,7 +268,23 @@ export function PreviewCanvas(props: PreviewCanvasProps) {
 			<div className={styles.bgBlur} style={blurStyle} aria-hidden />
 			{layout?.screenRect ? (
 				<div className={styles.screenStage} style={screenStyle}>
-					<PreviewCompositor {...relayProps} />
+					{(() => {
+						// ponytail: PreviewCompositor (Pixi v8) regressed the screen
+						// preview — the `<video>` is `visibility: hidden` while it's
+						// the decode source for a Pixi VideoSource, and the
+						// combination of `setPixiReady` + `canvasSize === {0,0}` on
+						// mount produces a 1x1 canvas that the resize effect never
+						// widens (the user reports either an empty stage showing
+						// the wallpaper through, or a black rectangle where the
+						// screen recording should be). Falling back to the legacy
+						// VirtualPreview path — CSS-transformed <video> + measure
+						// on ResizeObserver — until the Pixi path is hardened
+						// behind a flag with its own tests.
+						// See docs/engineering/ai-edition-preview-pixi-rollback.md
+						// (todo) for the failure write-up.
+						void relayProps.clockRef;
+						return <VirtualPreview {...relayProps} videoStyle={videoBorderRadiusStyle(settings)} />;
+					})()}
 					{selectedZoomRegion && props.onZoomFocusChange ? (
 						<ZoomFocusOverlay
 							region={selectedZoomRegion}
@@ -387,6 +400,12 @@ function buildScreenStyle(
 	};
 }
 
+function videoBorderRadiusStyle(
+	settings: ReturnType<typeof useEditorSettings>["settings"],
+): React.CSSProperties {
+	return { borderRadius: `${settings.borderRadius}px` };
+}
+
 // Webcam slot: full composite-layout rect with mask shape + shadow. NO
 // borderRadius here — the rounded corners live on the <video> inside so they
 // actually clip the camera content rather than drawing a frame around it.