PronounDB: Add support for compact mode & clean up (#604)

2 files changed, 47 insertions, 23 deletions

diff --git a/src/plugins/pronoundb/components/PronounsChatComponent.tsx b/src/plugins/pronoundb/components/PronounsChatComponent.tsx
index ce67754..70a2bf3 100644
--- a/src/plugins/pronoundb/components/PronounsChatComponent.tsx
+++ b/src/plugins/pronoundb/components/PronounsChatComponent.tsx
@@ -17,39 +17,63 @@
 */
 
 import { Settings } from "@api/settings";
-import { classes, useAwaiter } from "@utils/misc";
+import { classes } from "@utils/misc";
 import { findByPropsLazy } from "@webpack";
 import { UserStore } from "@webpack/common";
 import { Message } from "discord-types/general";
 
-import { fetchPronouns, formatPronouns } from "../pronoundbUtils";
-import { PronounMapping } from "../types";
+import { awaitAndFormatPronouns } from "../pronoundbUtils";
 
 const styles: Record<string, string> = findByPropsLazy("timestampInline");
 
-export default function PronounsChatComponentWrapper({ message }: { message: Message; }) {
+function shouldShow(message: Message): boolean {
+    // Respect showInMessages
+    if (!Settings.plugins.PronounDB.showInMessages)
+        return false;
     // Don't bother fetching bot or system users
     if (message.author.bot || message.author.system)
-        return null;
+        return false;
     // Respect showSelf options
     if (!Settings.plugins.PronounDB.showSelf && message.author.id === UserStore.getCurrentUser().id)
+        return false;
+
+    return true;
+}
+
+export function PronounsChatComponentWrapper({ message }: { message: Message; }) {
+    if (!shouldShow(message))
         return null;
 
     return <PronounsChatComponent message={message} />;
 }
 
-function PronounsChatComponent({ message }: { message: Message; }) {
-    const [result, , isPending] = useAwaiter(() => fetchPronouns(message.author.id), {
-        fallbackValue: null,
-        onError: e => console.error("Fetching pronouns failed: ", e)
-    });
+export function CompactPronounsChatComponentWrapper({ message }: { message: Message; }) {
+    if (!shouldShow(message))
+        return null;
+
+    return <CompactPronounsChatComponent message={message} />;
+}
 
-    // If the promise completed, the result was not "unspecified", and there is a mapping for the code, then return a span with the pronouns
-    if (!isPending && result && result !== "unspecified" && PronounMapping[result]) {
+function PronounsChatComponent({ message }: { message: Message; }) {
+    const result = awaitAndFormatPronouns(message.author.id);
+    if (result != null) {
         return (
             <span
                 className={classes(styles.timestampInline, styles.timestamp)}
-            >• {formatPronouns(result)}</span>
+            >• {result}</span>
+        );
+    }
+
+    return null;
+}
+
+export function CompactPronounsChatComponent({ message }: { message: Message; }) {
+    const result = awaitAndFormatPronouns(message.author.id);
+    if (result != null) {
+        return (
+            <span
+                className={classes(styles.timestampInline, styles.timestamp, "vc-pronoundb-compact")}
+            >• {result}</span>
         );
     }
 
diff --git a/src/plugins/pronoundb/components/PronounsProfileWrapper.tsx b/src/plugins/pronoundb/components/PronounsProfileWrapper.tsx
index 79fce23..34cfab5 100644
--- a/src/plugins/pronoundb/components/PronounsProfileWrapper.tsx
+++ b/src/plugins/pronoundb/components/PronounsProfileWrapper.tsx
@@ -17,16 +17,19 @@
 */
 
 import { Settings } from "@api/settings";
-import { useAwaiter } from "@utils/misc";
 import { UserStore } from "@webpack/common";
 
-import { fetchPronouns, formatPronouns } from "../pronoundbUtils";
-import { PronounMapping, UserProfilePronounsProps, UserProfileProps } from "../types";
+import { awaitAndFormatPronouns } from "../pronoundbUtils";
+import { UserProfilePronounsProps, UserProfileProps } from "../types";
 
 export default function PronounsProfileWrapper(PronounsComponent: React.ElementType<UserProfilePronounsProps>, props: UserProfilePronounsProps, profileProps: UserProfileProps) {
     const user = UserStore.getUser(profileProps.userId) ?? {};
+    // Respect showInProfile
+    if (!Settings.plugins.PronounDB.showInProfile)
+        return null;
     // Don't bother fetching bot or system users
-    if (user.bot || user.system) return null;
+    if (user.bot || user.system)
+        return null;
     // Respect showSelf options
     if (!Settings.plugins.PronounDB.showSelf && user.id === UserStore.getCurrentUser().id)
         return null;
@@ -45,15 +48,12 @@ function ProfilePronouns(
         leProps: UserProfilePronounsProps;
     }
 ) {
-    const [result, , isPending] = useAwaiter(() => fetchPronouns(userId), {
-        fallbackValue: null,
-        onError: e => console.error("Fetching pronouns failed: ", e),
-    });
+    const result = awaitAndFormatPronouns(userId);
 
     // If the promise completed, the result was not "unspecified", and there is a mapping for the code, then render
-    if (!isPending && result && result !== "unspecified" && PronounMapping[result]) {
+    if (result != null) {
         // First child is the header, second is a div with the actual text
-        leProps.currentPronouns ||= formatPronouns(result);
+        leProps.currentPronouns ||= result;
         return <Component {...leProps} />;
     }