From b9f14cbfe65fc2aa403f1aaad98dc2b7b9d71ea1 Mon Sep 17 00:00:00 2001
From: nikosszzz <19nikospap@gmail.com>
Date: Sat, 18 Mar 2023 09:56:52 +0200
Subject: [PATCH] [UI > PluginCard] Refactors

---
 src/lib/metro/common.ts                   |  4 +++-
 src/ui/settings/components/Card.tsx       |  2 +-
 src/ui/settings/components/PluginCard.tsx | 27 ++++++++++++++++++++---
 3 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/src/lib/metro/common.ts b/src/lib/metro/common.ts
index 3631393c..1d2404b0 100644
--- a/src/lib/metro/common.ts
+++ b/src/lib/metro/common.ts
@@ -1,8 +1,10 @@
-import { find, findByProps } from "@metro/filters";
+import { find, findByProps, findByStoreName } from "@metro/filters";
 
 // Discord
 export { constants } from "@lib/preinit";
 export const channels = findByProps("getVoiceChannelId");
+export const users = findByStoreName("UserStore");
+export const profiles = findByProps("showUserProfile");
 export const i18n = findByProps("Messages");
 export const url = findByProps("openURL", "openDeeplink");
 export const toasts = find(m => m.open && m.close && !m.startDrag && !m.init && !m.openReplay && !m.setAlwaysOnTop);
diff --git a/src/ui/settings/components/Card.tsx b/src/ui/settings/components/Card.tsx
index 51a4fdc3..83b30cd0 100644
--- a/src/ui/settings/components/Card.tsx
+++ b/src/ui/settings/components/Card.tsx
@@ -38,7 +38,7 @@ interface Action {
 
 interface CardProps {
     index?: number;
-    headerLabel: string | React.ComponentType;
+    headerLabel: string | React.ComponentType | (string | JSX.Element)[];
     headerIcon?: string;
     toggleType: "switch" | "radio";
     toggleValue?: boolean;
diff --git a/src/ui/settings/components/PluginCard.tsx b/src/ui/settings/components/PluginCard.tsx
index 45455f33..decc45bd 100644
--- a/src/ui/settings/components/PluginCard.tsx
+++ b/src/ui/settings/components/PluginCard.tsx
@@ -1,16 +1,30 @@
 import { ButtonColors, Plugin } from "@types";
-import { NavigationNative, clipboard } from "@metro/common";
+import { NavigationNative, clipboard, users, profiles, stylesheet, ReactNative as RN } from "@metro/common";
 import { getAssetIDByName } from "@ui/assets";
 import { showToast } from "@ui/toasts";
 import { showConfirmationAlert } from "@ui/alerts";
 import { removePlugin, startPlugin, stopPlugin, getSettings } from "@lib/plugins";
 import Card from "@ui/settings/components/Card";
+import { findByProps } from "@/lib/metro/filters";
+import { semanticColors } from "@/ui/color";
 
 interface PluginCardProps {
     plugin: Plugin;
     index: number;
 }
 
+const styles = stylesheet.createThemedStyleSheet({
+    link: {
+        color: semanticColors?.TEXT_LINK
+    }
+});
+
+const asyncUsers = findByProps("getUser", "fetchProfile");
+async function showUserProfile(id: string) {
+    if (!users.getUser(id)) await asyncUsers.fetchProfile(id);
+    profiles.showUserProfile({ userId: id });
+};
+
 export default function PluginCard({ plugin, index }: PluginCardProps) {
     const settings = getSettings(plugin.id);
     const navigation = NavigationNative.useNavigation();
@@ -18,12 +32,19 @@ export default function PluginCard({ plugin, index }: PluginCardProps) {
 
     // This is needed because of React™
     if (removed) return null;
+    const authors = plugin.manifest.authors;
 
     return (
         <Card 
             index={index}
-            // TODO: Actually make use of user IDs
-            headerLabel={`${plugin.manifest.name} by ${plugin.manifest.authors.map(i => i.name).join(", ")}`}
+            // TODO: Find a method to add seperators to authors
+            headerLabel={[plugin.manifest.name, ...(authors ? ["by ", ...(authors ? authors.map(i => i.id ?
+                <RN.Text
+                    style={styles.link}
+                    onPress={() => showUserProfile(i.id!!)}
+                >
+                    {i.name}
+                </RN.Text> : i.name) : [])] : "")]}
             headerIcon={plugin.manifest.vendetta?.icon || "ic_application_command_24px"}
             toggleType="switch"
             toggleValue={plugin.enabled}