Migrate proxied components to and fix LazyComponent

This commit is contained in:
Vendicated 2022-11-06 18:37:01 +01:00
parent 440baf6028
commit 963a7332b4
No known key found for this signature in database
GPG Key ID: EC781ADFB93EFFA3
6 changed files with 24 additions and 21 deletions

@ -21,10 +21,10 @@ import { Constructor } from "type-fest";
import { generateId } from "../../api/Commands"; import { generateId } from "../../api/Commands";
import { useSettings } from "../../api/settings"; import { useSettings } from "../../api/settings";
import { lazyWebpack, proxyLazy } from "../../utils"; import { LazyComponent, lazyWebpack, proxyLazy } from "../../utils";
import { ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize } from "../../utils/modal"; import { ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, ModalSize } from "../../utils/modal";
import { OptionType, Plugin } from "../../utils/types"; import { OptionType, Plugin } from "../../utils/types";
import { filters } from "../../webpack"; import { filters, findByCode } from "../../webpack";
import { Button, FluxDispatcher, Forms, React, Text, Tooltip, UserStore, UserUtils } from "../../webpack/common"; import { Button, FluxDispatcher, Forms, React, Text, Tooltip, UserStore, UserUtils } from "../../webpack/common";
import ErrorBoundary from "../ErrorBoundary"; import ErrorBoundary from "../ErrorBoundary";
import { Flex } from "../Flex"; import { Flex } from "../Flex";
@ -38,7 +38,7 @@ import {
SettingTextComponent SettingTextComponent
} from "./components"; } from "./components";
const UserSummaryItem = lazyWebpack(filters.byCode("defaultRenderUser", "showDefaultAvatarsForNullUsers")); const UserSummaryItem = LazyComponent(() => findByCode("defaultRenderUser", "showDefaultAvatarsForNullUsers"));
const AvatarStyles = lazyWebpack(filters.byProps("moreUsers", "emptyUser", "avatarContainer", "clickableAvatar")); const AvatarStyles = lazyWebpack(filters.byProps("moreUsers", "emptyUser", "avatarContainer", "clickableAvatar"));
const UserRecord: Constructor<Partial<User>> = proxyLazy(() => UserStore.getCurrentUser().constructor) as any; const UserRecord: Constructor<Partial<User>> = proxyLazy(() => UserStore.getCurrentUser().constructor) as any;

@ -23,10 +23,10 @@ import { Settings, useSettings } from "../../api/settings";
import { startDependenciesRecursive, startPlugin, stopPlugin } from "../../plugins"; import { startDependenciesRecursive, startPlugin, stopPlugin } from "../../plugins";
import { Logger, Modals } from "../../utils"; import { Logger, Modals } from "../../utils";
import { ChangeList } from "../../utils/ChangeList"; import { ChangeList } from "../../utils/ChangeList";
import { classes, lazyWebpack } from "../../utils/misc"; import { classes, LazyComponent, lazyWebpack } from "../../utils/misc";
import { Plugin } from "../../utils/types"; import { Plugin } from "../../utils/types";
import { filters } from "../../webpack"; import { filters, findByCode } from "../../webpack";
import { Alerts, Button, Forms, Margins, Parser, React, Switch, Text, TextInput, Toasts, Tooltip } from "../../webpack/common"; import { Alerts, Button, Forms, Margins, Parser, React, Select, Switch, Text, TextInput, Toasts, Tooltip } from "../../webpack/common";
import ErrorBoundary from "../ErrorBoundary"; import ErrorBoundary from "../ErrorBoundary";
import { ErrorCard } from "../ErrorCard"; import { ErrorCard } from "../ErrorCard";
import { Flex } from "../Flex"; import { Flex } from "../Flex";
@ -35,11 +35,10 @@ import * as styles from "./styles";
const logger = new Logger("PluginSettings", "#a6d189"); const logger = new Logger("PluginSettings", "#a6d189");
const Select = lazyWebpack(filters.byCode("optionClassName", "popoutPosition", "autoFocus", "maxVisibleItems"));
const InputStyles = lazyWebpack(filters.byProps("inputDefault", "inputWrapper")); const InputStyles = lazyWebpack(filters.byProps("inputDefault", "inputWrapper"));
const CogWheel = lazyWebpack(filters.byCode("18.564C15.797 19.099 14.932 19.498 14 19.738V22H10V19.738C9.069")); const CogWheel = LazyComponent(() => findByCode("18.564C15.797 19.099 14.932 19.498 14 19.738V22H10V19.738C9.069"));
const InfoIcon = lazyWebpack(filters.byCode("4.4408921e-16 C4.4771525,-1.77635684e-15 4.4408921e-16")); const InfoIcon = LazyComponent(() => findByCode("4.4408921e-16 C4.4771525,-1.77635684e-15 4.4408921e-16"));
function showErrorToast(message: string) { function showErrorToast(message: string) {
Toasts.show({ Toasts.show({

@ -17,14 +17,13 @@
*/ */
import { Devs } from "../utils/constants"; import { Devs } from "../utils/constants";
import { lazyWebpack, makeLazy } from "../utils/misc"; import { LazyComponent } from "../utils/misc";
import { ModalRoot, ModalSize, openModal } from "../utils/modal"; import { ModalRoot, ModalSize, openModal } from "../utils/modal";
import definePlugin from "../utils/types"; import definePlugin from "../utils/types";
import { find } from "../webpack"; import { find } from "../webpack";
import { React } from "../webpack/common";
const ImageModal = lazyWebpack(m => m.prototype?.render?.toString().includes("OPEN_ORIGINAL_IMAGE")); const ImageModal = LazyComponent(() => find(m => m.prototype?.render?.toString().includes("OPEN_ORIGINAL_IMAGE")));
const getMaskedLink = makeLazy(() => find(m => m.type?.toString().includes("MASKED_LINK)"))); const MaskedLink = LazyComponent(() => find(m => m.type?.toString().includes("MASKED_LINK)")));
const OPEN_URL = "Vencord.Plugins.plugins.ViewIcons.openImage("; const OPEN_URL = "Vencord.Plugins.plugins.ViewIcons.openImage(";
export default definePlugin({ export default definePlugin({
@ -39,7 +38,7 @@ export default definePlugin({
shouldAnimate={true} shouldAnimate={true}
original={url} original={url}
src={url} src={url}
renderLinkComponent={props => React.createElement(getMaskedLink(), props)} renderLinkComponent={() => <MaskedLink />}
/> />
</ModalRoot> </ModalRoot>
)); ));

@ -74,10 +74,11 @@ export function useAwaiter<T>(factory: () => Promise<T>, fallbackValue: T | null
* @param factory Function returning a Component * @param factory Function returning a Component
* @returns Result of factory function * @returns Result of factory function
*/ */
export function LazyComponent<T = any>(factory: () => React.ComponentType<T>) { export function LazyComponent<T extends JSX.IntrinsicAttributes = any>(factory: () => React.ComponentType<T>) {
const get = makeLazy(factory);
return (props: T) => { return (props: T) => {
const Component = React.useMemo(factory, []); const Component = get();
return <Component {...props as any /* I hate react typings ??? */} />; return <Component {...props} />;
}; };
} }

@ -21,8 +21,8 @@ import { User } from "discord-types/general";
import type Other from "discord-types/other"; import type Other from "discord-types/other";
import type Stores from "discord-types/stores"; import type Stores from "discord-types/stores";
import { lazyWebpack } from "../utils/misc"; import { LazyComponent, lazyWebpack } from "../utils/misc";
import { _resolveReady, filters, mapMangledModuleLazy, waitFor } from "./webpack"; import { _resolveReady, filters, findByCode, mapMangledModuleLazy, waitFor } from "./webpack";
export const Margins = lazyWebpack(filters.byProps("marginTop20")); export const Margins = lazyWebpack(filters.byProps("marginTop20"));
export let FluxDispatcher: Other.FluxDispatcher; export let FluxDispatcher: Other.FluxDispatcher;
@ -48,8 +48,8 @@ export let Router: any;
export let TextInput: any; export let TextInput: any;
export let Text: (props: TextProps) => JSX.Element; export let Text: (props: TextProps) => JSX.Element;
export const Select = lazyWebpack(filters.byCode("optionClassName", "popoutPosition", "autoFocus", "maxVisibleItems")); export const Select = LazyComponent(() => findByCode("optionClassName", "popoutPosition", "autoFocus", "maxVisibleItems"));
export const Slider = lazyWebpack(filters.byCode("closestMarkerIndex", "stickToMarkers")); export const Slider = LazyComponent(() => findByCode("closestMarkerIndex", "stickToMarkers"));
export let Parser: any; export let Parser: any;
export let Alerts: { export let Alerts: {

@ -290,6 +290,10 @@ export function findAllByProps(...props: string[]) {
return findAll(filters.byProps(...props)); return findAll(filters.byProps(...props));
} }
export function findByCode(...code: string[]) {
return find(filters.byCode(...code));
}
export function findByDisplayName(deezNuts: string) { export function findByDisplayName(deezNuts: string) {
return find(filters.byDisplayName(deezNuts)); return find(filters.byDisplayName(deezNuts));
} }