avoid showing ugly red error cards to users

src/api/MessageAccessories.tsx

@@ -48,7 +48,7 @@ export function _modifyAccessories(
 ) {
     for (const [key, accessory] of accessories.entries()) {
         const res = (
-            <ErrorBoundary message={`Failed to render ${key} Message Accessory`} key={key}>
+            <ErrorBoundary noop message={`Failed to render ${key} Message Accessory`} key={key}>
                 <accessory.render {...props} />
             </ErrorBoundary>
         );

src/components/ErrorBoundary.tsx

@@ -75,10 +75,15 @@ const ErrorBoundary = LazyComponent(() => {
             logger.error(`${this.props.message || "A component threw an Error"}\n`, error, errorInfo.componentStack);
         }
 
+        get isNoop() {
+            if (IS_DEV) return false;
+            return this.props.noop;
+        }
+
         render() {
             if (this.state.error === NO_ERROR) return this.props.children;
 
-            if (this.props.noop) return null;
+            if (this.isNoop) return null;
 
             if (this.props.fallback)
                 return (

src/components/PluginSettings/PluginModal.tsx

@@ -270,7 +270,7 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
                 {!!plugin.settingsAboutComponent && (
                     <div className={classes(Margins.bottom8, "vc-text-selectable")}>
                         <Forms.FormSection>
-                            <ErrorBoundary message="An error occurred while rendering this plugin's custom InfoComponent">
+                            <ErrorBoundary message="An error occurred while rendering this plugin's custom Info Component">
                                 <plugin.settingsAboutComponent tempSettings={tempSettings} />
                             </ErrorBoundary>
                         </Forms.FormSection>

src/plugins/decor/index.tsx

@@ -150,5 +150,5 @@ export default definePlugin({
         }
     },
 
-    DecorSection: ErrorBoundary.wrap(DecorSection)
+    DecorSection: ErrorBoundary.wrap(DecorSection, { noop: true })
 });

src/plugins/favGifSearch/index.tsx

@@ -118,7 +118,7 @@ export default definePlugin({
     renderSearchBar(instance: Instance, SearchBarComponent: TSearchBarComponent) {
         this.instance = instance;
         return (
-            <ErrorBoundary noop={true}>
+            <ErrorBoundary noop>
                 <SearchBar instance={instance} SearchBarComponent={SearchBarComponent} />
             </ErrorBoundary>
         );

src/plugins/mentionAvatars/index.tsx

@@ -99,7 +99,7 @@ export default definePlugin({
                 src={`${location.protocol}//${window.GLOBAL_ENV.CDN_HOST}/role-icons/${roleId}/${role.icon}.webp?size=24&quality=lossless`}
             />
         );
-    }),
+    }, { noop: true }),
 });
 
 function getUsernameString(username: string) {

src/plugins/messageLinkEmbeds/index.tsx

@@ -20,7 +20,6 @@ import { addMessageAccessory, removeMessageAccessory } from "@api/MessageAccesso
 import { updateMessage } from "@api/MessageUpdater";
 import { definePluginSettings } from "@api/Settings";
 import { getUserSettingLazy } from "@api/UserSettings";
-import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants.js";
 import { classes } from "@utils/misc";
 import { Queue } from "@utils/Queue";
@@ -373,7 +372,7 @@ export default definePlugin({
     settings,
 
     start() {
-        addMessageAccessory("messageLinkEmbed", props => {
+        addMessageAccessory("MessageLinkEmbeds", props => {
             if (!messageLinkRegex.test(props.message.content))
                 return null;
 
@@ -381,16 +380,14 @@ export default definePlugin({
             messageLinkRegex.lastIndex = 0;
 
             return (
-                <ErrorBoundary>
+                <MessageEmbedAccessory
-                    <MessageEmbedAccessory
+                    message={props.message}
-                        message={props.message}
+                />
-                    />
-                </ErrorBoundary>
             );
         }, 4 /* just above rich embeds */);
     },
 
     stop() {
-        removeMessageAccessory("messageLinkEmbed");
+        removeMessageAccessory("MessageLinkEmbeds");
     }
 });

src/plugins/mutualGroupDMs/index.tsx

@@ -204,5 +204,5 @@ export default definePlugin({
                 />
             </>
         );
-    })
+    }, { noop: true })
 });

src/plugins/pauseInvitesForever/index.tsx

@@ -75,5 +75,5 @@ export default definePlugin({
                 }}> Pause Indefinitely.</a>}
             </div>
         );
-    })
+    }, { noop: true })
 });

src/plugins/sortFriendRequests/index.tsx

@@ -86,5 +86,5 @@ export default definePlugin({
                 </TooltipContainer>
             )}
         </div>;
-    })
+    }, { noop: true })
 });

src/plugins/vencordToolbox/index.tsx

@@ -125,7 +125,7 @@ function VencordPopoutButton() {
 function ToolboxFragmentWrapper({ children }: { children: ReactNode[]; }) {
     children.splice(
         children.length - 1, 0,
-        <ErrorBoundary noop={true}>
+        <ErrorBoundary noop>
             <VencordPopoutButton />
         </ErrorBoundary>
     );