diff --git a/src/plugins/betterFolders/index.tsx b/src/plugins/betterFolders/index.tsx index ef12ff8f..56a71ab8 100644 --- a/src/plugins/betterFolders/index.tsx +++ b/src/plugins/betterFolders/index.tsx @@ -50,6 +50,35 @@ function closeFolders() { FolderUtils.toggleGuildFolderExpand(id); } +// Nuckyz: Unsure if this should be a general utility or not +function filterTreeWithTargetNode(children: any, predicate: (node: any) => boolean) { + if (children == null) { + return false; + } + + if (!Array.isArray(children)) { + if (predicate(children)) { + return true; + } + + return filterTreeWithTargetNode(children.props?.children, predicate); + } + + + let childIsTargetChild = false; + for (let i = 0; i < children.length; i++) { + const shouldKeep = filterTreeWithTargetNode(children[i], predicate); + if (shouldKeep) { + childIsTargetChild = true; + continue; + } + + children.splice(i--, 1); + } + + return childIsTargetChild; +} + export const settings = definePluginSettings({ sidebar: { type: OptionType.BOOLEAN, @@ -124,54 +153,30 @@ export default definePlugin({ match: /let{disableAppDownload:\i=\i\.isPlatformEmbedded,isOverlay:.+?(?=}=\i,)/, replace: "$&,isBetterFolders" }, - // Discord extacts the folders component, we need to pass the isBetterFolders and betterFoldersExpandedIds variable to it + // Export the isBetterFolders and betterFoldersExpandedIds variable to the Guild List component { - match: /0,\i\.jsxs?[^0}]{0,100}guildDiscoveryButton:\i,/g, + match: /,{guildDiscoveryButton:\i,/g, replace: "$&isBetterFolders:arguments[0]?.isBetterFolders,betterFoldersExpandedIds:arguments[0]?.betterFoldersExpandedIds," }, + // Export the isBetterFolders variable to the folders component + { + match: /switch\(\i\.type\){case \i\.\i\.FOLDER:.+?folderNode:\i,/, + replace: '$&isBetterFolders:typeof isBetterFolders!=="undefined"?isBetterFolders:false,' + }, // If we are rendering the Better Folders sidebar, we filter out guilds that are not in folders and unexpanded folders { match: /\[(\i)\]=(\(0,\i\.\i\).{0,40}getGuildsTree\(\).+?}\))(?=,)/, replace: (_, originalTreeVar, rest) => `[betterFoldersOriginalTree]=${rest},${originalTreeVar}=$self.getGuildTree(!!arguments[0]?.isBetterFolders,betterFoldersOriginalTree,arguments[0]?.betterFoldersExpandedIds)` }, - // If we are rendering the Better Folders sidebar, we filter out everything but the servers and folders from the GuildsBar Guild List children + // If we are rendering the Better Folders sidebar, we filter out everything but the servers and folders from the Guild List children { match: /lastTargetNode:\i\[\i\.length-1\].+?}\)(?::null)?\](?=}\))/, replace: "$&.filter($self.makeGuildsBarGuildListFilter(!!arguments[0]?.isBetterFolders))" }, - // If we are rendering the Better Folders sidebar, we filter out everything but the scroller for the guild list from the GuildsBar Tree children - { - match: /lurkingGuildIds:\i\}\)\](?=\}\)\})/, - replace: "$&.filter($self.makeGuildsBarTreeFilter(!!arguments[0]?.isBetterFolders))" - }, - // With one of the sidebar versions, there is a sticky top bar. Don't render it if we are rendering the Better Folders sidebar - { - // [^0] to not match any other JSX call - match: /(?=\(0,\i\.jsxs?\)[^0]+\.topSection)/, - replace: "!!arguments[0]?.isBetterFolders?null:" - }, - // Don't render the tiny separator line at the top of the Better Folders sidebar - // Only needed with the sidebar variant with the sticky top bar - { - match: /(?=\(0,\i\.jsxs?\)[^0]+fullWidth:)/, - replace: "!!arguments[0]?.isBetterFolders?null:" - }, - // On the other sidebar version, dms are rendered separately. - // We need to filter them out - { - match: /fullWidth:!0.+?lurkingGuildIds.+?\]/, - replace: "$&.filter($self.makeGuildsBarTreeFilter(!!arguments[0]?.isBetterFolders))" - }, - // if you click the (NEW) button on the better folders sidebar - // it will end up in some infinite loop + // If we are rendering the Better Folders sidebar, we filter out everything but the Guild List from the Sidebar children { match: /unreadMentionsFixedFooter\].+?\]/, - replace: "$&.filter($self.makeNewButtonFilter(!!arguments[0]?.isBetterFolders))" - }, - // Export the isBetterFolders variable to the folders component - { - match: /switch\(\i\.type\){case \i\.\i\.FOLDER:.+?folderNode:\i,/, - replace: '$&isBetterFolders:typeof isBetterFolders!=="undefined"?isBetterFolders:false,' + replace: "$&.filter($self.makeGuildsBarSidebarFilter(!!arguments[0]?.isBetterFolders))" } ] }, @@ -216,13 +221,13 @@ export default definePlugin({ // If we are rendering the normal GuildsBar sidebar, we avoid rendering guilds from folders that are expanded { predicate: () => !settings.store.keepIcons, - match: /folderGroupBackground.*?,(?=\i\(\(\i,\i,\i\)=>{let{key.+?"ul")(?<=selected:\i,expanded:(\i),.+?)/, + match: /folderGroupBackground.+?,(?=\i\(\(\i,\i,\i\)=>{let{key:.{0,70}"ul")(?<=selected:\i,expanded:(\i),.+?)/, replace: (m, isExpanded) => `${m}$self.shouldRenderContents(arguments[0],${isExpanded})?null:` }, // Decide if we should render the expanded folder background if we are rendering the Better Folders sidebar { predicate: () => settings.store.showFolderIcon !== FolderIconDisplay.Always, - match: /\.isExpanded].{0,110}children:\[/, + match: /\.isExpanded\].{0,110}children:\[/, replace: "$&$self.shouldShowFolderIconAndBackground(!!arguments[0]?.isBetterFolders,arguments[0]?.betterFoldersExpandedIds)&&" }, // Decide if we should render the expanded folder icon if we are rendering the Better Folders sidebar @@ -309,6 +314,9 @@ export default definePlugin({ } }, + FolderSideBar, + closeFolders, + gridStyle: "vc-betterFolders-sidebar-grid", getGuildTree(isBetterFolders: boolean, originalTree: any, expandedFolderIds?: Set) { @@ -330,27 +338,38 @@ export default definePlugin({ makeGuildsBarGuildListFilter(isBetterFolders: boolean) { return child => { - if (!isBetterFolders) return true; + if (!isBetterFolders) { + return true; + } try { return child?.props?.["aria-label"] === getIntlMessage("SERVERS"); } catch (e) { console.error(e); + return true; } - - return true; }; }, - makeGuildsBarTreeFilter(isBetterFolders: boolean) { + makeGuildsBarSidebarFilter(isBetterFolders: boolean) { return child => { - if (!isBetterFolders) return true; - return !!child?.props?.renderTreeNode; + if (!isBetterFolders) { + return true; + } + + try { + return filterTreeWithTargetNode(child, child => child?.props?.renderTreeNode != null); + } catch (e) { + console.error(e); + return true; + } }; }, shouldShowFolderIconAndBackground(isBetterFolders: boolean, expandedFolderIds?: Set) { - if (!isBetterFolders) return true; + if (!isBetterFolders) { + return true; + } switch (settings.store.showFolderIcon) { case FolderIconDisplay.Never: @@ -384,8 +403,5 @@ export default definePlugin({ if (props?.folderNode?.id === 1) return false; return !props?.isBetterFolders && isExpanded; - }, - - FolderSideBar, - closeFolders, + } }); diff --git a/src/plugins/imageZoom/components/Magnifier.tsx b/src/plugins/imageZoom/components/Magnifier.tsx index 009165ff..2acd0259 100644 --- a/src/plugins/imageZoom/components/Magnifier.tsx +++ b/src/plugins/imageZoom/components/Magnifier.tsx @@ -203,7 +203,7 @@ export const Magnifier = ErrorBoundary.wrap(({ instance, size: i }} width={`${box.width * zoom.current}px`} height={`${box.height * zoom.current}px`} - src={instance.props.src} + src={instance.props.src + "?animated=true"} alt="" /> )} diff --git a/src/plugins/mutualGroupDMs/index.tsx b/src/plugins/mutualGroupDMs/index.tsx index 42f4f2e3..f06cac0c 100644 --- a/src/plugins/mutualGroupDMs/index.tsx +++ b/src/plugins/mutualGroupDMs/index.tsx @@ -59,22 +59,21 @@ function renderClickableGDMs(mutualDms: Channel[], onClose: () => void) { return mutualDms.map(c => ( { onClose(); SelectedChannelActionCreators.selectPrivateChannel(c.id); }} > -
- - -
-
{getGroupDMName(c)}
-
{c.recipients.length + 1} Members
-
+ + +
+
{getGroupDMName(c)}
+
{c.recipients.length + 1} Members
)); diff --git a/src/plugins/plainFolderIcon/index.ts b/src/plugins/plainFolderIcon/index.ts index 5870d7e6..8eb87896 100644 --- a/src/plugins/plainFolderIcon/index.ts +++ b/src/plugins/plainFolderIcon/index.ts @@ -16,27 +16,27 @@ * along with this program. If not, see . */ -import "./styles.css"; +import "./style.css"; import { Devs } from "@utils/constants"; import definePlugin from "@utils/types"; export default definePlugin({ name: "PlainFolderIcon", - description: "Doesn't show the small guild icons in folders", + description: "Dont show the small guild icons in folders", authors: [Devs.botato], - folderClassName: "vc-plainFolderIcon-plain", + patches: [ + { + find: ".folderPreviewGuildIconError", + replacement: [ + { + // Discord always renders both plain and guild icons folders and uses a css transtion to switch between them + match: /(?<=.folderButtonContent]:(!\i))/, + replace: (_, hasFolderButtonContentClass) => `,"vc-plainFolderIcon-plain":${hasFolderButtonContentClass}` + } - patches: [{ - find: ".folderPreviewGuildIconError", - replacement: [ - { - // Discord always renders both and uses a css transtion to switch bewteen them - match: /.folderButtonContent]:(!\i)/, - replace: (m, cond) => `${m},[$self.folderClassName]:${cond}` - } - - ] - }] + ] + } + ] }); diff --git a/src/plugins/plainFolderIcon/style.css b/src/plugins/plainFolderIcon/style.css new file mode 100644 index 00000000..70a49078 --- /dev/null +++ b/src/plugins/plainFolderIcon/style.css @@ -0,0 +1,10 @@ +.vc-plainFolderIcon-plain { + /* Without this, they are a bit laggier */ + transition: none !important; + + /* Don't show the mini guild icons */ + transform: translateZ(0); + + /* The new icons are fully transparent. Add a sane default to match the old behavior */ + background-color: color-mix(in oklab, var(--custom-folder-color, var(--bg-brand)) 30%, var(--background-surface-higher) 70%); +} diff --git a/src/plugins/reviewDB/index.tsx b/src/plugins/reviewDB/index.tsx index f45da089..79affb4e 100644 --- a/src/plugins/reviewDB/index.tsx +++ b/src/plugins/reviewDB/index.tsx @@ -80,23 +80,23 @@ export default definePlugin({ { find: ".POPOUT,user:", replacement: { - match: /(children:\[)([^[]+shouldShowTooltip:)/, - replace: "$1$self.BiteSizeReviewsButton({user:arguments[0].user}),$2" + match: /children:\[(?=[^[]+?shouldShowTooltip:)/, + replace: "$&$self.BiteSizeReviewsButton({user:arguments[0].user})," } }, { find: ".MODAL,user:", replacement: { - match: /(children:\[)([^[]+shouldShowTooltip:)/, - replace: "$1$self.BiteSizeReviewsButton({user:arguments[0].user}),$2" + match: /children:\[(?=[^[]+?shouldShowTooltip:)/, + replace: "$&$self.BiteSizeReviewsButton({user:arguments[0].user})," } }, // places like the user profile on the right in dms { - find: 'location:"UserProfileSiebar"', + find: ".SIDEBAR,shouldShowTooltip:", replacement: { - match: /(children:\[)([^[]+shouldShowTooltip:)/, - replace: "$1$self.BiteSizeReviewsButton({user:arguments[0].user}),$2" + match: /children:\[(?=[^[]+?shouldShowTooltip:)/, + replace: "$&$self.BiteSizeReviewsButton({user:arguments[0].user})," } } ], diff --git a/src/plugins/showHiddenChannels/index.tsx b/src/plugins/showHiddenChannels/index.tsx index 3c55295c..b1a47c6c 100644 --- a/src/plugins/showHiddenChannels/index.tsx +++ b/src/plugins/showHiddenChannels/index.tsx @@ -357,7 +357,7 @@ export default definePlugin({ ] }, { - find: ".SIZE_24,overflowCountVariant:", + find: '="interactive-normal",overflowCountClassName:', replacement: [ { // Create a variable for the channel prop @@ -366,20 +366,21 @@ export default definePlugin({ }, { // Make Discord always render the plus button if the component is used inside the HiddenChannelLockScreen - match: /\i>0(?=&&.{0,60}Math.min)/, + match: /\i>0(?=&&.{0,30}Math.min)/, replace: m => `($self.isHiddenChannel(typeof shcChannel!=="undefined"?shcChannel:void 0,true)?true:${m})` }, { // Prevent Discord from overwriting the last children with the plus button // if the overflow amount is <= 0 and the component is used inside the HiddenChannelLockScreen - match: /(?<=\i\.length-)1(?=\]=.{0,60}renderPopout)(?<=(\i)=\i\.length-\i.*)/, + match: /(?<=\i\.length-)1(?=\]=.{0,60}renderPopout)(?<=(\i)=\i\.length-\i.+?)/, replace: (_, amount) => `($self.isHiddenChannel(typeof shcChannel!=="undefined"?shcChannel:void 0,true)&&${amount}<=0?0:1)` }, { // Show only the plus text without overflowed children amount // if the overflow amount is <= 0 and the component is used inside the HiddenChannelLockScreen - match: /(?<="\+"\.concat\()(\i)/, - replace: (m, amount) => `$self.isHiddenChannel(typeof shcChannel!=="undefined"?shcChannel:void 0,true)&&${amount}<=0?"":${m}` + match: /(?<="\+"\.concat\()\i/, + replace: overflowTextAmount => "" + + `$self.isHiddenChannel(typeof shcChannel!=="undefined"?shcChannel:void 0,true)&&(${overflowTextAmount}-1)<=0?"":${overflowTextAmount}` } ] },