perf: remove latex extraction from client
All checks were successful
Deploy to Netlify / Deploy to Netlify (push) Successful in 1m42s
All checks were successful
Deploy to Netlify / Deploy to Netlify (push) Successful in 1m42s
This commit is contained in:
parent
3549281b73
commit
0684a0649b
2 changed files with 2 additions and 43 deletions
|
|
@ -1,33 +0,0 @@
|
||||||
export function extractLatexImages(html: string) {
|
|
||||||
const imgRegex =
|
|
||||||
/<img[^>]+src="(https:\/\/latex\.codecogs\.com\/gif\.latex\?(=?.*?))"[^>]*>/g;
|
|
||||||
let parts = [];
|
|
||||||
let latexMatches: string[] = [];
|
|
||||||
let lastIndex = 0;
|
|
||||||
|
|
||||||
html.replace(imgRegex, (match, _, latex, index) => {
|
|
||||||
parts.push(html.slice(lastIndex, index)); // Add HTML before image
|
|
||||||
latexMatches.push(decodeURIComponent(latex)); // Extract and decode LaTeX
|
|
||||||
lastIndex = index + match.length;
|
|
||||||
return "";
|
|
||||||
});
|
|
||||||
|
|
||||||
parts.push(html.slice(lastIndex)); // Add remaining HTML after last image
|
|
||||||
|
|
||||||
return { parts, latexMatches };
|
|
||||||
}
|
|
||||||
|
|
||||||
export function renderLatex(html: string) {
|
|
||||||
const { parts, latexMatches } = extractLatexImages(html);
|
|
||||||
const outputHtml = parts
|
|
||||||
.map((part, i) => {
|
|
||||||
if (!latexMatches[i]) {
|
|
||||||
return part;
|
|
||||||
}
|
|
||||||
return `${part}$$${latexMatches[i]}$$`;
|
|
||||||
})
|
|
||||||
.join("");
|
|
||||||
// Remove all "\," from string
|
|
||||||
const regex = /\\,/g;
|
|
||||||
return outputHtml.replace(regex, " ");
|
|
||||||
}
|
|
||||||
|
|
@ -1,13 +1,5 @@
|
||||||
import "katex/dist/katex.min.css";
|
import "katex/dist/katex.min.css";
|
||||||
import { DomUtils, parseDocument } from "htmlparser2";
|
import { DomUtils, parseDocument } from "htmlparser2";
|
||||||
// TODO: API - remove trailing lines from HTML comment/content
|
|
||||||
// TODO: Server side image extraction and latex rendering
|
|
||||||
// TEMP SOLUTION
|
|
||||||
import { renderLatex } from "~/lib/latex"; // Custom LaTeX rendering function
|
|
||||||
// function removeTrailingLines(htmlString: string) {
|
|
||||||
// return htmlString.replace(/(<br\s*\/?>\s*)+$/gi, "").trim();
|
|
||||||
// }
|
|
||||||
|
|
||||||
import Latex from "react-latex-next";
|
import Latex from "react-latex-next";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { Navigate, useNavigate, useParams } from "react-router";
|
import { Navigate, useNavigate, useParams } from "react-router";
|
||||||
|
|
@ -61,7 +53,7 @@ export default function ColleDetailPage() {
|
||||||
const [isReloading, setIsReloading] = useState(false);
|
const [isReloading, setIsReloading] = useState(false);
|
||||||
|
|
||||||
if (isUserLoading) {
|
if (isUserLoading) {
|
||||||
return <ColleDetailsSkeleton />
|
return <ColleDetailsSkeleton />;
|
||||||
}
|
}
|
||||||
if (userError?.message === AUTH_ERROR) {
|
if (userError?.message === AUTH_ERROR) {
|
||||||
return <Navigate to="/login" replace />;
|
return <Navigate to="/login" replace />;
|
||||||
|
|
@ -435,7 +427,7 @@ function ExpandableComment({ comment }: { comment: string }) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Latex delimiters={[{ left: "$$", right: "$$", display: false }]}>
|
<Latex delimiters={[{ left: "$$", right: "$$", display: false }]}>
|
||||||
{renderLatex(displayedComment)}
|
{displayedComment}
|
||||||
</Latex>
|
</Latex>
|
||||||
{isLongComment && (
|
{isLongComment && (
|
||||||
<Button
|
<Button
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue