diff --git a/src/plugins/typingIndicator.tsx b/src/plugins/typingIndicator.tsx
new file mode 100644
index 00000000..f57eab3e
--- /dev/null
+++ b/src/plugins/typingIndicator.tsx
@@ -0,0 +1,135 @@
+/*
+ * Vencord, a modification for Discord's desktop app
+ * Copyright (c) 2022 Vendicated and contributors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see .
+*/
+
+import { definePluginSettings, Settings } from "@api/settings";
+import ErrorBoundary from "@components/ErrorBoundary";
+import { Devs } from "@utils/constants";
+import { LazyComponent } from "@utils/misc";
+import definePlugin, { OptionType } from "@utils/types";
+import { find, findLazy, findStoreLazy } from "@webpack";
+import { ChannelStore, GuildMemberStore, Tooltip, UserStore, useStateFromStores } from "@webpack/common";
+
+import { buildSeveralUsers } from "./typingTweaks";
+
+const ThreeDots = LazyComponent(() => find(m => m.type?.render?.toString()?.includes("().dots")));
+
+const TypingStore = findStoreLazy("TypingStore");
+const UserGuildSettingsStore = findStoreLazy("UserGuildSettingsStore");
+
+const Formatters = findLazy(m => m.Messages?.SEVERAL_USERS_TYPING);
+
+function getDisplayName(guildId: string, userId: string) {
+ return GuildMemberStore.getNick(guildId, userId) ?? UserStore.getUser(userId).username;
+}
+
+function TypingIndicator({ channelId }: { channelId: string; }) {
+ const typingUsers: Record = useStateFromStores(
+ [TypingStore],
+ () => ({ ...TypingStore.getTypingUsers(channelId) as Record }),
+ null,
+ (old, current) => {
+ const oldKeys = Object.keys(old);
+ const currentKeys = Object.keys(current);
+
+ return oldKeys.length === currentKeys.length && JSON.stringify(oldKeys) === JSON.stringify(currentKeys);
+ }
+ );
+
+ const guildId = ChannelStore.getChannel(channelId).guild_id;
+
+ if (!settings.store.includeMutedChannels) {
+ const isChannelMuted = UserGuildSettingsStore.isChannelMuted(guildId, channelId);
+ if (isChannelMuted) return null;
+ }
+
+ delete typingUsers[UserStore.getCurrentUser().id];
+
+ const typingUsersArray = Object.keys(typingUsers);
+ let tooltipText: string;
+
+ switch (typingUsersArray.length) {
+ case 0: break;
+ case 1: {
+ tooltipText = Formatters.Messages.ONE_USER_TYPING.format({ a: getDisplayName(guildId, typingUsersArray[0]) });
+ break;
+ }
+ case 2: {
+ tooltipText = Formatters.Messages.TWO_USERS_TYPING.format({ a: getDisplayName(guildId, typingUsersArray[0]), b: getDisplayName(guildId, typingUsersArray[1]) });
+ break;
+ }
+ case 3: {
+ tooltipText = Formatters.Messages.THREE_USERS_TYPING.format({ a: getDisplayName(guildId, typingUsersArray[0]), b: getDisplayName(guildId, typingUsersArray[1]), c: getDisplayName(guildId, typingUsersArray[1]) });
+ break;
+ }
+ default: {
+ tooltipText = Settings.plugins.TypingTweaks.enabled
+ ? buildSeveralUsers({ a: getDisplayName(guildId, typingUsersArray[0]), b: getDisplayName(guildId, typingUsersArray[1]), c: typingUsersArray.length - 2 })
+ : Formatters.Messages.SEVERAL_USERS_TYPING;
+ break;
+ }
+ }
+
+ if (typingUsersArray.length > 0) {
+ return (
+
+ {({ onMouseLeave, onMouseEnter }) => (
+
+
+
+ )}
+
+ );
+ }
+
+ return null;
+}
+
+const settings = definePluginSettings({
+ includeMutedChannels: {
+ type: OptionType.BOOLEAN,
+ description: "Whether to show the typing indicator for muted channels.",
+ default: false
+ }
+});
+
+export default definePlugin({
+ name: "TypingIndicator",
+ description: "Adds an indicator if someone is typing on a channel.",
+ authors: [Devs.Nuckyz],
+ settings,
+
+ patches: [
+ {
+ find: ".UNREAD_HIGHLIGHT",
+ replacement: {
+ match: /(?<=(?\i)=\i\.channel,.+?\(\)\.children.+?:null)/,
+ replace: ",$self.TypingIndicator($.id)"
+ }
+ }
+ ],
+
+ TypingIndicator: (channelId: string) => (
+
+
+
+ ),
+});
diff --git a/src/plugins/typingTweaks.tsx b/src/plugins/typingTweaks.tsx
index 45481799..db8c438b 100644
--- a/src/plugins/typingTweaks.tsx
+++ b/src/plugins/typingTweaks.tsx
@@ -44,6 +44,15 @@ const settings = definePluginSettings({
}
});
+export function buildSeveralUsers({ a, b, c }: { a: string, b: string, c: number; }) {
+ return [
+ {a},
+ ", ",
+ {b},
+ `, and ${c} others are typing...`
+ ];
+}
+
export default definePlugin({
name: "TypingTweaks",
description: "Show avatars and role colours in the typing indicator",
@@ -77,14 +86,7 @@ export default definePlugin({
],
settings,
- buildSeveralUsers({ a, b, c }: { a: string, b: string, c: number; }) {
- return [
- {a},
- ", ",
- {b},
- `, and ${c} others are typing...`
- ];
- },
+ buildSeveralUsers,
mutateChildren(props: any, users: User[], children: any) {
if (!Array.isArray(children)) return children;