diff --git a/apps/web/src/components/editor/panels/assets/views/settings/background.tsx b/apps/web/src/components/editor/panels/assets/views/settings/background.tsx index bbceac7d..72883e35 100644 --- a/apps/web/src/components/editor/panels/assets/views/settings/background.tsx +++ b/apps/web/src/components/editor/panels/assets/views/settings/background.tsx @@ -17,23 +17,24 @@ import { colors } from "@/data/colors/solid"; import { syntaxUIGradients } from "@/data/colors/syntax-ui"; import { useEditor } from "@/hooks/use-editor"; import { effectPreviewService } from "@/services/renderer/effect-preview"; -import type { TCanvasSize } from "@/lib/project/types"; import { cn } from "@/utils/ui"; +const BLUR_PREVIEW_UNIFORM_DIMENSIONS = { + width: 1920, + height: 1080, +} as const; + const BlurPreview = memo( ({ blur, - canvasSize, isSelected, onSelect, }: { blur: { label: string; value: number }; - canvasSize: TCanvasSize; isSelected: boolean; onSelect: () => void; }) => { const canvasRef = useRef(null); - const { width, height } = canvasSize; useEffect(() => { const renderPreview = () => { @@ -43,13 +44,13 @@ const BlurPreview = memo( effectType: "blur", params: { intensity: blur.value }, targetCanvas: canvasRef.current, - uniformDimensions: { width, height }, + uniformDimensions: BLUR_PREVIEW_UNIFORM_DIMENSIONS, }); }; renderPreview(); return effectPreviewService.onPreviewImageReady({ callback: renderPreview }); - }, [blur.value, width, height]); + }, [blur.value]); return (