Merge pull request #93 from reapit/feature/CLD-473-add-config-manager

Feature/cld 473 add config manager

.gitignore

@@ -12,3 +12,4 @@ browserstack-reports
 
 src/constants/.env
 src/tests/webdriver/screenshots
+reapit-config.json

azure-pipelines.yml

@@ -23,6 +23,8 @@ jobs:
       vmImage: 'ubuntu-latest'
     variables:
       - group: aws
+      - name: REAPIT_ENV
+        value: 'DEV'
     steps:
       - task: NodeTool@0
         inputs:
@@ -34,15 +36,6 @@ jobs:
         env:
           NPM_TOKEN: $(NPM_TOKEN)
 
-      - bash: printenv > src/constants/.env
-        displayName: Injects ENVs
-        env:
-          COGNITO_CLIENT_ID: $(COGNITO_CLIENT_ID)
-          COGNITO_USERPOOL_ID: $(COGNITO_USERPOOL_ID)
-          MARKETPLACE_API_KEY: $(MARKETPLACE_API_KEY)
-          REAPIT_API_KEY: $(REAPIT_API_KEY)
-          MAP_API_KEY: $(MAP_API_KEY)
-
       - script: yarn test:ci
         displayName: Unit tests
         env:
@@ -57,35 +50,29 @@ jobs:
           failTaskOnFailedTests: true # Optional
           publishRunAttachments: true # Optional
 
+      - bash: |
+          if [ 'refs/tags/GD-' ]; then
+            echo "##vso[task.setvariable variable=REAPIT_ENV]PROD";
+          fi
+          if [ 'refs/heads/demo' ]; then
+            echo "##vso[task.setvariable variable=REAPIT_ENV]DEMO";
+          fi
+        displayName: Set Reapit Env
+  
       - script: yarn build
         displayName: Build static assets
         failOnStderr: true
         env:
+          REAPIT_ENV: $(REAPIT_ENV)
           NPM_TOKEN: $(NPM_TOKEN)
+          AWS_ACCESS_KEY_ID: $(AWS_ACCESS_KEY_ID)
+          AWS_SECRET_ACCESS_KEY: $(AWS_SECRET_ACCESS_KEY)
 
       - task: PublishPipelineArtifact@1
         inputs:
           path: $(System.DefaultWorkingDirectory)/public/dist
           artifact: AppBundle
 
-    # Skipping while we are on free-tier as tests not running
-    # - task: BrowserStackConfig@0
-    #   inputs:
-    #     BrowserStackServiceEndPoint: 'BrowserStack connection'
-    #     browserstackLocal: true
-    #     bsLocalOptions: '{"verbose": true, "forceLocal": true}'
-
-    # - script: yarn test-e2e:bstack:ci
-    #   displayName: Run E2E Tests on BrowserStack
-    #   continueOnError: true
-    #   env:
-    #     BROWSER_STACK_BUILD: $(Build.BuildNumber)
-    #     NPM_TOKEN: $(NPM_TOKEN)
-
-    # - task: BrowserStackStopLocal@0
-
-    # - task: BrowserStackResults@0
-    #   continueOnError: true
   - deployment: S3DeployWebDev
     displayName: 'Dev | S3 Deployment'
     dependsOn: buildWebApp

package.json

@@ -11,8 +11,9 @@
   "author": "Author",
   "main": "./src/index.ts",
   "scripts": {
-    "build": "yarn fetch-definitions && webpack --color --mode production --config ./src/scripts/webpack-prod.js",
-    "dev": "webpack-dev-server --hot --progress --color --mode development --config ./src/scripts/webpack-dev.js",
+    "build": "yarn fetch-config && yarn fetch-definitions && webpack --color --mode production --config ./src/scripts/webpack-prod.js",
+    "dev": "yarn fetch-config && REAPIT_ENV=LOCAL webpack-dev-server --hot --progress --color --mode development --config ./src/scripts/webpack-dev.js",
+    "fetch-config": "yarn config-manager getSecret reapit-marketplace-app-config",
     "fetch-definitions": "node ./src/scripts/fetch-definitions.js",
     "lint": "tslint --fix --project tsconfig.json --format stylish",
     "start": "node ./public/index.js geo-diary",
@@ -46,6 +47,7 @@
     "@babel/core": "^7.7.2",
     "@babel/polyfill": "^7.7.0",
     "@babel/preset-env": "^7.7.1",
+    "@reapit/config-manager": "^1.1.0",
     "@redux-saga/testing-utils": "^1.0.5",
     "@types/enzyme": "^3.9.3",
     "@types/googlemaps": "^3.37.5",
@@ -64,8 +66,6 @@
     "concurrently": "^4.1.1",
     "core-js": "^3.4.1",
     "css-loader": "^3.0.0",
-    "dotenv": "^8.0.0",
-    "dotenv-webpack": "^1.7.0",
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.14.0",
     "enzyme-to-json": "^3.3.5",

src/components/container/map.tsx

@@ -112,7 +112,7 @@ export const MapContainer = ({
       >
         <Map
           autoFitBounds={true}
-          apiKey={process.env.MAP_API_KEY as string}
+          apiKey={process.env.GOOGLE_MAPS_API_KEY as string}
           coordinates={coordinates}
           markerCallBack={handleOnClick}
           destinationPoint={destinationLatLng}

src/constants/api.ts

@@ -4,8 +4,6 @@ export const APPOINTMENTS_HEADERS = {
   'Content-Type': 'application/json'
 } as StringMap
 
-export const REAPIT_API_BASE_URL = 'https://dev.platform.reapit.net'
-
 export const URLS = {
   appointments: '/appointments',
   appointmentTypes: '/configuration/appointmentTypes'

src/sagas/__tests__/appointments.ts

@@ -13,7 +13,7 @@ import {
 import { selectOnlineStatus } from '@/selectors/online'
 import { Action } from '@/types/core'
 import { fetcher } from '@reapit/elements'
-import { REAPIT_API_BASE_URL, URLS } from '@/constants/api'
+import { URLS } from '@/constants/api'
 import { initAuthorizedRequestHeaders } from '@/utils/api'
 
 import { appointmentsDataStub } from '../__stubs__/appointments'
@@ -114,7 +114,7 @@ describe('appointments should fetch data', () => {
     call(fetcher, {
       url:
         '/appointments?Start=2019-10-10T00:00:00.000Z&End=2019-10-10T23:59:59.999Z&IncludeCancelled=true&IncludeUnconfirmed=true',
-      api: REAPIT_API_BASE_URL,
+      api: process.env.PLATFORM_API_BASE_URL as string,
       method: 'GET',
       headers: mockHeaders
     })
@@ -128,7 +128,7 @@ describe('appointments should fetch data', () => {
     expect(clone.next(appointmentsDataStub.appointments as any).value).toEqual(
       call(fetcher, {
         url: URLS.appointmentTypes,
-        api: REAPIT_API_BASE_URL,
+        api: process.env.PLATFORM_API_BASE_URL as string,
         method: 'GET',
         headers: mockHeaders
       })
@@ -172,7 +172,7 @@ describe('appointments should fetch data tomowrrow', () => {
     call(fetcher, {
       url:
         '/appointments?Start=2019-10-11T00:00:00.000Z&End=2019-10-11T23:59:59.999Z&IncludeCancelled=true&IncludeUnconfirmed=true',
-      api: REAPIT_API_BASE_URL,
+      api: process.env.PLATFORM_API_BASE_URL as string,
       method: 'GET',
       headers: mockHeaders
     })
@@ -186,7 +186,7 @@ describe('appointments should fetch data tomowrrow', () => {
     expect(clone.next(appointmentsDataStub.appointments as any).value).toEqual(
       call(fetcher, {
         url: URLS.appointmentTypes,
-        api: REAPIT_API_BASE_URL,
+        api: process.env.PLATFORM_API_BASE_URL as string,
         method: 'GET',
         headers: mockHeaders
       })
@@ -230,7 +230,7 @@ describe('appointments should fetch data week view', () => {
     call(fetcher, {
       url:
         '/appointments?Start=2019-10-10T00:00:00.000Z&End=2019-10-16T23:59:59.999Z&IncludeCancelled=true&IncludeUnconfirmed=true',
-      api: REAPIT_API_BASE_URL,
+      api: process.env.PLATFORM_API_BASE_URL as string,
       method: 'GET',
       headers: mockHeaders
     })
@@ -244,7 +244,7 @@ describe('appointments should fetch data week view', () => {
     expect(clone.next(appointmentsDataStub.appointments).value).toEqual(
       call(fetcher, {
         url: URLS.appointmentTypes,
-        api: REAPIT_API_BASE_URL,
+        api: process.env.PLATFORM_API_BASE_URL as string,
         method: 'GET',
         headers: mockHeaders
       })

src/sagas/api.ts

@@ -1,13 +1,13 @@
 import { fetcher } from '@reapit/elements'
 import { initAuthorizedRequestHeaders } from '@/utils/api'
-import { URLS, REAPIT_API_BASE_URL } from '@/constants/api'
+import { URLS } from '@/constants/api'
 import { AppointmentModel } from '@/types/platform'
 
 export const fetchAppointment = async ({ id }) => {
   const headers = await initAuthorizedRequestHeaders()
   const response = await fetcher({
     url: `${URLS.appointments}/${id}`,
-    api: REAPIT_API_BASE_URL,
+    api: process.env.PLATFORM_API_BASE_URL as string,
     method: 'GET',
     headers: headers
   })
@@ -18,7 +18,7 @@ export const updateAppointment = async ({ id, ...rest }: AppointmentModel) => {
   const headers = await initAuthorizedRequestHeaders()
   const response = await fetcher({
     url: `${URLS.appointments}/${id}`,
-    api: REAPIT_API_BASE_URL,
+    api: process.env.PLATFORM_API_BASE_URL as string,
     method: 'PATCH',
     headers: headers,
     body: rest

src/sagas/appointments.ts

@@ -20,7 +20,6 @@ import { URLS } from '@/constants/api'
 import { fetcher } from '@reapit/elements'
 import { Action } from '@/types/core'
 import { selectOnlineStatus } from '@/selectors/online'
-import { REAPIT_API_BASE_URL } from '../constants/api'
 import { AppointmentRequestParams } from '@/actions/appointments'
 import { initAuthorizedRequestHeaders } from '@/utils/api'
 import { sortAppoinmentsByStartTime } from '@/utils/sortAppoinmentsByStartTime'
@@ -84,7 +83,7 @@ export const appointmentsDataFetch = function*({ data: { time } }: Action<Appoin
       url: `${
         URLS.appointments
       }?Start=${start.toISOString()}&End=${end.toISOString()}&IncludeCancelled=true&IncludeUnconfirmed=true`,
-      api: REAPIT_API_BASE_URL,
+      api: process.env.PLATFORM_API_BASE_URL as string,
       method: 'GET',
       headers
     })
@@ -97,7 +96,7 @@ export const appointmentsDataFetch = function*({ data: { time } }: Action<Appoin
 
     const appointmentTypes = yield call(fetcher, {
       url: URLS.appointmentTypes,
-      api: REAPIT_API_BASE_URL,
+      api: process.env.PLATFORM_API_BASE_URL as string,
       method: 'GET',
       headers
     })

src/scripts/webpack-dev.js

@@ -3,9 +3,9 @@ const ForkTsCheckerNotifierWebpackPlugin = require('fork-ts-checker-notifier-web
 const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const FaviconsWebpackPlugin = require('favicons-webpack-plugin')
-const Dotenv = require('dotenv-webpack')
-
+const EnvironmentPlugin = require('webpack').EnvironmentPlugin
 const ResolveTSPathsToWebpackAlias = require('ts-paths-to-webpack-alias')
+const config = require(path.resolve(__dirname, '../..', 'reapit-config.json'))
 
 module.exports = {
   context: process.cwd(),
@@ -26,9 +26,7 @@ module.exports = {
       title: 'TypeScript',
       excludeWarnings: false
     }),
-    new Dotenv({
-      path: path.join(process.cwd(), 'src', 'constants', '.env')
-    }),
+    new EnvironmentPlugin(config[process.env.REAPIT_ENV]),
     new HtmlWebpackPlugin({
       inject: true,
       template: 'public/index.html'

src/scripts/webpack-prod.js

@@ -5,11 +5,12 @@ const { GenerateSW } = require('workbox-webpack-plugin')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const FaviconsWebpackPlugin = require('favicons-webpack-plugin')
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
-const Dotenv = require('dotenv-webpack')
 const ResolveTSPathsToWebpackAlias = require('ts-paths-to-webpack-alias')
 const HashedModuleIdsPlugin = require('webpack').HashedModuleIdsPlugin
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const PurgecssWhitelister = require('purgecss-whitelister')
+const EnvironmentPlugin = require('webpack').EnvironmentPlugin
+const config = require(path.resolve(__dirname, '../..', 'reapit-config.json'))
 
 const PATHS = {
   src: path.join(__dirname, '../..', 'src')
@@ -86,9 +87,7 @@ module.exports = {
       analyzerMode: 'disabled',
       generateStatsFile: true
     }),
-    new Dotenv({
-      path: path.join(process.cwd(), 'src', 'constants', '.env')
-    }),
+    new EnvironmentPlugin(config[process.env.REAPIT_ENV]),
     new HashedModuleIdsPlugin(),
     new MiniCssExtractPlugin({
       filename: 'css/[name].[hash].css'