perf: move theme parsing out of natives to prevent duplicate dependencies

This commit is contained in:
Lewis Crichton 2023-09-08 16:35:37 +01:00
parent 9a23571b3e
commit 7174d2e744
No known key found for this signature in database
5 changed files with 32 additions and 36 deletions

View file

@ -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<void>(IpcEvents.UPLOAD_THEME, fileName, fileData),
deleteTheme: (fileName: string) => invoke<void>(IpcEvents.DELETE_THEME, fileName),
getThemesDir: () => invoke<string>(IpcEvents.GET_THEMES_DIR),
getThemesList: () => invoke<Array<ThemeHeader>>(IpcEvents.GET_THEMES_LIST),
getThemesList: () => invoke<Array<{ fileName: string; content: string; }>>(IpcEvents.GET_THEMES_LIST),
getThemeData: (fileName: string) => invoke<string | undefined>(IpcEvents.GET_THEME_DATA, fileName)
},

View file

@ -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

View file

@ -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<ThemeHeader[]> {
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) {

View file

@ -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");

View file

@ -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) {