aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/Monaco.ts2
-rw-r--r--src/ipcMain/index.ts4
-rw-r--r--src/plugins/whoReacted.tsx60
-rw-r--r--src/utils/Queue.ts45
-rw-r--r--src/utils/misc.tsx5
-rw-r--r--src/webpack/common.tsx1
6 files changed, 104 insertions, 13 deletions
diff --git a/src/components/Monaco.ts b/src/components/Monaco.ts
index 16eff85..6d16c76 100644
--- a/src/components/Monaco.ts
+++ b/src/components/Monaco.ts
@@ -25,7 +25,7 @@ import { find } from "../webpack/webpack";
const queue = new Queue();
const setCss = debounce((css: string) => {
- queue.add(() => VencordNative.ipc.invoke(IpcEvents.SET_QUICK_CSS, css));
+ queue.push(() => VencordNative.ipc.invoke(IpcEvents.SET_QUICK_CSS, css));
});
export async function launchMonacoEditor() {
diff --git a/src/ipcMain/index.ts b/src/ipcMain/index.ts
index 8a60bc6..535c005 100644
--- a/src/ipcMain/index.ts
+++ b/src/ipcMain/index.ts
@@ -66,14 +66,14 @@ const settingsWriteQueue = new Queue();
ipcMain.handle(IpcEvents.GET_QUICK_CSS, () => readCss());
ipcMain.handle(IpcEvents.SET_QUICK_CSS, (_, css) =>
- cssWriteQueue.add(() => writeFile(QUICKCSS_PATH, css))
+ cssWriteQueue.push(() => writeFile(QUICKCSS_PATH, css))
);
ipcMain.handle(IpcEvents.GET_SETTINGS_DIR, () => SETTINGS_DIR);
ipcMain.on(IpcEvents.GET_SETTINGS, e => e.returnValue = readSettings());
ipcMain.handle(IpcEvents.SET_SETTINGS, (_, s) => {
- settingsWriteQueue.add(() => writeFile(SETTINGS_FILE, s));
+ settingsWriteQueue.push(() => writeFile(SETTINGS_FILE, s));
});
diff --git a/src/plugins/whoReacted.tsx b/src/plugins/whoReacted.tsx
index 0079983..b1fb27d 100644
--- a/src/plugins/whoReacted.tsx
+++ b/src/plugins/whoReacted.tsx
@@ -16,20 +16,56 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
-import { User } from "discord-types/general";
+import { ReactionEmoji, User } from "discord-types/general";
import ErrorBoundary from "../components/ErrorBoundary";
import { Devs } from "../utils/constants";
-import { LazyComponent, lazyWebpack } from "../utils/misc";
+import { LazyComponent, lazyWebpack, sleep, useForceUpdater } from "../utils/misc";
+import { Queue } from "../utils/Queue";
import definePlugin from "../utils/types";
import { filters, findByCode } from "../webpack";
-import { ChannelStore, React, Tooltip } from "../webpack/common";
+import { ChannelStore, FluxDispatcher, React, RestAPI, Tooltip } from "../webpack/common";
const UserSummaryItem = LazyComponent(() => findByCode("defaultRenderUser", "showDefaultAvatarsForNullUsers"));
const AvatarStyles = lazyWebpack(filters.byProps("moreUsers", "emptyUser", "avatarContainer", "clickableAvatar"));
const ReactionStore = lazyWebpack(filters.byProps("getReactions"));
+const queue = new Queue();
+
+function fetchReactions(msg: Message, emoji: ReactionEmoji) {
+ const key = emoji.name + (emoji.id ? `:${emoji.id}` : "");
+ return RestAPI.get({
+ url: `/channels/${msg.channel_id}/messages/${msg.id}/reactions/${key}`,
+ query: {
+ limit: 100
+ },
+ oldFormErrors: true
+ })
+ .then(res => FluxDispatcher.dispatch({
+ type: "MESSAGE_REACTION_ADD_USERS",
+ channelId: msg.channel_id,
+ messageId: msg.id,
+ users: res.body,
+ emoji
+ }))
+ .catch(console.error)
+ .finally(() => sleep(250));
+}
+
+function getReactionsWithQueue(msg: Message, e: ReactionEmoji) {
+ const key = `${msg.id}:${e.name}:${e.id ?? ""}`;
+ const cache = ReactionStore.__getLocalVars().reactions[key] ??= { fetched: false, users: {} };
+ if (!cache.fetched) {
+ queue.unshift(() =>
+ fetchReactions(msg, e)
+ );
+ cache.fetched = true;
+ }
+
+ return cache.users;
+}
+
function makeRenderMoreUsers(users: User[]) {
return function renderMoreUsers(_label: string, _count: number) {
return (
@@ -62,7 +98,7 @@ export default definePlugin({
}],
renderUsers(props: RootObject) {
- return (
+ return props.message.reactions.length > 10 ? null : (
<ErrorBoundary noop>
<this._renderUsers {...props} />
</ErrorBoundary>
@@ -70,8 +106,19 @@ export default definePlugin({
},
_renderUsers({ message, emoji }: RootObject) {
- const reactions = ReactionStore.getReactions(message.channel_id, message.id, emoji);
- const users = Object.values(reactions) as User[];
+ const forceUpdate = useForceUpdater();
+ React.useEffect(() => {
+ const cb = (e: any) => {
+ if (e.messageId === message.id)
+ forceUpdate();
+ };
+ FluxDispatcher.subscribe("MESSAGE_REACTION_ADD_USERS", cb);
+
+ return () => FluxDispatcher.unsubscribe("MESSAGE_REACTION_ADD_USERS", cb);
+ }, [message.id]);
+
+ const reactions = getReactionsWithQueue(message, emoji);
+ const users = Object.values(reactions).filter(Boolean) as User[];
return (
<div
@@ -79,7 +126,6 @@ export default definePlugin({
>
<UserSummaryItem
users={users}
- count={users.length}
guildId={ChannelStore.getChannel(message.channel_id)?.guild_id}
renderIcon={false}
max={5}
diff --git a/src/utils/Queue.ts b/src/utils/Queue.ts
index 46959a0..6153d40 100644
--- a/src/utils/Queue.ts
+++ b/src/utils/Queue.ts
@@ -19,9 +19,48 @@
import { Promisable } from "type-fest";
export class Queue {
- private promise: Promise<any> = Promise.resolve();
+ /**
+ * @param maxSize The maximum amount of functions that can be queued at once.
+ * If the queue is full, the oldest function will be removed.
+ */
+ constructor(public maxSize = Infinity) { }
- add<T>(func: (lastValue: unknown) => Promisable<T>): Promise<T> {
- return (this.promise = this.promise.then(func));
+ queue = [] as Array<() => Promisable<unknown>>;
+
+ private promise?: Promise<any>;
+
+ private next() {
+ const func = this.queue.shift();
+ if (func)
+ this.promise = Promise.resolve()
+ .then(func)
+ .then(() => this.next());
+ else
+ this.promise = undefined;
+ }
+
+ private run() {
+ if (!this.promise)
+ this.next();
+ }
+
+ push<T>(func: () => Promisable<T>) {
+ if (this.size >= this.maxSize)
+ this.queue.shift();
+
+ this.queue.push(func);
+ this.run();
+ }
+
+ unshift<T>(func: () => Promisable<T>) {
+ if (this.size >= this.maxSize)
+ this.queue.pop();
+
+ this.queue.unshift(func);
+ this.run();
+ }
+
+ get size() {
+ return this.queue.length;
}
}
diff --git a/src/utils/misc.tsx b/src/utils/misc.tsx
index 005bcc0..44fc819 100644
--- a/src/utils/misc.tsx
+++ b/src/utils/misc.tsx
@@ -70,6 +70,11 @@ export function useAwaiter<T>(factory: () => Promise<T>, fallbackValue: T | null
return [state.value, state.error, state.pending, () => setSignal(signal + 1)];
}
+export function useForceUpdater() {
+ const [, set] = React.useState(0);
+ return () => set(s => s + 1);
+}
+
/**
* A lazy component. The factory method is called on first render. For example useful
* for const Component = LazyComponent(() => findByDisplayName("...").default)
diff --git a/src/webpack/common.tsx b/src/webpack/common.tsx
index 6ebad16..2f3768e 100644
--- a/src/webpack/common.tsx
+++ b/src/webpack/common.tsx
@@ -32,6 +32,7 @@ export const Flux = lazyWebpack(filters.byProps("connectStores"));
export let React: typeof import("react");
export const ReactDOM: typeof import("react-dom") = lazyWebpack(filters.byProps("createPortal", "render"));
+export const RestAPI = lazyWebpack(filters.byProps("getAPIBaseURL", "get"));
export const moment: typeof import("moment") = lazyWebpack(filters.byProps("parseTwoDigitYear"));
export const MessageStore = lazyWebpack(filters.byProps("getRawMessages")) as Omit<Stores.MessageStore, "getMessages"> & { getMessages(chanId: string): any; };
generated by cgit (git 2.46.0) at 2024-11-24 11:00:49 +0000