working on frontend stuff

build.gradle

@@ -26,11 +26,16 @@ dependencies {
 mainClassName = 'org.bringo.server.Main'
 
 task compileJs(type: Exec) {
+    inputs.files(fileTree("frontend"), "bsconfig.json", "webpack.config.js", "package.json")
+    outputs.dir "src/main/resources/public/dist"
     commandLine "npm", "run", "build"
 }
 
 task installJs(type: Exec) {
+    inputs.files "bsconfig.json", "webpack.config.js", "package.json"
+    outputs.dir "node_modules"
     commandLine "npm", "install"
 }
 
+compileJs.dependsOn installJs
 compileJava.dependsOn compileJs

frontend/Main.re

@@ -1 +1 @@
-Js.Console.log("yo");
+ReactDOMRe.renderToElementWithId(<MainPage />, "main-page-app");

frontend/components/errorPage/ErrorPage.re

@@ -0,0 +1,45 @@
+[@react.component]
+let make = () =>
+  <MaterialUi_WithStyles
+    classes=[
+      {
+        name: "errorLogoContainer",
+        styles: ReactDOMRe.Style.make(~textAlign="right", ()),
+      },
+      {
+        name: "errorLogo",
+        styles:
+          ReactDOMRe.Style.make(~maxHeight="75px", ~maxWidth="60px", ()),
+      },
+      ...SharedClasses.classes,
+    ]
+    render={classes =>
+      MaterialUi.(
+        <section>
+          <Container maxWidth=`Md>
+            <Paper className=classes##pageTopMargin>
+              <Grid container=true spacing=V4>
+                <Grid item=true xs=`V4 className=classes##errorLogoContainer>
+                  <img src="/icons/dead.svg" className=classes##errorLogo />
+                </Grid>
+                <Grid item=true xs=`V8>
+                  <Typography variant=`H3>
+                    {React.string("Oops!")}
+                  </Typography>
+                </Grid>
+                <Grid item=true xs=`V2 />
+                <Grid item=true xs=`V8>
+                  <Typography variant=`Body1>
+                    {React.string(
+                       "It looks like something went wrong! Please wait a few minutes and try again.",
+                     )}
+                  </Typography>
+                </Grid>
+                <Grid item=true xs=`V2 />
+              </Grid>
+            </Paper>
+          </Container>
+        </section>
+      )
+    }
+  />;

frontend/components/loginPage/LoginPage.re

@@ -1,17 +1,7 @@
 [@react.component]
 let make = () =>
   <MaterialUi_WithStyles
-    classes=[
-      {
-        name: "buttonMargin",
-        styles:
-          ReactDOMRe.Style.make(~marginLeft="6px", ~marginRight="6px", ()),
-      },
-      {
-        name: "pageTopMargin",
-        styles: ReactDOMRe.Style.make(~marginTop="7vh", ()),
-      },
-    ]
+    classes=SharedClasses.classes
     render={classes =>
       MaterialUi.(
         <section>

frontend/components/mainPage/MainPage.re

@@ -0,0 +1,8 @@
+[@react.component]
+let make = () =>
+  <MaterialUi_WithStyles
+    classes=SharedClasses.classes
+    render={classes =>
+      MaterialUi.(<section> <Container maxWidth=`Md /> </section>)
+    }
+  />;

frontend/styles/SharedClasses.re

@@ -0,0 +1,15 @@
+type style = {
+  name: String.t,
+  styles: ReactDOMRe.Style.t,
+};
+
+let classes: list(MaterialUi_WithStyles.style) = [
+  {
+    name: "buttonMargin",
+    styles: ReactDOMRe.Style.make(~marginLeft="6px", ~marginRight="6px", ()),
+  },
+  {
+    name: "pageTopMargin",
+    styles: ReactDOMRe.Style.make(~marginTop="7vh", ()),
+  },
+];