From 92f976fc932259555ed436137fb616651cb6d332 Mon Sep 17 00:00:00 2001
From: Kitteh <kitteh@kitteh.pw>
Date: Mon, 24 May 2021 09:48:13 +0100
Subject: [PATCH] Add tsx syntax to main.

---
 src/{main.ts => main.tsx} | 43 ++++++++++++++-------------------------
 webpack-dev.config.js     |  2 +-
 webpack.config.js         |  2 +-
 3 files changed, 17 insertions(+), 30 deletions(-)
 rename src/{main.ts => main.tsx} (78%)

diff --git a/src/main.ts b/src/main.tsx
similarity index 78%
rename from src/main.ts
rename to src/main.tsx
index 0119ca6..4082e0e 100644
--- a/src/main.ts
+++ b/src/main.tsx
@@ -17,45 +17,32 @@ import "prismjs/components/prism-json";
 Prism.highlightAll();
 /* eslint-enable */
 
-// Actual Imports
+// @ts-ignore
+import translations from "./translations/index.mjs";
 
+// Actual Imports
 import { PageRouter } from "z-pagerouter";
 import { formatDistance } from "./formatDistance";
 import { getSealStatus } from "./api/sys/getSealStatus";
-import { makeElement } from "z-makeelement";
 import { pageList } from "./allPages";
 import { pageState } from "./globalPageState";
 import { playground } from "./playground";
 import { reloadNavBar } from "./elements/NavBar";
+import { render } from "preact";
 import i18next from "i18next";
 
-// @ts-ignore
-import translations from "./translations/index.mjs";
-
 async function onLoad(): Promise<void> {
-  document.body.innerHTML = "";
-  document.body.appendChild(makeElement({ tag: "div", id: "navBarBox" }));
-  document.body.appendChild(
-    makeElement({
-      tag: "div",
-      class: ["uk-container", "uk-container-medium", "uk-align-center"],
-      children: makeElement({
-        tag: "div",
-        class: ["uk-card", "uk-card-body"],
-        children: [
-          makeElement({
-            tag: "h3",
-            class: "uk-card-title",
-            id: "pageTitle",
-            text: "",
-          }),
-          makeElement({
-            tag: "div",
-            id: "pageContent",
-          }),
-        ],
-      }),
-    }),
+  render(
+    <>
+      <div id="navBarBox" />
+      <div class="uk-container uk-container-medium uk-align-center">
+        <div class="uk-card uk-card-body">
+          <h3 class="uk-card-title" id="pageTitle" />
+          <div id="pageContent" />
+        </div>
+      </div>
+    </>,
+    document.body,
   );
 
   const pageRouter = new PageRouter(
diff --git a/webpack-dev.config.js b/webpack-dev.config.js
index 689ca05..f46bcd2 100644
--- a/webpack-dev.config.js
+++ b/webpack-dev.config.js
@@ -12,7 +12,7 @@ let commitHash = gitRevisionPlugin.commithash();
 module.exports = {
   mode: "development",
   cache: true,
-  entry: './src/main.ts',
+  entry: './src/main.tsx',
   output: {
     path: path.resolve(__dirname, 'dist'),
     filename: 'bundle.js',
diff --git a/webpack.config.js b/webpack.config.js
index 708b8f9..de54231 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -33,7 +33,7 @@ let commitHash = gitRevisionPlugin.commithash();
 module.exports = {
   mode: "production",
   cache: false,
-  entry: './src/main.ts',
+  entry: './src/main.tsx',
   output: {
     path: path.resolve(__dirname, 'dist'),
     filename: 'bundle.js',