Put sources under src/

The only thing that has to stay in the root is the `index.html` file, otherwise the dev server doesn't pick it up. Also make sure our frontend tests actually run and pass in CI.
3 years ago · 5babf9d12f
10 changed files with 36 additions and 21 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@ -29,6 +29,9 @@ jobs:
      - run: cargo clippy --workspace --all-targets -- -D warnings

  build_frontend:
+    strategy:
+      matrix:
+        app: [ maker, taker ]
    defaults:
      run:
        working-directory: frontend
@ -41,8 +44,8 @@ jobs:
          cache-dependency-path: frontend/yarn.lock
      - run: yarn install
      - run: yarn run eslint
-      - run: APP=maker yarn build
-      - run: APP=taker yarn build
+      - run: APP=${{ matrix.app }} yarn test
+      - run: APP=${{ matrix.app }} yarn build

  test_daemons:
    strategy:
--- a/frontend/dynamicApp.ts
+++ b/frontend/dynamicApp.ts
@ -5,11 +5,11 @@ export default function dynamicApp(app: string): Plugin {
        name: "dynamicApp", // required, will show up in warnings and errors
        resolveId: (id) => {
            // For some reason these are different?
-            const productionBuildId = "./__app__.tsx";
-            const devBuildId = "/__app__.tsx";
+            const productionBuildId = "src/__app__.tsx";
+            const devBuildId = "/src/__app__.tsx";

            if (id === productionBuildId || id === devBuildId) {
-                return `${__dirname}/${app}.tsx`;
+                return `${__dirname}/src/${app}.tsx`;
            }

            return null;
--- a/frontend/index.html
+++ b/frontend/index.html
@ -2,13 +2,13 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/src/favicon.svg" />
+    <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Hermes</title>
  </head>
  <body>
    <div id="root"></div>
-    <script type="module" src="./__app__.tsx"> // `__app__` is dynamically resolved by the `dynamicApp` vite plugin
+    <script type="module" src="src/__app__.tsx"> // `__app__` is dynamically resolved by the `dynamicApp` vite plugin
    </script>
  </body>
 </html>
--- a/frontend/src/MakerApp.test.tsx
+++ b/frontend/src/MakerApp.test.tsx
@ -1,8 +1,7 @@
 import { ChakraProvider } from "@chakra-ui/react";
 import React from "react";
 import ReactDOM from "react-dom";
-import { BrowserRouter, Route, Routes } from "react-router-dom";
-import Maker from "./Maker";
+import Maker from "./MakerApp";
 import theme from "./theme";

 it("renders without crashing", () => {
@ -10,11 +9,7 @@ it("renders without crashing", () => {
    ReactDOM.render(
        <React.StrictMode>
            <ChakraProvider theme={theme}>
-                <BrowserRouter>
-                    <Routes>
-                        <Route path="/maker/*" element={<Maker />} />
-                    </Routes>
-                </BrowserRouter>
+                <Maker />
            </ChakraProvider>
        </React.StrictMode>,
        div,
--- a/frontend/src/MakerApp.tsx
+++ b/frontend/src/MakerApp.tsx
--- a/frontend/src/TakerApp.test.tsx
+++ b/frontend/src/TakerApp.test.tsx
@ -0,0 +1,17 @@
+import { ChakraProvider } from "@chakra-ui/react";
+import React from "react";
+import ReactDOM from "react-dom";
+import Taker from "./TakerApp";
+import theme from "./theme";
+
+it("renders without crashing", () => {
+    const div = document.createElement("div");
+    ReactDOM.render(
+        <React.StrictMode>
+            <ChakraProvider theme={theme}>
+                <Taker />
+            </ChakraProvider>
+        </React.StrictMode>,
+        div,
+    );
+});
--- a/frontend/src/TakerApp.tsx
+++ b/frontend/src/TakerApp.tsx
--- a/frontend/src/maker.tsx
+++ b/frontend/src/maker.tsx
@ -3,9 +3,9 @@ import React from "react";
 import ReactDOM from "react-dom";
 import { BrowserRouter } from "react-router-dom";
 import { EventSourceProvider } from "react-sse-hooks";
-import "./src/index.css";
-import App from "./src/Maker";
-import theme from "./src/theme";
+import "./index.css";
+import App from "./MakerApp";
+import theme from "./theme";

 ReactDOM.render(
    <React.StrictMode>
--- a/frontend/src/taker.tsx
+++ b/frontend/src/taker.tsx
@ -3,9 +3,9 @@ import React from "react";
 import ReactDOM from "react-dom";
 import { BrowserRouter } from "react-router-dom";
 import { EventSourceProvider } from "react-sse-hooks";
-import "./src/index.css";
-import App from "./src/Taker";
-import theme from "./src/theme";
+import "./index.css";
+import App from "./TakerApp";
+import theme from "./theme";

 ReactDOM.render(
    <React.StrictMode>
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@ -16,5 +16,5 @@
    "noEmit": true,
    "jsx": "react"
  },
-  "include": ["."]
+  "include": ["src"]
 }