From 6875ff0d9fe4a7977aea972f4eb162b9b4ef10f4 Mon Sep 17 00:00:00 2001 From: Masterjoona <69722179+Masterjoona@users.noreply.github.com> Date: Mon, 29 Jul 2024 21:22:40 +0300 Subject: [PATCH 1/6] A pr was wanted --- src/plugins/UnreadCountBadge/README.md | 3 +++ src/plugins/UnreadCountBadge/index.tsx | 36 +++++++++++++++++++++++++ src/plugins/UnreadCountBadge/styles.css | 3 +++ 3 files changed, 42 insertions(+) create mode 100644 src/plugins/UnreadCountBadge/README.md create mode 100644 src/plugins/UnreadCountBadge/index.tsx create mode 100644 src/plugins/UnreadCountBadge/styles.css diff --git a/src/plugins/UnreadCountBadge/README.md b/src/plugins/UnreadCountBadge/README.md new file mode 100644 index 000000000..bd9a8eb32 --- /dev/null +++ b/src/plugins/UnreadCountBadge/README.md @@ -0,0 +1,3 @@ +Show a badge in the channel list for unread messages. + +![image](https://github.com/user-attachments/assets/fdec8682-8db6-4a24-be48-b13a16ad9d00) diff --git a/src/plugins/UnreadCountBadge/index.tsx b/src/plugins/UnreadCountBadge/index.tsx new file mode 100644 index 000000000..20a7736fe --- /dev/null +++ b/src/plugins/UnreadCountBadge/index.tsx @@ -0,0 +1,36 @@ +/* + * Vencord, a Discord client mod + * Copyright (c) 2024 Vendicated and contributors + * SPDX-License-Identifier: GPL-3.0-or-later + */ + +import ErrorBoundary from "@components/ErrorBoundary"; +import { Devs } from "@utils/constants"; +import definePlugin from "@utils/types"; +import { findByPropsLazy } from "@webpack"; +import { ReadStateStore, useStateFromStores } from "@webpack/common"; +const { NumberBadge } = findByPropsLazy("NumberBadge"); + +import "./styles.css"; + +export default definePlugin({ + name: "UnreadCountBadge", + authors: [Devs.Joona], + description: "Show unread count in the channel list", + patches: [ + // Kanged from typingindicators + { + find: "UNREAD_IMPORTANT:", + replacement: { + match: /\.name\),.{0,120}\.children.+?:null(?<=,channel:(\i).+?)/, + replace: "$&,$self.CountBadge({channelId:$1.id})" + } + }, + ], + + CountBadge: ErrorBoundary.wrap(({ channelId }: { channelId: string; }) => { + const unreadCount = useStateFromStores([ReadStateStore], () => ReadStateStore.getUnreadCount(channelId)); + if (!unreadCount) return null; + return ; + }, { noop: true }) +}); diff --git a/src/plugins/UnreadCountBadge/styles.css b/src/plugins/UnreadCountBadge/styles.css new file mode 100644 index 000000000..b13bcd8b0 --- /dev/null +++ b/src/plugins/UnreadCountBadge/styles.css @@ -0,0 +1,3 @@ +.unreadCountBadge { + margin-left: 4px; +} From 58b8aee4260f693c4236d976274496e9159cec3d Mon Sep 17 00:00:00 2001 From: Masterjoona <69722179+Masterjoona@users.noreply.github.com> Date: Wed, 31 Jul 2024 12:15:01 +0000 Subject: [PATCH 2/6] Follow style guides, support for threads, and some settings --- src/plugins/UnreadCountBadge/README.md | 3 - src/plugins/UnreadCountBadge/index.tsx | 36 ---------- src/plugins/unreadCountBadge/README.md | 5 ++ src/plugins/unreadCountBadge/index.tsx | 66 +++++++++++++++++++ .../styles.css | 2 +- 5 files changed, 72 insertions(+), 40 deletions(-) delete mode 100644 src/plugins/UnreadCountBadge/README.md delete mode 100644 src/plugins/UnreadCountBadge/index.tsx create mode 100644 src/plugins/unreadCountBadge/README.md create mode 100644 src/plugins/unreadCountBadge/index.tsx rename src/plugins/{UnreadCountBadge => unreadCountBadge}/styles.css (51%) diff --git a/src/plugins/UnreadCountBadge/README.md b/src/plugins/UnreadCountBadge/README.md deleted file mode 100644 index bd9a8eb32..000000000 --- a/src/plugins/UnreadCountBadge/README.md +++ /dev/null @@ -1,3 +0,0 @@ -Show a badge in the channel list for unread messages. - -![image](https://github.com/user-attachments/assets/fdec8682-8db6-4a24-be48-b13a16ad9d00) diff --git a/src/plugins/UnreadCountBadge/index.tsx b/src/plugins/UnreadCountBadge/index.tsx deleted file mode 100644 index 20a7736fe..000000000 --- a/src/plugins/UnreadCountBadge/index.tsx +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Vencord, a Discord client mod - * Copyright (c) 2024 Vendicated and contributors - * SPDX-License-Identifier: GPL-3.0-or-later - */ - -import ErrorBoundary from "@components/ErrorBoundary"; -import { Devs } from "@utils/constants"; -import definePlugin from "@utils/types"; -import { findByPropsLazy } from "@webpack"; -import { ReadStateStore, useStateFromStores } from "@webpack/common"; -const { NumberBadge } = findByPropsLazy("NumberBadge"); - -import "./styles.css"; - -export default definePlugin({ - name: "UnreadCountBadge", - authors: [Devs.Joona], - description: "Show unread count in the channel list", - patches: [ - // Kanged from typingindicators - { - find: "UNREAD_IMPORTANT:", - replacement: { - match: /\.name\),.{0,120}\.children.+?:null(?<=,channel:(\i).+?)/, - replace: "$&,$self.CountBadge({channelId:$1.id})" - } - }, - ], - - CountBadge: ErrorBoundary.wrap(({ channelId }: { channelId: string; }) => { - const unreadCount = useStateFromStores([ReadStateStore], () => ReadStateStore.getUnreadCount(channelId)); - if (!unreadCount) return null; - return ; - }, { noop: true }) -}); diff --git a/src/plugins/unreadCountBadge/README.md b/src/plugins/unreadCountBadge/README.md new file mode 100644 index 000000000..ce63cd455 --- /dev/null +++ b/src/plugins/unreadCountBadge/README.md @@ -0,0 +1,5 @@ +# UnreadCountBadge + +Show a badge in the channel list for unread messages. + +![](https://github.com/user-attachments/assets/58beb269-259c-47aa-84dc-60f2354e6207) diff --git a/src/plugins/unreadCountBadge/index.tsx b/src/plugins/unreadCountBadge/index.tsx new file mode 100644 index 000000000..d4af9774d --- /dev/null +++ b/src/plugins/unreadCountBadge/index.tsx @@ -0,0 +1,66 @@ +/* + * Vencord, a Discord client mod + * Copyright (c) 2024 Vendicated and contributors + * SPDX-License-Identifier: GPL-3.0-or-later + */ + +import "./styles.css"; + +import { definePluginSettings } from "@api/Settings"; +import ErrorBoundary from "@components/ErrorBoundary"; +import { Devs } from "@utils/constants"; +import definePlugin, { OptionType } from "@utils/types"; +import { findByPropsLazy, findStoreLazy } from "@webpack"; +import { ReadStateStore, useStateFromStores } from "@webpack/common"; +import { Channel } from "discord-types/general"; + +const UserGuildSettingsStore = findStoreLazy("UserGuildSettingsStore"); +const JoinedThreadsStore = findStoreLazy("JoinedThreadsStore"); +const { NumberBadge } = findByPropsLazy("NumberBadge"); + +const settings = definePluginSettings({ + ShowOnMutedChannels: { + description: "Show unread count on muted channels", + type: OptionType.BOOLEAN, + default: false, + }, + NotificationCountLimit: { + description: "Show +99 instead of true amount", + type: OptionType.BOOLEAN, + default: false, + }, +}); + +export default definePlugin({ + name: "UnreadCountBadge", + authors: [Devs.Joona], + description: "Show unread count in the channel list", + patches: [ + // Kanged from typingindicators + { + find: "UNREAD_IMPORTANT:", + replacement: { + match: /\.name\),.{0,120}\.children.+?:null(?<=,channel:(\i),guild:(\i).+?)/, + replace: "$&,$self.CountBadge({channel: $1})" + } + }, + // Threads + { + // This is the thread "spine" that shows in the left + find: "M11 9H4C2.89543 9 2 8.10457 2 7V1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1V7C0 9.20914 1.79086 11 4 11H11C11.5523 11 12 10.5523 12 10C12 9.44771 11.5523 9 11 9Z", + replacement: + { + match: /mentionsCount:\i.+?null(?<=channel:(\i).+?)/, + replace: "$&,$self.CountBadge({channel: $1})" + } + + }, + ], + settings, + CountBadge: ErrorBoundary.wrap(({ channel }: { channel: Channel; }) => { + let unreadCount = useStateFromStores([ReadStateStore], () => ReadStateStore.getUnreadCount(channel.id)); + if (!unreadCount || (!settings.store.ShowOnMutedChannels && (UserGuildSettingsStore.isChannelMuted(channel.guild_id, channel.id) || JoinedThreadsStore.isMuted(channel.id)))) return null; + if (settings.store.NotificationCountLimit && unreadCount > 99) unreadCount = "+99"; + return ; + }, { noop: true }), +}); diff --git a/src/plugins/UnreadCountBadge/styles.css b/src/plugins/unreadCountBadge/styles.css similarity index 51% rename from src/plugins/UnreadCountBadge/styles.css rename to src/plugins/unreadCountBadge/styles.css index b13bcd8b0..d54621e5d 100644 --- a/src/plugins/UnreadCountBadge/styles.css +++ b/src/plugins/unreadCountBadge/styles.css @@ -1,3 +1,3 @@ -.unreadCountBadge { +.vc-unreadCountBadge { margin-left: 4px; } From 33c9dadaf1fa0d07a5bbbb65874f6182b1aab085 Mon Sep 17 00:00:00 2001 From: Vendicated Date: Thu, 1 Aug 2024 14:18:38 +0200 Subject: [PATCH 3/6] =?UTF-8?q?needs=20some=20room=20to=20breeeeeeeeeeeath?= =?UTF-8?q?e=20+=20=F0=9F=90=AB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/plugins/unreadCountBadge/index.tsx | 31 +++++++++++++++++++------- 1 file changed, 23 insertions(+), 8 deletions(-) diff --git a/src/plugins/unreadCountBadge/index.tsx b/src/plugins/unreadCountBadge/index.tsx index d4af9774d..d14ad20d4 100644 --- a/src/plugins/unreadCountBadge/index.tsx +++ b/src/plugins/unreadCountBadge/index.tsx @@ -19,12 +19,12 @@ const JoinedThreadsStore = findStoreLazy("JoinedThreadsStore"); const { NumberBadge } = findByPropsLazy("NumberBadge"); const settings = definePluginSettings({ - ShowOnMutedChannels: { + showOnMutedChannels: { description: "Show unread count on muted channels", type: OptionType.BOOLEAN, default: false, }, - NotificationCountLimit: { + notificationCountLimit: { description: "Show +99 instead of true amount", type: OptionType.BOOLEAN, default: false, @@ -34,7 +34,9 @@ const settings = definePluginSettings({ export default definePlugin({ name: "UnreadCountBadge", authors: [Devs.Joona], - description: "Show unread count in the channel list", + description: "Show unread message count badges on channels in the channel list", + settings, + patches: [ // Kanged from typingindicators { @@ -56,11 +58,24 @@ export default definePlugin({ }, ], - settings, + CountBadge: ErrorBoundary.wrap(({ channel }: { channel: Channel; }) => { - let unreadCount = useStateFromStores([ReadStateStore], () => ReadStateStore.getUnreadCount(channel.id)); - if (!unreadCount || (!settings.store.ShowOnMutedChannels && (UserGuildSettingsStore.isChannelMuted(channel.guild_id, channel.id) || JoinedThreadsStore.isMuted(channel.id)))) return null; - if (settings.store.NotificationCountLimit && unreadCount > 99) unreadCount = "+99"; - return ; + const unreadCount = useStateFromStores([ReadStateStore], () => ReadStateStore.getUnreadCount(channel.id)); + if (!unreadCount) return null; + + if (!settings.store.showOnMutedChannels && (UserGuildSettingsStore.isChannelMuted(channel.guild_id, channel.id) || JoinedThreadsStore.isMuted(channel.id))) + return null; + + return ( + 99 && settings.store.notificationCountLimit + ? "+99" + : unreadCount + } + /> + ); }, { noop: true }), }); From 7e2ff411f756359b78c8de778e216a402d84f658 Mon Sep 17 00:00:00 2001 From: Vendicated Date: Thu, 1 Aug 2024 14:19:25 +0200 Subject: [PATCH 4/6] better description --- src/plugins/unreadCountBadge/README.md | 2 +- src/plugins/unreadCountBadge/index.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plugins/unreadCountBadge/README.md b/src/plugins/unreadCountBadge/README.md index ce63cd455..04dc72cea 100644 --- a/src/plugins/unreadCountBadge/README.md +++ b/src/plugins/unreadCountBadge/README.md @@ -1,5 +1,5 @@ # UnreadCountBadge -Show a badge in the channel list for unread messages. +Shows unread message count badges on channels in the channel list ![](https://github.com/user-attachments/assets/58beb269-259c-47aa-84dc-60f2354e6207) diff --git a/src/plugins/unreadCountBadge/index.tsx b/src/plugins/unreadCountBadge/index.tsx index d14ad20d4..20a848ee9 100644 --- a/src/plugins/unreadCountBadge/index.tsx +++ b/src/plugins/unreadCountBadge/index.tsx @@ -34,7 +34,7 @@ const settings = definePluginSettings({ export default definePlugin({ name: "UnreadCountBadge", authors: [Devs.Joona], - description: "Show unread message count badges on channels in the channel list", + description: "Shows unread message count badges on channels in the channel list", settings, patches: [ From 5b5faf823918fdce273026c1b9945446320cf38a Mon Sep 17 00:00:00 2001 From: Vendicated Date: Thu, 1 Aug 2024 14:22:31 +0200 Subject: [PATCH 5/6] safer patch --- src/plugins/typingIndicator/index.tsx | 2 +- src/plugins/unreadCountBadge/index.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plugins/typingIndicator/index.tsx b/src/plugins/typingIndicator/index.tsx index 6df3f4b80..bf40a8c56 100644 --- a/src/plugins/typingIndicator/index.tsx +++ b/src/plugins/typingIndicator/index.tsx @@ -172,7 +172,7 @@ export default definePlugin({ // This is the thread "spine" that shows in the left find: "M11 9H4C2.89543 9 2 8.10457 2 7V1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1V7C0 9.20914 1.79086 11 4 11H11C11.5523 11 12 10.5523 12 10C12 9.44771 11.5523 9 11 9Z", replacement: { - match: /mentionsCount:\i.+?null(?<=channel:(\i).+?)/, + match: /mentionsCount:\i.{0,50}?null(?<=channel:(\i).+?)/, replace: "$&,$self.TypingIndicator($1.id)" } } diff --git a/src/plugins/unreadCountBadge/index.tsx b/src/plugins/unreadCountBadge/index.tsx index 20a848ee9..43e16419b 100644 --- a/src/plugins/unreadCountBadge/index.tsx +++ b/src/plugins/unreadCountBadge/index.tsx @@ -52,7 +52,7 @@ export default definePlugin({ find: "M11 9H4C2.89543 9 2 8.10457 2 7V1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1V7C0 9.20914 1.79086 11 4 11H11C11.5523 11 12 10.5523 12 10C12 9.44771 11.5523 9 11 9Z", replacement: { - match: /mentionsCount:\i.+?null(?<=channel:(\i).+?)/, + match: /mentionsCount:\i.{0,50}?null(?<=channel:(\i).+?)/, replace: "$&,$self.CountBadge({channel: $1})" } From 947240b1f7d9b2fea687b25788e3e43b053efdf5 Mon Sep 17 00:00:00 2001 From: Masterjoona <69722179+Masterjoona@users.noreply.github.com> Date: Sun, 4 Aug 2024 17:46:41 +0300 Subject: [PATCH 6/6] Use arguments[0] instead of lookbehinds, add setting to replace the white dot --- src/plugins/unreadCountBadge/README.md | 4 +++ src/plugins/unreadCountBadge/index.tsx | 48 +++++++++++++++++-------- src/plugins/unreadCountBadge/styles.css | 16 +++++++++ 3 files changed, 54 insertions(+), 14 deletions(-) diff --git a/src/plugins/unreadCountBadge/README.md b/src/plugins/unreadCountBadge/README.md index 04dc72cea..fae38b1c0 100644 --- a/src/plugins/unreadCountBadge/README.md +++ b/src/plugins/unreadCountBadge/README.md @@ -3,3 +3,7 @@ Shows unread message count badges on channels in the channel list ![](https://github.com/user-attachments/assets/58beb269-259c-47aa-84dc-60f2354e6207) + +Setting to replace the white dot + +![](https://github.com/user-attachments/assets/c0612bc2-d62b-45ca-86dd-105dcc484071) diff --git a/src/plugins/unreadCountBadge/index.tsx b/src/plugins/unreadCountBadge/index.tsx index 43e16419b..0b461cdc9 100644 --- a/src/plugins/unreadCountBadge/index.tsx +++ b/src/plugins/unreadCountBadge/index.tsx @@ -29,6 +29,12 @@ const settings = definePluginSettings({ type: OptionType.BOOLEAN, default: false, }, + replaceWhiteDot: { + description: "Replace the white dot with the badge", + type: OptionType.BOOLEAN, + default: false, + restartNeeded: true, + }, }); export default definePlugin({ @@ -41,35 +47,49 @@ export default definePlugin({ // Kanged from typingindicators { find: "UNREAD_IMPORTANT:", - replacement: { - match: /\.name\),.{0,120}\.children.+?:null(?<=,channel:(\i),guild:(\i).+?)/, - replace: "$&,$self.CountBadge({channel: $1})" - } + replacement: [ + { + match: /\.name\),.{0,120}\.children.+?:null/, + replace: "$&,$self.CountBadge({channel: arguments[0].channel,})", + predicate: () => !settings.store.replaceWhiteDot + }, + { + match: /\(0,\i\.jsx\)\("div",{className:\i\(\)\(\i\.unread,\i\?\i\.unreadImportant:void 0\)}\)/, + replace: "$self.CountBadge({channel: arguments[0].channel, whiteDot:$&})", + predicate: () => settings.store.replaceWhiteDot + } + ] }, // Threads { // This is the thread "spine" that shows in the left find: "M11 9H4C2.89543 9 2 8.10457 2 7V1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1V7C0 9.20914 1.79086 11 4 11H11C11.5523 11 12 10.5523 12 10C12 9.44771 11.5523 9 11 9Z", - replacement: - { - match: /mentionsCount:\i.{0,50}?null(?<=channel:(\i).+?)/, - replace: "$&,$self.CountBadge({channel: $1})" - } - + replacement: [ + { + match: /mentionsCount:\i.{0,50}?null/, + replace: "$&,$self.CountBadge({channel: arguments[0].thread})", + predicate: () => !settings.store.replaceWhiteDot + }, + { + match: /\(0,\i\.jsx\)\("div",{className:\i\(\)\(\i\.unread,\i\.unreadImportant\)}\)/, + replace: "$self.CountBadge({channel: arguments[0].thread, whiteDot:$&})", + predicate: () => settings.store.replaceWhiteDot + } + ] }, ], - CountBadge: ErrorBoundary.wrap(({ channel }: { channel: Channel; }) => { + CountBadge: ErrorBoundary.wrap(({ channel, whiteDot }: { channel: Channel, whiteDot?: JSX.Element; }) => { const unreadCount = useStateFromStores([ReadStateStore], () => ReadStateStore.getUnreadCount(channel.id)); - if (!unreadCount) return null; + if (!unreadCount) return whiteDot || null; if (!settings.store.showOnMutedChannels && (UserGuildSettingsStore.isChannelMuted(channel.guild_id, channel.id) || JoinedThreadsStore.isMuted(channel.id))) return null; - + const className = `vc-unreadCountBadge${whiteDot ? "-dot" : ""}${channel.threadMetadata ? "-thread" : ""}`; return ( 99 && settings.store.notificationCountLimit ? "+99" diff --git a/src/plugins/unreadCountBadge/styles.css b/src/plugins/unreadCountBadge/styles.css index d54621e5d..e0f0c2461 100644 --- a/src/plugins/unreadCountBadge/styles.css +++ b/src/plugins/unreadCountBadge/styles.css @@ -1,3 +1,19 @@ .vc-unreadCountBadge { margin-left: 4px; } + +.vc-unreadCountBadge-dot { + position: absolute; + top: 25%; + margin-left: -3%; + scale: 0.9; + z-index: 1; +} + +.vc-unreadCountBadge-dot-thread { + position: absolute; + top: 20%; + margin-left: -18%; + scale: 0.9; + z-index: 1; +}