bunch of stuff

- fix preview
- fix settings
- update headers
- add readme

src/plugins/customFolderIcons/README.md

@@ -0,0 +1,7 @@
+# CustomFolderIcons
+
+Allows you to set custom images/svgs as folder icons
+
+Available as "Change Icon" in the folder context menu
+
+TODO: upload example images (in *pss#general)

src/plugins/customFolderIcons/components.tsx

@@ -1,6 +1,6 @@
 /*
  * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
+ * Copyright (c) 2024 sadan
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
@@ -9,17 +9,20 @@ import { Button, Menu, Slider, TextInput, useState } from "@webpack/common";
 
 import { folderProp } from ".";
 import settings, { folderIconsData } from "./settings";
-import { int2rgba, setFolderUrl } from "./util";
+import { int2rgba, setFolderData } from "./util";
 
 export function ImageModal(folderProps: folderProp) {
-    const [data, setData] = useState("");
+    const [data, setData] = useState(((settings.store.folderIcons ?? {}) as folderIconsData)[folderProps.folderId]?.url ?? "");
     const [size, setSize] = useState(100);
     return (
         <>
-            <TextInput onChange={(val, _n) => {
+            <TextInput
-                setData(val);
+                // this looks like a horrorshow
-            }}
+                defaultValue={data}
-            placeholder="https://example.com/image.png"
+                onChange={(val, _n) => {
+                    setData(val);
+                }}
+                placeholder="https://example.com/image.png"
             >
             </TextInput>
             <RenderPreview folderProps={folderProps} url={data} size={size} />
@@ -34,13 +37,14 @@ export function ImageModal(folderProps: folderProp) {
                     }}
                     maxValue={200}
                     minValue={25}
+                    // [25, 200]
                     markers={Array.apply(0, Array(176)).map((_, i) => i + 25)}
                     stickToMarkers={true}
                     keyboardStep={1}
                     renderMarker={() => null} />
             </>}
             <Button onClick={() => {
-                setFolderUrl(folderProps, {
+                setFolderData(folderProps, {
                     url: data,
                     size: size
                 });
@@ -67,18 +71,18 @@ export function ImageModal(folderProps: folderProp) {
 export function RenderPreview({ folderProps, url, size }: { folderProps: folderProp; url: string; size: number; }) {
     if (!url) return null;
     return (
-        <div style={{
+        <div className="test1234" style={{
             width: "20vh",
             height: "20vh",
-            borderRadius: "24px",
+            overflow: "hidden",
+            // 16/48
+            borderRadius: "33%",
             backgroundColor: int2rgba(folderProps.folderColor, 0.4),
             display: "flex",
             justifyContent: "center",
             alignItems: "center"
         }}>
-            <img src={url} width={`${size}%`} height={`${size}%`} style={{
+            <img src={url} width={`${size}%`} height={`${size}%`} />
-                // borderRadius: "24px",
-            }} />
         </div>
     );
 }

src/plugins/customFolderIcons/index.tsx

@@ -1,6 +1,6 @@
 /*
  * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
+ * Copyright (c) 2024 sadan
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
@@ -63,10 +63,3 @@ export default definePlugin({
         }
     }
 });
-export function handleUpdateError(e: any) {
-    showNotification({
-        title: "CustomFolderIcons: Error",
-        body: "An error has occurred. Check the console for more info."
-    });
-    console.error(e);
-}

src/plugins/customFolderIcons/settings.tsx

@@ -1,11 +1,11 @@
 /*
  * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
+ * Copyright (c) 2024 sadan
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
 import { definePluginSettings } from "@api/Settings";
-import { IPluginOptionComponentProps, OptionType } from "@utils/types";
+import { OptionType } from "@utils/types";
 
 export interface folderIcon{
     url: string,
@@ -17,17 +17,8 @@ const settings = definePluginSettings({
     folderIcons: {
         type: OptionType.COMPONENT,
         hidden: true,
-        description: "guh",
+        description: "folder icon settings",
-        component: props => <>
+        component: () => <></>
-            <FolderIconsSettings
-                setValue={props.setValue}
-                setError={props.setError}
-                option={props.option}
-            />
-        </>
     }
 });
 export default settings;
-function FolderIconsSettings(props: IPluginOptionComponentProps): JSX.Element {
-    return <></>;
-}

src/plugins/customFolderIcons/util.tsx

@@ -1,23 +1,18 @@
 /*
  * Vencord, a Discord client mod
- * Copyright (c) 2024 Vendicated and contributors
+ * Copyright (c) 2024 sadan
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
 import { folderProp } from ".";
 import settings, { folderIcon, folderIconsData } from "./settings";
 
-export async function setFolderUrl(props: folderProp, newData: folderIcon) {
+export async function setFolderData(props: folderProp, newData: folderIcon) {
-    // FIXME: https://canary.discord.com/channels/1015060230222131221/1032770730703716362/1256504513125158924
     if(!settings.store.folderIcons){
         settings.store.folderIcons = {};
     }
     const folderSettings = (settings.store.folderIcons as folderIconsData);
-    const data = folderSettings[props.folderId] ?? {} as folderIcon;
+    folderSettings[props.folderId] = newData;
-    for (const k in newData){
-        data[k] = newData[k];
-    }
-    folderSettings[props.folderId] = data;
 }
 
 /**