error proof settings ui

src/renderer/components/settings/DiscordBranchPicker.tsx

@@ -4,23 +4,26 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
+import { ErrorBoundary } from "@vencord/types/components";
 import { Select } from "@vencord/types/webpack/common";
 
 import { SettingsComponent } from "./Settings";
 
 export const DiscordBranchPicker: SettingsComponent = ({ settings }) => {
     return (
-        <Select
-            placeholder="Stable"
-            options={[
-                { label: "Stable", value: "stable", default: true },
-                { label: "Canary", value: "canary" },
-                { label: "PTB", value: "ptb" }
-            ]}
-            closeOnSelect={true}
-            select={v => (settings.discordBranch = v)}
-            isSelected={v => v === settings.discordBranch}
-            serialize={s => s}
-        />
+        <ErrorBoundary noop>
+            <Select
+                placeholder="Stable"
+                options={[
+                    { label: "Stable", value: "stable", default: true },
+                    { label: "Canary", value: "canary" },
+                    { label: "PTB", value: "ptb" }
+                ]}
+                closeOnSelect={true}
+                select={v => (settings.discordBranch = v)}
+                isSelected={v => v === settings.discordBranch}
+                serialize={s => s}
+            />
+        </ErrorBoundary>
     );
 };

src/renderer/components/settings/Settings.tsx

@@ -179,12 +179,12 @@ function SettingsSections() {
 export default ErrorBoundary.wrap(
     function SettingsUI() {
         return (
-            <Forms.FormSection>
+            <section>
                 <Text variant="heading-xl/semibold" color="header-primary" className="vcd-settings-title">
                     Vesktop Settings
                 </Text>
                 <SettingsSections />
-            </Forms.FormSection>
+            </section>
         );
     },
     {

src/renderer/components/settings/WindowsTransparencyControls.tsx

@@ -4,6 +4,7 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
+import { ErrorBoundary } from "@vencord/types/components";
 import { Margins } from "@vencord/types/utils";
 import { Forms, Select } from "@vencord/types/webpack/common";
 
@@ -13,35 +14,37 @@ export const WindowsTransparencyControls: SettingsComponent = ({ settings }) =>
     if (!VesktopNative.app.supportsWindowsTransparency()) return null;
 
     return (
-        <div>
-            <Forms.FormTitle className={Margins.bottom8}>Transparency Options</Forms.FormTitle>
-            <Forms.FormText className={Margins.bottom8}>
-                Requires a full restart. You will need a theme that supports transparency for this to work.
-            </Forms.FormText>
+        <ErrorBoundary noop>
+            <div>
+                <Forms.FormTitle className={Margins.bottom8}>Transparency Options</Forms.FormTitle>
+                <Forms.FormText className={Margins.bottom8}>
+                    Requires a full restart. You will need a theme that supports transparency for this to work.
+                </Forms.FormText>
 
-            <Select
-                placeholder="None"
-                options={[
-                    {
-                        label: "None",
-                        value: "none",
-                        default: true
-                    },
-                    {
-                        label: "Mica (incorporates system theme + desktop wallpaper to paint the background)",
-                        value: "mica"
-                    },
-                    { label: "Tabbed (variant of Mica with stronger background tinting)", value: "tabbed" },
-                    {
-                        label: "Acrylic (blurs the window behind Vesktop for a translucent background)",
-                        value: "acrylic"
-                    }
-                ]}
-                closeOnSelect={true}
-                select={v => (settings.transparencyOption = v)}
-                isSelected={v => v === settings.transparencyOption}
-                serialize={s => s}
-            />
-        </div>
+                <Select
+                    placeholder="None"
+                    options={[
+                        {
+                            label: "None",
+                            value: "none",
+                            default: true
+                        },
+                        {
+                            label: "Mica (incorporates system theme + desktop wallpaper to paint the background)",
+                            value: "mica"
+                        },
+                        { label: "Tabbed (variant of Mica with stronger background tinting)", value: "tabbed" },
+                        {
+                            label: "Acrylic (blurs the window behind Vesktop for a translucent background)",
+                            value: "acrylic"
+                        }
+                    ]}
+                    closeOnSelect={true}
+                    select={v => (settings.transparencyOption = v)}
+                    isSelected={v => v === settings.transparencyOption}
+                    serialize={s => s}
+                />
+            </div>
+        </ErrorBoundary>
     );
 };