aboutsummaryrefslogtreecommitdiff
path: root/src/plugins/reviewDB/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/plugins/reviewDB/components')
-rw-r--r--src/plugins/reviewDB/components/ReviewBadge.tsx4
-rw-r--r--src/plugins/reviewDB/components/ReviewComponent.tsx16
-rw-r--r--src/plugins/reviewDB/components/ReviewsView.tsx119
3 files changed, 87 insertions, 52 deletions
diff --git a/src/plugins/reviewDB/components/ReviewBadge.tsx b/src/plugins/reviewDB/components/ReviewBadge.tsx
index e65dff2..3c02c35 100644
--- a/src/plugins/reviewDB/components/ReviewBadge.tsx
+++ b/src/plugins/reviewDB/components/ReviewBadge.tsx
@@ -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}
diff --git a/src/plugins/reviewDB/components/ReviewComponent.tsx b/src/plugins/reviewDB/components/ReviewComponent.tsx
index fa4cad4..1278a50 100644
--- a/src/plugins/reviewDB/components/ReviewComponent.tsx
+++ b/src/plugins/reviewDB/components/ReviewComponent.tsx
@@ -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",
diff --git a/src/plugins/reviewDB/components/ReviewsView.tsx b/src/plugins/reviewDB/components/ReviewsView.tsx
index ada0fa0..e5bc426 100644
--- a/src/plugins/reviewDB/components/ReviewsView.tsx
+++ b/src/plugins/reviewDB/components/ReviewsView.tsx
@@ -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,48 +116,82 @@ 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;
-
- 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 editorRef = useRef<any>(null);
+ const inputType = InputTypes.FORM;
+ inputType.disableAutoFocus = true;
+
+ 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
- }
- }}
- placeholder={
- !token
- ? "You need to authorize to review users!"
- : isAuthor
- ? `Update review for @${name}`
- : `Review @${name}`
- }
- onKeyDown={onKeyPress}
- onClick={() => {
+ <>
+ <div onClick={() => {
if (!token) {
showToast("Opening authorization window...");
authorize();
}
- }}
- />
+ }}>
+ <InputComponent
+ className={cl("input")}
+ channel={channel}
+ placeholder={
+ !token
+ ? "You need to authorize to review users!"
+ : isAuthor
+ ? `Update review for @${name}`
+ : `Review @${name}`
+ }
+ 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>
+
+ </>
);
}
generated by cgit (git 2.46.0) at 2025-01-08 12:12:47 +0000