/tools/assetsTransformer.js"
+ },
+ "setupFiles": [
+ "raf/polyfill",
+ "./tools/enzymeTestAdapterSetup.js"
+ ]
+ }
+}
diff --git a/web/src/App.js b/web/src/App.js
new file mode 100644
index 00000000..e19aef4e
--- /dev/null
+++ b/web/src/App.js
@@ -0,0 +1,19 @@
+/* eslint-disable import/no-named-as-default */
+import React from 'react';
+import {hot} from 'react-hot-loader';
+import Home from './ui/pages/Home';
+
+// Import Tabler styles
+import 'tabler/scss/tabler.scss';
+
+import './App.scss';
+
+const App = () => {
+ return (
+
+
+
+ );
+};
+
+export default hot(module)(App);
diff --git a/web/src/App.scss b/web/src/App.scss
new file mode 100644
index 00000000..d7785616
--- /dev/null
+++ b/web/src/App.scss
@@ -0,0 +1 @@
+@import './assets/main';
diff --git a/web/src/assets/_variables.scss b/web/src/assets/_variables.scss
new file mode 100644
index 00000000..fba36a3b
--- /dev/null
+++ b/web/src/assets/_variables.scss
@@ -0,0 +1,2 @@
+/* Import defalts variabls */
+@import '~tabler/scss/_variables.scss';
diff --git a/web/src/assets/main.scss b/web/src/assets/main.scss
new file mode 100644
index 00000000..a0f49ebe
--- /dev/null
+++ b/web/src/assets/main.scss
@@ -0,0 +1 @@
+@import "variables"
diff --git a/web/src/hooks/.gitkeep b/web/src/hooks/.gitkeep
new file mode 100644
index 00000000..9c558e35
--- /dev/null
+++ b/web/src/hooks/.gitkeep
@@ -0,0 +1 @@
+.
diff --git a/web/src/index.ejs b/web/src/index.ejs
new file mode 100755
index 00000000..9eda257f
--- /dev/null
+++ b/web/src/index.ejs
@@ -0,0 +1,76 @@
+
+
+
+
+
+
+
+ Yolo
+
+
+
+
+
+
diff --git a/web/src/index.js b/web/src/index.js
new file mode 100644
index 00000000..80c4cf77
--- /dev/null
+++ b/web/src/index.js
@@ -0,0 +1,26 @@
+/* eslint-disable import/default */
+/* eslint-disable global-require */
+
+import React from 'react';
+import {render} from 'react-dom';
+import {AppContainer} from 'react-hot-loader';
+import App from './App';
+
+render(
+
+
+ ,
+ document.getElementById('app')
+);
+
+if (module.hot) {
+ module.hot.accept('./App', () => {
+ const NewApp = require('./App').default;
+ render(
+
+
+ ,
+ document.getElementById('app')
+ );
+ });
+}
diff --git a/web/src/store/.gitkeep b/web/src/store/.gitkeep
new file mode 100644
index 00000000..9c558e35
--- /dev/null
+++ b/web/src/store/.gitkeep
@@ -0,0 +1 @@
+.
diff --git a/web/src/ui/components/BuildList.js b/web/src/ui/components/BuildList.js
new file mode 100644
index 00000000..d476b48d
--- /dev/null
+++ b/web/src/ui/components/BuildList.js
@@ -0,0 +1,69 @@
+import React, {useState, useEffect, useRef} from 'react';
+import Card from './Card';
+
+const BuildList = ({platformName, platformId}) => {
+ const [error, setError] = useState(null);
+ const [isLoaded, setIsLoaded] = useState(false);
+ const [items, setItems] = useState([]);
+ const [baseURL, setBaseURL] = useState('');
+
+ // TODO: Move these controllers out of component code
+ useEffect(() => {
+ const getBuilds = () =>
+ fetch(`${process.env.API_URL}/build-list?artifact_kind=${platformId}&`, {
+ method: 'GET',
+ headers: !process.env.YOLO_APP_PW
+ ? new Headers({
+ Authorization: 'Basic ' + btoa(`${process.env.YOLO_APP_PW}`),
+ })
+ : null,
+ })
+ .then((res) => {
+ // TODO: Consume as stream (load incrementally)
+ return res.json();
+ })
+ .then(
+ (result) => {
+ setIsLoaded(true);
+ setBaseURL(
+ `${document.location.protocol}//${document.location.host}`
+ );
+ setItems(result.builds);
+ },
+ (error) => {
+ setIsLoaded(true);
+ setError(error);
+ }
+ );
+ if (!isLoaded) {
+ getBuilds();
+ }
+ });
+
+ // TODO: Factor out HOC
+ if (error) {
+ return (
+
+
Builds for{' ' + platformName}
Error:{' '}
+ {error.message}
+
+ );
+ } else if (!isLoaded) {
+ return (
+
+
Builds for{' ' + platformName}
Loading...
+
+ );
+ } else {
+ return (
+
+
Builds for{' ' + platformName}
+ {items.map((item) => (
+
+ ))}
+
+ );
+ }
+};
+
+export default BuildList;
diff --git a/web/src/ui/components/Card.js b/web/src/ui/components/Card.js
new file mode 100644
index 00000000..9cfe7063
--- /dev/null
+++ b/web/src/ui/components/Card.js
@@ -0,0 +1,53 @@
+import React from 'react';
+
+const Card = ({item, baseURL}) => (
+
+
+
{item.id}
+
+
+
branch: {item.branch}
+
date: {item.date}
+
message: {item.message}
+
commit: {item.commit}
+
state: {item.state}
+
+
+
+ {item.has_artifacts &&
+ item.has_artifacts.map((artifact) => (
+
+
+
path: {artifact.local_path}
+
state: {artifact.state}
+
+
+
+ ))}
+
+
+
{headerMessage}
+
+);
+
+export default Header;
diff --git a/web/src/ui/pages/Home.js b/web/src/ui/pages/Home.js
new file mode 100644
index 00000000..6105fbcb
--- /dev/null
+++ b/web/src/ui/pages/Home.js
@@ -0,0 +1,55 @@
+import React, {useState} from 'react';
+import BuildList from '../components/BuildList';
+
+const PLATFORMS = {
+ iOS: '1',
+ android: '2',
+ none: '3',
+};
+
+const Home = () => {
+ const [platformId, setPlatformId] = useState(PLATFORMS.none);
+
+ return (
+
+
Yolo!
+
+ {/* TODO: No magic strings */}
+ {platformId !== PLATFORMS.none && (
+
+ )}
+
+