ulysia/Vencord
1
0
Fork 0
Code Pull requests Activity

[ReviewDB] add emojis, discord markdown & notifications (#1718)

Browse source 
Co-authored-by: V <vendicated@riseup.net>
This commit is contained in:
Manti 2023-09-21 18:16:15 +03:00 committed by GitHub
parent 9550b74b2a
commit e5c0898dd6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 170 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/plugins/reviewDB/components/ReviewBadge.tsx
View file

@ -28,8 +28,8 @@ export default function ReviewBadge(badge: Badge) {
{({ onMouseEnter, onMouseLeave }) => (
<img
className={cl("badge")}
width="24px"
height="24px"
width="22px"
height="22px"
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
src={badge.icon}

16
src/plugins/reviewDB/components/ReviewComponent.tsx
View file

@ -20,7 +20,7 @@ import { openUserProfile } from "@utils/discord";
import { classes } from "@utils/misc";
import { LazyComponent } from "@utils/react";
import { filters, findBulk } from "@webpack";
import { Alerts, moment, Timestamp, UserStore } from "@webpack/common";
import { Alerts, moment, Parser, Timestamp, UserStore } from "@webpack/common";
import { Review, ReviewType } from "../entities";
import { deleteReview, reportReview } from "../reviewDbApi";
@ -30,12 +30,12 @@ import { DeleteButton, ReportButton } from "./MessageButton";
import ReviewBadge from "./ReviewBadge";
export default LazyComponent(() => {
// this is terrible, blame mantika
// this is terrible, blame ven
const p = filters.byProps;
const [
{ cozyMessage, buttons, message, buttonsInner, groupStart },
{ container, isHeader },
{ avatar, clickable, username, messageContent, wrapper, cozy },
{ avatar, clickable, username, wrapper, cozy },
buttonClasses,
botTag
] = findBulk(
@ -124,12 +124,10 @@ export default LazyComponent(() => {
</Timestamp>)
}
<p
className={classes(messageContent)}
style={{ fontSize: 15, marginTop: 4, color: "var(--text-normal)" }}
>
{review.comment}
</p>
<div className={cl("review-comment")}>
{Parser.parseGuildEventDescription(review.comment)}
</div>
{review.id !== 0 && (
<div className={classes(container, isHeader, buttons)} style={{
padding: "0px",

105
src/plugins/reviewDB/components/ReviewsView.tsx
View file

@ -16,11 +16,9 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import { classes } from "@utils/misc";
import { useAwaiter, useForceUpdater } from "@utils/react";
import { findByPropsLazy } from "@webpack";
import { Forms, React, RelationshipStore, UserStore } from "@webpack/common";
import type { KeyboardEvent } from "react";
import { LazyComponent, useAwaiter, useForceUpdater } from "@utils/react";
import { find, findByPropsLazy } from "@webpack";
import { Forms, React, RelationshipStore, useRef, UserStore } from "@webpack/common";
import { Review } from "../entities";
import { addReview, getReviews, Response, REVIEWS_PER_PAGE } from "../reviewDbApi";
@ -28,7 +26,12 @@ import { settings } from "../settings";
import { authorize, cl, showToast } from "../utils";
import ReviewComponent from "./ReviewComponent";
const Classes = findByPropsLazy("inputDefault", "editable");
const Editor = findByPropsLazy("start", "end", "addMark");
const Transform = findByPropsLazy("unwrapNodes");
const InputTypes = findByPropsLazy("VOICE_CHANNEL_STATUS", "SIDEBAR");
const InputComponent = LazyComponent(() => find(m => m?.type?.render?.toString().includes("CHANNEL_TEXT_AREA).AnalyticsLocationProvider")));
interface UserProps {
discordId: string;
@ -113,34 +116,38 @@ function ReviewList({ refetch, reviews, hideOwnReview }: { refetch(): void; revi
);
}
export function ReviewsInputComponent({ discordId, isAuthor, refetch, name }: { discordId: string, name: string; isAuthor: boolean; refetch(): void; }) {
const { token } = settings.store;
const editorRef = useRef<any>(null);
const inputType = InputTypes.FORM;
inputType.disableAutoFocus = true;
function onKeyPress({ key, target }: KeyboardEvent<HTMLTextAreaElement>) {
if (key === "Enter") {
addReview({
userid: discordId,
comment: (target as HTMLInputElement).value,
star: -1
}).then(res => {
if (res?.success) {
(target as HTMLInputElement).value = ""; // clear the input
refetch();
} else if (res?.message) {
showToast(res.message);
}
});
}
}
const channel = {
flags_: 256,
guild_id_: null,
id: "0",
getGuildId: () => null,
isPrivate: () => true,
isActiveThread: () => false,
isArchivedLockedThread: () => false,
isDM: () => true,
roles: { "0": { permissions: 0n } },
getRecipientId: () => "0",
hasFlag: () => false,
};
return (
<textarea
className={classes(Classes.inputDefault, "enter-comment", cl("input"))}
onKeyDownCapture={e => {
if (e.key === "Enter") {
e.preventDefault(); // prevent newlines
<>
<div onClick={() => {
if (!token) {
showToast("Opening authorization window...");
authorize();
}
}}
}}>
<InputComponent
className={cl("input")}
channel={channel}
placeholder={
!token
? "You need to authorize to review users!"
@ -148,13 +155,43 @@ export function ReviewsInputComponent({ discordId, isAuthor, refetch, name }: {
? `Update review for @${name}`
: `Review @${name}`
}
onKeyDown={onKeyPress}
onClick={() => {
if (!token) {
showToast("Opening authorization window...");
authorize();
type={inputType}
disableThemedBackground={true}
setEditorRef={ref => editorRef.current = ref}
textValue=""
onSubmit={
async res => {
const response = await addReview({
userid: discordId,
comment: res.value,
});
if (response?.success) {
refetch();
const slateEditor = editorRef.current.ref.current.getSlateEditor();
// clear editor
Transform.delete(slateEditor, {
at: {
anchor: Editor.start(slateEditor, []),
focus: Editor.end(slateEditor, []),
}
});
} else if (response?.message) {
showToast(response.message);
}
// even tho we need to return this, it doesnt do anything
return {
shouldClear: false,
shouldRefocus: true,
};
}
}
}}
/>
</div>
</>
);
}

15
src/plugins/reviewDB/entities.ts
View file

@ -29,6 +29,13 @@ export const enum ReviewType {
System = 3
}
export const enum NotificationType {
Info = 0,
Ban = 1,
Unban = 2,
Warning = 3
}
export interface Badge {
name: string;
description: string;
@ -45,6 +52,13 @@ export interface BanInfo {
banEndDate: number;
}
export interface Notification {
id: number;
title: string;
content: string;
type: NotificationType;
}
export interface ReviewDBUser {
ID: number;
discordID: string;
@ -54,6 +68,7 @@ export interface ReviewDBUser {
warningCount: number;
badges: any[];
banInfo: BanInfo | null;
notification: Notification | null;
lastReviewID: number;
type: UserType;
}

45
src/plugins/reviewDB/index.tsx
View file

@ -24,13 +24,13 @@ import ExpandableHeader from "@components/ExpandableHeader";
import { OpenExternalIcon } from "@components/Icons";
import { Devs } from "@utils/constants";
import definePlugin from "@utils/types";
import { Alerts, Menu, useState } from "@webpack/common";
import { Alerts, Menu, Parser, useState } from "@webpack/common";
import { Guild, User } from "discord-types/general";
import { openReviewsModal } from "./components/ReviewModal";
import ReviewsView from "./components/ReviewsView";
import { UserType } from "./entities";
import { getCurrentUserInfo } from "./reviewDbApi";
import { NotificationType } from "./entities";
import { getCurrentUserInfo, readNotification } from "./reviewDbApi";
import { settings } from "./settings";
import { showToast } from "./utils";
@ -78,26 +78,8 @@ export default definePlugin({
addContextMenuPatch("guild-header-popout", guildPopoutPatch);
if (user.banInfo) {
const endDate = new Date(user.banInfo.banEndDate);
if (endDate.getTime() > Date.now() && (s.user?.banInfo?.banEndDate ?? 0) < endDate.getTime()) {
Alerts.show({
title: "You have been banned from ReviewDB",
body: (
<>
<p>
You are banned from ReviewDB {
user.type === UserType.Banned
? "permanently"
: "until " + endDate.toLocaleString()
}
</p>
{user.banInfo.reviewContent && (
<p>Offending Review: {user.banInfo.reviewContent}</p>
)}
<p>Continued offenses will result in a permanent ban.</p>
</>
),
if (user.notification) {
const props = user.notification.type === NotificationType.Ban ? {
cancelText: "Appeal",
confirmText: "Ok",
onCancel: () =>
@ -108,10 +90,21 @@ export default definePlugin({
page: "dashboard/appeal"
})
)
});
}
}
} : {};
Alerts.show({
title: user.notification.title,
body: (
Parser.parse(
user.notification.content,
false
)
),
...props
});
readNotification(user.notification.id);
}
s.user = user;
}, 4000);
},

9
src/plugins/reviewDB/reviewDbApi.ts
View file

@ -140,3 +140,12 @@ export function getCurrentUserInfo(token: string): Promise<ReviewDBUser> {
method: "POST",
}).then(r => r.json());
}
export function readNotification(id: number) {
return fetch(API_URL + `/api/reviewdb/notifications?id=${id}`, {
method: "PATCH",
headers: {
"Authorization": settings.store.token || "",
},
});
}

37
src/plugins/reviewDB/style.css
View file

@ -14,7 +14,16 @@
overflow: hidden;
background: transparent;
border: 1px solid var(--profile-message-input-border-color);
font-size: 14px;
}
.vc-rdb-modal-footer > div {
width: 100%;
margin: 6px 16px;
}
/* When input becomes disabled(while sending review), input adds unneccesary padding to left, this prevents it */
.vc-rdb-input > div > div {
padding-left: 0 !important;
}
.vc-rdb-placeholder {
@ -24,13 +33,12 @@
color: var(--text-muted);
}
.vc-rdb-modal-footer {
padding: 0;
.vc-rdb-input * {
font-size: 14px;
}
.vc-rdb-modal-footer > div {
width: 100%;
margin: 6px 16px;
.vc-rdb-modal-footer {
padding: 0;
}
.vc-rdb-modal-footer .vc-rdb-input {
@ -49,3 +57,20 @@
.vc-rdb-modal-reviews {
margin-top: 16px;
}
.vc-rdb-review {
margin-top: 8px;
margin-bottom: 8px;
}
.vc-rdb-review-comment img {
vertical-align: text-top;
}
.vc-rdb-review-comment {
overflow-y: hidden;
margin-top: 1px;
margin-bottom: 8px;
color: var(--text-normal);
font-size: 15px;
}