From a4519b795ae008ab5741db6816eaa23dc30d8226 Mon Sep 17 00:00:00 2001 From: SammCheese Date: Wed, 28 Dec 2022 03:27:40 +0100 Subject: [PATCH] Modal UI overhaul --- manifest.json | 2 +- scripts/build.ts | 1 + src/assets/chatbarLock.tsx | 2 +- src/assets/popoverIcon.tsx | 2 +- src/components/DecryptionModal.tsx | 55 +++++++------- src/components/EncryptionModal.tsx | 74 ++++++++++--------- src/components/Modals.tsx | 112 ----------------------------- src/index.ts | 17 +++-- 8 files changed, 87 insertions(+), 178 deletions(-) delete mode 100644 src/components/Modals.tsx diff --git a/manifest.json b/manifest.json index 7a6ea99..b3dd023 100644 --- a/manifest.json +++ b/manifest.json @@ -7,7 +7,7 @@ "discordID": "372148345894076416", "github": "SammCheese" }, - "version": "1.0.6", + "version": "1.1.0", "updater": { "type": "github", "id": "SammCheese/invisible-chat" diff --git a/scripts/build.ts b/scripts/build.ts index 4850833..6d68cdd 100644 --- a/scripts/build.ts +++ b/scripts/build.ts @@ -25,6 +25,7 @@ const globalModules = { "ignition", "plugins", "util", + "components", ], defaultExport: true, }, diff --git a/src/assets/chatbarLock.tsx b/src/assets/chatbarLock.tsx index 45d4b63..1849701 100644 --- a/src/assets/chatbarLock.tsx +++ b/src/assets/chatbarLock.tsx @@ -6,7 +6,7 @@ const { React } = common; export const chatbarLock = ( ( - + ); diff --git a/src/components/DecryptionModal.tsx b/src/components/DecryptionModal.tsx index 5e2aa4c..b81e98f 100644 --- a/src/components/DecryptionModal.tsx +++ b/src/components/DecryptionModal.tsx @@ -1,56 +1,55 @@ -import { common, webpack } from "replugged"; -import { - ModalContent, - ModalFooter, - ModalHeader, - ModalProps, - ModalRoot, - closeModal, - openModal, -} from "./Modals"; +import { common, components, webpack } from "replugged"; import { buildEmbed, decrypt } from "../index"; + const { React } = common; +const { Button, Modal } = components; +// @ts-expect-error Package doesnt include it yet +const { closeModal, openModal } = common.modal; + +const FormText = components.FormText.DEFAULT; const rawTextInput: any = webpack.waitForModule( webpack.filters.byProps("defaultProps", "Sizes", "contextType"), ); -const rawButton = webpack.waitForModule(webpack.filters.byProps("Hovers", "Looks", "Sizes")); - -let Button: any; let TextInput: any; export async function initDecModal() { TextInput = webpack.getExportsForProps(await rawTextInput, ["contextType"]); - Button = webpack.getExportsForProps(await rawButton, ["Link"]); } let modalKey: any; +interface ModalProps { + transitionState: any; + onClose(): Promise; +} + function DecModal(props: ModalProps) { // @ts-ignore let secret: string = props?.message?.content; let [password, setPassword] = React.useState("password"); return ( - - -
Decrypt Message
- - -
Secret
+ + + Decrypt Message + + + Secret -
Password
+ Password { setPassword(e); }}>
- - + + - - + + ); } export function buildDecModal(msg: any): any { - modalKey = openModal((props) => ); + modalKey = openModal((props: JSX.IntrinsicAttributes & ModalProps) => ( + + )); } diff --git a/src/components/EncryptionModal.tsx b/src/components/EncryptionModal.tsx index b9a287d..080a829 100644 --- a/src/components/EncryptionModal.tsx +++ b/src/components/EncryptionModal.tsx @@ -1,95 +1,103 @@ -import { common, webpack } from "replugged"; -import { - ModalContent, - ModalFooter, - ModalHeader, - ModalProps, - ModalRoot, - ModalSize, - closeModal, - openModal, -} from "./Modals"; +import { common, components, webpack } from "replugged"; import { encrypt } from "../index"; const { React } = common; +// @ts-expect-error Package not updated yet +const { closeModal, openModal } = common.modal; +const { Button, SwitchItem, Modal, Divider } = components; +const FormText = components.FormText.DEFAULT; const rawTextInput: any = webpack.waitForModule( webpack.filters.byProps("defaultProps", "Sizes", "contextType"), ); -const rawButton = webpack.waitForModule(webpack.filters.byProps("Hovers", "Looks", "Sizes")); - -let Button: any; let TextInput: any; export async function initEncModal() { TextInput = webpack.getExportsForProps(await rawTextInput, ["contextType"]); - Button = webpack.getExportsForProps(await rawButton, ["Link"]); } let modalKey: any; -export function EncModal(props: ModalProps) { +interface ModalProps { + transitionState: any; + onClose(): Promise; +} + +function EncModal(props: ModalProps) { let [secret, setSecret] = React.useState(""); let [cover, setCover] = React.useState(""); let [password, setPassword] = React.useState("password"); + let [DontUseCover, setDontUseCover] = React.useState(false); - const valid = secret && cover && /\w \w/.test(cover); + const valid = secret && DontUseCover ? true : cover && /\w \w/.test(cover); return ( - - -
Encrypt Message
- - -
Secret
+ + + Encrypt Message + + + Secret Message { setSecret(e); }}> -
Cover (2 or more Words!!)
+ Cover (2 or more Words!!) { setCover(e); }}> -
Password
+ Password { setPassword(e); }}> - - + + { + console.log(e); + setDontUseCover(e); + }}> + Don't use a cover + + + - - + + ); } export function buildEncModal(): any { - modalKey = openModal((props) => ); + modalKey = openModal((props: JSX.IntrinsicAttributes & ModalProps) => ); } diff --git a/src/components/Modals.tsx b/src/components/Modals.tsx deleted file mode 100644 index 60ca59f..0000000 --- a/src/components/Modals.tsx +++ /dev/null @@ -1,112 +0,0 @@ -/* eslint-disable no-unused-vars */ -// Lots of shit is from VENCORD -// https://github.com/Vendicated/Vencord -// https://github.com/Vendicated/Vencord/blob/main/src/utils/modal.tsx - -import { common, webpack } from "replugged"; -const { React } = common; - -enum ModalTransitionState { - ENTERING, - ENTERED, - EXITING, - EXITED, - HIDDEN, -} - -export enum ModalSize { - SMALL = "small", - MEDIUM = "medium", - LARGE = "large", - DYNAMIC = "dynamic", -} - -export interface ModalProps { - transitionState: ModalTransitionState; - onClose(): Promise; -} - -export interface ModalOptions { - modalKey?: string; - onCloseRequest?: () => void; - onCloseCallback?: () => void; -} - -/*interface ModalAPI { - openModal: undefined | ((modal: any) => void); - closeModal: undefined | ((modal: any) => void); -}*/ - -interface Modals { - ModalRoot: any; - ModalHeader: any; - ModalContent: any; - ModalFooter: any; - ModalCloseButton: any; -} - -interface ModalRootProps { - transitionState?: ModalTransitionState; - /* eslint-disable */ - children: React.ReactNode; - size?: ModalSize; - role?: "alertdialog" | "dialog"; - className?: string; - onAnimationEnd?(): string; -} - -type RenderFunction = (props: ModalProps) => React.ReactNode; - -export let ModalAPI: any; -export let Modals: Modals; - -export async function initModals() { - let rawModalModule = webpack.waitForModule(webpack.filters.bySource("onCloseRequest:null!=")); - let rawModalsModule = webpack.waitForModule( - webpack.filters.bySource("().closeWithCircleBackground"), - ); - - ModalAPI = { - // @ts-ignore - openModal: webpack.getFunctionBySource("onCloseRequest:null!=", await rawModalModule), - // @ts-ignore - closeModal: webpack.getFunctionBySource("onCloseCallback&&", await rawModalModule), - }; - - Modals = { - // @ts-ignore - ModalRoot: webpack.getFunctionBySource("().root", await rawModalsModule), - // @ts-ignore - ModalHeader: webpack.getFunctionBySource("().header", await rawModalsModule)!, - // @ts-ignore - ModalContent: webpack.getFunctionBySource("().content", await rawModalsModule)!, - // @ts-ignore - ModalFooter: webpack.getFunctionBySource("().footerSeparator", await rawModalsModule)!, - ModalCloseButton: webpack.getFunctionBySource( - "().closeWithCircleBackground", - // @ts-ignore - await rawModalsModule, - )!, - }; -} - -export const ModalRoot = (props: ModalRootProps) => ; -export const ModalHeader = (props: any) => ; -export const ModalContent = (props: any) => ; -export const ModalFooter = (props: any) => ; -export const ModalCloseButton = (props: any) => ; - -export function openModal( - render: RenderFunction, - options?: ModalOptions, - contextKey?: string, -): string { - return ModalAPI.openModal(render, options, contextKey); -} - -/** - * Close a modal by its key - */ -export function closeModal(modalKey: string, contextKey?: string): void { - return ModalAPI.closeModal(modalKey, contextKey); -} diff --git a/src/index.ts b/src/index.ts index 00dac01..c4195cc 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,10 +1,8 @@ import { common } from "replugged"; +import { Indicator } from "./assets/indicator"; import { popoverIcon } from "./assets/popoverIcon"; import { chatbarLock } from "./assets/chatbarLock"; -import { Indicator } from "./assets/indicator"; - -import { initModals } from "./components/Modals"; import { initEncModal } from "./components/EncryptionModal"; import { buildDecModal, initDecModal } from "./components/DecryptionModal"; @@ -58,7 +56,6 @@ export async function start(): Promise { steggo = await new StegCloak(true, false); // Prepare Modals - await initModals(); await initDecModal(); await initEncModal(); @@ -99,6 +96,18 @@ async function getEmbed(url: URL): Promise { return await rawRes.json(); } +export function removeEmbed(message: unknown): void { + // @ts-expect-error not typed + for (let embed in message.embeds) { + // @ts-expect-error not typed + if (message.embeds[embed]?.footer?.text.includes("c0dine and Sammy!")) { + // @ts-expect-error not typed + message.embeds.splice(embed, 1); + } + } + updateMessage(message); +} + export async function buildEmbed(message: unknown, revealed: string): Promise { const urlCheck = revealed.match(URL_DETECTION) || [];