diff --git a/src/components/PluginSettings/components/SettingArrayComponent.tsx b/src/components/PluginSettings/components/SettingArrayComponent.tsx index 3a7581950..60083d51b 100644 --- a/src/components/PluginSettings/components/SettingArrayComponent.tsx +++ b/src/components/PluginSettings/components/SettingArrayComponent.tsx @@ -4,18 +4,27 @@ * SPDX-License-Identifier: GPL-3.0-or-later */ +import { classNameFactory } from "@api/Styles"; import ErrorBoundary from "@components/ErrorBoundary"; import { Flex } from "@components/Flex"; import { Margins } from "@utils/margins"; import { wordsFromCamel, wordsToTitle } from "@utils/text"; import { OptionType, PluginOptionList } from "@utils/types"; -import { findComponentByCodeLazy } from "@webpack"; -import { Button, ChannelStore, Forms, GuildStore, React, TextInput, useState } from "@webpack/common"; -import { Channel } from "discord-types/general"; +import { findByCodeLazy, findComponentByCodeLazy } from "@webpack"; +import { Avatar, Button, ChannelStore, Forms, GuildStore, IconUtils, React, Text, TextInput, useState } from "@webpack/common"; +import { Channel, Guild } from "discord-types/general"; +import { JSX } from "react"; import { ISettingElementProps } from "."; +const cl = classNameFactory("vc-plugin-modal-"); + const UserMentionComponent = findComponentByCodeLazy(".USER_MENTION)"); +const getDMChannelIcon = findByCodeLazy(".getChannelIconURL({"); +const GroupDMAvatars = findComponentByCodeLazy(".AvatarSizeSpecs[", "getAvatarURL"); + + +// FIXME saving is broken, so are indexes apparently? const CloseIcon = () => { return ; + + }; + const removeItem = (index: number) => { if (items.length === 1) { setItems([]); @@ -62,13 +95,149 @@ export function SettingArrayComponent({ pluginSettings[id] = items; }; - function wrapChannel(id: string) { - const channel = ChannelStore.getChannel(id) as Channel; - if (!channel) { - return "Unknown Channel"; - } - return (GuildStore.getGuild(channel.guild_id)?.name ?? "Unknown Guild") + " - " + channel.name; + function renderGuildView() { + return items.map(item => GuildStore.getGuild(item)) + .map((guild, index) => ( + + {guild ? ( +
+ + {guildIcon(guild)} + {guild.name} + +
+ ) : {"Unknown Guild"}} + {removeButton(index)} + + )); } + + function renderChannelView() { + + const getChannelSymbol = (type: number) => { + switch (type) { + case 2: + return ; + + case 5: + return ; + + case 13: + return ; + + case 15: + return ; + + default: // Text channel icon + return ; + } + }; + + // collapsible guild list with channels in it + const channels: Record = {}; + const dmChannels: Channel[] = []; + const elements: JSX.Element[] = []; + for (const item of items) { + const channel = ChannelStore.getChannel(item); + if (!channel) { + continue; + } + if (channel.isDM() || channel.isGroupDM()) { + dmChannels.push(channel); + continue; + } + if (!channels[channel.guild_id]) { + channels[channel.guild_id] = []; + } + channels[channel.guild_id].push(channel); + } + + if (dmChannels.length > 0) { + elements.push( +
+ DMs +
+ {dmChannels.map((channel, index) => ( + + + {channel.recipients.length >= 2 && channel.icon == null ? ( + + ) : ( + + )} + {channel.name} + {removeButton(index)} + + + ))} +
+
+ ); + } + Object.keys(channels).forEach(guildId => { + const guild = GuildStore.getGuild(guildId); + elements.push( +
+ {!guild ? Unknown Guild : ( + + + {guildIcon(guild)} + {guild.name} + + + )} +
+ {channels[guildId].map((channel, index) => ( + + + {getChannelSymbol(channel.type)} + {channel.name} + {removeButton(index)} + + + ))} +
+
+ ); + }); + return elements; + } + function handleSubmit() { const inputElement = document.getElementById(`vc-plugin-modal-input-${option.type === OptionType.CHANNELS ? "channel" : option.type === OptionType.GUILDS ? "guild" : option.type === OptionType.USERS ? "user" : "string"}`) as HTMLInputElement; if (!inputElement || inputElement.value === "") { @@ -79,8 +248,17 @@ export function SettingArrayComponent({ setError("Value is not a valid snowflake ID"); return; } + + if (items.includes(inputElement.value)) { + setError("This item is already added"); + inputElement.value = ""; + return; + } + setItems([...items, inputElement.value]); + console.log(pluginSettings[id]); pluginSettings[id] = items; + console.log(pluginSettings[id]); inputElement.value = ""; } @@ -90,10 +268,11 @@ export function SettingArrayComponent({ {wordsToTitle(wordsFromCamel(id))} {option.description} - - {items.map((item, index) => ( + {option.type === OptionType.ARRAY || option.type === OptionType.USERS ? + items.map((item, index) => ( - ) : option.type === OptionType.CHANNELS ? ( - {wrapChannel(item)} - ) : option.type === OptionType.GUILDS ? ( - - {GuildStore.getGuild(item)?.name || "Unknown Guild"} - - // TODO add logo to guild and channel? ) : ( - {item} + {item} )} - + {removeButton(index)} - ))} - + + - - + + + - - {error && {error}} ); diff --git a/src/plugins/_api/settingArrays.tsx b/src/plugins/_api/settingArrays.tsx index 35b31c0b1..7f2ae0916 100644 --- a/src/plugins/_api/settingArrays.tsx +++ b/src/plugins/_api/settingArrays.tsx @@ -53,10 +53,12 @@ function renderRegisteredPlugins(name: string, value: any) { {plugins[plugin].map(setting => ( handleCheckboxClick(plugin, setting)} @@ -104,9 +106,11 @@ export default definePlugin({ contextMenus: { "channel-context": MakeContextCallback("Channel"), "thread-context": MakeContextCallback("Channel"), + "gdm-context": MakeContextCallback("Channel"), // TODO make this work "guild-context": MakeContextCallback("Guild"), "user-context": MakeContextCallback("User") }, + required: true, start() { for (const plugin of Object.values(Vencord.Plugins.plugins)) { diff --git a/src/plugins/messageLogger/index.tsx b/src/plugins/messageLogger/index.tsx index f192f6677..cd57294e7 100644 --- a/src/plugins/messageLogger/index.tsx +++ b/src/plugins/messageLogger/index.tsx @@ -205,7 +205,7 @@ export default definePlugin({ name: "MessageLogger", description: "Temporarily logs deleted and edited messages.", authors: [Devs.rushii, Devs.Ven, Devs.AutumnVN, Devs.Nickyux, Devs.Kyuuhachi], - dependencies: ["MessageUpdaterAPI", "SettingArraysAPI"], + dependencies: ["MessageUpdaterAPI"], contextMenus: { "message": patchMessageContextMenu,