From 035e2add0b26c0d8cdd61c8450a37c992de805f7 Mon Sep 17 00:00:00 2001 From: Nuckyz <61953774+Nuckyz@users.noreply.github.com> Date: Wed, 8 May 2024 06:44:18 -0300 Subject: [PATCH] Fix MoreUserTags freezing the client --- src/plugins/moreUserTags/index.tsx | 17 ++++++------- src/utils/lazyReact.tsx | 8 +++++++ src/webpack/webpack.tsx | 38 ++++++++++++++++++++++++++++++ 3 files changed, 55 insertions(+), 8 deletions(-) diff --git a/src/plugins/moreUserTags/index.tsx b/src/plugins/moreUserTags/index.tsx index 3728b4404..b48f6ccfc 100644 --- a/src/plugins/moreUserTags/index.tsx +++ b/src/plugins/moreUserTags/index.tsx @@ -55,7 +55,8 @@ const PermissionUtil = findByProps("computePermissions", "canEveryoneRole") as { computePermissions({ ...args }): bigint; }; -const Tag = findComponentByCode(".DISCORD_SYSTEM_MESSAGE_BOT_TAG_TOOLTIP,") as React.ComponentType<{ type?: number, className?: string, useRemSizes?: boolean; }> & { Types: Record; }; +const Tag = findComponentByCode(".DISCORD_SYSTEM_MESSAGE_BOT_TAG_TOOLTIP,") as React.ComponentType<{ type?: number, className?: string, useRemSizes?: boolean; }>; +const { BotTagTypes } = findByProps("BotTagTypes"); const isWebhook = (message: Message, user: User) => !!message?.webhookId && user.isNonUserBot(); @@ -116,7 +117,7 @@ function SettingsComponent(props: { setValue(v: any): void; }) { onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} > - {t.displayName} Tag + {t.displayName} Tag )} @@ -316,7 +317,7 @@ export default definePlugin({ return obj; }, - isOPTag: (tag: number) => tag === Tag.Types.ORIGINAL_POSTER || tags.some(t => tag === Tag.Types[`${t.name}-OP`]), + isOPTag: (tag: number) => tag === BotTagTypes.ORIGINAL_POSTER || tags.some(t => tag === BotTagTypes[`${t.name}-OP`]), getTagText(passedTagName: string, strings: Record) { if (!passedTagName) return strings.APP_TAG; @@ -349,9 +350,9 @@ export default definePlugin({ if (!user) return null; if (location === "chat" && user.id === "1") - return Tag.Types.OFFICIAL; + return BotTagTypes.OFFICIAL; if (user.isClyde()) - return Tag.Types.AI; + return BotTagTypes.AI; let type = typeof origType === "number" ? origType : null; @@ -370,11 +371,11 @@ export default definePlugin({ (tag.condition?.(message!, user, channel)) ) { if (channel.isForumPost() && channel.ownerId === user.id) - type = Tag.Types[`${tag.name}-OP`]; + type = BotTagTypes[`${tag.name}-OP`]; else if (user.bot && !isWebhook(message!, user) && !settings.dontShowBotTag) - type = Tag.Types[`${tag.name}-BOT`]; + type = BotTagTypes[`${tag.name}-BOT`]; else - type = Tag.Types[tag.name]; + type = BotTagTypes[tag.name]; break; } } diff --git a/src/utils/lazyReact.tsx b/src/utils/lazyReact.tsx index acc538ce1..719ce4262 100644 --- a/src/utils/lazyReact.tsx +++ b/src/utils/lazyReact.tsx @@ -8,6 +8,14 @@ import { makeLazy } from "./lazy"; /** * A lazy component. The factory method is called on first render. + * + * IMPORTANT: You cannot access properties set on the lazy component using this method. + * + * Example of how you cannot access the properties set on the component: + * ``` + * const Component = LazyComponent(...); + * console.log(Component.Types); // This will not work + * ```` * @param factory Function returning a component * @param attempts How many times to try to get the component before giving up * @returns Result of factory function diff --git a/src/webpack/webpack.tsx b/src/webpack/webpack.tsx index d3a3577cb..158faf348 100644 --- a/src/webpack/webpack.tsx +++ b/src/webpack/webpack.tsx @@ -182,6 +182,14 @@ export function find(filter: FilterFn, callback: (mod: any) => any = m /** * Find the first component that matches the filter. + * + * IMPORTANT: You cannot access properties set on the found component using this method. You should instead try to obtain the property using a non component find instead. + * + * Example of how you cannot access the properties set on the component: + * ``` + * const Component = findComponent(...); + * console.log(Component.Types); // This will not work + * ```` * @param filter A function that takes a module and returns a boolean * @param parse A function that takes the found component as its first argument and returns a component. Useful if you want to wrap the found component in something. Defaults to the original component * @returns The component if found, or a noop component @@ -226,6 +234,13 @@ export function findComponent(filter: FilterFn, parse: ( /** * Find the first component that is exported by the first prop name. * + * IMPORTANT: You cannot access properties set on the found component using this method. You should instead try to obtain the property using a non component find instead. + * + * Example of how you cannot access the properties set on the component: + * ``` + * const Component = findExportedComponent(...); + * console.log(Component.Types); // This will not work + * ```` * @example findExportedComponent("FriendRow") * @example findExportedComponent("FriendRow", "Friend", FriendRow => React.memo(FriendRow)) * @@ -271,6 +286,13 @@ export function findExportedComponent(...props: string[] /** * Find the first component in a default export that includes all the given code. * + * IMPORTANT: You cannot access properties set on the found component using this method. You should instead try to obtain the property using a non component find instead. + * + * Example of how you cannot access the properties set on the component: + * ``` + * const Component = findComponentByCode(...); + * console.log(Component.Types); // This will not work + * ```` * @example findComponentByCode(".Messages.USER_SETTINGS_PROFILE_COLOR_SELECT_COLOR") * @example findComponentByCode(".Messages.USER_SETTINGS_PROFILE_COLOR_SELECT_COLOR", ".BACKGROUND_PRIMARY)", ColorPicker => React.memo(ColorPicker)) * @@ -507,6 +529,14 @@ export function webpackDependantLazy(factory: () => any, attempts?: num * This is just a wrapper around {@link LazyComponent} to make our reporter test for your webpack finds. * * A lazy component. The factory method is called on first render. + * + * IMPORTANT: You cannot access properties set on the lazy component using this method. + * + * Example of how you cannot access the properties set on the component: + * ``` + * const Component = webpackDependantLazyComponent(...); + * console.log(Component.Types); // This will not work + * ```` * @param factory Function returning a Component * @param attempts How many times to try to get the component before giving up * @returns Result of factory function @@ -543,6 +573,14 @@ export const proxyLazyWebpack = deprecatedRedirect("proxyLazyWebpack", "webpackD * This is just a wrapper around {@link LazyComponent} to make our reporter test for your webpack finds. * * A lazy component. The factory method is called on first render. + * + * IMPORTANT: You cannot access properties set on the lazy component using this method. + * + * Example of how you cannot access the properties set on the component: + * ``` + * const Component = LazyComponentWebpack(...); + * console.log(Component.Types); // This will not work + * ```` * @param factory Function returning a Component * @param attempts How many times to try to get the component before giving up * @returns Result of factory function