Deploying version 2.1.2+1709334280

isp-site/package.json

@@ -1,6 +1,6 @@
 {
   "name": "isp-site",
-  "version": "2.1.2+1709323971",
+  "version": "2.1.2+1709334280",
   "homepage": "https://inst.bid/#/",
   "private": true,
   "dependencies": {

isp-site/src/routes/markdownBrand.jsx

@@ -1,5 +1,5 @@
+// Modules
 import React, { useState, useEffect } from "react";
-import * as ReactDOM from "react-dom/client";
 import Markdown from "react-markdown";
 import remarkGfm from "remark-gfm";
 import remarkGemoji from "remark-gemoji";
@@ -15,13 +15,15 @@ import { useParams } from "react-router-dom";
 import strings from "strings/markdown";
 import { getStrings, getLang } from "utils/langs";
 import { Explorer } from "utils/explorer";
+import { createPortal } from "react-dom";
 
 // Page
 export default function MarkdownBrand({ readme, brand }) {
 	const l = getLang(useParams().language);
 	const s = getStrings(strings, l);
 	const css = `.markdown .lang { display: none; } .markdown .lang.${l.toUpperCase()} { display: inherit; }`;
 	const md = readme;
+
 	const [content, setContent] = useState(`${s.loading}`);
 
 	useEffect(() => {
@@ -42,17 +44,19 @@ export default function MarkdownBrand({ readme, brand }) {
 
 	useEffect(() => {
 		const branches = document.querySelectorAll(".markdown .contents");
+
 		if (branches.length > 0) {
 			for (const branch of branches) {
 				Explorer(brand.toLowerCase(), branch, l).then((table) => {
-					ReactDOM.createRoot(branch).render(
+					createPortal(
 						<Markdown
 							children={table}
 							remarkPlugins={[remarkGfm, remarkGemoji]}
 							rehypePlugins={[rehypeRaw]}
 							allowedElements={allowedElements}
 							components={mdtoui}
 						/>,
+						branch,
 					);
 				});
 			}
@@ -71,7 +75,6 @@ export default function MarkdownBrand({ readme, brand }) {
 				margin="0 auto"
 			>
 				<style>{css}</style>
-
 				<View as="div" className="markdown">
 					<Markdown
 						children={content}