make some changes in design and add badges to userreviews

src/plugins/bypassAutomod.ts

@@ -0,0 +1,27 @@
+import { Devs } from "../utils/constants";
+import definePlugin from "../utils/types";
+import { addPreEditListener, addPreSendListener, MessageObject, removePreEditListener, removePreSendListener } from "../api/MessageEvents";
+
+
+export default definePlugin({
+    name: "Bypass Automod",
+    description: "Bypasses the automod",
+    version: "1.0.0",
+    authors: [Devs.mantikafasi],
+    start() {
+        return
+        
+        addPreSendListener((_, msg) => {
+            var newMsg = "";
+            msg.content.split(" ").forEach((word, _) => {
+                if (word.length < 2) return
+                let i = Math.round(Math.random() * (word.length - 1));
+                console.log(i,word)
+                newMsg += word.replace(word[i], word[i] + "\u200C\u2062\u2063\u2064\u200d") + " ";
+            });
+            msg.content = newMsg.concat();
+        });
+
+    }
+}
+);

src/plugins/reviewDB/components/ReviewBadge.tsx

@@ -0,0 +1,25 @@
+import { IpcEvents } from "../../../utils";
+import { 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="22px"
+                    height="22px"
+                    onMouseEnter={onMouseEnter}
+                    onMouseLeave={onMouseLeave}
+                    src={badge.badge_icon}
+                    style={{ verticalAlign: "middle", marginLeft: "4px" }}
+                    onClick={() =>
+                        VencordNative.ipc.invoke(IpcEvents.OPEN_EXTERNAL, badge.redirect_url)
+                    }
+                />
+            )}
+        </Tooltip>
+    );
+}

src/plugins/reviewDB/components/ReviewComponent.tsx

@@ -16,21 +16,22 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { classes, LazyComponent } from "../../../utils/misc";
+import { classes, LazyComponent, lazyWebpack } from "../../../utils/misc";
 import { filters, findBulk } from "../../../webpack";
 import { Alerts, UserStore } from "../../../webpack/common";
 import { Review } from "../entities/Review";
 import { deleteReview, reportReview } from "../Utils/ReviewDBAPI";
 import { canDeleteReview, openUserProfileModal, showToast } from "../Utils/Utils";
 import MessageButton from "./MessageButton";
+import ReviewBadge from "./ReviewBadge";
 
 export default LazyComponent(() => {
     // this is terrible, blame mantika
     const p = filters.byProps;
     const [
-        { cozyMessage, buttons, message, groupStart },
+        { cozyMessage, buttons },
         { container, isHeader },
-        { avatar, clickable, username, messageContent, wrapper, cozy },
+        { avatar, clickable, messageContent, wrapper, cozy },
         { contents },
         buttonClasses,
         { defaultColor }
@@ -77,23 +78,32 @@ export default LazyComponent(() => {
         }
 
         return (
-            <div className={classes(cozyMessage, message, groupStart, wrapper, cozy)}>
-                <div className={contents}>
+            <div className={classes(cozyMessage, wrapper)} style={
+                {
+                    marginLeft: "0px",
+                    paddingLeft: "52px",
+                    paddingRight: "16px"
+                }
+            }>
+
+                <div className={contents} style={{ paddingLeft: "0px" }}>
                     <img
                         className={classes(avatar, clickable)}
                         onClick={openModal}
                         src={review.profile_photo || "/assets/1f0bfc0865d324c2587920a7d80c609b.png?size=128"}
+                        style={{ left: "0px" }}
                     />
                     <span
-                        className={classes(username, clickable)}
-                        style={{ color: "var(--text-muted)" }}
+                        className={classes(clickable)}
+                        style={{ color: "var(--channels-default)", fontSize: "14px" }}
                         onClick={() => openModal()}
                     >
                         {review.username}
                     </span>
+                    {review.badges.map(badge => <ReviewBadge {...badge} />)}
                     <p
                         className={classes(messageContent, defaultColor)}
-                        style={{ fontSize: 15, marginTop: 4 }}
+                        style={{ fontSize: 15, marginTop: 4, marginRight: "0px" }}
                     >
                         {review.comment}
                     </p>

src/plugins/reviewDB/components/ReviewsView.tsx

@@ -51,7 +51,6 @@ export default function ReviewsView({ userId }: { userId: string; }) {
                 tag="h2"
                 variant="eyebrow"
                 style={{
-                    paddingLeft: "12px",
                     marginBottom: "12px",
                     color: "var(--header-primary)"
                 }}
@@ -66,16 +65,19 @@ export default function ReviewsView({ userId }: { userId: string; }) {
                 />
             )}
             {reviews?.length === 0 && (
-                <Forms.FormText style={{ paddingLeft: "12px", paddingRight: "12px" }}>
+                <Forms.FormText style={{ padding: "12px", paddingTop: "0px", paddingLeft: "4px", fontWeight: "bold", fontStyle: "italic" }}>
                     Looks like nobody reviewed this user yet. You could be the first!
                 </Forms.FormText>
             )}
             <textarea
-                className={Classes.textarea}
+                className={Classes.textarea.replace("textarea", "")}
+                // this produces something like '-_59yqs ...' but since no class exists with that name its fine
                 placeholder="Enter a comment"
                 onKeyDown={onKeyPress}
                 style={{
-                    padding: "12px",
+                    marginTop: "6px",
+                    resize: "none",
+                    marginBottom: "12px",
                 }}
             />
         </>

src/plugins/reviewDB/entities/Badge.ts

@@ -0,0 +1,6 @@
+export default interface Badge {
+    badge_name: string,
+    badge_icon: string,
+    redirect_url: string,
+    badge_type: number,
+}

src/plugins/reviewDB/entities/Review.ts

@@ -16,6 +16,8 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
+import Badge from "./Badge";
+
 export interface Review {
     comment: string,
     id: number,
@@ -24,4 +26,5 @@ export interface Review {
     star: number,
     username: string,
     profile_photo: string;
+    badges: Badge[];
 }