feat: port DeleteMessage and Confirmation

src/controllers/modals/ModalController.tsx

@@ -20,10 +20,12 @@ import AddFriend from "./components/AddFriend";
 import Changelog from "./components/Changelog";
 import ChannelInfo from "./components/ChannelInfo";
 import Clipboard from "./components/Clipboard";
+import Confirmation from "./components/Confirmation";
 import CreateGroup from "./components/CreateGroup";
 import CreateRole from "./components/CreateRole";
 import CreateServer from "./components/CreateServer";
 import CustomStatus from "./components/CustomStatus";
+import DeleteMessage from "./components/DeleteMessage";
 import Error from "./components/Error";
 import ImageViewer from "./components/ImageViewer";
 import LinkWarning from "./components/LinkWarning";
@@ -231,11 +233,20 @@ export const modalController = new ModalControllerExtended({
     changelog: Changelog,
     channel_info: ChannelInfo,
     clipboard: Clipboard,
+    leave_group: Confirmation,
+    close_dm: Confirmation,
+    leave_server: Confirmation,
+    delete_server: Confirmation,
+    delete_channel: Confirmation,
+    delete_bot: Confirmation,
+    block_user: Confirmation,
+    unfriend_user: Confirmation,
     create_group: CreateGroup,
     create_role: CreateRole,
     create_server: CreateServer,
     create_bot: CreateBotModal,
     custom_status: CustomStatus,
+    delete_message: DeleteMessage,
     error: Error,
     image_viewer: ImageViewer,
     link_warning: LinkWarning,

src/controllers/modals/components/Confirmation.tsx

@@ -0,0 +1,101 @@
+import { useHistory } from "react-router-dom";
+
+import { Text } from "preact-i18n";
+
+import { ModalForm } from "@revoltchat/ui";
+
+import { TextReact } from "../../../lib/i18n";
+
+import { clientController } from "../../client/ClientController";
+import { ModalProps } from "../types";
+
+/**
+ * Confirmation modal
+ */
+export default function Confirmation(
+    props: ModalProps<
+        | "leave_group"
+        | "close_dm"
+        | "leave_server"
+        | "delete_server"
+        | "delete_channel"
+        | "delete_bot"
+        | "block_user"
+        | "unfriend_user"
+    >,
+) {
+    const history = useHistory();
+
+    const EVENTS = {
+        close_dm: ["confirm_close_dm", "close"],
+        delete_server: ["confirm_delete", "delete"],
+        delete_channel: ["confirm_delete", "delete"],
+        delete_bot: ["confirm_delete", "delete"],
+        leave_group: ["confirm_leave", "leave"],
+        leave_server: ["confirm_leave", "leave"],
+        unfriend_user: ["unfriend_user", "remove"],
+        block_user: ["block_user", "block"],
+    };
+
+    const event = EVENTS[props.type];
+    let name;
+    switch (props.type) {
+        case "unfriend_user":
+        case "block_user":
+            name = props.target.username;
+            break;
+        case "close_dm":
+            name = props.target.recipient?.username;
+            break;
+        case "delete_bot":
+            name = props.name;
+            break;
+        default:
+            name = props.target.name;
+    }
+
+    return (
+        <ModalForm
+            {...props}
+            title={
+                <Text
+                    id={`app.special.modals.prompt.${event[0]}`}
+                    fields={{ name }}
+                />
+            }
+            description={
+                <TextReact
+                    id={`app.special.modals.prompt.${event[0]}_long`}
+                    fields={{ name: <b>{name}</b> }}
+                />
+            }
+            data={{}}
+            schema={{}}
+            callback={async () => {
+                switch (props.type) {
+                    case "unfriend_user":
+                        await props.target.removeFriend();
+                        break;
+                    case "block_user":
+                        await props.target.blockUser();
+                        break;
+                    case "leave_group":
+                    case "close_dm":
+                    case "delete_channel":
+                    case "leave_server":
+                    case "delete_server":
+                        if (props.type != "delete_channel") history.push("/");
+
+                        props.target.delete();
+                        break;
+                    case "delete_bot":
+                        clientController
+                            .getAvailableClient()
+                            .bots.delete(props.target);
+                        props.cb?.();
+                        break;
+                }
+            }}
+        />
+    );
+}

src/controllers/modals/components/DeleteMessage.tsx

@@ -0,0 +1,35 @@
+import { Text } from "preact-i18n";
+
+import { ModalForm } from "@revoltchat/ui";
+
+import Message from "../../../components/common/messaging/Message";
+import { ModalProps } from "../types";
+
+/**
+ * Delete message modal
+ */
+export default function DeleteMessage({
+    target,
+    ...props
+}: ModalProps<"delete_message">) {
+    return (
+        <ModalForm
+            {...props}
+            title={<Text id={"app.context_menu.delete_message"} />}
+            description={
+                <Text
+                    id={`app.special.modals.prompt.confirm_delete_message_long`}
+                />
+            }
+            schema={{
+                message: "custom",
+            }}
+            data={{
+                message: {
+                    element: <Message message={target} head={true} contrast />,
+                },
+            }}
+            callback={() => target.delete()}
+        />
+    );
+}

src/controllers/modals/types.ts

@@ -1,4 +1,4 @@
-import { API, Client, User, Member, Channel, Server } from "revolt.js";
+import { API, Client, User, Member, Channel, Server, Message } from "revolt.js";
 
 export type Modal = {
     key?: string;
@@ -117,6 +117,69 @@ export type Modal = {
           server: Server;
           callback: (id: string) => void;
       }
+    | {
+          type: "leave_group";
+          target: Channel;
+      }
+    | {
+          type: "close_dm";
+          target: Channel;
+      }
+    | {
+          type: "delete_channel";
+          target: Channel;
+      }
+    | {
+          type: "create_invite";
+          target: Channel;
+      }
+    | {
+          type: "leave_server";
+          target: Server;
+      }
+    | {
+          type: "delete_server";
+          target: Server;
+      }
+    | {
+          type: "delete_bot";
+          target: string;
+          name: string;
+          cb?: () => void;
+      }
+    | {
+          type: "delete_message";
+          target: Message;
+      }
+    | {
+          type: "kick_member";
+          member: Member;
+      }
+    | {
+          type: "ban_member";
+          member: Member;
+      }
+    | {
+          type: "unfriend_user";
+          target: User;
+      }
+    | {
+          type: "block_user";
+          target: User;
+      }
+    | {
+          type: "create_channel";
+          target: Server;
+          cb?: (
+              channel: Channel & {
+                  channel_type: "TextChannel" | "VoiceChannel";
+              },
+          ) => void;
+      }
+    | {
+          type: "create_category";
+          target: Server;
+      }
 );
 
 export type ModalProps<T extends Modal["type"]> = Modal & { type: T } & {