fix(exprs): fetch ventex in cool mode

This commit is contained in:
uku 2024-11-01 21:38:17 +01:00
parent 266cef9baf
commit e2f73b4e51
Signed by: uku
SSH key fingerprint: SHA256:4P0aN6M8ajKukNi6aPOaX0LacanGYtlfjmN+m/sHY/o
2 changed files with 11 additions and 130 deletions

View file

@ -12,7 +12,7 @@ vencord-input: final: prev: {
idea-ultimate-fixed = prev.callPackage ./idea-fixed.nix {};
vencord = prev.vencord.overrideAttrs (old: {
vencord = prev.vencord.overrideAttrs (old: rec {
src =
vencord-input
// {
@ -20,6 +20,15 @@ vencord-input: final: prev: {
repo = "Vencord";
};
patches = old.patches or [] ++ [./ventex.patch];
ventex = prev.fetchFromGitHub {
owner = "vgskye";
repo = "ventex";
rev = "158c14e7d88acb140a71766c514d8a3724d260cd";
hash = "sha256-Svc8dI2weFcqPSk064t/pL/4Hopn6/mWP6cIrT+FIr8=";
};
postConfigure = ''
cp -r ${ventex} src/plugins/ventex
'';
});
}

View file

@ -1,128 +0,0 @@
diff --git a/src/plugins/ventex/README.md b/src/plugins/ventex/README.md
new file mode 100644
index 00000000..3a0dc43d
--- /dev/null
+++ b/src/plugins/ventex/README.md
@@ -0,0 +1,4 @@
+# vencord katex thing
+[forum guidelines told me to link this](https://docs.vencord.dev/installing/custom-plugins/)
+
+renders inline codeblocks starting and ending in `$` and codeblocks with the language `latex` in TeX using KaTeX
\ No newline at end of file
diff --git a/src/plugins/ventex/index.tsx b/src/plugins/ventex/index.tsx
new file mode 100644
index 00000000..11fc0d22
--- /dev/null
+++ b/src/plugins/ventex/index.tsx
@@ -0,0 +1,97 @@
+import "./katex.css";
+
+import { Devs } from "@utils/constants";
+import definePlugin, { ReporterTestable } from "@utils/types";
+import { makeLazy } from "@utils/lazy";
+import { React, useEffect, useMemo, useState } from "@webpack/common";
+
+// @ts-expect-error
+export const getKatex = /* #__PURE__*/ makeLazy(async () => (await import("https://unpkg.com/katex@0.16.9/dist/katex.mjs")).default);
+
+export function useKatex() {
+ const [katex, setKatex] = useState();
+ useEffect(() => {
+ if (katex === undefined)
+ getKatex().then(setKatex);
+ });
+ return katex;
+}
+
+// @ts-expect-error
+export const getDomPurify = /* #__PURE__*/ makeLazy(async () => (await import("https://unpkg.com/dompurify@3.1.7/dist/purify.es.mjs")).default);
+
+export function useDomPurify() {
+ const [domPurify, setDomPurify] = useState();
+ useEffect(() => {
+ if (domPurify === undefined)
+ getDomPurify().then(setDomPurify);
+ });
+ return domPurify;
+}
+
+export interface HighlighterProps {
+ lang?: string;
+ content: string;
+ isPreview: boolean;
+ tempSettings?: Record<string, any>;
+}
+
+export default definePlugin({
+ name: "KaTeX",
+ description: "TeX typesetting in discord",
+ authors: [Devs.skyevg],
+ reporterTestable: ReporterTestable.Patches,
+
+ patches: [
+ {
+ find: "codeBlock:{react(",
+ replacement: {
+ match: /codeBlock:\{react\((\i),(\i),(\i)\)\{/,
+ replace: "$&if($1.lang == 'latex') return $self.createBlock($1,$2,$3);"
+ }
+ },
+ {
+ find: "inlineCode:{react:(",
+ replacement: {
+ match: /inlineCode:\{react:\((\i),(\i),(\i)\)=>/,
+ replace: "$&($1.content.startsWith('$$') && $1.content.endsWith('$$'))?$self.createInline($1,$2,$3):"
+ }
+ }
+ ],
+ start: async () => {
+ useKatex();
+ useDomPurify();
+ },
+ stop: () => {
+ },
+
+ createBlock: (props: HighlighterProps) => (
+ <LazyLatex displayMode formula={props.content} />
+ ),
+ createInline: (props: HighlighterProps) => (
+ <LazyLatex formula={props.content.substring(1, props.content.length - 1)} />
+ ),
+});
+
+function LazyLatex(props) {
+ const { formula } = props;
+ const katex = useKatex();
+ const domPurify = useDomPurify();
+ return katex && domPurify
+ ? <Latex {...props} katex={katex} domPurify={domPurify} />
+ : <code>{formula}</code>;
+}
+
+function Latex({ katex, formula, displayMode, domPurify }) {
+ const result = useMemo(() => {
+ const html = katex.renderToString(formula, {
+ displayMode,
+ throwOnError: false
+ });
+ return domPurify.sanitize(html);
+ }, [formula, displayMode]);
+
+ return displayMode
+ ? <div className="tex" dangerouslySetInnerHTML={{ __html: result }} />
+ : <span className="tex" dangerouslySetInnerHTML={{ __html: result }} />;
+}
\ No newline at end of file
diff --git a/src/plugins/ventex/katex.css b/src/plugins/ventex/katex.css
new file mode 100644
index 00000000..fbc06b44
--- /dev/null
+++ b/src/plugins/ventex/katex.css
@@ -0,0 +1,6 @@
+@import url("https://unpkg.com/katex@0.16.9/dist/katex.min.css");
+
+.katex-display {
+ width: min-content;
+ margin: 1em;
+}
\ No newline at end of file