feat: add error if launched incorrectly

zeevo · May 13, 2020 · aea6e19 · aea6e19
1 parent 755fb5f
commit aea6e19
Show file tree

Hide file tree

Showing 12 changed files with 107 additions and 220 deletions.
diff --git a/config/env.js b/config/env.js
@@ -1,4 +1,4 @@
-'use strict';
+/* eslint-disable */
 
 const fs = require('fs');
 const path = require('path');
@@ -9,18 +9,18 @@ delete require.cache[require.resolve('./paths')];
 
 const NODE_ENV = 'production';
 if (!NODE_ENV) {
-	throw new Error('The NODE_ENV environment variable is required but was not specified.');
+  throw new Error('The NODE_ENV environment variable is required but was not specified.');
 }
 
 // https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
 const dotenvFiles = [
-	`${paths.dotenv}.${NODE_ENV}.local`,
-	`${paths.dotenv}.${NODE_ENV}`,
-	// Don't include `.env.local` for `test` environment
-	// since normally you expect tests to produce the same
-	// results for everyone
-	NODE_ENV !== 'test' && `${paths.dotenv}.local`,
-	paths.dotenv,
+  `${paths.dotenv}.${NODE_ENV}.local`,
+  `${paths.dotenv}.${NODE_ENV}`,
+  // Don't include `.env.local` for `test` environment
+  // since normally you expect tests to produce the same
+  // results for everyone
+  NODE_ENV !== 'test' && `${paths.dotenv}.local`,
+  paths.dotenv,
 ].filter(Boolean);
 
 // Load environment variables from .env* files. Suppress warnings using silent
@@ -29,13 +29,13 @@ const dotenvFiles = [
 // https://github.com/motdotla/dotenv
 // https://github.com/motdotla/dotenv-expand
 dotenvFiles.forEach(dotenvFile => {
-	if (fs.existsSync(dotenvFile)) {
-		require('dotenv-expand')(
-			require('dotenv').config({
-				path: dotenvFile,
-			}),
-		);
-	}
+  if (fs.existsSync(dotenvFile)) {
+    require('dotenv-expand')(
+      require('dotenv').config({
+        path: dotenvFile,
+      }),
+    );
+  }
 });
 
 // We support resolving modules according to `NODE_PATH`.
@@ -49,44 +49,44 @@ dotenvFiles.forEach(dotenvFile => {
 // We also resolve them to make sure all tools using them work consistently.
 const appDirectory = fs.realpathSync(process.cwd());
 process.env.NODE_PATH = (process.env.NODE_PATH || '')
-	.split(path.delimiter)
-	.filter(folder => folder && !path.isAbsolute(folder))
-	.map(folder => path.resolve(appDirectory, folder))
-	.join(path.delimiter);
+  .split(path.delimiter)
+  .filter(folder => folder && !path.isAbsolute(folder))
+  .map(folder => path.resolve(appDirectory, folder))
+  .join(path.delimiter);
 
 // Grab NODE_ENV and REACT_APP_* environment variables and prepare them to be
 // injected into the application via DefinePlugin in Webpack configuration.
 const REACT_APP = /^REACT_APP_/i;
 
 function getClientEnvironment(publicUrl) {
-	const raw = Object.keys(process.env)
-		.filter(key => REACT_APP.test(key))
-		.reduce(
-			(env, key) => {
-				env[key] = process.env[key];
-				return env;
-			},
-			{
-				// Useful for determining whether we’re running in production mode.
-				// Most importantly, it switches React into the correct mode.
-				NODE_ENV: process.env.NODE_ENV || 'development',
-				ASCVD_ENV: process.env.ASCVD_ENV || 'production',
-				// Useful for resolving the correct path to static assets in `public`.
-				// For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
-				// This should only be used as an escape hatch. Normally you would put
-				// images into the `src` and `import` them in code to get their paths.
-				PUBLIC_URL: publicUrl,
-			},
-		);
-	// Stringify all values so we can feed into Webpack DefinePlugin
-	const stringified = {
-		'process.env': Object.keys(raw).reduce((env, key) => {
-			env[key] = JSON.stringify(raw[key]);
-			return env;
-		}, {}),
-	};
+  const raw = Object.keys(process.env)
+    .filter(key => REACT_APP.test(key))
+    .reduce(
+      (env, key) => {
+        env[key] = process.env[key];
+        return env;
+      },
+      {
+        // Useful for determining whether we’re running in production mode.
+        // Most importantly, it switches React into the correct mode.
+        NODE_ENV: process.env.NODE_ENV || 'development',
+        ASCVD_ENV: process.env.ASCVD_ENV || 'production',
+        // Useful for resolving the correct path to static assets in `public`.
+        // For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
+        // This should only be used as an escape hatch. Normally you would put
+        // images into the `src` and `import` them in code to get their paths.
+        PUBLIC_URL: publicUrl,
+      },
+    );
+  // Stringify all values so we can feed into Webpack DefinePlugin
+  const stringified = {
+    'process.env': Object.keys(raw).reduce((env, key) => {
+      env[key] = JSON.stringify(raw[key]);
+      return env;
+    }, {}),
+  };
 
-	return { raw, stringified };
+  return { raw, stringified };
 }
 
 module.exports = getClientEnvironment;
diff --git a/config/modules.js b/config/modules.js
@@ -1,10 +1,11 @@
-'use strict';
+/* eslint-disable */
 
 const fs = require('fs');
 const path = require('path');
-const paths = require('./paths');
-const chalk = require('react-dev-utils/chalk');
 const resolve = require('resolve');
+const chalk = require('react-dev-utils/chalk');
+
+const paths = require('./paths');
 
 /**
  * Get the baseUrl of a compilerOptions object.
@@ -42,8 +43,8 @@ function getAdditionalModulePaths(options = {}) {
   throw new Error(
     chalk.red.bold(
       "Your project's `baseUrl` can only be set to `src` or `node_modules`." +
-        ' Create React App does not support other values at this time.'
-    )
+        ' Create React App does not support other values at this time.',
+    ),
   );
 }
 
@@ -54,7 +55,7 @@ function getModules() {
 
   if (hasTsConfig && hasJsConfig) {
     throw new Error(
-      'You have both a tsconfig.json and a jsconfig.json. If you are using TypeScript please remove your jsconfig.json file.'
+      'You have both a tsconfig.json and a jsconfig.json. If you are using TypeScript please remove your jsconfig.json file.',
     );
   }
 

diff --git a/config/paths.js b/config/paths.js
@@ -1,4 +1,4 @@
-'use strict';
+/* eslint-disable */
 
 const path = require('path');
 const fs = require('fs');

diff --git a/config/pnpTs.js b/config/pnpTs.js
@@ -1,4 +1,4 @@
-'use strict';
+/* eslint-disable */
 
 const { resolveModuleName } = require('ts-pnp');
 
@@ -7,14 +7,14 @@ exports.resolveModuleName = (
   moduleName,
   containingFile,
   compilerOptions,
-  resolutionHost
+  resolutionHost,
 ) => {
   return resolveModuleName(
     moduleName,
     containingFile,
     compilerOptions,
     resolutionHost,
-    typescript.resolveModuleName
+    typescript.resolveModuleName,
   );
 };
 
@@ -23,13 +23,13 @@ exports.resolveTypeReferenceDirective = (
   moduleName,
   containingFile,
   compilerOptions,
-  resolutionHost
+  resolutionHost,
 ) => {
   return resolveModuleName(
     moduleName,
     containingFile,
     compilerOptions,
     resolutionHost,
-    typescript.resolveTypeReferenceDirective
+    typescript.resolveTypeReferenceDirective,
   );
 };
diff --git a/config/webpack.config.js b/config/webpack.config.js
@@ -514,13 +514,13 @@ module.exports = function(webpackEnv) {
 
       // Generate a 'launch.html' from config
       new HtmlWebpackPlugin({
-        template: 'src/launch.html',
+        template: 'public/launch.html',
         config: require('../src/config'),
         filename: 'launch.html',
       }),
 
       new HtmlWebpackPlugin({
-        template: 'src/index.html',
+        template: 'public/index.html',
         config: { buildId: buildId },
         filename: 'index.html',
       }),

diff --git a/config/webpackDevServer.config.js b/config/webpackDevServer.config.js
@@ -1,12 +1,13 @@
-'use strict';
+/* eslint-disable */
 
 const errorOverlayMiddleware = require('react-dev-utils/errorOverlayMiddleware');
 const evalSourceMapMiddleware = require('react-dev-utils/evalSourceMapMiddleware');
 const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware');
 const ignoredFiles = require('react-dev-utils/ignoredFiles');
-const paths = require('./paths');
 const fs = require('fs');
 
+const paths = require('./paths');
+
 const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
 const host = process.env.HOST || '0.0.0.0';
 
@@ -28,8 +29,7 @@ module.exports = function(proxy, allowedHost) {
     // So we will disable the host check normally, but enable it if you have
     // specified the `proxy` setting. Finally, we let you override it if you
     // really know what you're doing with a special environment variable.
-    disableHostCheck:
-      !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
+    disableHostCheck: !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
     // Enable gzip compression of generated files.
     compress: true,
     // Silence WebpackDevServer's own logs since they're generally not useful.

diff --git a/package.json b/package.json
@@ -81,6 +81,7 @@
     "redux-saga": "^1.1.1",
     "regenerator-runtime": "^0.13.3",
     "reselect": "^4.0.0",
+    "resolve": "^1.17.0",
     "semantic-ui-css": "^2.4.1",
     "semantic-ui-react": "^0.88.2",
     "styled-components": "^4.4.0",
@@ -174,6 +175,7 @@
     "stylelint-order": "^3.1.1",
     "stylelint-processor-styled-components": "^1.10.0",
     "terser-webpack-plugin": "^2.1.2",
+    "ts-pnp": "^1.2.0",
     "url-loader": "^2.2.0",
     "webpack": "^4.43.0",
     "webpack-cli": "^3.3.9",

diff --git a/src/config.js b/src/config.js
@@ -6,10 +6,10 @@
 const config = {
   name: 'FHIR App Starter',
   description: 'FHIR App Starter',
-  clientId: '', // Make sure to set your environment up correctly when starting/building
-  scope: '',
-  iss: '',
-  redirectUri: '',
+  clientId: '3a095ead-a361-4c33-b01b-2ad95225e9b1', // Make sure to set your environment up correctly when starting/building
+  scope: 'patient/Patient.read',
+  iss: 'https://fhir-ehr.sandboxcerner.com/dstu2/0b8a0111-e8e6-4c26-a91c-5069cbc6b1ca/',
+  redirectUri: 'http://localhost:3000/',
 };
 
 module.exports = config;
diff --git a/src/containers/App/index.js b/src/containers/App/index.js
@@ -3,7 +3,7 @@ import { connect } from 'react-redux';
 import styled from 'styled-components';
 import { Router, Switch, Route } from 'react-router-dom';
 import { Helmet } from 'react-helmet-async';
-import { Grid, Container, Header, Divider } from 'semantic-ui-react';
+import { Grid, Container, Header, Divider, Message, Icon } from 'semantic-ui-react';
 import FhirClient from 'fhirclient';
 
 import { getConfig } from './selectors';
@@ -16,29 +16,54 @@ const Wrapper = styled.div`
 `;
 
 class App extends React.Component {
-  componentDidMount() {
-    const { loadConfig, loaded } = this.props;
-
-    if (!loaded) {
-      loadConfig();
-    }
+  constructor() {
+    super();
+    this.state = {};
 
     FhirClient.oauth2
       .ready()
       .then(client => {
         console.log(client);
       })
-      .catch(e => {});
+      .catch(() => {
+        this.setState({
+          error: {
+            header: 'Something went wrong!',
+            body: 'Make sure you are launching from a SMART On FHIR Sandbox',
+          },
+        });
+      });
+  }
+
+  componentDidMount() {
+    const { loadConfig, loaded } = this.props;
+
+    if (!loaded) {
+      loadConfig();
+    }
   }
 
   render() {
+    const { error } = this.state;
     return (
       <Router history={history}>
         <Helmet />
         <Wrapper>
           <Container>
             <Grid columns="1" stackable>
               <Grid.Column>
+                {error ? (
+                  <Grid.Row>
+                    <Message icon color="yellow" gutter="5">
+                      <Icon name="exclamation circle" />
+                      <Message.Content>
+                        <Message.Header>{error.header}</Message.Header>
+                        <p>{error.body}</p>
+                      </Message.Content>
+                    </Message>
+                    <Divider hidden />
+                  </Grid.Row>
+                ) : null}
                 <Grid.Row>
                   <Header as="h1">FHIR App Starter</Header>
                   <Divider />