From 7174d2e7448985ed5aeb9e483c75bcc896b78124 Mon Sep 17 00:00:00 2001 From: Lewis Crichton Date: Fri, 8 Sep 2023 16:35:37 +0100 Subject: [PATCH] perf: move theme parsing out of natives to prevent duplicate dependencies --- src/VencordNative.ts | 3 +- src/components/VencordSettings/ThemesTab.tsx | 26 +++++++++++++-- src/main/ipcMain.ts | 35 +++----------------- src/utils/themes/usercss/compiler.ts | 2 +- src/utils/themes/usercss/index.ts | 2 +- 5 files changed, 32 insertions(+), 36 deletions(-) diff --git a/src/VencordNative.ts b/src/VencordNative.ts index dc6042c2..5426fa35 100644 --- a/src/VencordNative.ts +++ b/src/VencordNative.ts @@ -5,7 +5,6 @@ */ import { IpcEvents } from "@utils/IpcEvents"; -import type { ThemeHeader } from "@utils/themes"; import { IpcRes } from "@utils/types"; import { ipcRenderer } from "electron"; @@ -22,7 +21,7 @@ export default { uploadTheme: (fileName: string, fileData: string) => invoke(IpcEvents.UPLOAD_THEME, fileName, fileData), deleteTheme: (fileName: string) => invoke(IpcEvents.DELETE_THEME, fileName), getThemesDir: () => invoke(IpcEvents.GET_THEMES_DIR), - getThemesList: () => invoke>(IpcEvents.GET_THEMES_LIST), + getThemesList: () => invoke>(IpcEvents.GET_THEMES_LIST), getThemeData: (fileName: string) => invoke(IpcEvents.GET_THEME_DATA, fileName) }, diff --git a/src/components/VencordSettings/ThemesTab.tsx b/src/components/VencordSettings/ThemesTab.tsx index 95dcc60f..b6cf1168 100644 --- a/src/components/VencordSettings/ThemesTab.tsx +++ b/src/components/VencordSettings/ThemesTab.tsx @@ -25,7 +25,8 @@ import { classes } from "@utils/misc"; import { showItemInFolder } from "@utils/native"; import { useAwaiter } from "@utils/react"; import type { ThemeHeader } from "@utils/themes"; -import type { UserThemeHeader } from "@utils/themes/bd"; +import { getThemeInfo, stripBOM, type UserThemeHeader } from "@utils/themes/bd"; +import { usercssParse } from "@utils/themes/usercss"; import { findByCodeLazy, findByPropsLazy, findLazy } from "@webpack"; import { Button, Card, FluxDispatcher, Forms, React, showToast, TabBar, TextArea, useEffect, useRef, useState } from "@webpack/common"; import type { ComponentType, Ref, SyntheticEvent } from "react"; @@ -206,7 +207,28 @@ function ThemesTab() { async function refreshLocalThemes() { const themes = await VencordNative.themes.getThemesList(); - setUserThemes(themes); + + const themeInfo: ThemeHeader[] = []; + + for (const { fileName, content } of themes) { + if (!fileName.endsWith(".css")) continue; + + if (fileName.endsWith(".user.css")) { + // handle it as usercss + themeInfo.push({ + type: "usercss", + header: usercssParse(content, fileName) + }); + } else { + // presumably BD but could also be plain css + themeInfo.push({ + type: "bd", + header: getThemeInfo(stripBOM(content), fileName) + }); + } + } + + setUserThemes(themeInfo); } // When a local theme is enabled/disabled, update the settings diff --git a/src/main/ipcMain.ts b/src/main/ipcMain.ts index f7f12451..95a7c386 100644 --- a/src/main/ipcMain.ts +++ b/src/main/ipcMain.ts @@ -22,9 +22,6 @@ import "./ipcPlugins"; import { debounce } from "@utils/debounce"; import { IpcEvents } from "@utils/IpcEvents"; import { Queue } from "@utils/Queue"; -import type { ThemeHeader } from "@utils/themes"; -import { getThemeInfo, stripBOM } from "@utils/themes/bd"; -import { parse as usercssParse } from "@utils/themes/usercss"; import { BrowserWindow, ipcMain, shell } from "electron"; import { mkdirSync, readFileSync, watch } from "fs"; import { open, readdir, readFile, writeFile } from "fs/promises"; @@ -49,33 +46,11 @@ function readCss() { return readFile(QUICKCSS_PATH, "utf-8").catch(() => ""); } -async function listThemes(): Promise { - const files = await readdir(THEMES_DIR).catch(() => []); - - const themeInfo: ThemeHeader[] = []; - - for (const fileName of files) { - if (!fileName.endsWith(".css")) continue; - - const data = await getThemeData(fileName).then(stripBOM).catch(() => null); - if (data == null) continue; - - if (fileName.endsWith(".user.css")) { - // handle it as usercss - themeInfo.push({ - type: "usercss", - header: usercssParse(data, fileName) - }); - } else { - // presumably BD but could also be plain css - themeInfo.push({ - type: "bd", - header: getThemeInfo(data, fileName) - }); - } - } - - return themeInfo; +function listThemes(): Promise<{ fileName: string; content: string; }[]> { + return readdir(THEMES_DIR) + .then(files => + Promise.all(files.map(async fileName => ({ fileName, content: await getThemeData(fileName) })))) + .catch(() => []); } function getThemeData(fileName: string) { diff --git a/src/utils/themes/usercss/compiler.ts b/src/utils/themes/usercss/compiler.ts index cb13a978..be05ce4f 100644 --- a/src/utils/themes/usercss/compiler.ts +++ b/src/utils/themes/usercss/compiler.ts @@ -8,7 +8,7 @@ import { Settings } from "@api/Settings"; import { getLess, getStylus } from "@utils/dependencies"; import { Logger } from "@utils/Logger"; -import { parse as usercssParse } from "."; +import { usercssParse as usercssParse } from "."; const UserCSSLogger = new Logger("UserCSS:Compiler", "#d2acf5"); diff --git a/src/utils/themes/usercss/index.ts b/src/utils/themes/usercss/index.ts index d5d2f389..3c51e38f 100644 --- a/src/utils/themes/usercss/index.ts +++ b/src/utils/themes/usercss/index.ts @@ -9,7 +9,7 @@ import { parse as originalParse, UserstyleHeader } from "usercss-meta"; const UserCSSLogger = new Logger("UserCSS", "#d2acf5"); -export function parse(text: string, fileName: string): UserstyleHeader { +export function usercssParse(text: string, fileName: string): UserstyleHeader { var { metadata, errors } = originalParse(text.replace(/\r/g, ""), { allowErrors: true }); if (errors.length) {