ConsoleJanitor: Support allowing log levels (#3255)

Co-authored-by: Nuckyz <61953774+Nuckyz@users.noreply.github.com>

src/plugins/consoleJanitor/index.tsx

@@ -5,8 +5,11 @@
  */
 
 import { definePluginSettings } from "@api/Settings";
+import { ErrorBoundary, Flex } from "@components/index";
 import { Devs } from "@utils/constants";
-import definePlugin, { OptionType, StartAt } from "@utils/types";
+import { Margins } from "@utils/margins";
+import definePlugin, { defineDefault, OptionType, StartAt } from "@utils/types";
+import { Checkbox, Forms, Text } from "@webpack/common";
 
 const Noop = () => { };
 const NoopLogger = {
@@ -24,6 +27,48 @@ const NoopLogger = {
 
 const logAllow = new Set();
 
+interface AllowLevels {
+    error: boolean;
+    warn: boolean;
+    trace: boolean;
+    log: boolean;
+    info: boolean;
+    debug: boolean;
+}
+
+interface AllowLevelSettingProps {
+    settingKey: keyof AllowLevels;
+}
+
+function AllowLevelSetting({ settingKey }: AllowLevelSettingProps) {
+    const { allowLevel } = settings.use(["allowLevel"]);
+    const value = allowLevel[settingKey];
+
+    return (
+        <Checkbox
+            value={value}
+            onChange={(_, newValue) => settings.store.allowLevel[settingKey] = newValue}
+            size={20}
+        >
+            <Text variant="text-sm/normal">{settingKey[0].toUpperCase() + settingKey.slice(1)}</Text>
+        </Checkbox>
+    );
+}
+
+const AllowLevelSettings = ErrorBoundary.wrap(() => {
+    return (
+        <Forms.FormSection>
+            <Forms.FormTitle tag="h3">Filter List</Forms.FormTitle>
+            <Forms.FormText className={Margins.bottom8} type={Forms.FormText.Types.DESCRIPTION}>Always allow loggers of these types</Forms.FormText>
+            <Flex flexDirection="row">
+                {Object.keys(settings.store.allowLevel).map(key => (
+                    <AllowLevelSetting key={key} settingKey={key as keyof AllowLevels} />
+                ))}
+            </Flex>
+        </Forms.FormSection>
+    );
+});
+
 const settings = definePluginSettings({
     disableLoggers: {
         type: OptionType.BOOLEAN,
@@ -45,6 +90,18 @@ const settings = definePluginSettings({
             logAllow.clear();
             newVal.split(";").map(x => x.trim()).forEach(logAllow.add.bind(logAllow));
         }
+    },
+    allowLevel: {
+        type: OptionType.COMPONENT,
+        component: AllowLevelSettings,
+        default: defineDefault<AllowLevels>({
+            error: true,
+            warn: false,
+            trace: false,
+            log: false,
+            info: false,
+            debug: false
+        })
     }
 });
 
@@ -61,8 +118,9 @@ export default definePlugin({
     },
 
     NoopLogger: () => NoopLogger,
-    shouldLog(logger: string) {
-        return logAllow.has(logger);
+
+    shouldLog(logger: string, level: keyof AllowLevels) {
+        return logAllow.has(logger) || settings.store.allowLevel[level] === true;
     },
 
     patches: [
@@ -136,13 +194,13 @@ export default definePlugin({
                 replace: ""
             }
         },
-        // Patches discords generic logger function
+        // Patches Discord generic logger function
         {
             find: "Σ:",
             predicate: () => settings.store.disableLoggers,
             replacement: {
                 match: /(?<=&&)(?=console)/,
-                replace: "$self.shouldLog(arguments[0])&&"
+                replace: "$self.shouldLog(arguments[0],arguments[1])&&"
             }
         },
         {

src/utils/types.ts

@@ -26,7 +26,7 @@ import { MessageDecorationFactory } from "@api/MessageDecorations";
 import { MessageClickListener, MessageEditListener, MessageSendListener } from "@api/MessageEvents";
 import { MessagePopoverButtonFactory } from "@api/MessagePopover";
 import { FluxEvents } from "@webpack/types";
-import { JSX } from "react";
+import { ReactNode } from "react";
 import { Promisable } from "type-fest";
 
 // exists to export default definePlugin({...})
@@ -202,6 +202,10 @@ export const enum ReporterTestable {
     FluxEvents = 1 << 4
 }
 
+export function defineDefault<T = any>(value: T) {
+    return value;
+}
+
 export const enum OptionType {
     STRING,
     NUMBER,
@@ -334,7 +338,8 @@ export interface IPluginOptionComponentProps {
 
 export interface PluginSettingComponentDef {
     type: OptionType.COMPONENT;
-    component: (props: IPluginOptionComponentProps) => JSX.Element;
+    component: (props: IPluginOptionComponentProps) => ReactNode | Promise<ReactNode>;
+    default?: any;
 }
 
 /** Maps a `PluginSettingDef` to its value type */

src/webpack/common/components.ts

@@ -38,6 +38,7 @@ export const Forms = {
 export const Card = waitForComponent<t.Card>("Card", filters.componentByCode(".editable),", ".outline:"));
 export const Button = waitForComponent<t.Button>("Button", filters.componentByCode("#{intl::A11Y_LOADING_STARTED}))),!1"));
 export const Switch = waitForComponent<t.Switch>("Switch", filters.componentByCode(".labelRow,ref:", ".disabledText"));
+export const Checkbox = waitForComponent<t.Checkbox>("Checkbox", filters.componentByCode(".checkboxWrapperDisabled:"));
 
 const Tooltips = mapMangledModuleLazy(".tooltipTop,bottom:", {
     Tooltip: filters.componentByCode("this.renderTooltip()]"),

src/webpack/common/types/components.d.ts

@@ -16,7 +16,7 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import type { ComponentPropsWithRef, ComponentType, CSSProperties, FunctionComponent, HtmlHTMLAttributes, HTMLProps, JSX, KeyboardEvent, MouseEvent, PropsWithChildren, PropsWithRef, ReactNode, Ref } from "react";
+import type { ComponentPropsWithRef, ComponentType, CSSProperties, FunctionComponent, HtmlHTMLAttributes, HTMLProps, JSX, KeyboardEvent, MouseEvent, PointerEvent, PropsWithChildren, PropsWithRef, ReactNode, Ref } from "react";
 
 
 export type TextVariant = "heading-sm/normal" | "heading-sm/medium" | "heading-sm/semibold" | "heading-sm/bold" | "heading-md/normal" | "heading-md/medium" | "heading-md/semibold" | "heading-md/bold" | "heading-lg/normal" | "heading-lg/medium" | "heading-lg/semibold" | "heading-lg/bold" | "heading-xl/normal" | "heading-xl/medium" | "heading-xl/bold" | "heading-xxl/normal" | "heading-xxl/medium" | "heading-xxl/bold" | "eyebrow" | "heading-deprecated-14/normal" | "heading-deprecated-14/medium" | "heading-deprecated-14/bold" | "text-xxs/normal" | "text-xxs/medium" | "text-xxs/semibold" | "text-xxs/bold" | "text-xs/normal" | "text-xs/medium" | "text-xs/semibold" | "text-xs/bold" | "text-sm/normal" | "text-sm/medium" | "text-sm/semibold" | "text-sm/bold" | "text-md/normal" | "text-md/medium" | "text-md/semibold" | "text-md/bold" | "text-lg/normal" | "text-lg/medium" | "text-lg/semibold" | "text-lg/bold" | "display-sm" | "display-md" | "display-lg" | "code";
@@ -197,6 +197,36 @@ export type Switch = ComponentType<PropsWithChildren<{
     tooltipNote?: ReactNode;
 }>>;
 
+export type CheckboxAligns = {
+    CENTER: "center";
+    TOP: "top";
+};
+
+export type CheckboxTypes = {
+    DEFAULT: "default";
+    INVERTED: "inverted";
+    GHOST: "ghost";
+    ROW: "row";
+};
+
+export type Checkbox = ComponentType<PropsWithChildren<{
+    value: boolean;
+    onChange(event: PointerEvent, value: boolean): void;
+
+    align?: "center" | "top";
+    disabled?: boolean;
+    displayOnly?: boolean;
+    readOnly?: boolean;
+    reverse?: boolean;
+    shape?: string;
+    size?: number;
+    type?: "default" | "inverted" | "ghost" | "row";
+}>> & {
+    Shapes: Record<"BOX" | "ROUND" | "SMALL_BOX", string>;
+    Aligns: CheckboxAligns;
+    Types: CheckboxTypes;
+};
+
 export type Timestamp = ComponentType<PropsWithChildren<{
     timestamp: Date;
     isEdited?: boolean;