From 063718e5c2c94a605865af25badd466791f58e12 Mon Sep 17 00:00:00 2001
From: Animenosekai <40539549+Animenosekai@users.noreply.github.com>
Date: Sun, 26 Jun 2022 01:15:10 +0200
Subject: [PATCH] [add] styling tables in docs [add] adding redirects to docs

---
 website/components/ui/markdown/code.tsx     |  2 +-
 website/components/ui/markdown/headings.tsx |  8 +++++++-
 website/components/ui/markdown/index.ts     | 11 +++++++++--
 website/components/ui/markdown/table.tsx    | 19 +++++++++++++++++++
 website/config.ts                           |  4 ++++
 website/next.config.js                      | 11 +++++++++--
 website/pages/documentation/[...path].tsx   |  3 ++-
 7 files changed, 51 insertions(+), 7 deletions(-)
 create mode 100644 website/components/ui/markdown/table.tsx

diff --git a/website/components/ui/markdown/code.tsx b/website/components/ui/markdown/code.tsx
index 9e95ed67..86342cd0 100644
--- a/website/components/ui/markdown/code.tsx
+++ b/website/components/ui/markdown/code.tsx
@@ -14,7 +14,7 @@ export const CodeBlock = ({ node, inline, className, children, ...props }) => {
             <Lowlight
                 className="overflow-x-auto w-[80vw] text-[85%] my-4"
                 value={String(children).replace(/\n$/, '')}
-                language={common.includes(match[1]) ? match[1] : undefined}
+                language={common.includes((match && match[1])) ? match[1] : undefined}
                 inline={inline}
                 {...props}
             />
diff --git a/website/components/ui/markdown/headings.tsx b/website/components/ui/markdown/headings.tsx
index cd63f9ef..d9dd404e 100644
--- a/website/components/ui/markdown/headings.tsx
+++ b/website/components/ui/markdown/headings.tsx
@@ -23,6 +23,12 @@ export const Heading3 = ({ node, level, children, key, ...props }) => {
 
 export const Heading4 = ({ node, level, children, key, ...props }) => {
     return <section id={headingLink(children.toString())}>
-        <h4 className="text-base font-normal mt-3 mb-1">{children}</h4>
+        <h4 className="text-base font-medium mt-3 mb-1">{children}</h4>
+    </section>
+}
+
+export const Heading5 = ({ node, level, children, key, ...props }) => {
+    return <section id={headingLink(children.toString())}>
+        <h5 className="text-base font-normal mt-3 mb-1">{children}</h5>
     </section>
 }
diff --git a/website/components/ui/markdown/index.ts b/website/components/ui/markdown/index.ts
index 0f7d4364..b331995a 100644
--- a/website/components/ui/markdown/index.ts
+++ b/website/components/ui/markdown/index.ts
@@ -1,5 +1,6 @@
-import { Heading1, Heading2, Heading3, Heading4 } from "./headings";
+import { Heading1, Heading2, Heading3, Heading4, Heading5 } from "./headings";
 import { ListItem, OrderedList, UnorderedList } from "./lists";
+import { Table, TableD, TableH, TableHead, TableR } from "./table";
 
 import { CodeBlock } from "./code";
 
@@ -9,7 +10,13 @@ export const MarkdownComponent = {
     h2: Heading2,
     h3: Heading3,
     h4: Heading4,
+    h5: Heading5,
     li: ListItem,
     ol: OrderedList,
-    ul: UnorderedList
+    ul: UnorderedList,
+    table: Table,
+    thead: TableHead,
+    tr: TableR,
+    th: TableH,
+    td: TableD
 }
\ No newline at end of file
diff --git a/website/components/ui/markdown/table.tsx b/website/components/ui/markdown/table.tsx
new file mode 100644
index 00000000..b1cc7c83
--- /dev/null
+++ b/website/components/ui/markdown/table.tsx
@@ -0,0 +1,19 @@
+export const Table = ({ node, children, key, ...props }) => {
+    return <table className="w-max max-w-full overflow-auto block">{children}</table>
+}
+
+export const TableHead = ({ node, children, key, ...props }) => {
+    return <thead>{children}</thead>
+}
+
+export const TableR = ({ node, isHeader, children, key, ...props }) => {
+    return <tr className="border-t-[1px] even:bg-[#f6f8fa]">{children}</tr>
+}
+
+export const TableH = ({ node, style, isHeader, children, key, ...props }) => {
+    return <th className="py-[6px] px-[13px] border-[1px]">{children}</th>
+}
+
+export const TableD = ({ node, style, isHeader, children, key, ...props }) => {
+    return <td className="py-[6px] px-[13px] border-[1px]">{children}</td>
+}
\ No newline at end of file
diff --git a/website/config.ts b/website/config.ts
index 69b386e7..97e00ea9 100644
--- a/website/config.ts
+++ b/website/config.ts
@@ -1,6 +1,10 @@
 const Configuration = {
     request: {
         host: process.env.NODE_ENV === "development" ? "http://127.0.0.1:5001" : "https://anise-translate.herokuapp.com"
+    },
+    repo: {
+        // branch: "website"
+        branch: "59d190ee0972ab8a0cb56c69c793063869f1ae5d"
     }
 }
 
diff --git a/website/next.config.js b/website/next.config.js
index a843cbee..b316672a 100644
--- a/website/next.config.js
+++ b/website/next.config.js
@@ -1,6 +1,13 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  reactStrictMode: true,
+    reactStrictMode: true,
+    async redirects() {
+        return [{
+            source: '/documentation',
+            destination: '/documentation/translatepy',
+            permanent: false,
+        }, ]
+    },
 }
 
-module.exports = nextConfig
+module.exports = nextConfig
\ No newline at end of file
diff --git a/website/pages/documentation/[...path].tsx b/website/pages/documentation/[...path].tsx
index 1a27cd9d..14eda674 100644
--- a/website/pages/documentation/[...path].tsx
+++ b/website/pages/documentation/[...path].tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react'
 
+import Configuration from 'config'
 import Link from 'next/link'
 import { MarkdownComponent } from 'components/ui/markdown'
 import type { NextPage } from 'next'
@@ -40,7 +41,7 @@ const Documentation: NextPage = () => {
         if (!resultPath.endsWith(".md")) {
             resultPath += "/README.md"
         }
-        fetch(`https://cdn.jsdelivr.net/gh/Animenosekai/translate@website/docs/${encodeURIComponent(strings.name)}${resultPath}`)
+        fetch(`https://cdn.jsdelivr.net/gh/Animenosekai/translate@${encodeURIComponent(Configuration.repo.branch)}/docs/${encodeURIComponent(strings.name)}${resultPath}`)
             .then(response => response.text())
             .then(text => {
                 if (path.join("|") === __path__) {