Browse Source
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.
Thomas Eizinger
3 years ago
GPG Key ID:
10 changed files with
36 additions and
21 deletions
.github/workflows/ci.yml
frontend/dynamicApp.ts
frontend/index.html
frontend/src/MakerApp.test.tsx
frontend/src/MakerApp.tsx
frontend/src/TakerApp.test.tsx
frontend/src/TakerApp.tsx
frontend/src/maker.tsx
frontend/src/taker.tsx
frontend/tsconfig.json
@ -29,6 +29,9 @@ jobs:
- run : cargo clippy --workspace --all-targets -- -D warnings - run : cargo clippy --workspace --all-targets -- -D warnings
build_frontend: build_frontend:
strategy:
matrix:
app : [ maker, taker ]
defaults: defaults:
run: run:
working-directory : frontend working-directory : frontend
@ -41,8 +44,8 @@ jobs:
cache-dependency-path : frontend/yarn.lock cache-dependency-path : frontend/yarn.lock
- run : yarn install - run : yarn install
- run : yarn run eslint - run : yarn run eslint
- run : APP=maker yarn build - run : APP=${{ matrix.app }} yarn test
- run : APP=taker yarn build - run : APP=${{ matrix.app }} yarn build
test_daemons: test_daemons:
strategy: strategy:
@ -5,11 +5,11 @@ export default function dynamicApp(app: string): Plugin {
name : "dynamicApp" , // required, will show up in warnings and errors
name : "dynamicApp" , // required, will show up in warnings and errors
resolveId : ( id ) = > { resolveId : ( id ) = > {
// For some reason these are different?
// For some reason these are different?
const productionBuildId = ". /__app__.tsx" ; const productionBuildId = "src /__app__.tsx" ;
const devBuildId = "/__app__.tsx" ; const devBuildId = "/src/ __app__.tsx" ;
if ( id === productionBuildId || id === devBuildId ) { if ( id === productionBuildId || id === devBuildId ) {
return ` ${ __dirname } / ${ app } .tsx ` ; return ` ${ __dirname } /src/ ${ app } .tsx ` ;
} }
return null ; return null ;
@ -2,13 +2,13 @@
< html lang = "en" > < html lang = "en" >
< head > < head >
< meta charset = "UTF-8" / > < 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" / > < meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
< title > Hermes< / title > < title > Hermes< / title >
< / head > < / head >
< body > < body >
< div id = "root" > < / div > < div id = "root" > < / div >
< script type = "module" src = ". /__app__.tsx" > / / ` _ _ a p p _ _ ` i s d y n a m i c a l l y r e s o l v e d b y t h e ` d y n a m i c A p p ` v i t e p l u g i n < script type = "module" src = "src /__app__.tsx" > / / ` _ _ a p p _ _ ` i s d y n a m i c a l l y r e s o l v e d b y t h e ` d y n a m i c A p p ` v i t e p l u g i n
< / script > < / script >
< / body > < / body >
< / html > < / html >
@ -1,8 +1,7 @@
import { ChakraProvider } from "@chakra-ui/react" ; import { ChakraProvider } from "@chakra-ui/react" ;
import React from "react" ; import React from "react" ;
import ReactDOM from "react-dom" ; import ReactDOM from "react-dom" ;
import { BrowserRouter , Route , Routes } from "react-router-dom" ; import Maker from "./MakerApp" ;
import Maker from "./Maker" ;
import theme from "./theme" ; import theme from "./theme" ;
it ( "renders without crashing" , ( ) = > { it ( "renders without crashing" , ( ) = > {
@ -10,11 +9,7 @@ it("renders without crashing", () => {
ReactDOM . render ( ReactDOM . render (
< React.StrictMode > < React.StrictMode >
< ChakraProvider theme = { theme } > < ChakraProvider theme = { theme } >
< BrowserRouter > < Maker / >
< Routes >
< Route path = "/maker/*" element = { < Maker / > } / >
< / Routes >
< / BrowserRouter >
< / ChakraProvider > < / ChakraProvider >
< / React.StrictMode > , < / React.StrictMode > ,
div , div ,
@ -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 ,
) ;
} ) ;
@ -3,9 +3,9 @@ import React from "react";
import ReactDOM from "react-dom" ; import ReactDOM from "react-dom" ;
import { BrowserRouter } from "react-router-dom" ; import { BrowserRouter } from "react-router-dom" ;
import { EventSourceProvider } from "react-sse-hooks" ; import { EventSourceProvider } from "react-sse-hooks" ;
import "./src/ index.css" ; import "./index.css" ;
import App from "./src/ Maker" ; import App from "./MakerApp " ;
import theme from "./src/ theme" ; import theme from "./theme" ;
ReactDOM . render ( ReactDOM . render (
< React.StrictMode > < React.StrictMode >
@ -3,9 +3,9 @@ import React from "react";
import ReactDOM from "react-dom" ; import ReactDOM from "react-dom" ;
import { BrowserRouter } from "react-router-dom" ; import { BrowserRouter } from "react-router-dom" ;
import { EventSourceProvider } from "react-sse-hooks" ; import { EventSourceProvider } from "react-sse-hooks" ;
import "./src/ index.css" ; import "./index.css" ;
import App from "./src/ Taker" ; import App from "./TakerApp " ;
import theme from "./src/ theme" ; import theme from "./theme" ;
ReactDOM . render ( ReactDOM . render (
< React.StrictMode > < React.StrictMode >
@ -16,5 +16,5 @@
"noEmit" : true , "noEmit" : true ,
"jsx" : "react" "jsx" : "react"
} , } ,
"include" : [ ". " ] "include" : [ "src " ]
} }
Thomas Eizinger
3 years ago