Move api key to env. Use current host for apollo client

Store the api key in .env files outside of the git repo.
Delete the old key

Connect to the graphql endpoint using the current browser host

Change the logo to be squared. Still not being displayed

app/.gitignore

@@ -4,3 +4,4 @@ piclimbing
 TODO
 piclimbing.exe
 piclimbing.arm6
+piclimbing.osx

app/Makefile

@@ -16,6 +16,9 @@ build_amd64:
 build_windows_amd64:
 	GOOS=windows GOARCH=amd64 go build -o ${NAME}.exe
 
+build_osx:
+	GOOS=darwin go build -o ${NAME}.osx
+
 .PHONY: all build_amd64 build_rpizero build_windows_amd64 pkger
 
 

app/frontend/.gitignore

@@ -69,4 +69,7 @@ yarn-error.log
 .yarn-integrity
 
 # Build files
-lib/
+lib/
+
+.env.development
+.env.production

app/frontend/Makefile

@@ -1,7 +1,7 @@
 all: clean build
 
 clean:
-	gatsby build
+	gatsby clean
 
 build:
 	gatsby build

app/frontend/src/components/chrome/chrome.tsx

@@ -27,7 +27,6 @@ import {
 
 import { Link } from '@reach/router';
 import { GoogleApi } from '@lourd/react-google-api';
-import { GoogleClientId, GoogleApiKey, } from '../../settings';
 import 'regenerator-runtime/runtime';
 import { loadState, saveState } from '../../state/localStorage';
 import { client } from './client'
@@ -84,8 +83,8 @@ export default class Chrome extends React.Component<any, any> {
               'https://sheets.googleapis.com/$discovery/rest?version=v4',
               'https://www.googleapis.com/discovery/v1/apis/drive/v3/rest',
             ]}
-            clientId={GoogleClientId}
-            apiKey={GoogleApiKey}>
+            clientId={process.env.GOOGLE_CLIENT_ID}
+            apiKey={process.env.GOOGLE_API_KEY}>
             {({ authorize, loading: apiLoading, signout, signedIn, error }) => (
               <div>
                 <EuiHeader className="chrHeader">

app/frontend/src/components/chrome/client.tsx

@@ -3,22 +3,21 @@ import { HttpLink } from 'apollo-link-http';
 import { WebSocketLink } from 'apollo-link-ws';
 import { getMainDefinition } from 'apollo-utilities';
 import { InMemoryCache } from 'apollo-cache-inmemory';
-import { HTTPServer, WSServer } from '../../settings';
 import { ApolloClient } from 'apollo-client';
 import fetch from 'isomorphic-fetch';
 
 const wsLink = process.browser
   ? new WebSocketLink({
       // if you instantiate in the server, the error will be thrown
-      uri: WSServer,
+      uri: `ws://${window.location.host}/query`,
       options: {
         reconnect: true,
       },
     })
   : null;
 
 const httplink = new HttpLink({
-  uri: HTTPServer,
+  uri: '/query',
   fetch,
   credentials: 'same-origin',
 });

app/frontend/src/settings.tsx

@@ -1,10 +1,3 @@
 const AppName = 'piclimbing';
-const Server = '127.0.0.1:8080';
-const HTTPServer = `http://${Server}/query`;
-const WSServer = `ws://${Server}/query`;
 
-const GoogleClientId =
-  '275924066084-dgk36mi6e5t4c8oilvt2nmjmq0tquaq8.apps.googleusercontent.com';
-const GoogleApiKey = 'AIzaSyCl0nG267IOgnfT-sWUj0cDb4FEj8Kt9Ss';
-
-export { AppName, HTTPServer, WSServer, GoogleClientId, GoogleApiKey };
+export { AppName };