bandaid patches for swc

src/renderer/components/card.tsx

@@ -1,98 +1,92 @@
 import "./card.scss";
 import DiscordComponents from "./discord";
+import Icon from "./icons";
 
 const kernel: any = (window as any).kernel;
 const Electron = SettingsNative.requireModule("electron");
 
-export function Icon({name, ...props}) {
-    const IconComponent = DiscordComponents.Icons[name] ?? (() => null);
-    props.size ??= "16";
+export function ToolButton({ label, icon, onClick, danger = false }) {
+  const { Tooltips, Button } = DiscordComponents;
 
-    return (
-        <IconComponent {...props} width={props.size} height={props.size} />
-    );
+  return (
+    <Tooltips text={label} position="top">
+      {(props) => (
+        <Button
+          {...props}
+          className="kernel-toolbutton"
+          look={Button.Looks.BLANK}
+          size={Button.Sizes.NONE}
+          onClick={onClick}
+        >
+          <Icon size="20" name={icon} color={danger ? "#ed4245" : undefined} />
+        </Button>
+      )}
+    </Tooltips>
+  );
 }
 
-export function ToolButton({label, icon, onClick, danger = false}) {
-    const {Tooltips, Button} = DiscordComponents;
+export function SwitchWrapper({ value, onChange, disabled }) {
+  const { Switch } = DiscordComponents;
+  const [isChecked, setChecked] = React.useState(value);
 
-    return (
-        <Tooltips.Tooltip text={label} position="top">
-            {props => (
-                <Button
-                    {...props}
-                    className="kernel-toolbutton"
-                    look={Button.Looks.BLANK}
-                    size={Button.Sizes.NONE}
-                    onClick={onClick}
-                >
-                    <Icon size="20" name={icon} color={danger ? "#ed4245" : undefined} />
-                </Button>
-            )}
-        </Tooltips.Tooltip>
-    );
-}
-
-export function SwitchWrapper({value, onChange, disabled}) {
-    const {Switch} = DiscordComponents;
-    const [isChecked, setChecked] = React.useState(value);
+  return (
+    <Switch
+      checked={isChecked}
+      disabled={disabled}
+      value={value}
+      onChange={React.useCallback(() => {
+        if (disabled) return;
 
-    return (
-        <Switch
-            checked={isChecked}
-            disabled={disabled}
-            onChange={React.useCallback(() => {
-                if (disabled) return;
-
-                onChange(!isChecked);
-                setChecked((value: boolean) => !value);
-            }, [onChange, isChecked])}
-        />
-    );
+        onChange(!isChecked);
+        setChecked((value: boolean) => !value);
+      }, [onChange, isChecked])}
+    />
+  );
 }
 
 export function openItem(path: string) {
-    if (path.endsWith(".asar")) return Electron.showItemInFolder(path);
+  if (path.endsWith(".asar")) return Electron.showItemInFolder(path);
 
-    Electron.openPath(path);
+  Electron.openPath(path);
 }
 
-export default function KernelCard({pkg}) {
-    const {Markdown, Text} = DiscordComponents;
+export default function KernelCard({ pkg }) {
+  const { Markdown, Text } = DiscordComponents;
 
-    return (
-        <div className="kernel-card">
-            <div className="kernel-card-tools">
-                <ToolButton
-                    label="Open Path"
-                    icon="Folder"
-                    onClick={() => openItem(pkg.path)}
-                />
-                <ToolButton
-                    danger
-                    label="Delete"
-                    icon="Trash"
-                    onClick={() => Electron.trashItem(pkg.path)}
-                />
-            </div>
-            <div className="kernel-card-header">
-                <Text className="kernel-card-name">{pkg.name}</Text>
-            </div>
-            {pkg.description != null && (
-                <Text className="kernel-card-desc">
-                    <Markdown>{pkg.description}</Markdown>
-                </Text>
-            )}
-            <div className="kernel-footer">
-                <SwitchWrapper
-                    value={pkg.enabled}
-                    disabled={pkg.id === "kernel-settings"}
-                    onChange={(value: boolean) => {
-                        if (!value) kernel.packages.stopPackage(pkg.id);
-                        else kernel.packages.startPackage(pkg.id);
-                    }}
-                />
-            </div>
-        </div>
-    );
-}
+  return (
+    <div className="kernel-card">
+      <div className="kernel-card-tools">
+        <ToolButton
+          label="Open Path"
+          icon="Folder"
+          onClick={() => openItem(pkg.path)}
+        />
+        <ToolButton
+          danger
+          label="Delete"
+          icon="Trash"
+          onClick={() => Electron.trashItem(pkg.path)}
+        />
+      </div>
+      <div className="kernel-card-header">
+        <Text className="kernel-card-name">{pkg.name}</Text>
+      </div>
+      {pkg.description != null && (
+        <Text className="kernel-card-desc">
+          <Markdown>{pkg.description}</Markdown>
+        </Text>
+      )}
+      <div className="kernel-footer">
+        <SwitchWrapper
+          value={pkg.enabled}
+          enabled={pkg.enabled}
+          disabled={pkg.id === "kernel-settings"}
+          onChange={(value: boolean) => {
+            if (!value) kernel.packages.stopPackage(pkg.id);
+            else kernel.packages.startPackage(pkg.id);
+          }}
+        />
+      </div>
+    </div>
+  );
+}

src/renderer/components/discord.ts

@@ -1,34 +1,19 @@
 import memoize from "../modules/memoize";
-import Webpack from "../modules/webpack";
+import Webpack, { Filters } from "../modules/webpack";
 
 const DiscordComponents = memoize({
     get Button() {return Webpack.findByProps("BorderColors");},
-    get Switch() {return Webpack.findByDisplayName("Switch");},
-    get Markdown() {return Webpack.findModule(m => m.displayName === "Markdown" && "rules" in m);},
-    get Header() {return Webpack.findModule(m => m.displayName === "Header" && "Tags" in m);},
-    get Text() {
-        const names = new Set(["Text", "LegacyText"]);
-
-        return Webpack.findModule(m => names.has(m.displayName));
-    },
-    get Forms() {return Webpack.findByProps("FormItem", "FormTitle");},
-    get Spinner() {return Webpack.findByDisplayName("Spinner");},
-    get Flex() {return Webpack.findByDisplayName("Flex");},
-    get Link() {return Webpack.findByDisplayName("Anchor");},
-    get Icons() {
-        const icons = Webpack.findModules(m => typeof m === "function" && m.displayName && m.toString().indexOf("currentColor") > -1);
-
-        return Object.fromEntries(icons.map(icon => [icon.displayName, icon]));
-    },
-    get Tooltips() {
-        const TooltipModule = Webpack.findByProps("TooltipContainer");
-
-        return {
-            Container: TooltipModule.TooltipContainer,
-            Tooltip: TooltipModule.default,
-            ...TooltipModule
-        };
-    }
+    get Switch() {return Webpack.findModule(m => typeof m === 'function' && Filters.byCode('helpdeskArticleId')(m));},
+    get Markdown() {return Webpack.findModule(m => m?.prototype?.render && m.rules);},
+    get Text() {return Webpack.findModule(m => m.Sizes?.SIZE_24 && m.Colors?.LINK);},
+    get Spinner() {return Webpack.findModule(m => m.Type?.SPINNING_CIRCLE);},
+    get Flex() {return Webpack.findByProps("Child", "Align");},
+    get Link() {return Webpack.findModule(m => typeof m === 'function' && Filters.byCode('href', 'anchor')(m));},
+    get FormTitle() {return Webpack.findModule(m => m.Tags && Filters.byCode('errorSeparator')(m));},
+    get FormNotice() {return Webpack.findModule(m => m.Types && Filters.byCode('formNoticeTitle', 'formNoticeBody')(m));},
+    get FormDivider() {return Webpack.findModule(m => typeof m === 'function' && (m = m.toString()) && m.length < 200 && m.includes('divider'));},
+    get FormItem() {return Webpack.findModule(m => m.Tags && Filters.byCode('children', 'createElement', 'disabled', 'tag', 'title')(m));},
+    get Tooltips() {return Webpack.findByProps("Positions", "Colors");}
 });
 
-export default DiscordComponents;
+export default DiscordComponents;

src/renderer/components/icons/folder.tsx

@@ -0,0 +1,10 @@
+export default function Folder(props: any) {
+    return (
+        <svg width='24' height='24' viewBox='0 0 512 512' {...props}>
+            <path
+                fill='currentColor'
+                d='M464 128H272l-64-64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V176c0-26.51-21.49-48-48-48z'
+            />
+        </svg>
+    );
+}

src/renderer/components/icons/index.tsx

@@ -0,0 +1,32 @@
+import Trash from './trash';
+import Folder from './folder';
+import Shield from './shield';
+import UpdateAvailable from './update_available';
+
+export const Icons = {
+    Trash,
+    Folder,
+    Shield,
+    UpdateAvailable,
+};
+
+export default function Icon({
+    name,
+    ...props
+}: {
+    name: keyof typeof Icons;
+    size?: string | number;
+    className?: string;
+}) {
+    const IconComponent = Icons[name];
+    const extraProps: any = {};
+
+    if (!IconComponent) {
+        return null;
+    }
+    if (props.size) {
+        extraProps.width = extraProps.height = props.size;
+    }
+
+    return <IconComponent {...props} {...extraProps} />;
+}

src/renderer/components/icons/trash.tsx

@@ -0,0 +1,21 @@
+export default function Trash(props: any) {
+    return (
+        <svg
+            width='24'
+            height='24'
+            viewBox='0 0 24 24'
+            xmlns='http://www.w3.org/2000/svg'
+            {...props}
+        >
+            <path d="M0 0h24v24H0z" fill="none" />
+            <path
+                d='M15 3.999V2H9V3.999H3V5.999H21V3.999H15Z'
+                fill='currentColor'
+            />
+            <path
+                d='M5 6.99902V18.999C5 20.101 5.897 20.999 7 20.999H17C18.103 20.999 19 20.101 19 18.999V6.99902H5ZM11 17H9V11H11V17ZM15 17H13V11H15V17Z'
+                fill='currentColor'
+            />
+        </svg>
+    );
+}

src/renderer/components/panel.tsx

@@ -5,7 +5,7 @@ import "./panel.scss";
 const kernel: any = (window as any).kernel;
 
 export default function KernelPanel() {
-    const {Forms: {FormTitle}} = DiscordComponents;
+    const {FormTitle} = DiscordComponents;
 
     return (
         <div className="kernel-panel">
@@ -17,4 +17,4 @@ export default function KernelPanel() {
             </div>
         </div>
     );
-}
+}

src/renderer/components/updates.tsx

@@ -73,7 +73,7 @@ let needsReload = false;
 export default function UpdaterPanel() {
     const {Moment} = DiscordModules;
     const [errorMessage, setError] = React.useState(null);
-    const {Link, Button, Text, Flex, Forms: {FormTitle, FormNotice, FormDivider, FormItem}, Spinner} = DiscordComponents;
+    const {Link, Button, Text, Flex, FormTitle, FormNotice, FormDivider, FormItem, Spinner} = DiscordComponents;
     const git = useGitCommand<boolean>(() => Git.isInstalled());
     const updates = useGitCommand<Commit[]>(async () => {
         if (!git.loaded || !git.result) return [];
@@ -222,4 +222,4 @@ export default function UpdaterPanel() {
             </Show>
         </div>
     );
-}
+}

src/renderer/modules/settings.ts

@@ -57,7 +57,7 @@ export namespace SettingsRenderer {
         if (initialized) return;
         initialized = true;
 
-        const SettingsView = await Webpack.findLazy(Webpack.Filters.byDisplayName("SettingsView"));
+        const SettingsView = await Webpack.findLazy(Webpack.Filters.byPrototype("getPredicateSections"));
 
         if (!win["__kernel_settings_cache__"]) Patcher.patch(SettingsView.prototype, "getPredicateSections", function (_, res) {
             if (!Array.isArray(res) || !res.some(e => e?.section?.toLowerCase() === "changelog") || res.some(s => s?.id === "kernel-settings")) return;
@@ -72,4 +72,4 @@ export namespace SettingsRenderer {
             win["__kernel_settings_cache__"] = panels;
         });
     };
-}
+}

src/renderer/modules/webpack.ts

@@ -26,6 +26,13 @@ export class Filters {
     static byTypeString(...strings: string[]) {
         return (module: any) => module.type && (module = module.type?.toString()) && strings.every(str => module.indexOf(str) > -1);
     }
+    static byCode(...strings: string[]) {
+        return (module: any) => (module = module.toString()) && strings.every(str => module.indexOf(str) > -1);
+    }
+    static byPrototype(...props: string[]) {
+        const filter = Filters.byProps(...props);
+        return (module: any) => module.prototype && filter(module.prototype);
+    }
 }
 
 export type ModuleFilter = (module: any, index: number) => boolean;
@@ -167,7 +174,7 @@ class WebpackModule {
         return req;
     }
 
-    findModule(filter: ModuleFilter, {all = false, cache = true, force = false, default: defaultExports = false} = {}) {
+    findModule(filter: ModuleFilter, {all = false, cache = true, force = true, default: defaultExports = false} = {}) {
         if (typeof (filter) !== "function") return void 0;
 
         const __webpack_require__ = this.request(cache);
@@ -195,7 +202,7 @@ class WebpackModule {
                         found.push(module);
                     }
 
-                    if (module.__esModule &&
+                    if (/* module.__esModule && */
                         module.default != null &&
                         typeof module.default !== "number" &&
                         wrapFilter(module.default, id)
@@ -205,7 +212,7 @@ class WebpackModule {
                         found.push(exports);
                     }
 
-                    if (force && module.__esModule) for (const key in module) {
+                    if (force /* && module.__esModule */) for (const key in module) {
                         if (!module[key]) continue;
 
                         if (wrapFilter(module[key], id)) {