Temp Fix Better Folders

src/equicordplugins/wallpaperFree/components/ctxmenu.tsx

@@ -8,8 +8,7 @@ import { NavContextMenuPatchCallback } from "@api/ContextMenu";
 import { openModal } from "@utils/modal";
 import { ChannelStore, FluxDispatcher, Menu } from "@webpack/common";
 
-import { SetCustomWallpaperModal, SetDiscordWallpaperModal } from "./modal";
+import { SetWallpaperModal } from "./modal";
-import { ChatWallpaperStore, fetchWallpapers } from "./util";
 
 
 const addWallpaperMenu = (channelId?: string, guildId?: string) => {
@@ -22,25 +21,18 @@ const addWallpaperMenu = (channelId?: string, guildId?: string) => {
             url,
         });
     };
+
     return (
         <Menu.MenuItem label="Wallpaper Free" key="vc-wpfree-menu" id="vc-wpfree-menu">
             <Menu.MenuItem
-                label="Set custom wallpaper"
+                label="Set Wallpaper"
-                id="vc-wpfree-set-custom"
+                id="vc-wpfree-set-wallpaper"
-                action={() => openModal(props => <SetCustomWallpaperModal props={props} onSelect={setWallpaper} />)}
+                action={() => openModal(props => <SetWallpaperModal props={props} onSelect={setWallpaper} />)}
-            />
-            <Menu.MenuItem
-                label="Set a Discord wallpaper"
-                id="vc-wpfree-set-discord"
-                action={async () => {
-                    ChatWallpaperStore.shouldFetchWallpapers && await fetchWallpapers();
-                    openModal(props => <SetDiscordWallpaperModal props={props} onSelect={setWallpaper} />);
-                }}
             />
             <Menu.MenuSeparator />
             <Menu.MenuItem
-                label="Remove Custom Wallpaper"
+                label="Remove Wallpaper"
-                id="vc-wpfree-remove"
+                id="vc-wpfree-remove-wallpaper"
                 color="danger"
                 action={() => setWallpaper(void 0)}
             />

src/equicordplugins/wallpaperFree/components/modal.tsx

@@ -5,38 +5,37 @@
  */
 
 import { ModalContent, ModalHeader, ModalProps, ModalRoot, ModalSize } from "@utils/modal";
-import { Button, lodash, Text, TextInput, useState, useStateFromStores } from "@webpack/common";
+import { Button, Text, TextInput, useState } from "@webpack/common";
-
-import { ChatWallpaperStore, Wallpaper } from "./util";
 
 interface Props {
     props: ModalProps;
     onSelect: (url: string) => void;
 }
 
-export function SetCustomWallpaperModal({ props, onSelect }: Props) {
+export function SetWallpaperModal({ props, onSelect }: Props) {
     const [url, setUrl] = useState("");
 
     return (
         <ModalRoot {...props} size={ModalSize.SMALL}>
             <ModalHeader>
                 <Text variant="heading-lg/normal" style={{ marginBottom: 8 }}>
-                    Set a custom wallpaper
+                    Set wallpaper
                 </Text>
             </ModalHeader>
             <ModalContent>
                 <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
-
+                    <Text>The image url</Text>
                     <TextInput
-                        placeholder="The image url"
                         value={url}
-                        onChange={setUrl}
+                        onChange={u => {
+                            setUrl(u);
+                        }}
                         autoFocus
                     />
                     {url && (
                         <img
+                            alt=""
                             src={url}
-                            alt="Wallpaper preview"
                             style={{
                                 display: "block",
                                 width: "100%",
@@ -60,57 +59,6 @@ export function SetCustomWallpaperModal({ props, onSelect }: Props) {
                     </div>
                 </div>
             </ModalContent>
-        </ModalRoot>
+        </ModalRoot >
     );
 }
-
-export function SetDiscordWallpaperModal({ props, onSelect }: Props) {
-    const discordWallpapers: Wallpaper[] = useStateFromStores([ChatWallpaperStore], () => ChatWallpaperStore.wallpapers);
-
-    return (
-        <ModalRoot {...props} size={ModalSize.MEDIUM}>
-            <ModalHeader>
-                <Text variant="heading-lg/normal" style={{ marginBottom: 8 }}>
-                    Choose a Discord Wallpaper
-                </Text>
-            </ModalHeader>
-            <ModalContent>
-                <div className="vc-wpfree-discord-wp-modal">
-                    {lodash.chunk(discordWallpapers, 2).map(group => {
-                        const main = group[0];
-                        return (
-                            <div key={main.id} className="vc-wpfree-discord-wp-icon-container">
-                                <figure style={{ margin: 0, textAlign: "center" }}>
-                                    <img
-                                        className="vc-wpfree-discord-wp-icon-img"
-                                        src={`https://cdn.discordapp.com/assets/content/${main.default.icon}`}
-                                        alt={main.label}
-                                    />
-                                    <figcaption>
-                                        <Text variant="text-md/normal">{main.label}</Text>
-                                    </figcaption>
-                                </figure>
-                                <div className="vc-wpfree-discord-set-buttons">
-                                    {group.map(wp => (
-                                        <Button
-                                            key={wp.id}
-                                            size={Button.Sizes.SMALL}
-                                            color={Button.Colors.BRAND}
-                                            onClick={() => {
-                                                onSelect(`https://cdn.discordapp.com/assets/content/${wp.default.asset}`);
-                                                props.onClose();
-                                            }}
-                                        >
-                                            {wp.isBlurred ? "Blurred" : "Normal"}
-                                        </Button>
-                                    ))}
-                                </div>
-                            </div>
-                        );
-                    })}
-                </div>
-            </ModalContent>
-        </ModalRoot>
-    );
-}
-

src/equicordplugins/wallpaperFree/components/util.tsx

@@ -6,13 +6,9 @@
 
 import { openModal } from "@utils/modal";
 import { makeCodeblock } from "@utils/text";
-import { findByCodeLazy, findStoreLazy } from "@webpack";
 import { Button, FluxDispatcher, Parser } from "@webpack/common";
 
-import { SetCustomWallpaperModal, SetDiscordWallpaperModal } from "./modal";
+import { SetWallpaperModal } from "./modal";
-
-export const ChatWallpaperStore = findStoreLazy("ChatWallpaperStore");
-export const fetchWallpapers = findByCodeLazy('type:"FETCH_CHAT_WALLPAPERS_SUCCESS"');
 
 export function GlobalDefaultComponent() {
     const setGlobal = (url?: string) => {
@@ -26,13 +22,8 @@ export function GlobalDefaultComponent() {
     return (
         <>
             <Button onClick={() => {
-                openModal(props => <SetCustomWallpaperModal props={props} onSelect={setGlobal} />);
+                openModal(props => <SetWallpaperModal props={props} onSelect={setGlobal} />);
-            }}>Set a global custom wallpaper</Button>
+            }}>Set a global wallpaper</Button>
-
-            <Button onClick={async () => {
-                ChatWallpaperStore.shouldFetchWallpapers && await fetchWallpapers();
-                openModal(props => <SetDiscordWallpaperModal props={props} onSelect={setGlobal} />);
-            }}>Set a global Discord wallpaper</Button>
 
             <Button
                 color={Button.Colors.RED}
@@ -52,30 +43,10 @@ export function GlobalDefaultComponent() {
 
 export function TipsComponent() {
     const tipText = `
-    [class^=wallpaperContainer] {
+    .vc-wpfree-wp-container {
         transform: scaleX(-1); /* flip it horizontally */
         filter: blur(4px); /* apply a blur */
         opacity: 0.7; /* self-explanatory */
     }`;
     return Parser.parse(makeCodeblock(tipText, "css"));
 }
-
-export interface Wallpaper {
-    id: string;
-    label: string;
-    default: Default;
-    variants: Variants;
-    isBlurred: boolean;
-    designGroupId: string;
-}
-
-export interface Default {
-    asset: string;
-    icon: string;
-    thumbhash: string;
-    opacity?: number;
-}
-
-export interface Variants {
-    dark: Default;
-}

src/equicordplugins/wallpaperFree/index.tsx

@@ -7,59 +7,47 @@
 import "./styles.css";
 
 import { definePluginSettings } from "@api/Settings";
+import { ErrorBoundary } from "@components/index";
 import { Devs } from "@utils/constants";
 import definePlugin, { OptionType } from "@utils/types";
 import { useStateFromStores } from "@webpack/common";
 import { Channel } from "discord-types/general";
 
 import { ChannelContextPatch, GuildContextPatch, UserContextPatch } from "./components/ctxmenu";
-import { GlobalDefaultComponent, TipsComponent, Wallpaper } from "./components/util";
+import { GlobalDefaultComponent, TipsComponent } from "./components/util";
 import { WallpaperFreeStore } from "./store";
 
 
-const settings = definePluginSettings({
+export const settings = definePluginSettings({
-    forceReplace: {
+    globalDefault: {
-        description: "If a dm wallpaper is already set, your custom wallpaper will be used instead.",
+        description: "Set a global default wallpaper for all channels.",
-        type: OptionType.BOOLEAN,
+        type: OptionType.COMPONENT,
-        default: false,
+        component: GlobalDefaultComponent
     },
     stylingTips: {
         description: "",
         type: OptionType.COMPONENT,
         component: TipsComponent,
-    },
-    globalDefault: {
-        description: "Set a global default wallpaper for all channels.",
-        type: OptionType.COMPONENT,
-        component: GlobalDefaultComponent
     }
 });
 
 export default definePlugin({
     name: "WallpaperFree",
     authors: [Devs.Joona],
-    description: "Use the DM wallpapers anywhere or set a custom wallpaper",
+    description: "Recreation of the old DM wallpaper experiment; Set a background image for any channel or server.",
     patches: [
         {
-            find: ".wallpaperContainer,",
+            find: ".handleSendMessage,onResize",
             group: true,
             replacement: [
                 {
-                    match: /return null==(\i).+?\?null:/,
+                    match: /return.{1,150},(?=keyboardModeEnabled)/,
-                    replace: "const vcWpFreeCustom = $self.customWallpaper(arguments[0].channel,$1);return !($1||vcWpFreeCustom)?null:"
+                    replace: "const vcWallpaperFreeUrl=$self.WallpaperState(arguments[0].channel);$&vcWallpaperFreeUrl,"
                 },
                 {
-                    match: /,{chatWallpaperState:/,
+                    match: /}\)]}\)](?=.{1,30}messages-)/,
-                    replace: "$&vcWpFreeCustom||"
+                    replace: "$&.toSpliced(0,0,$self.Wallpaper({url:this.props.vcWallpaperFreeUrl}))"
-                },
+                }
-                {
-                    match: /(\i)=(.{1,50}asset.+?(?=,\i=))(?=.+?concat\(\1)/,
-                    replace: "$1=arguments[0].chatWallpaperState.vcWallpaperUrl||($2)"
-                },
-                {
-                    match: /(\i\.isViewable&&)(null!=\i)/,
-                    replace: "$1($2||arguments[0].chatWallpaperState.vcWallpaperUrl)"
-                },
             ]
         }
     ],
@@ -71,21 +59,17 @@ export default definePlugin({
         "guild-context": GuildContextPatch,
         "gdm-context": ChannelContextPatch,
     },
-    customWallpaper(channel: Channel, wp: Wallpaper | undefined) {
+    Wallpaper({ url }: { url: string; }) {
-        const { forceReplace } = settings.use(["forceReplace"]);
+        // no we cant place the hook here
-        const url = useStateFromStores([WallpaperFreeStore], () => WallpaperFreeStore.getUrl(channel));
+        if (!url) return null;
 
-        if (!forceReplace && wp?.id)
+        return <ErrorBoundary noop>
-            return wp;
+            <div className="wallpaperContainer vc-wpfree-wp-container" style={{
-
+                backgroundImage: `url(${url})`,
-        if (url) {
+            }}></div>
-            return {
+        </ErrorBoundary>;
-                wallpaperId: "id",
-                vcWallpaperUrl: url,
-                isViewable: true,
-            };
-        }
-
-        return void 0;
     },
+    WallpaperState(channel: Channel) {
+        return useStateFromStores([WallpaperFreeStore], () => WallpaperFreeStore.getUrl(channel));
+    }
 });

src/equicordplugins/wallpaperFree/styles.css

@@ -1,30 +1,8 @@
-.vc-wpfree-discord-wp-modal {
+.vc-wpfree-wp-container,
-    display: grid;
+.wallpaperContainer {
-    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    background-position: 100% 100%;
-    gap: 24px;
+    background-repeat: no-repeat;
-    padding: 8px 0;
+    background-size: cover;
-}
+    inset: 0;
-
+    position: absolute;
-.vc-wpfree-discord-wp-icon-container {
-    border-radius: 10px;
-    box-shadow: 0 2px 8px rgb(0 0 0 / 8%);
-    padding: 16px;
-    display: flex;
-    flex-direction: column;
-    align-items: center
-}
-
-.vc-wpfree-discord-wp-icon-img {
-    width: 120px;
-    height: 68px;
-    object-fit: cover;
-    border-radius: 6px;
-    margin-bottom: 8px;
-    border: 1px solid var(--background-modifier-accent);
-}
-
-.vc-wpfree-discord-set-buttons {
-    display: flex;
-    gap: 8px;
-    margin-top: 12px
 }

src/plugins/betterFolders/index.tsx

@@ -20,7 +20,6 @@ import "./style.css";
 
 import { definePluginSettings } from "@api/Settings";
 import { Devs } from "@utils/constants";
-import { getIntlMessage } from "@utils/discord";
 import definePlugin, { OptionType } from "@utils/types";
 import { findByPropsLazy, findLazy, findStoreLazy } from "@webpack";
 import { FluxDispatcher } from "@webpack/common";
@@ -350,7 +349,7 @@ export default definePlugin({
             }
 
             try {
-                return child?.props?.["aria-label"] === getIntlMessage("SERVERS");
+                return child?.props?.renderTreeNode !== null;
             } catch (e) {
                 console.error(e);
                 return true;
@@ -365,7 +364,7 @@ export default definePlugin({
             }
 
             try {
-                return filterTreeWithTargetNode(child, child => child?.props?.renderTreeNode != null);
+                return filterTreeWithTargetNode(child, child => child?.props?.role === "tree");
             } catch (e) {
                 console.error(e);
                 return true;
@@ -390,14 +389,6 @@ export default definePlugin({
         }
     },
 
-    makeNewButtonFilter(isBetterFolders: boolean) {
-        return child => {
-            if (!isBetterFolders) return true;
-
-            return !child?.props?.barClassName;
-        };
-    },
-
     shouldShowTransition(props: any) {
         // Pending guilds
         if (props?.folderNode?.id === 1) return true;