From efcad679207b1671ff5186bcd9d2fe7629e2a1da Mon Sep 17 00:00:00 2001 From: thororen1234 <78185467+thororen1234@users.noreply.github.com> Date: Mon, 6 Jul 2026 21:00:26 -0400 Subject: [PATCH] FakeProfileThemes: Support New Profile Editor --- packages/discord-types/src/components.d.ts | 6 ++++++ .../_core/concatenatedComponentExtractor.tsx | 12 +++++++++++- src/plugins/decor/index.tsx | 9 --------- src/plugins/decor/ui/components/DecorSection.tsx | 11 +++++------ src/plugins/fakeProfileThemes/index.tsx | 16 +++++++++++++--- src/webpack/common/components.ts | 5 +++++ 6 files changed, 40 insertions(+), 19 deletions(-) diff --git a/packages/discord-types/src/components.d.ts b/packages/discord-types/src/components.d.ts index a207ba755..d88497762 100644 --- a/packages/discord-types/src/components.d.ts +++ b/packages/discord-types/src/components.d.ts @@ -542,3 +542,9 @@ export type ColorPicker = ComponentType<{ onChange(value: number | null): void; disabled?: boolean; }>; + +export type ComponentSection = ComponentType>; diff --git a/src/plugins/_core/concatenatedComponentExtractor.tsx b/src/plugins/_core/concatenatedComponentExtractor.tsx index 7fd23ff77..23682a662 100644 --- a/src/plugins/_core/concatenatedComponentExtractor.tsx +++ b/src/plugins/_core/concatenatedComponentExtractor.tsx @@ -6,7 +6,7 @@ import { Devs } from "@utils/constants"; import definePlugin from "@utils/types"; -import { setColorPicker, setCreateScroller } from "@webpack/common"; +import { setColorPicker, setCreateScroller, setNewCustomizationSection } from "@webpack/common"; export default definePlugin({ name: "ConcatenatedComponentExtractor", @@ -29,9 +29,19 @@ export default definePlugin({ match: /(?=function (\i)\(\i,\i,\i\)\{.{0,20}?return \i\.forwardRef\(function\(\i,\i\)\{let\{[^}]+?="ltr",orientation:)/, replace: "$self.setCreateScroller($1);" } + }, + { + find: '("UserProfileModalV2EditingPanel")', + replacement: [ + { + match: /function (\i).{0,50}showNitroIcon:.{0,450}\}\),\i\]\}\)\}/, + replace: "$&$self.setNewCustomizationSection($1);" + } + ] } ], setCreateScroller, setColorPicker, + setNewCustomizationSection }); diff --git a/src/plugins/decor/index.tsx b/src/plugins/decor/index.tsx index 12528c792..33d20a2ff 100644 --- a/src/plugins/decor/index.tsx +++ b/src/plugins/decor/index.tsx @@ -24,8 +24,6 @@ export interface AvatarDecoration { skuId: string; } -export let NewCustomizationSection; - export default definePlugin({ name: "Decor", description: "Create and use your own custom avatar decorations, or pick your favorite from the presets.", @@ -124,10 +122,6 @@ export default definePlugin({ { find: '("UserProfileModalV2EditingPanel")', replacement: [ - { - match: /function (\i).{0,50}showNitroIcon:.{0,450}\}\),\i\]\}\)\}/, - replace: "$&$self.setNewCustomizationSection($1);" - }, { match: /"inline"===.{0,100}#{intl::Zenogr::raw}\)/, replace: "$self.ExperimentDecorSection(),$&" @@ -187,7 +181,4 @@ export default definePlugin({ (props: DecorSectionProps) => , { noop: true } ), - setNewCustomizationSection(component) { - NewCustomizationSection = component; - } }); diff --git a/src/plugins/decor/ui/components/DecorSection.tsx b/src/plugins/decor/ui/components/DecorSection.tsx index 93aa0f3b8..e31a27d56 100644 --- a/src/plugins/decor/ui/components/DecorSection.tsx +++ b/src/plugins/decor/ui/components/DecorSection.tsx @@ -6,13 +6,12 @@ import { Button } from "@components/Button"; import { Flex } from "@components/Flex"; -import { NewCustomizationSection } from "@plugins/decor"; import { useAuthorizationStore } from "@plugins/decor/lib/stores/AuthorizationStore"; import { useCurrentUserDecorationsStore } from "@plugins/decor/lib/stores/CurrentUserDecorationsStore"; import { cl } from "@plugins/decor/ui"; import { openChangeDecorationModal } from "@plugins/decor/ui/modals/ChangeDecorationModal"; import { findComponentByCodeLazy } from "@webpack"; -import { useEffect } from "@webpack/common"; +import { NewCustomizationSection, useEffect } from "@webpack/common"; const CustomizationSection = findComponentByCodeLazy(".DESCRIPTION", "hasBackground:"); @@ -35,14 +34,14 @@ export default function DecorSection({ hideTitle = false, hideDivider = false, n if (useNewSection && !NewSection) return null; - const Section = useNewSection ? NewSection : CustomizationSection; + const Section = (useNewSection ? NewCustomizationSection : CustomizationSection); const sectionProps = useNewSection - ? { heading: !hideTitle && "Decor" } + ? { heading: hideTitle ? undefined : "Decor" } : { - title: !hideTitle && "Decor", + title: hideTitle ? undefined : "Decor", hasBackground: true, hideDivider, - className: noMargin && cl("section-remove-margin") + className: noMargin ? cl("section-remove-margin") : undefined }; const changeLabel = useNewSection ? "Change" : "Change Decoration"; diff --git a/src/plugins/fakeProfileThemes/index.tsx b/src/plugins/fakeProfileThemes/index.tsx index c0db3f2d4..ab9601dc7 100644 --- a/src/plugins/fakeProfileThemes/index.tsx +++ b/src/plugins/fakeProfileThemes/index.tsx @@ -216,6 +216,16 @@ export default definePlugin({ match: /#{intl::USER_SETTINGS_RESET_PROFILE_THEME}\).+?}\)(?=\])(?<=color:(\i),.{0,500}?color:(\i),.{0,500}?)/, replace: "$&,$self.addCopy3y3Button({primary:$1,accent:$2})" } + }, + // 2026-03-wysiwyg-user-profile-editing + { + find: '("UserProfileModalV2EditingPanel")', + replacement: [ + { + match: /\(0,\i\.jsxs?\)\(\i,\{heading:.{0,40}#{intl::USER_SETTINGS_PROFILE_EFFECT}/, + replace: "$self.addCopy3y3Button(),$&" + } + ] } ], @@ -244,8 +254,8 @@ export default definePlugin({ }} color={Button.Colors.PRIMARY} size={Button.Sizes.XLARGE} - className={Margins.left16} - >Copy 3y3 - ; + > + Copy 3y3 + ; }, { noop: true }), }); diff --git a/src/webpack/common/components.ts b/src/webpack/common/components.ts index f0f5610aa..fc116a19b 100644 --- a/src/webpack/common/components.ts +++ b/src/webpack/common/components.ts @@ -74,6 +74,11 @@ export function setColorPicker(component: t.ColorPicker) { ColorPicker = component; } +export let NewCustomizationSection: t.ComponentSection = () => null; +export function setNewCustomizationSection(component: t.ComponentSection) { + NewCustomizationSection = component; +} + export const UserSummaryItem = waitForComponent("UserSummaryItem", filters.componentByCode("defaultRenderUser", "showDefaultAvatarsForNullUsers")); export let createScroller: ((scrollbarClassName: string, fadeClassName: string, customThemeClassName: string) => t.ScrollerThin) | undefined;