update customColors / sidebarchat (icon) (#220)

yeaah

src/equicordplugins/customUserColors/SetColorModal.tsx

@@ -63,7 +63,7 @@ export function SetColorModal({ userId, modalProps }: { userId: string, modalPro
             <ModalContent className={cl("modal-content")} onKeyDown={handleKey}>
                 <section className={Margins.bottom16}>
                     <Forms.FormTitle tag="h3">
-                        Pick a color
+                        Pick a Color
                     </Forms.FormTitle>
                     <ColorPicker
                         color={colorPickerColor}

src/equicordplugins/customUserColors/index.tsx

@@ -21,12 +21,26 @@ import { SetColorModal } from "./SetColorModal";
 export const DATASTORE_KEY = "equicord-customcolors";
 export let colors: Record<string, string> = {};
 
+
 (async () => {
     colors = await get<Record<string, string>>(DATASTORE_KEY) || {};
 })();
 
 // needed for color picker to be available without opening settings (ty pindms!!)
 const requireSettingsMenu = extractAndLoadChunksLazy(['name:"UserSettings"'], /createPromise:.{0,20}(\i\.\i\("?.+?"?\).*?).then\(\i\.bind\(\i,"?(.+?)"?\)\).{0,50}"UserSettings"/);
+const ColorIcon = () => {
+    return (
+        <svg
+            viewBox="0 0 20 20"
+            fill="currentColor"
+            aria-hidden="true"
+            width="18"
+            height="18"
+        >
+            <path d="m9.17 12.67 2.16 2.16a1 1 0 0 0 .99.25l2.57-.75A3 3 0 0 0 16.6 13l4.91-8.05a1.8 1.8 0 0 0-2.47-2.47L11 7.39a3 3 0 0 0-1.32 1.72l-.75 2.57a1 1 0 0 0 .25.99ZM8.03 13.14c.27.07.51.23.7.43l1.7 1.7c.2.19.36.43.43.7A4 4 0 0 1 7 21H2a1 1 0 1 1 0-2c.68 0 1.13-.77 1.04-1.44a4 4 0 0 1 5-4.42Z" />
+        </svg>
+    );
+};
 
 const userContextMenuPatch: NavContextMenuPatchCallback = (children, { user }: { user: User; }) => {
     if (user?.id == null) return;
@@ -35,6 +49,7 @@ const userContextMenuPatch: NavContextMenuPatchCallback = (children, { user }: {
         <Menu.MenuItem
             label="Set Color"
             id="set-color"
+            icon={ColorIcon}
             action={async () => {
                 await requireSettingsMenu();
                 openModal(modalProps => <SetColorModal userId={user.id} modalProps={modalProps} />);

src/equicordplugins/sidebarChat/index.tsx

@@ -34,7 +34,19 @@ const Resize = findComponentByCodeLazy("sidebarType:", "homeSidebarWidth");
 const ChannelHeader = findComponentByCodeLazy("#{intl::HUB_DIRECTORY_CHANNEL_TITLE}");
 const ChatInputTypes = findByPropsLazy("FORM", "NORMAL");
 const Sidebars = findByPropsLazy("ThreadSidebar", "MessageRequestSidebar");
-
+const SidebarIcon = () => {
+    return (
+        <svg
+            viewBox="0 0 20 20"
+            fill="currentColor"
+            aria-hidden="true"
+            width="18"
+            height="18"
+        >
+            <path d="M2.75 3.02A3 3 0 0 1 5 2h10a3 3 0 0 1 3 3v7.64c0 .44-.55.7-.95.55a3 3 0 0 0-3.17 4.93l.02.03a.5.5 0 0 1-.35.85h-.05a.5.5 0 0 0-.5.5 2.5 2.5 0 0 1-3.68 2.2l-5.8-3.09A3 3 0 0 1 2 16V5a3 3 0 0 1 .76-1.98Zm1.3 1.95A.04.04 0 0 0 4 5v11c0 .36.2.68.49.86l5.77 3.08a.5.5 0 0 0 .74-.44V8.02a.5.5 0 0 0-.32-.46l-6.63-2.6Z" />
+        </svg>
+    );
+};
 
 interface ContextMenuProps {
     channel: Channel;
@@ -43,7 +55,7 @@ interface ContextMenuProps {
 }
 
 const ArrowsLeftRightIcon = findComponentByCodeLazy("18.58V3a1");
-const XSmallIcon = findComponentByCodeLazy("13.42l5.3");
+const XSmallIcon = findComponentByCodeLazy("12l4.94-4.94a1.5")
 
 function MakeContextCallback(name: "user" | "channel"): NavContextMenuPatchCallback {
     return (children, { user, channel, guildId }: ContextMenuProps) => {
@@ -58,6 +70,7 @@ function MakeContextCallback(name: "user" | "channel"): NavContextMenuPatchCallb
             <Menu.MenuItem
                 id={`vc-sidebar-chat-${name}`}
                 label={"Open Sidebar Chat"}
+                icon={SidebarIcon}
                 action={() => {
                     FluxDispatcher.dispatch({
                         // @ts-ignore
@@ -122,7 +135,7 @@ export default definePlugin({
                         <>
                             <HeaderBarIcon
                                 icon={() => <ArrowsLeftRightIcon style={{ transform: "rotate(90deg)" }} />}
-                                tooltip="Switch channels"
+                                tooltip="Switch Channels"
                                 onClick={() => {
                                     const currentChannel = ChannelStore.getChannel(SelectedChannelStore.getChannelId());
                                     FluxDispatcher.dispatch({
@@ -136,7 +149,7 @@ export default definePlugin({
                                 }}
                             />
                             <HeaderBarIcon
-                                icon={XSmallIcon}
+                                icon={() => (<XSmallIcon style={{width: "24px",height: "24px"}} />)}
                                 tooltip="Close Sidebar Chat"
                                 onClick={() => {
                                     FluxDispatcher.dispatch({