move the visualizer settings out of error boundary

src/renderer/features/visualizer/components/audiomotionanalyzer/visualizer.tsx

@@ -217,6 +217,10 @@ const VisualizerInner = () => {
         }
     }, [motion, options]);
 
+    return <div className={styles.visualizer} ref={canvasRef} />;
+};
+
+export const Visualizer = () => {
     return (
         <div className={styles.container}>
             <ActionIcon
@@ -229,15 +233,9 @@ const VisualizerInner = () => {
                 top={0}
                 variant="transparent"
             />
-            <div className={styles.visualizer} ref={canvasRef} />
+            <ComponentErrorBoundary>
+                <VisualizerInner />
+            </ComponentErrorBoundary>
         </div>
     );
 };
-
-export const Visualizer = () => {
-    return (
-        <ComponentErrorBoundary>
-            <VisualizerInner />
-        </ComponentErrorBoundary>
-    );
-};

src/renderer/features/visualizer/components/butternchurn/visualizer.tsx

@@ -294,16 +294,6 @@ const VisualizerInner = () => {
 
     return (
         <div className={styles.container} ref={containerRef}>
-            <ActionIcon
-                className={styles.settingsIcon}
-                icon="settings2"
-                iconProps={{ size: 'lg' }}
-                onClick={openVisualizerSettingsModal}
-                pos="absolute"
-                right={0}
-                top={0}
-                variant="transparent"
-            />
             <canvas className={styles.canvas} ref={canvasRef} />
             {butterchurnSettings.currentPreset && (
                 <Text className={styles['preset-overlay']} isNoSelect size="sm">
@@ -316,8 +306,20 @@ const VisualizerInner = () => {
 
 export const Visualizer = () => {
     return (
-        <ComponentErrorBoundary>
+        <div className={styles.container} style={{ position: 'relative' }}>
-            <VisualizerInner />
+            <ActionIcon
-        </ComponentErrorBoundary>
+                className={styles.settingsIcon}
+                icon="settings2"
+                iconProps={{ size: 'lg' }}
+                onClick={openVisualizerSettingsModal}
+                pos="absolute"
+                right={0}
+                top={0}
+                variant="transparent"
+            />
+            <ComponentErrorBoundary>
+                <VisualizerInner />
+            </ComponentErrorBoundary>
+        </div>
     );
 };