Make some changes to reviewdb ui and add badges to it (#245)

1 files changed, 45 insertions, 0 deletions

diff --git a/src/plugins/reviewDB/components/ReviewBadge.tsx b/src/plugins/reviewDB/components/ReviewBadge.tsx
new file mode 100644
index 0000000..4a3c0c4
--- /dev/null
+++ b/src/plugins/reviewDB/components/ReviewBadge.tsx
@@ -0,0 +1,45 @@
+/*
+ * 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 <https://www.gnu.org/licenses/>.
+*/
+
+import { MaskedLinkStore, Tooltip } from "@webpack/common";
+
+import { Badge } from "../entities/Badge";
+
+export default function ReviewBadge(badge: Badge) {
+    return (
+        <Tooltip
+            text={badge.badge_name}>
+            {({ onMouseEnter, onMouseLeave }) => (
+                <img
+                    width="24px"
+                    height="24px"
+                    onMouseEnter={onMouseEnter}
+                    onMouseLeave={onMouseLeave}
+                    src={badge.badge_icon}
+                    alt={badge.badge_description}
+                    style={{ verticalAlign: "middle", marginLeft: "4px" }}
+                    onClick={() =>
+                        MaskedLinkStore.openUntrustedLink({
+                            href: badge.redirect_url,
+                        })
+                    }
+                />
+            )}
+        </Tooltip>
+    );
+}