chore: Update translations

src/element/async-loader.tsx

@@ -1,10 +1,10 @@
 import { ReactNode, useEffect, useState } from "react";
 
-export function Async<T>({ loader, then }: { loader: () => Promise<T>, then: (v: T) => ReactNode }) {
-    const [res, setResult] = useState<T>();
-    useEffect(() => {
-        loader().then(setResult);
-    }, []);
-    if (!res) return;
-    return then(res);
-}
+export function Async<T>({ loader, then }: { loader: () => Promise<T>; then: (v: T) => ReactNode }) {
+  const [res, setResult] = useState<T>();
+  useEffect(() => {
+    loader().then(setResult);
+  }, []);
+  if (!res) return;
+  return then(res);
+}

src/element/markdown.css

@@ -37,4 +37,4 @@
 .markdown h5,
 .markdown h6 {
   margin: 0.5em 0;
-}
+}

src/element/markdown.tsx

@@ -14,7 +14,6 @@ interface MarkdownProps {
 }
 
 const Markdown = forwardRef<HTMLDivElement, MarkdownProps>((props: MarkdownProps, ref) => {
-
   function renderToken(t: Token): ReactNode {
     try {
       switch (t.type) {
@@ -76,18 +75,26 @@ const Markdown = forwardRef<HTMLDivElement, MarkdownProps>((props: MarkdownProps
           return <s>{t.tokens ? t.tokens.map(renderToken) : t.raw}</s>;
         }
         case "table": {
-          return <table className="table-auto border-collapse">
-            <thead>
-              <tr>
-                {(t.header as Tokens.TableCell[]).map(v => <th className="border">{v.tokens ? v.tokens.map(renderToken) : v.text}</th>)}
-              </tr>
-            </thead>
-            <tbody>
-              {(t.rows as Tokens.TableCell[][]).map(v => <tr>
-                {v.map(d => <td className="border px-2 py-1">{d.tokens ? d.tokens.map(renderToken) : d.text}</td>)}
-              </tr>)}
-            </tbody>
-          </table>;
+          return (
+            <table className="table-auto border-collapse">
+              <thead>
+                <tr>
+                  {(t.header as Tokens.TableCell[]).map(v => (
+                    <th className="border">{v.tokens ? v.tokens.map(renderToken) : v.text}</th>
+                  ))}
+                </tr>
+              </thead>
+              <tbody>
+                {(t.rows as Tokens.TableCell[][]).map(v => (
+                  <tr>
+                    {v.map(d => (
+                      <td className="border px-2 py-1">{d.tokens ? d.tokens.map(renderToken) : d.text}</td>
+                    ))}
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          );
         }
         default: {
           if ("tokens" in t) {
@@ -104,7 +111,6 @@ const Markdown = forwardRef<HTMLDivElement, MarkdownProps>((props: MarkdownProps
     }
   }
 
-
   const parsed = useMemo(() => {
     return marked.lexer(props.content);
   }, [props.content, props.tags]);

src/faq.md

@@ -1,13 +1,15 @@
 # FAQ
 
 # Reccomended Stream Settings
-| Name | Value |
-| - | - |
-| Video Codec | h264 |
-| Audio Codec | AAC |
+
+| Name              | Value |
+| ----------------- | ----- |
+| Video Codec       | h264  |
+| Audio Codec       | AAC   |
 | Max Video Bitrate | 7000k |
-| Max Audio Bitrate | 320k |
-| Keyframe Interval | 2s |
+| Max Audio Bitrate | 320k  |
+| Keyframe Interval | 2s    |
 
 ### Example settings in OBS (Apple M1 Mac):
-![OBS Apple](https://void.cat/d/VQQ75R6tmbVQJ9eqiwJhoj.webp)
+
+![OBS Apple](https://void.cat/d/VQQ75R6tmbVQJ9eqiwJhoj.webp)

src/index.tsx

@@ -109,10 +109,15 @@ const router = createBrowserRouter([
       },
       {
         path: "/faq",
-        element: <Async loader={async () => {
-          const req = await fetch(Faq);
-          return await req.text();
-        }} then={(v) => <Markdown content={v} tags={[]} plainText={true} />} />
+        element: (
+          <Async
+            loader={async () => {
+              const req = await fetch(Faq);
+              return await req.text();
+            }}
+            then={v => <Markdown content={v} tags={[]} plainText={true} />}
+          />
+        ),
       },
       {
         path: "*",