Merge branch 'kw-secure-cookie' of https://github.com/adhocteam/Head-…

…Start-TTADP into kw-secure-cookie
HHS · Feb 12, 2021 · 61cb04e · 61cb04e
2 parents 4ba76a9 + 6740fd5
commit 61cb04e
Show file tree

Hide file tree

Showing 44 changed files with 953 additions and 307 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -251,17 +251,23 @@ jobs:
       - run:
           name: Pull OWASP ZAP docker image
           command: docker pull owasp/zap2docker-weekly
+      - run:
+          name: Make reports directory group writeable
+          command: chmod g+w reports
       - run:
           name: Run OWASP ZAP
           command: |
             docker run \
-              -v $(pwd)/zap.conf:/zap/wrk/zap.conf:rw \
+              -v $(pwd)/zap.conf:/zap/wrk/zap.conf:ro \
               -v $(pwd)/reports:/zap/wrk:rw \
               --rm \
+              --user zap:$(id -g) \
               --network="project_smarthub" \
               -t owasp/zap2docker-weekly zap-baseline.py \
               -t http://server:8080 \
-              -c zap.conf -I -i
+              -c zap.conf -I -i -r owasp_report.html
+      - store_artifacts:
+          path: reports/owasp_report.html
   accessibility_scan:
     executor: docker-postgres-executor
     steps:

diff --git a/README.md b/README.md
@@ -2,6 +2,25 @@
 
 Welcome to the home of the OHS TTADP.
 
+<table>
+<tr>
+<th scope="col">HHS</th>
+<th scope="col">Ad Hoc</th>
+</tr>
+<tr>
+<td>
+
+[![HHS](https://circleci.com/gh/HHS/Head-Start-TTADP.svg?style=shield)](https://app.circleci.com/pipelines/github/HHS/Head-Start-TTADP)
+
+</td>
+<td>
+
+[![adhocteam](https://circleci.com/gh/adhocteam/Head-Start-TTADP.svg?style=shield)](https://app.circleci.com/pipelines/github/adhocteam/Head-Start-TTADP)
+
+</td>
+</tr>
+</table>
+
 ## What We're Building and Why
 
 For the latest on our product mission, goals, initiatives, and KPIs, see the [Product Planning page](https://github.com/HHS/Head-Start-TTADP/wiki/Product-Planning).
@@ -13,7 +32,7 @@ For the latest on our product mission, goals, initiatives, and KPIs, see the [Pr
 
 1. Make sure Docker is installed. To check run `docker ps`.
 2. Make sure you have Node 12.20.0 installed.
-3. Run `yarn docker:deps`. This builds the frontend and backend docker containers and install dependencies. You only need to run this step the first time you fire up the app and when dependencies are added/updated/removed. 
+3. Run `yarn docker:deps`. This builds the frontend and backend docker containers and install dependencies. You only need to run this step the first time you fire up the app and when dependencies are added/updated/removed.
 4. Copy `.env.example` to `.env`.  
 6. Change the `AUTH_CLIENT_ID` and `AUTH_CLIENT_SECRET` variables to to values found in the "Values for local development" section of the "Development Credentials" document. If you don't have access to this document, please ask in the hs-vendors-ohs-tta channel of the gsa-tts slack channel.
 7. Optionally, set `CURRENT_USER` to your current user's uid:gid. This will cause files created by docker compose to be owned by your user instead of root.

diff --git a/docs/boundary_diagram.md b/docs/boundary_diagram.md
@@ -1,7 +1,7 @@
 System Boundary Diagram
 =======================
 
-<img src="http://www.plantuml.com/plantuml/png/fLPVRnit37_tf-3oKBX04tT91XJ3CDI9tJH3t7evjtqf4CWwsXQgawuYPTSO-jqdAkUpBqQ73GEIMAR87yaV_oYlYLNWMDdUJyPf6qk45NDDlmu6GMtEbePNSHu9W_QEqV6PzjL0bS4ejxQnZeFhozEfLOu_JEu6LZ4I9z73TT9Mnc4ugmMR3Lk4sMm8HPNSmTiuXxcFhbHX2sk3czuK0tdNh_E7G_i2JlQg7mZ3IP8C7Q0hJoKSy0lWrHFCa-Sxd1BNQ7r2w-2CTjAJZdYTG7s0reP0kH9kPfE4vpmZA8Anqs5Ri_7kNPBqXjQ2ba2rY2ZPraOpbg020cPT-RP9zC7ihe2VpyuXEej4u5FOOMC8GR3Birxode-zguQHljgGPFkfW1k_lhO-bYVFuQyUGAkXHRZqwwIMZsVftEW055jYh1x6trYG7fIT7wg1zQeydIkhd6veJOw6TrSfswvrw-L1rQO3CPpU_eDsy94pyxyzisgBWNw7lUdZ9OdVd1cyaPp25ZYenS9e80nhex71ttF2VYwnQXsmDAo4z_QsJHsWxRp-PhD9WTUTEBej-0ddCAnhQtI6avZU-HB_A5x0-5iTa58Pxb5fbfkHeJh1F3Q7zjQYPig0fM9r1fDesTGMmJXYuPOWHEUCM-PKkh5fgoebrNjZaWLfbHKphvaOLGq_okdMCGQdBAXzcB3mOM-IXo7MKbGwTZIQPnfAeMxgYPS1Yp_lOAHOpHNXhlhteqAEZHb1C-nDgcvXbZ6qlhia_j0dNJJWnGNCe_w2VD8Av5Im3qX0KaeD2-514I7lilZUaz_llSSEwxyjnaMoaezidN9F5eLPEdZlFhl9co6iZOAPgV3qIX6MKbdm0QQt7q6hK7vEMeMFGQFiZfkW72Dc9fB3jisMf1v8APBIO7a_d4nF4_N1hnDWeLIHEwtJzWut0QtHqZouWNivxyWqBlf8CF7Ei0-v5L96IULmGHq0J9HJIuGaJZnNqaJm3AnVBfEfOERL33VZsM3wlaX_Fim6e_7TU3Q6_kNbnVE4BjXDutUG0zO-C06ZnGevR0METTqnFDY--yLHvPZQHlzlOKWJ7Exqqc-Sj6fJRsQbLnKwfWvi1wQDv7Y_rC5_Cp9d-3KYCVtxs8wmMix-1sYBqKwtJ2dbN5iO40JelthvwkMHNTFZ0JaON6FRf4Uy7xWzDbUHL-XOjWKInERjV3zCulFZGZT6QmnciGLJYYLlZvDkNLwPZjDslGHK9GqsmOXNYPYG8Q3seSp9r_JLGl-Noulp7w18hnoZx7QHGAnh3UZAsXl7XqFR39Cqqcvuhsy7roEOcXgjSNWyjVaV6mdxnh1iCLajRujJSHPajylUAn5aRCYmboUc2w1Dq1Qr4L_vU7txPEfbTo-RjLcqZzhH-BUHJEFS6bfbnmALBe3Iz_xvULFgDkf3vxwgakBA-o_WF9k5zEuk8c0lZn0yib6tR6ImFSYJTtw4jVNRpfEJVYXgZKIBQ1ku19oGxjJsOVHaSpnAxvkTdGMlqPMnidy3" alt="rendered boundary diagram">
+![rendered boundary diagram](http://www.plantuml.com/plantuml/png/dLP1Rniv3xtdL_3BeKY19kwNz50i5eiwiPjcaMpTZDjU2WIoXXvhev5KaR9hBFhVTwYC9nuxNHGz9DP8ukEZI3xf3R6Ad6fxy3_Zj4qbme8vq6-3GLIhayhm8iqIOTJUCJe-qRuUg38QvPOsXJIuU7KyiShnnvlhWLMCnCtKtOLth8p3U184cmrRXEbq24Mj8iExD8EPJwvKSGrBWwk32KRoxYZa7uVs1Hm-Rlr860-RcQ43TEMnq04_1rxiO1u-t-2Kk4Jh6xGUpcWpUzYRNZQWFa9dGw1S2PVJcmRll6Lvf5Oa33uNSEcN5zQdyl0v_7C0qEtGCbdvPRCj3q-QSRi7e5WJOtqt_iQ2TAViR7iRMA_AuvcookdCBZiQNfyt3FhMdPSx5KmFOZYv-e_TqIVEf_7xCwlM6EaFU3HzM2JncoE3jn9JN0D7DPyR3OHnQJIs-8zdmducNBMEM1fMRBphLhlG0RfgE5gjLWtnqEFHBulFE8DX2DRe32US_l8b_bcyWF6t496QDDoYqYmh8qEXWNb8cFRMecRAWALYTG8toR895i4uOZbRWfYSCwwIK7Qv-NYFiQMtGoel_OZNUR9MlYSOvpxMC5Fwlefo322OGYxpWH2zHgAdtMkhQYN5yzPO1D8gyynfpNbHzV2JZAuSOtJAWdfa0utVHvFS7ob8JT6-ez4iPw6S2MDFN4KiFbp3IB6QAS9DyTsE2XcsPWHj_xSdxUQcIh7ptS_X3ttIMGjUdC4iwNlamsuYjoJxY0GabQHXBkUWY91_78NKdVJbhVpknJ2sYXeafHTvwaF2XE3dsmdwsyy8s3yaohlMqVS3-Vj-yD19H--AST7Ooq-cQLnb4GfJENZllhYRjqDO6WLJK-FnkI8ifLB0HvXSVGAjOlcbsLNu57LsVncLOyHCTrjYAb9tf1H93M1vExoP7AiGebysW8LIHUweNdixN4MqHainuWfkPRp9cd799u8Rxmpxc6kkYQZPiYsEMm0togaA8JmKiJGBF0Fhgwen5SnyBS3bU3gOl2-QVn-dWz7uUZmTmz6hLsVF6tJ1RXkyXnmn-CW4Z1PhvBWMEDQXPxYb_8y2MMTENKF_70td6I6QQi7W7LZZxW-6re8MT2qLIr1YC9gn11KHqEcu3lArCho0wNK1_pyvXUGi4e7d1SQL8GJ1BKyEq9LvAAoxgjw-jqg_Sj9xRG4pAxseqJ7rwFU2xoBUr-iG_JSZkeLV4nBJpwTY3wlBpQ-3zaIoKonH7ihXTaWW873q-kNhbq-PjXqLaQF19NOjiPVbtUBgcQl42tJIuOoKPKzitm-RwTFTikgCbXZDV0sc54jUxuVUkJmtFQUTQaPK9GrMqOXNOKp8457xMERu0tsrdNaNzIyZz0ZGsLFc6tKMssNGWAuCtZZUO_7BCBj4EkL5zrLabKH98QYeQjoy9VAM7Ghx02K-2G3F88M6L7iVf1vY9vcjb4bxRQJpucfmCOA92MYDmttDp4zQISAbORciHDZV5SSIUlJMebnl9OA85Xdsyf3f0sWJjKLjn5SUNbpjQAvSqLLxEnRTqsbFV3icapIpXXRPiK0r2q3Dzz7fQLlw7Ujjvxwk3SF2-tiH93ENZjum0lOGauE7qmZTQMImHv2Tr-G8W_Nhtil2Ew2aDHBDastX6k06wLgjxqOxklqmUzlUc7dY3ReorVPV)
 
 UML Source
 ----------
@@ -12,19 +12,18 @@ UML Source
 title TTA Smart Hub boundary view
 Person(personnel, "Smart Hub User", "An end-user of the TTA Smart Hub")
 Person(developer, "Smart Hub Developer", "Smart Hub vendor developers and GTM")
-note as EncryptionNote
-All connections depicted are encrypted with TLS 1.2 unless otherwise noted.
-end note
 Boundary(aws, "AWS GovCloud") {
   Boundary(cloudgov, "cloud.gov") {
     System_Ext(aws_alb, "cloud.gov load-balancer", "AWS ALB")
     System_Ext(cloudgov_api, "cloud.gov API")
     System_Ext(cloudgov_router, "<&layers> cloud.gov routers", "Cloud Foundry traffic service")
     Boundary(atob, "Accreditation Boundary") {
       Container(www_app, "<&layers> TTA Smart Hub Web Application", "NodeJS, Express, React", "Displays and collects TTA data. Multiple instances running")
+      Container(worker_app, "TTA Smart Hub Worker Application", "NodeJS, Bull", "Perform background work and data processing")
       Container(clamav, "File scanning API", "ClamAV", "Internal application for scanning user uploads")
       ContainerDb(www_db, "PostgreSQL Database", "AWS RDS", "Contains content and configuration for TTA Smart Hub")
       ContainerDb(www_s3, "AWS S3 bucket", "AWS S3", "Stores static file assets")
+      ContainerDb(www_redis, "Redis Database", "AWS Elasticache", "Queue of background jobs to work on")
     }
   }
 }
@@ -35,15 +34,22 @@ Boundary(gsa_saas, "FedRAMP-approved SaaS") {
 Rel(developer, newrelic, "Manage performance & logging", "https GET/POST/PUT/DELETE (443)")
 Rel(www_app, newrelic, "reports telemetry", "tcp (443)")
 Rel(personnel, aws_alb, "manage TTA data", "https GET/POST/PUT/DELETE (443)")
+note right on link
+All connections depicted are encrypted with TLS 1.2 unless otherwise noted.
+end note
 Rel(www_s3, personnel, "download file attachments", "https GET (443)")
 Rel(aws_alb, cloudgov_router, "proxies requests", "https GET/POST/PUT/DELETE (443)")
 Rel(cloudgov_router, www_app, "proxies requests", "https GET/POST/PUT/DELETE (443)")
-Rel(www_app, clamav, "scans files", "http POST (8080)")
-Rel(www_app, HSES, "retrieve Grantee data", "https GET (443)")
+Rel(worker_app, clamav, "scans files", "http POST (8080)")
+Rel(worker_app, HSES, "retrieve Grantee data", "https GET (443)")
 Rel(www_app, HSES, "authenticates user", "OAuth2")
 Rel(personnel, HSES, "verify identity", "https GET/POST (443)")
-BiRel(www_app, www_db, "reads/writes dataset records", "psql (5432)")
+BiRel(www_app, www_db, "reads/writes dataset records", "psql")
+BiRel(worker_app, www_db, "reads/writes dataset records", "psql")
 BiRel(www_app, www_s3, "reads/writes data content", "vpc endpoint")
+BiRel(worker_app, www_s3, "reads/writes data content", "vpc endpoint")
+Rel(www_app, www_redis, "enqueues job parameters", "redis")
+BiRel(worker_app, www_redis, "dequeues job parameters & updates status", "redis")
 Boundary(development_saas, "CI/CD Pipeline") {
   System_Ext(github, "GitHub", "HHS-controlled code repository")
   System_Ext(circleci, "CircleCI", "Continuous Integration Service")
@@ -59,7 +65,7 @@ Lay_R(HSES, aws)
 Instructions
 ------------
 
-1. [Edit this diagram with plantuml.com](http://www.plantuml.com/plantuml/uml/fLPVRnit37_tf-3oKBX04tT91XJ3CDI9tJH3t7evjtqf4CWwsXQgawuYPTSO-jqdAkUpBqQ73GEIMAR87yaV_oYlYLNWMDdUJyPf6qk45NDDlmu6GMtEbePNSHu9W_QEqV6PzjL0bS4ejxQnZeFhozEfLOu_JEu6LZ4I9z73TT9Mnc4ugmMR3Lk4sMm8HPNSmTiuXxcFhbHX2sk3czuK0tdNh_E7G_i2JlQg7mZ3IP8C7Q0hJoKSy0lWrHFCa-Sxd1BNQ7r2w-2CTjAJZdYTG7s0reP0kH9kPfE4vpmZA8Anqs5Ri_7kNPBqXjQ2ba2rY2ZPraOpbg020cPT-RP9zC7ihe2VpyuXEej4u5FOOMC8GR3Birxode-zguQHljgGPFkfW1k_lhO-bYVFuQyUGAkXHRZqwwIMZsVftEW055jYh1x6trYG7fIT7wg1zQeydIkhd6veJOw6TrSfswvrw-L1rQO3CPpU_eDsy94pyxyzisgBWNw7lUdZ9OdVd1cyaPp25ZYenS9e80nhex71ttF2VYwnQXsmDAo4z_QsJHsWxRp-PhD9WTUTEBej-0ddCAnhQtI6avZU-HB_A5x0-5iTa58Pxb5fbfkHeJh1F3Q7zjQYPig0fM9r1fDesTGMmJXYuPOWHEUCM-PKkh5fgoebrNjZaWLfbHKphvaOLGq_okdMCGQdBAXzcB3mOM-IXo7MKbGwTZIQPnfAeMxgYPS1Yp_lOAHOpHNXhlhteqAEZHb1C-nDgcvXbZ6qlhia_j0dNJJWnGNCe_w2VD8Av5Im3qX0KaeD2-514I7lilZUaz_llSSEwxyjnaMoaezidN9F5eLPEdZlFhl9co6iZOAPgV3qIX6MKbdm0QQt7q6hK7vEMeMFGQFiZfkW72Dc9fB3jisMf1v8APBIO7a_d4nF4_N1hnDWeLIHEwtJzWut0QtHqZouWNivxyWqBlf8CF7Ei0-v5L96IULmGHq0J9HJIuGaJZnNqaJm3AnVBfEfOERL33VZsM3wlaX_Fim6e_7TU3Q6_kNbnVE4BjXDutUG0zO-C06ZnGevR0METTqnFDY--yLHvPZQHlzlOKWJ7Exqqc-Sj6fJRsQbLnKwfWvi1wQDv7Y_rC5_Cp9d-3KYCVtxs8wmMix-1sYBqKwtJ2dbN5iO40JelthvwkMHNTFZ0JaON6FRf4Uy7xWzDbUHL-XOjWKInERjV3zCulFZGZT6QmnciGLJYYLlZvDkNLwPZjDslGHK9GqsmOXNYPYG8Q3seSp9r_JLGl-Noulp7w18hnoZx7QHGAnh3UZAsXl7XqFR39Cqqcvuhsy7roEOcXgjSNWyjVaV6mdxnh1iCLajRujJSHPajylUAn5aRCYmboUc2w1Dq1Qr4L_vU7txPEfbTo-RjLcqZzhH-BUHJEFS6bfbnmALBe3Iz_xvULFgDkf3vxwgakBA-o_WF9k5zEuk8c0lZn0yib6tR6ImFSYJTtw4jVNRpfEJVYXgZKIBQ1ku19oGxjJsOVHaSpnAxvkTdGMlqPMnidy3)
+1. [Edit this diagram with plantuml.com](http://www.plantuml.com/plantuml/uml/dLP1Rniv3xtdL_3BeKY19kwNz50i5eiwiPjcaMpTZDjU2WIoXXvhev5KaR9hBFhVTwYC9nuxNHGz9DP8ukEZI3xf3R6Ad6fxy3_Zj4qbme8vq6-3GLIhayhm8iqIOTJUCJe-qRuUg38QvPOsXJIuU7KyiShnnvlhWLMCnCtKtOLth8p3U184cmrRXEbq24Mj8iExD8EPJwvKSGrBWwk32KRoxYZa7uVs1Hm-Rlr860-RcQ43TEMnq04_1rxiO1u-t-2Kk4Jh6xGUpcWpUzYRNZQWFa9dGw1S2PVJcmRll6Lvf5Oa33uNSEcN5zQdyl0v_7C0qEtGCbdvPRCj3q-QSRi7e5WJOtqt_iQ2TAViR7iRMA_AuvcookdCBZiQNfyt3FhMdPSx5KmFOZYv-e_TqIVEf_7xCwlM6EaFU3HzM2JncoE3jn9JN0D7DPyR3OHnQJIs-8zdmducNBMEM1fMRBphLhlG0RfgE5gjLWtnqEFHBulFE8DX2DRe32US_l8b_bcyWF6t496QDDoYqYmh8qEXWNb8cFRMecRAWALYTG8toR895i4uOZbRWfYSCwwIK7Qv-NYFiQMtGoel_OZNUR9MlYSOvpxMC5Fwlefo322OGYxpWH2zHgAdtMkhQYN5yzPO1D8gyynfpNbHzV2JZAuSOtJAWdfa0utVHvFS7ob8JT6-ez4iPw6S2MDFN4KiFbp3IB6QAS9DyTsE2XcsPWHj_xSdxUQcIh7ptS_X3ttIMGjUdC4iwNlamsuYjoJxY0GabQHXBkUWY91_78NKdVJbhVpknJ2sYXeafHTvwaF2XE3dsmdwsyy8s3yaohlMqVS3-Vj-yD19H--AST7Ooq-cQLnb4GfJENZllhYRjqDO6WLJK-FnkI8ifLB0HvXSVGAjOlcbsLNu57LsVncLOyHCTrjYAb9tf1H93M1vExoP7AiGebysW8LIHUweNdixN4MqHainuWfkPRp9cd799u8Rxmpxc6kkYQZPiYsEMm0togaA8JmKiJGBF0Fhgwen5SnyBS3bU3gOl2-QVn-dWz7uUZmTmz6hLsVF6tJ1RXkyXnmn-CW4Z1PhvBWMEDQXPxYb_8y2MMTENKF_70td6I6QQi7W7LZZxW-6re8MT2qLIr1YC9gn11KHqEcu3lArCho0wNK1_pyvXUGi4e7d1SQL8GJ1BKyEq9LvAAoxgjw-jqg_Sj9xRG4pAxseqJ7rwFU2xoBUr-iG_JSZkeLV4nBJpwTY3wlBpQ-3zaIoKonH7ihXTaWW873q-kNhbq-PjXqLaQF19NOjiPVbtUBgcQl42tJIuOoKPKzitm-RwTFTikgCbXZDV0sc54jUxuVUkJmtFQUTQaPK9GrMqOXNOKp8457xMERu0tsrdNaNzIyZz0ZGsLFc6tKMssNGWAuCtZZUO_7BCBj4EkL5zrLabKH98QYeQjoy9VAM7Ghx02K-2G3F88M6L7iVf1vY9vcjb4bxRQJpucfmCOA92MYDmttDp4zQISAbORciHDZV5SSIUlJMebnl9OA85Xdsyf3f0sWJjKLjn5SUNbpjQAvSqLLxEnRTqsbFV3icapIpXXRPiK0r2q3Dzz7fQLlw7Ujjvxwk3SF2-tiH93ENZjum0lOGauE7qmZTQMImHv2Tr-G8W_Nhtil2Ew2aDHBDastX6k06wLgjxqOxklqmUzlUc7dY3ReorVPV)
 1. Copy and paste the final UML into the UML Source section
 1. Update the img src and edit link target to the current values
 

diff --git a/docs/openapi/index.yaml b/docs/openapi/index.yaml
@@ -85,6 +85,8 @@ components:
           description: Topics covered during the TTA
           items:
             type: string
+        approvingManager:
+          $ref: '#/components/schemas/user'
         pageState:
           type: object
           enum: ['Not Started', 'In progress', 'Completed']
@@ -100,7 +102,11 @@ components:
               type: string
         status:
           type: string
-          enum: ['draft', 'submitted']
+          enum:
+            - draft
+            - submitted
+            - approved
+            - needs_action
           description: The current state of the report
         ttaType:
           type: array

diff --git a/docs/openapi/paths/activity-reports/review.yaml b/docs/openapi/paths/activity-reports/review.yaml
@@ -18,8 +18,8 @@ put:
               type: string
               description: The status of the report after review
               enum:
-                - Approved
-                - Needs Action
+                - approved
+                - needs_action
             managerNotes:
               type: string
               description: Any notes the manager needs to relay to the author/collaborators of the report
@@ -40,7 +40,7 @@ put:
               status:
                 type: string
                 enum:
-                 - Approved
-                 - Needs Action
+                  - approved
+                  - needs_action
               managerNotes:
                 type: string
diff --git a/frontend/src/Constants.js b/frontend/src/Constants.js
@@ -66,3 +66,15 @@ export const REGIONS = [
 ];
 
 export const DECIMAL_BASE = 10;
+
+export const managerReportStatuses = [
+  'needs_action',
+  'approved',
+];
+
+export const REPORT_STATUSES = {
+  DRAFT: 'draft',
+  SUBMITTED: 'submitted',
+  NEEDS_ACTION: 'needs_action',
+  APPROVED: 'approved',
+};
diff --git a/frontend/src/components/Navigator/__tests__/index.js b/frontend/src/components/Navigator/__tests__/index.js
@@ -5,44 +5,48 @@ import {
   render, screen, waitFor, within,
 } from '@testing-library/react';
 
+import { useFormContext } from 'react-hook-form';
 import Navigator from '../index';
 import { NOT_STARTED } from '../constants';
 
+// eslint-disable-next-line react/prop-types
+const Input = ({ name }) => {
+  const { register } = useFormContext();
+  return (
+    <input
+      type="radio"
+      data-testid={name}
+      name={name}
+      ref={register}
+    />
+  );
+};
+
 const pages = [
   {
     position: 1,
     path: 'first',
     label: 'first page',
     review: false,
-    render: (hookForm) => (
-      <input
-        type="radio"
-        data-testid="first"
-        ref={hookForm.register}
-        name="first"
-      />
+    render: () => (
+      <Input name="first" />
     ),
   },
   {
     position: 2,
     path: 'second',
     label: 'second page',
     review: false,
-    render: (hookForm) => (
-      <input
-        type="radio"
-        data-testid="second"
-        ref={hookForm.register}
-        name="second"
-      />
+    render: () => (
+      <Input name="second" />
     ),
   },
   {
     position: 3,
     label: 'review page',
     path: 'review',
     review: true,
-    render: (hookForm, allComplete, formData, onSubmit) => (
+    render: (allComplete, formData, onSubmit) => (
       <div>
         <button type="button" data-testid="review" onClick={onSubmit}>Continue</button>
       </div>
@@ -57,9 +61,10 @@ describe('Navigator', () => {
   const renderNavigator = (currentPage = 'first', onSubmit = () => {}, onSave = () => {}) => {
     render(
       <Navigator
+        reportId={1}
         submitted={false}
-        initialData={initialData}
-        status="draft"
+        formData={initialData}
+        updateFormData={() => {}}
         onReview={() => {}}
         approvingManager={false}
         defaultValues={{ first: '', second: '' }}
@@ -76,7 +81,7 @@ describe('Navigator', () => {
     const firstInput = screen.getByTestId('first');
     userEvent.click(firstInput);
     const first = await screen.findByRole('button', { name: 'first page' });
-    await waitFor(() => expect(within(first).getByText('In progress')).toBeVisible());
+    await waitFor(() => expect(within(first).getByText('In Progress')).toBeVisible());
   });
 
   it('onContinue calls onSave with correct page position', async () => {

diff --git a/frontend/src/components/Navigator/components/SideNav.js b/frontend/src/components/Navigator/components/SideNav.js
@@ -5,15 +5,17 @@
 */
 import React from 'react';
 import PropTypes from 'prop-types';
+import { startCase } from 'lodash';
 import Sticky from 'react-stickynode';
 import { Button, Tag, Alert } from '@trussworks/react-uswds';
 import { useMediaQuery } from 'react-responsive';
 import moment from 'moment';
 
 import Container from '../../Container';
 import './SideNav.css';
+import { REPORT_STATUSES } from '../../../Constants';
 import {
-  NOT_STARTED, IN_PROGRESS, COMPLETE, SUBMITTED, APPROVED, NEEDS_ACTION,
+  NOT_STARTED, IN_PROGRESS, COMPLETE,
 } from '../constants';
 
 const tagClass = (state) => {
@@ -24,11 +26,11 @@ const tagClass = (state) => {
       return 'smart-hub--tag-in-progress';
     case COMPLETE:
       return 'smart-hub--tag-complete';
-    case SUBMITTED:
+    case REPORT_STATUSES.SUBMITTED:
       return 'smart-hub--tag-submitted';
-    case APPROVED:
+    case REPORT_STATUSES.APPROVED:
       return 'smart-hub--tag-submitted';
-    case NEEDS_ACTION:
+    case REPORT_STATUSES.NEEDS_ACTION:
       return 'smart-hub--tag-needs-action';
     default:
       return '';
@@ -50,10 +52,10 @@ function SideNav({
       >
         <span className="margin-left-2">{page.label}</span>
         <span className="margin-left-auto margin-right-2">
-          {page.state !== 'draft'
+          {page.state !== REPORT_STATUSES.DRAFT
             && (
             <Tag className={`smart-hub--tag ${tagClass(page.state)}`}>
-              {page.state}
+              {startCase(page.state)}
             </Tag>
             )}
         </span>