Merge remote-tracking branch 'upstream/dev' into dev

package.json

@@ -1,7 +1,7 @@
 {
     "name": "equicord",
     "private": "true",
-    "version": "1.14.10.1",
+    "version": "1.14.11.0",
     "description": "The other cutest Discord client mod",
     "homepage": "https://github.com/Equicord/Equicord#readme",
     "bugs": {

src/plugins/callTimer/index.tsx

@@ -138,8 +138,8 @@ export default definePlugin({
         {
             find: "renderConnectionStatus(){",
             replacement: {
-                match: /(renderConnectionStatus\(\).{0,1000}?,children:)(\i)(?=,|}\))/,
-                replace: "$1[$2,$self.renderConnectionTimer(this.props.channel.id)]"
+                match: /(renderConnectionStatus\(\).{0,1000}?lineClamp:1,children:)(\i)(?=,|}\))/,
+                replace: "$1[$2,$self.renderConnectionTimer(this.props?.channel?.id)]"
             }
         }
     ],

src/plugins/shikiCodeblocks.desktop/components/Highlighter.tsx

@@ -22,9 +22,9 @@ import { shiki } from "@plugins/shikiCodeblocks.desktop/api/shiki";
 import { useShikiSettings } from "@plugins/shikiCodeblocks.desktop/hooks/useShikiSettings";
 import { useTheme } from "@plugins/shikiCodeblocks.desktop/hooks/useTheme";
 import { hex2Rgb } from "@plugins/shikiCodeblocks.desktop/utils/color";
-import { cl, hljs, shouldUseHljs } from "@plugins/shikiCodeblocks.desktop/utils/misc";
+import { cl, hljs, requireHljs, shouldUseHljs } from "@plugins/shikiCodeblocks.desktop/utils/misc";
 import { useAwaiter, useIntersection } from "@utils/react";
-import { React } from "@webpack/common";
+import { React, useEffect } from "@webpack/common";
 
 import { ButtonRow } from "./ButtonRow";
 import { Code } from "./Code";
@@ -43,13 +43,25 @@ export interface HighlighterProps {
     isPreview: boolean;
 }
 
-export const createHighlighter = (props: HighlighterProps) => (
-    <pre className={cl("container")}>
-        <ErrorBoundary>
-            <Highlighter {...props} />
-        </ErrorBoundary>
-    </pre>
-);
+let didLoadHljs = false;
+export const HighlighterContainer = (props: HighlighterProps) => {
+    const [_, _err, isPending] = useAwaiter(requireHljs);
+
+    useEffect(() => {
+        if (!isPending) didLoadHljs = true;
+    }, [isPending]);
+
+    if (!didLoadHljs && isPending) return null;
+
+    return (
+        <pre className={cl("container")}>
+            <ErrorBoundary>
+                <Highlighter {...props} />
+            </ErrorBoundary>
+        </pre>
+    );
+};
+
 export const Highlighter = ({
     lang,
     content,

src/plugins/shikiCodeblocks.desktop/index.tsx

@@ -24,12 +24,11 @@ import definePlugin, { ReporterTestable } from "@utils/types";
 import previewExampleText from "file://previewExample.tsx";
 
 import { shiki } from "./api/shiki";
-import { createHighlighter } from "./components/Highlighter";
+import { HighlighterContainer } from "./components/Highlighter";
 import deviconStyle from "./devicon.css?managed";
 import { settings } from "./settings";
 import { DeviconSetting } from "./types";
 import { clearStyles } from "./utils/createStyle";
-import { requireHljs } from "./utils/misc";
 
 export default definePlugin({
     name: "ShikiCodeblocks",
@@ -55,6 +54,7 @@ export default definePlugin({
             }
         }
     ],
+
     start: async () => {
         if (settings.store.useDevIcon !== DeviconSetting.Disabled)
             enableStyle(deviconStyle);
@@ -65,21 +65,12 @@ export default definePlugin({
         shiki.destroy();
         clearStyles();
     },
-    settingsAboutComponent: () => createHighlighter({
-        lang: "tsx",
-        content: previewExampleText,
-        isPreview: true
-    }),
+
+    settingsAboutComponent: () => <HighlighterContainer lang="tsx" content={previewExampleText} isPreview />,
 
     // exports
     shiki,
-    createHighlighter,
     renderHighlighter: ({ lang, content }: { lang: string; content: string; }) => {
-        requireHljs();
-        return createHighlighter({
-            lang,
-            content,
-            isPreview: false,
-        });
+        return <HighlighterContainer lang={lang?.toLowerCase()} content={content} isPreview={false} />;
     },
 });

src/plugins/showHiddenChannels/index.tsx

@@ -170,7 +170,7 @@ export default definePlugin({
             replacement: {
                 // Lock Icon
                 match: /(?<=(\i)\.isNSFW\(\);)switch\(\i\.type\)/,
-                replace: (_, channel) => `if($self.isHiddenChannel(${channel}))return $self.LockIcon;${_}`
+                replace: (m, channel) => `if($self.isHiddenChannel(${channel}))return $self.LockIcon;${m}`
             }
         },
         {