Frontend experimentation

upvalue · Nov 16, 2018 · 184e24e · 184e24e
1 parent 487eb1e
commit 184e24e
Show file tree

Hide file tree

Showing 11 changed files with 108 additions and 26 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -43,7 +43,7 @@ jobs:
 
       - run:
           name: Run golang backend tests
-          command: cd /root/go/src/github.com/upvalue/meditations && go test -v -race $(go list ./... | grep -v /vendor/)
+          command: cd /root/go/src/github.com/upvalue/meditations && go test -cover -v -race $(go list ./... | grep -v /vendor/)
 
       - run:
           name: Install npm dependencies

diff --git a/backend/graphql.go b/backend/graphql.go
@@ -309,7 +309,6 @@ var mutationType = graphql.NewObject(graphql.ObjectConfig{
 })
 
 func executeQuery(query string, schema graphql.Schema) *graphql.Result {
-	fmt.Printf("GraphQL Query %s\n", query)
 	result := graphql.Do(graphql.Params{
 		Schema:        schema,
 		RequestString: query,

diff --git a/frontend-ng/index.d.ts b/frontend-ng/index.d.ts
diff --git a/frontend-ng/package.json b/frontend-ng/package.json
@@ -25,6 +25,8 @@
     "typescript": "^3.1.3"
   },
   "devDependencies": {
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-config-react": "^1.1.7",
     "react-scripts": "^2.0.6-next.c662dfb0"
   },
   "scripts": {

diff --git a/frontend-ng/src/App.tsx b/frontend-ng/src/App.tsx
@@ -8,6 +8,8 @@ import { ThirdCoast, Button } from '@upvalueio/third-coast';
 import '@upvalueio/third-coast/index.scss';
 
 import { store } from './store';
+import { Header } from './Header';
+import './styles/main.scss';
 
 interface DefaultRouteProps {
   default: boolean;
@@ -16,8 +18,7 @@ interface DefaultRouteProps {
 const DefaultRoute = (props: DefaultRouteProps) => {
   return (
     <div className="App">
-      <Button>Boop the snoot</Button>
+      <p>one two three four</p>
-      <p>howdy</p>
     </div>
   );
 }
@@ -27,9 +28,12 @@ class App extends Component {
     return (
       <ThirdCoast>
         <Provider store={store}>
-          <Router>
+          <React.Fragment>
-            <DefaultRoute default={true} />
+            <Header />
-          </Router>
+            <Router>
+              <DefaultRoute default={true} />
+            </Router>
+          </React.Fragment>
         </Provider>
       </ThirdCoast>
     );

diff --git a/frontend-ng/src/Habits.tsx b/frontend-ng/src/Habits.tsx
@@ -0,0 +1,6 @@
+
+export const Habits = () => {
+
+}
+
+export default Habits;
diff --git a/frontend-ng/src/Header.scss b/frontend-ng/src/Header.scss
@@ -0,0 +1,15 @@
+@import '@upvalueio/third-coast/index.scss';
+
+body {
+  background-color: $light-gray5;
+}
+
+header.dark {
+  background-color: $white;
+  color: $black;
+}
+
+header{
+  background-color: $dark-gray4;
+  color: $white;
+}
diff --git a/frontend-ng/src/Header.tsx b/frontend-ng/src/Header.tsx
@@ -0,0 +1,38 @@
+// Header.tsx - Header
+import React from 'react';
+
+import './Header.scss';
+import { View, useTheme, Button } from '@upvalueio/third-coast';
+
+/**
+ * Page header. Displays navigation, title, help message, nanny.
+ */
+export const Header = () => {
+  const [theme, setTheme] = useTheme();
+
+  return (
+    <React.Fragment>
+      {/*
+      <View component="header" padding={['p1']} style={{ display: 'flex', flexDirection: 'row', width: '100%', height: '55px', alignItems: 'center' }}>
+        <div>
+          <h1 className="m0">meditations</h1>
+        </div>
+        <div style={{ justifySelf: 'center', flex: '1 1 auto' }}>
+          <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-around' }}>
+            <p>Habits: July 2018</p>
+          </div>
+        </div>
+        <div>
+          <Button onClick={() => setTheme(theme === 'dark' ? '' : 'dark')}>Dark</Button>
+        </div>
+      </View >
+      <div style={{ height: '55px', marginTop: '-55px', display: 'flex' }}>
+        <div style={{ margin: '0 auto', backgroundColor: 'white', width: '26em', display: 'flex', justifyContent: 'space-around' }}>
+          <span>Habits: July 2018</span>
+        </div>
+      </div>
+      */}
+      <Button>hello</Button>
+    </React.Fragment>
+  );
+}
diff --git a/frontend-ng/src/store/index.tsx b/frontend-ng/src/store/index.tsx
@@ -5,4 +5,3 @@ export const store = createStore(
   () => ({}),
   applyMiddleware(logger)
 );
-
diff --git a/frontend-ng/src/styles/main.scss b/frontend-ng/src/styles/main.scss
@@ -0,0 +1,4 @@
+#root {
+  display: flex;
+  flex-direction: column;
+}
diff --git a/frontend-ng/yarn.lock b/frontend-ng/yarn.lock
@@ -2957,12 +2957,32 @@ escodegen@^1.11.0, escodegen@^1.9.1:
   optionalDependencies:
     source-map "~0.6.1"
 
+eslint-config-airbnb-base@^13.1.0:
+  version "13.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-13.1.0.tgz#b5a1b480b80dfad16433d6c4ad84e6605052c05c"
+  dependencies:
+    eslint-restricted-globals "^0.1.1"
+    object.assign "^4.1.0"
+    object.entries "^1.0.4"
+
+eslint-config-airbnb@^17.1.0:
+  version "17.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-17.1.0.tgz#3964ed4bc198240315ff52030bf8636f42bc4732"
+  dependencies:
+    eslint-config-airbnb-base "^13.1.0"
+    object.assign "^4.1.0"
+    object.entries "^1.0.4"
+
 eslint-config-react-app@3.0.5-next.c662dfb0:
   version "3.0.5-next.c662dfb0"
   resolved "https://registry.yarnpkg.com/eslint-config-react-app/-/eslint-config-react-app-3.0.5-next.c662dfb0.tgz#cb2509446219553fffb7dfffd496a6f2cf9d8454"
   dependencies:
     confusing-browser-globals "1.0.5-next.c662dfb0"
 
+eslint-config-react@^1.1.7:
+  version "1.1.7"
+  resolved "https://registry.yarnpkg.com/eslint-config-react/-/eslint-config-react-1.1.7.tgz#a0918d0fc47d0e9bd161a47308021da85d2585b3"
+
 eslint-import-resolver-node@^0.3.1:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.2.tgz#58f15fb839b8d0576ca980413476aab2472db66a"
@@ -3031,6 +3051,10 @@ eslint-plugin-react@7.11.1:
     jsx-ast-utils "^2.0.1"
     prop-types "^15.6.2"
 
+eslint-restricted-globals@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/eslint-restricted-globals/-/eslint-restricted-globals-0.1.1.tgz#35f0d5cbc64c2e3ed62e93b4b1a7af05ba7ed4d7"
+
 eslint-scope@3.7.1:
   version "3.7.1"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-3.7.1.tgz#3d63c3edfda02e06e01a452ad88caacc7cdcb6e8"
@@ -5963,6 +5987,15 @@ object.assign@^4.1.0:
     has-symbols "^1.0.0"
     object-keys "^1.0.11"
 
+object.entries@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.0.4.tgz#1bf9a4dd2288f5b33f3a993d257661f05d161a5f"
+  dependencies:
+    define-properties "^1.1.2"
+    es-abstract "^1.6.1"
+    function-bind "^1.1.0"
+    has "^1.0.1"
+
 object.getownpropertydescriptors@^2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.0.3.tgz#8758c846f5b407adab0f236e0986f14b051caa16"