fix: ensure canvas renders when dialog opens

Fixed canvas visualization not painting sometimes by:
- Adding `open` prop check before rendering
- Adding `open` to useEffect dependencies
- Adding dimension validation for dynamic canvas sizes
- Ensures canvas properly renders when dialog becomes visible

Affected dialogs: DynamicsParameterDialog, TimeBasedParameterDialog,
AdvancedParameterDialog

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-17 20:53:59 +01:00
parent 2fc1620495
commit 39624ca9cf
3 changed files with 13 additions and 5 deletions

View File

@@ -139,7 +139,7 @@ export function DynamicsParameterDialog({
// Draw transfer curve (input level vs output level)
React.useEffect(() => {
if (!canvasRef.current) return;
if (!open || !canvasRef.current) return;
const canvas = canvasRef.current;
const ctx = canvas.getContext('2d');
@@ -149,6 +149,9 @@ export function DynamicsParameterDialog({
const rect = canvas.getBoundingClientRect();
const dpr = window.devicePixelRatio || 1;
// Ensure canvas has dimensions before drawing
if (rect.width === 0 || rect.height === 0) return;
// Set actual size in memory (scaled to account for extra pixel density)
canvas.width = rect.width * dpr;
canvas.height = rect.height * dpr;
@@ -296,7 +299,7 @@ export function DynamicsParameterDialog({
ctx.fillText(db.toString(), x, height - 20);
}
}, [parameters, effectType]);
}, [parameters, effectType, open]);
const handleApply = () => {
onApply(parameters);