Merge pull request #150 from bcgov/shared

Shared components project!

.github/workflows/code-climate-coverage-aggregation.yml

@@ -5,53 +5,53 @@ name: Generate/Upload all Coverage Reports
 
 on:
   push:
-    branches: [ master ]
+    branches: [master]
   pull_request:
-    branches: [ master ]
+    branches: [master]
 
 jobs:
-    java:
-      env:
-        ACTION_DEBUG: true
-        CC_TEST_REPORTER_ID: 9ada3133fe9babf91a222009998b3545b7eae897a05900930bfa8a27fd82f385
-        
-      name: Create, format and upload Java and Javascript coverage artifact
-      runs-on: ubuntu-latest
-      steps:
+  java:
+    env:
+      ACTION_DEBUG: true
+      CC_TEST_REPORTER_ID: 9ada3133fe9babf91a222009998b3545b7eae897a05900930bfa8a27fd82f385
+
+    name: Create, format and upload Java and Javascript coverage artifact
+    runs-on: ubuntu-latest
+    steps:
       - uses: actions/checkout@v2
-      
-      # Get Code Climate binary  
+
+      # Get Code Climate binary
       - name: Download Code Climate Binary
         run: curl -L https://codeclimate.com/downloads/test-reporter/test-reporter-latest-linux-amd64 > ./cc-test-reporter
-      
+
       # Permissions applied to the Code Climate Executable
       - name: Apply executable perms to Code Climate Binary
         run: chmod +x ./cc-test-reporter
-      
+
       # Set required Git env vars for either pull request
       - name: Set ENV for codeclimate (pull_request)
         run: |
           # git fetch --no-tags --prune --depth=1 origin +refs/heads/$GITHUB_HEAD_REF:refs/remotes/origin/$GITHUB_HEAD_REF
           # echo "::set-env name=GIT_BRANCH::$GITHUB_HEAD_REF"
-          
+
           echo "::set-env name=GIT_BRANCH::${{ github.event.pull_request.head.ref }}"
           echo "::set-env name=GIT_COMMIT_SHA::${{ github.event.pull_request.head.sha }}"
         if: github.event_name == 'pull_request'
-        
+
       # Set required Git env vars for a push to master
       - name: Set ENV for codeclimate (push)
         run: |
           echo "::set-env name=GIT_BRANCH::$GITHUB_REF"
           echo "::set-env name=GIT_COMMIT_SHA::$GITHUB_SHA"
         if: github.event_name == 'push'
-      
+
       # Trimming the ref to master in order to publish correct report (paambaati)
       - name: Set ref/head/master to master
         run: |
           echo "::set-env name=GIT_BRANCH::master"
         if: env.GIT_BRANCH == 'refs/heads/master'
-        
-      # Setup Java Environment  
+
+      # Setup Java Environment
       - name: Set up JDK 1.8
         uses: actions/setup-java@v1
         with:
@@ -62,11 +62,11 @@ jobs:
           key: ${{ runner.os }}-maven-${{ hashFiles('**/pom.xml') }}
           restore-keys: |
             ${{ runner.os }}-maven-
-      
+
       # Run Maven Verify to generate all jacoco reports
       - name: Build with Maven
         run: mvn -B verify -P all --file src/backend/pom.xml
-      
+
       # Loop through all BACKEND services to show that jacoco reports have been generated
       - name: WHERE AM I - BACKEND?
         run: |
@@ -75,32 +75,40 @@ jobs:
             ls ${{ github.workspace }}/src/backend/$s/target/site/jacoco;
           done
         if: env.ACTION_DEBUG == true
-
+
+      # Run Yarn Install
+      - name: Run Yarn Install - Shared components
+        run: yarn --cwd src/frontend/shared-components install
+
+      # Run Yarn Prepare
+      - name: Run Yarn Prepare - Shared components
+        run: yarn --cwd src/frontend/shared-components prepare
+
       # Run Yarn Install
-      - name: Run Yarn Install
+      - name: Run Yarn Install - eFiling Frontend
         run: yarn --cwd src/frontend/efiling-frontend install
-      
+
       # Run Yarn Coverage to generate javascript coverage report
-      - name: Run Yarn Coverage
+      - name: Run Yarn Coverage - eFiling Frontend
         run: yarn --cwd /home/runner/work/jag-file-submission/jag-file-submission/src/frontend/efiling-frontend coverage
-      
+
       # List frontend coverage reports
       - name: WHERE AM I - FRONTEND?
         run: ls ${{github.workspace}}/src/frontend/efiling-frontend/coverage
         if: env.ACTION_DEBUG == true
-      
+
       # Run Yarn Install
-      - name: Run Yarn Install - DEMO
+      - name: Run Yarn Install - eFiling Demo
         run: yarn --cwd src/frontend/efiling-demo install
-      
+
       # Run Yarn Coverage to generate javascript coverage report
-      - name: Run Yarn Coverage - DEMO
+      - name: Run Yarn Coverage - eFiling Demo
         run: yarn --cwd /home/runner/work/jag-file-submission/jag-file-submission/src/frontend/efiling-demo coverage
-      
+
       # List frontend coverage reports
       - name: WHERE AM I - FRONTEND DEMO?
         run: ls ${{github.workspace}}/src/frontend/efiling-demo/coverage
-      
+
       # Formatting the BACKEND coverage reports generated (dynamically)
       - name: Format BACKEND coverage reports
         run: |
@@ -120,34 +128,34 @@ jobs:
                   echo $file does not match
               fi
           done
-      
+
       # Formatting the FRONTEND coverage report
       - name: Format the FRONTEND coverage report
         run: |
-          ./cc-test-reporter format-coverage -t lcov -o coverage/frontend-codeclimate.json ${{github.workspace}}/src/frontend/efiling-frontend/coverage/lcov.info 
-        
+          ./cc-test-reporter format-coverage -t lcov -o coverage/frontend-codeclimate.json ${{github.workspace}}/src/frontend/efiling-frontend/coverage/lcov.info
+
       # Formatting the FRONTEND DEMO coverage report
       - name: Format the FRONTEND DEMO coverage report
         run: |
           ./cc-test-reporter format-coverage -t lcov -o coverage/frontend-demo-codeclimate.json ${{github.workspace}}/src/frontend/efiling-demo/coverage/lcov.info
-        
-      # List all formatted files in coverage directory    
+
+      # List all formatted files in coverage directory
       - name: WHERE AM I - FORMATTED?
         run: ls ${{ github.workspace }}/coverage
         if: env.ACTION_DEBUG == true
-      
+
       # Sum the coverage reports
       - name: Summing the coverage reports generated
         run: ./cc-test-reporter sum-coverage coverage/*-codeclimate.json -p 7 -o coverage/total-codeclimate.json
-    
+
       # Upload JSON for debugging purposes
       - name: Upload JSON for debugging purposes
         uses: actions/upload-artifact@v2
         with:
           name: summed-coverage-report
           path: coverage/total-codeclimate.json
         if: env.ACTION_DEBUG == true
-        
+
       # Upload total coverage report to Code Climate
       - name: Upload coverage report to Code Climate
         run: ./cc-test-reporter upload-coverage -i coverage/total-codeclimate.json

src/frontend/efiling-demo/.env.example

@@ -0,0 +1 @@
+REACT_APP_API_BASE_URL=<Base_url_of_backend_api>

src/frontend/efiling-demo/.gitignore

@@ -15,6 +15,7 @@
 .DS_Store
 .env.local
 .env.development.local
+.env.development
 .env.test.local
 .env.production.local
 

src/frontend/efiling-demo/babel.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  env: {
+    test: {
+      presets: ["@babel/preset-env", "@babel/preset-react"],
+      plugins: ["transform-export-extensions"],
+      only: ["./**/*.js", "node_modules/jest-runtime"]
+    }
+  }
+};

src/frontend/efiling-demo/jest.config.js

@@ -0,0 +1,24 @@
+module.exports = {
+  watchPathIgnorePatterns: ["<rootDir>/node_modules/"],
+  collectCoverageFrom: [
+    "src/**/*.js",
+    "!src/index.js",
+    "!**/node_modules/**",
+    "!**/vendor/**"
+  ],
+  transform: {
+    "^.+\\.[t|j]sx?$": "babel-jest"
+  },
+  transformIgnorePatterns: ["./node_modules/(?!shared-components).+\\.js$"],
+  setupFilesAfterEnv: ["<rootDir>/src/setupTests.js", "./src/setupTests.js"],
+  moduleNameMapper: {
+    "\\.(jpg|jpeg|png|PNG|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|pdf)$":
+      "<rootDir>/src/AssetsTransformer.js",
+    "\\.(css|less)$": "<rootDir>/src/AssetsTransformer.js"
+  },
+  verbose: true,
+  testResultsProcessor: "jest-sonar-reporter",
+  collectCoverage: false,
+  coverageReporters: ["text", "lcov"],
+  coverageDirectory: "coverage"
+};

src/frontend/efiling-demo/package.json

@@ -9,6 +9,7 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
+    "axios": "^0.19.2",
     "babel-plugin-transform-export-extensions": "^6.22.0",
     "bootstrap": "^4.4.1",
     "enzyme": "^3.11.0",
@@ -20,9 +21,10 @@
     "react-dom": "^16.13.1",
     "react-router-dom": "^5.1.2",
     "react-scripts": "3.4.1",
+    "react-test-renderer": "^16.12.0",
     "regenerator-runtime": "^0.13.5",
     "webpack": "4.42.0",
-    "react-test-renderer": "^16.12.0"
+    "shared-components": "file:./../shared-components"
   },
   "scripts": {
     "start": "SET PORT=3001 && react-scripts start",
@@ -76,36 +78,6 @@
     "prettier": "1.19.1",
     "pretty-quick": "^2.0.1"
   },
-  "jest": {
-    "watchPathIgnorePatterns": [
-      "<rootDir>/node_modules/"
-    ],
-    "collectCoverageFrom": [
-      "src/**/*.js",
-      "!src/index.js",
-      "!**/node_modules/**",
-      "!**/vendor/**"
-    ],
-    "transform": {
-      "^.+\\.[t|j]sx?$": "babel-jest"
-    },
-    "setupFilesAfterEnv": [
-      "<rootDir>/src/setupTests.js",
-      "./src/setupTests.js"
-    ],
-    "moduleNameMapper": {
-      "\\.(jpg|jpeg|png|PNG|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|pdf)$": "<rootDir>/src/AssetsTransformer.js",
-      "\\.(css|less)$": "<rootDir>/src/AssetsTransformer.js"
-    },
-    "verbose": true,
-    "testResultsProcessor": "jest-sonar-reporter",
-    "collectCoverage": false,
-    "coverageReporters": [
-      "text",
-      "lcov"
-    ],
-    "coverageDirectory": "coverage"
-  },
   "jestSonar": {
     "reportPath": "coverage",
     "reportFile": "test-report.xml",

src/frontend/efiling-demo/src/App.js

@@ -2,13 +2,17 @@ import React from "react";
 import { Switch, Route, Redirect } from "react-router-dom";
 import Home from "./components/page/home/Home";
 
+const header = {
+  name: "eFiling Demo Client"
+};
+
 export default function App() {
   return (
     <div>
       <Switch>
         <Redirect exact from="/" to="/efiling-demo" />
         <Route exact path="/efiling-demo">
-          <Home />
+          <Home page={{ header }} />
         </Route>
       </Switch>
     </div>