split up webpack commons into categories & type everything (#455)

2 files changed, 60 insertions, 44 deletions

diff --git a/src/utils/misc.tsx b/src/utils/misc.tsx
index 0ef7ffb..c64d9e1 100644
--- a/src/utils/misc.tsx
+++ b/src/utils/misc.tsx
@@ -153,34 +153,6 @@ export function sleep(ms: number): Promise<void> {
 }
 
 /**
- * Wraps a Function into a try catch block and logs any errors caught
- * Due to the nature of this function, not all paths return a result.
- * Thus, for consistency, the returned functions will always return void or Promise<void>
- *
- * @param name Name identifying the wrapped function. This will appear in the logged errors
- * @param func Function (async or sync both work)
- * @param thisObject Optional thisObject
- * @returns Wrapped Function
- */
-export function suppressErrors<F extends Function>(name: string, func: F, thisObject?: any): F {
-    return (func.constructor.name === "AsyncFunction"
-        ? async function (this: any) {
-            try {
-                await func.apply(thisObject ?? this, arguments);
-            } catch (e) {
-                console.error(`Caught an Error in ${name || "anonymous"}\n`, e);
-            }
-        }
-        : function (this: any) {
-            try {
-                func.apply(thisObject ?? this, arguments);
-            } catch (e) {
-                console.error(`Caught an Error in ${name || "anonymous"}\n`, e);
-            }
-        }) as any as F;
-}
-
-/**
  * Wrap the text in ``` with an optional language
  */
 export function makeCodeblock(text: string, language?: string) {
diff --git a/src/utils/modal.tsx b/src/utils/modal.tsx
index 73dd009..3174cac 100644
--- a/src/utils/modal.tsx
+++ b/src/utils/modal.tsx
@@ -17,6 +17,9 @@
 */
 
 import { filters, mapMangledModuleLazy } from "@webpack";
+import type { ComponentType, PropsWithChildren, ReactNode, Ref } from "react";
+
+import { LazyComponent } from "./misc";
 
 export enum ModalSize {
     SMALL = "small",
@@ -44,16 +47,7 @@ export interface ModalOptions {
     onCloseCallback?: (() => void);
 }
 
-interface ModalRootProps {
-    transitionState: ModalTransitionState;
-    children: React.ReactNode;
-    size?: ModalSize;
-    role?: "alertdialog" | "dialog";
-    className?: string;
-    onAnimationEnd?(): string;
-}
-
-type RenderFunction = (props: ModalProps) => React.ReactNode;
+type RenderFunction = (props: ModalProps) => ReactNode;
 
 export const Modals = mapMangledModuleLazy(".closeWithCircleBackground", {
     ModalRoot: filters.byCode(".root"),
@@ -61,13 +55,63 @@ export const Modals = mapMangledModuleLazy(".closeWithCircleBackground", {
     ModalContent: filters.byCode(".content"),
     ModalFooter: filters.byCode(".footerSeparator"),
     ModalCloseButton: filters.byCode(".closeWithCircleBackground"),
-});
+}) as {
+    ModalRoot: ComponentType<PropsWithChildren<{
+        transitionState: ModalTransitionState;
+        size?: ModalSize;
+        role?: "alertdialog" | "dialog";
+        className?: string;
+        fullscreenOnMobile?: boolean;
+        "aria-label"?: string;
+        "aria-labelledby"?: string;
+        onAnimationEnd?(): string;
+    }>>;
+    ModalHeader: ComponentType<PropsWithChildren<{
+        /** Flex.Justify.START */
+        justify?: string;
+        /** Flex.Direction.HORIZONTAL */
+        direction?: string;
+        /** Flex.Align.CENTER */
+        align?: string;
+        /** Flex.Wrap.NO_WRAP */
+        wrap?: string;
+        separator?: boolean;
+
+        className?: string;
+    }>>;
+    /** This also accepts Scroller props but good luck with that */
+    ModalContent: ComponentType<PropsWithChildren<{
+        className?: string;
+        scrollerRef?: Ref<HTMLElement>;
+        [prop: string]: any;
+    }>>;
+    ModalFooter: ComponentType<PropsWithChildren<{
+        /** Flex.Justify.START */
+        justify?: string;
+        /** Flex.Direction.HORIZONTAL_REVERSE */
+        direction?: string;
+        /** Flex.Align.STRETCH */
+        align?: string;
+        /** Flex.Wrap.NO_WRAP */
+        wrap?: string;
+        separator?: boolean;
+
+        className?: string;
+    }>>;
+    ModalCloseButton: ComponentType<{
+        focusProps?: any;
+        onClick(): void;
+        withCircleBackground?: boolean;
+        hideOnFullscreen?: boolean;
+        className?: string;
+    }>;
+};
 
-export const ModalRoot = (props: ModalRootProps) => <Modals.ModalRoot {...props} />;
-export const ModalHeader = (props: any) => <Modals.ModalHeader {...props} />;
-export const ModalContent = (props: any) => <Modals.ModalContent {...props} />;
-export const ModalFooter = (props: any) => <Modals.ModalFooter {...props} />;
-export const ModalCloseButton = (props: any) => <Modals.ModalCloseButton {...props} />;
+export const ModalRoot = LazyComponent(() => Modals.ModalRoot);
+export const ModalHeader = LazyComponent(() => Modals.ModalHeader);
+export const ModalContent = LazyComponent(() => Modals.ModalContent);
+export const ModalFooter = LazyComponent(() => Modals.ModalFooter);
+export const ModalCloseButton = LazyComponent(() => Modals.ModalCloseButton);
 
 const ModalAPI = mapMangledModuleLazy("onCloseRequest:null!=", {
     openModal: filters.byCode("onCloseRequest:null!="),