Fix SpotifyControls

src/plugins/spotifyControls/PlayerComponent.tsx

@@ -18,7 +18,6 @@
 
 import "./spotifyStyles.css";
 
-import ErrorBoundary from "@components/ErrorBoundary";
 import { Flex } from "@components/Flex";
 import { ImageIcon, LinkIcon, OpenExternalIcon } from "@components/Icons";
 import { debounce } from "@shared/debounce";
@@ -376,17 +375,10 @@ export function Player() {
     } as React.CSSProperties;
 
     return (
-        <ErrorBoundary fallback={() => (
+        <div id={cl("player")} style={exportTrackImageStyle}>
-            <div className="vc-spotify-fallback">
+            <Info track={track} />
-                <p>Failed to render Spotify Modal :(</p>
+            <SeekBar />
-                <p >Check the console for errors</p>
+            <Controls />
-            </div>
+        </div>
-        )}>
-            <div id={cl("player")} style={exportTrackImageStyle}>
-                <Info track={track} />
-                <SeekBar />
-                <Controls />
-            </div>
-        </ErrorBoundary>
     );
 }

src/plugins/spotifyControls/index.tsx

@@ -18,6 +18,7 @@
 
 import { Settings } from "@api/Settings";
 import { disableStyle, enableStyle } from "@api/Styles";
+import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
 
@@ -49,10 +50,10 @@ export default definePlugin({
         {
             find: "showTaglessAccountPanel:",
             replacement: {
-                // return React.createElement(AccountPanel, { ..., showTaglessAccountPanel: blah })
+                // react.jsx)(AccountPanel, { ..., showTaglessAccountPanel: blah })
-                match: /return ?(.{0,30}\(.{1,3},\{[^}]+?,showTaglessAccountPanel:.+?\}\))/,
+                match: /(?<=\i\.jsxs?\)\()(\i),{(?=[^}]*?showTaglessAccountPanel:)/,
-                // return [Player, Panel]
+                // react.jsx(WrapperComponent, { VencordOriginal: AccountPanel, ...
-                replace: "return [$self.renderPlayer(),$1]"
+                replace: "$self.PanelWrapper,{VencordOriginal:$1,"
             }
         },
         {
@@ -78,6 +79,25 @@ export default definePlugin({
             }
         }
     ],
+
     start: () => toggleHoverControls(Settings.plugins.SpotifyControls.hoverControls),
-    renderPlayer: () => <Player />
+
+    PanelWrapper({ VencordOriginal, ...props }) {
+        return (
+            <>
+                <ErrorBoundary
+                    fallback={() => (
+                        <div className="vc-spotify-fallback">
+                            <p>Failed to render Spotify Modal :(</p>
+                            <p >Check the console for errors</p>
+                        </div>
+                    )}
+                >
+                    <Player />
+                </ErrorBoundary>
+
+                <VencordOriginal {...props} />
+            </>
+        );
+    }
 });