Merge pull request #2027 from GSA/fix-deploy-actions

Fix the prod and demo deployment actions

.ds.baseline

@@ -133,15 +133,7 @@
         "filename": ".github/workflows/checks.yml",
         "hashed_secret": "5baa61e4c9b93f3f0682250b6cf8331b7ee68fd8",
         "is_verified": false,
-        "line_number": 61,
-        "is_secret": false
-      },
-      {
-        "type": "Basic Auth Credentials",
-        "filename": ".github/workflows/checks.yml",
-        "hashed_secret": "5baa61e4c9b93f3f0682250b6cf8331b7ee68fd8",
-        "is_verified": false,
-        "line_number": 95,
+        "line_number": 68,
         "is_secret": false
       }
     ],
@@ -169,7 +161,7 @@
         "filename": "app/config.py",
         "hashed_secret": "577a4c667e4af8682ca431857214b3a920883efc",
         "is_verified": false,
-        "line_number": 117,
+        "line_number": 118,
         "is_secret": false
       }
     ],
@@ -407,23 +399,13 @@
         "is_secret": false
       }
     ],
-    "app/main/views/sign_in.py": [
-      {
-        "type": "Private Key",
-        "filename": "app/main/views/sign_in.py",
-        "hashed_secret": "1348b145fa1a555461c1b790a2f66614781091e9",
-        "is_verified": false,
-        "line_number": 27,
-        "is_secret": false
-      }
-    ],
     "app/templates/new/components/head.html": [
       {
         "type": "Base64 High Entropy String",
         "filename": "app/templates/new/components/head.html",
         "hashed_secret": "ee5048791fc7ff45a1545e24f85bec3317371327",
         "is_verified": false,
-        "line_number": 34,
+        "line_number": 33,
         "is_secret": false
       }
     ],
@@ -527,7 +509,7 @@
         "filename": "tests/app/main/views/organizations/test_organization_invites.py",
         "hashed_secret": "bdbb156d25d02fd7792865824201dda1c60f4473",
         "is_verified": false,
-        "line_number": 265,
+        "line_number": 274,
         "is_secret": false
       },
       {
@@ -535,7 +517,7 @@
         "filename": "tests/app/main/views/organizations/test_organization_invites.py",
         "hashed_secret": "5baa61e4c9b93f3f0682250b6cf8331b7ee68fd8",
         "is_verified": false,
-        "line_number": 273,
+        "line_number": 282,
         "is_secret": false
       }
     ],
@@ -545,7 +527,7 @@
         "filename": "tests/app/main/views/test_accept_invite.py",
         "hashed_secret": "07f0a6c13923fc3b5f0c57ffa2d29b715eb80d71",
         "is_verified": false,
-        "line_number": 607,
+        "line_number": 643,
         "is_secret": false
       }
     ],
@@ -565,7 +547,7 @@
         "filename": "tests/app/main/views/test_register.py",
         "hashed_secret": "bdbb156d25d02fd7792865824201dda1c60f4473",
         "is_verified": false,
-        "line_number": 116,
+        "line_number": 122,
         "is_secret": false
       },
       {
@@ -573,7 +555,7 @@
         "filename": "tests/app/main/views/test_register.py",
         "hashed_secret": "5baa61e4c9b93f3f0682250b6cf8331b7ee68fd8",
         "is_verified": false,
-        "line_number": 192,
+        "line_number": 201,
         "is_secret": false
       },
       {
@@ -581,7 +563,7 @@
         "filename": "tests/app/main/views/test_register.py",
         "hashed_secret": "bb5b7caa27d005d38039e3797c3ddb9bcd22c3c8",
         "is_verified": false,
-        "line_number": 260,
+        "line_number": 274,
         "is_secret": false
       }
     ],
@@ -591,7 +573,7 @@
         "filename": "tests/app/main/views/test_sign_in.py",
         "hashed_secret": "8b8b69116ee882b5e987e330f55db81aba0636f9",
         "is_verified": false,
-        "line_number": 90,
+        "line_number": 97,
         "is_secret": false
       }
     ],
@@ -601,7 +583,7 @@
         "filename": "tests/app/main/views/test_two_factor.py",
         "hashed_secret": "dc66ad927c29e31c6c374231f57a4684b0687bfe",
         "is_verified": false,
-        "line_number": 267,
+        "line_number": 290,
         "is_secret": false
       }
     ],
@@ -611,7 +593,7 @@
         "filename": "tests/app/main/views/test_user_profile.py",
         "hashed_secret": "8072d7aad32964ec43fbcb699c75dc38890792f7",
         "is_verified": false,
-        "line_number": 350,
+        "line_number": 336,
         "is_secret": false
       },
       {
@@ -619,7 +601,7 @@
         "filename": "tests/app/main/views/test_user_profile.py",
         "hashed_secret": "4c9dbb972da179e4f66f023eaa5fb9451d835030",
         "is_verified": false,
-        "line_number": 351,
+        "line_number": 337,
         "is_secret": false
       }
     ],
@@ -702,5 +684,5 @@
       }
     ]
   },
-  "generated_at": "2024-06-11T22:26:18Z"
+  "generated_at": "2024-10-07T20:44:40Z"
 }

.github/actions/deploy-proxy/action.yml

@@ -1,6 +1,9 @@
 name: Deploy egress proxy
 description: Set egress space security groups and deploy proxy
 inputs:
+  cf_org:
+    description: The org the target app exists in.
+    required: true
   cf_space:
     description: The space the target app exists in.
     required: true
@@ -16,6 +19,19 @@ inputs:
 runs:
   using: composite
   steps:
+    - name: Install cf-cli
+      shell: bash
+      run: |
+        curl -A "cg-deploy-action" -v -L -o cf-cli_amd64.deb 'https://packages.cloudfoundry.org/stable?release=debian64&version=v8&source=github'
+        sudo dpkg -i cf-cli_amd64.deb
+    - name: Login to cf-cli
+      shell: bash
+      run: |
+        cf api api.fr.cloud.gov
+        cf auth
+    - name: Target org and space
+      shell: bash
+      run: cf target -o ${{ inputs.cf_org }} -s ${{ inputs.cf_space }}
     - name: Set restricted space egress
       shell: bash
       run: ./terraform/set_space_egress.sh -t -s ${{ inputs.cf_space }}

.github/dependabot.yml

@@ -3,14 +3,22 @@
 # Please see the documentation for all configuration options:
 # https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
 
-version: 3
+version: 2
 updates:
   - package-ecosystem: "pip" # See documentation for possible values
     directory: "/" # Location of package manifests
     schedule:
       interval: "daily"
-  - package-ecosystem: 'npm'
-    directory: '/'
+    assignees:
+      - "A-Shumway42"
+    reviewers:
+      - "A-Shumway42"
+  - package-ecosystem: "npm"
+    directory: "/"
     schedule:
-      interval: 'daily'
-
+      interval: "daily"
+    versioning-strategy: increase
+    assignees:
+      - "alexjanousekGSA"
+    reviewers:
+      - "alexjanousekGSA"

.github/workflows/checks.yml

@@ -23,6 +23,12 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "22.3.0"
+      - name: Install dependencies
+        run: npm install
       - uses: ./.github/actions/setup-project
       - uses: jwalton/gh-find-current-pr@v1
         id: findPr
@@ -38,8 +44,6 @@ jobs:
         run: poetry run isort --check-only ./app ./tests
       - name: Check dead code
         run: make dead-code
-      - name: Run js lint
-        run: npm run lint
       - name: Run js tests
         run: npm test
       - name: Run py tests with coverage
@@ -48,11 +52,14 @@ jobs:
         run: poetry run coverage report --fail-under=90
 
   end-to-end-tests:
+    if: ${{ github.actor != 'dependabot[bot]' }}
+
     permissions:
       checks: write
       pull-requests: write
       contents: write
     runs-on: ubuntu-latest
+    environment: staging
     services:
       postgres:
         image: postgres
@@ -78,64 +85,39 @@ jobs:
         ports:
           # Maps tcp port 6379 on service container to the host
           - 6379:6379
+
     steps:
       - uses: actions/checkout@v4
       - uses: ./.github/actions/setup-project
       - uses: jwalton/gh-find-current-pr@v1
         id: findPr
-      - name: Clone API
-        uses: actions/checkout@v4
-        with:
-         repository: GSA/notifications-api
-         path: 'notifications-api'
-      - name: Install API dependencies
-        working-directory: 'notifications-api'
-        run: make bootstrap
-        env:
-          DATABASE_URL: postgresql://user:password@localhost:5432/test_notification_api
-          SQLALCHEMY_DATABASE_TEST_URI: postgresql://user:password@localhost:5432/test_notification_api
-          REDIS_URL: redis://localhost:6379
-          NOTIFY_E2E_TEST_EMAIL: ${{ secrets.NOTIFY_E2E_TEST_EMAIL }}
-          NOTIFY_E2E_TEST_PASSWORD: ${{ secrets.NOTIFY_E2E_TEST_PASSWORD }}
-          NOTIFY_ENVIRONMENT: development
-      - name: Run API server
-        working-directory: 'notifications-api'
-        run: make run-procfile &
-        env:
-          DATABASE_URL: postgresql://user:password@localhost:5432/test_notification_api
-          SQLALCHEMY_DATABASE_TEST_URI: postgresql://user:password@localhost:5432/test_notification_api
-          REDIS_URL: redis://localhost:6379
-          NOTIFY_E2E_TEST_EMAIL: ${{ secrets.NOTIFY_E2E_TEST_EMAIL }}
-          NOTIFY_E2E_TEST_PASSWORD: ${{ secrets.NOTIFY_E2E_TEST_PASSWORD }}
-          NOTIFY_ENVIRONMENT: development
+      - name: Check API Server availability
+        run: |
+          curl --fail -v https://notify-api-staging.app.cloud.gov || exit 1
       - name: Run Admin server
-        run: make run-flask &
+        # If we want to log stuff and see what's broken,
+        # insert this line:
+        # tail -f admin-server.log &
+        # above make e2e-test
+
+
+        run: |
+          make run-flask > admin-server.log 2>&1 &
+          tail -f admin-server.log &
+          make e2e-test
+
         env:
-          # API_HOST_NAME: https://notify-api-staging.app.cloud.gov
-          API_HOST_NAME: http://localhost:6011
-          DANGEROUS_SALT: ${{ secrets.DANGEROUS_SALT }}
+          API_HOST_NAME: https://notify-api-staging.app.cloud.gov/
           SECRET_KEY: ${{ secrets.SECRET_KEY }}
+          DANGEROUS_SALT: ${{ secrets.DANGEROUS_SALT }}
           ADMIN_CLIENT_SECRET: ${{ secrets.ADMIN_CLIENT_SECRET }}
           ADMIN_CLIENT_USERNAME: notify-admin
           NOTIFY_ENVIRONMENT: e2etest
           NOTIFY_E2E_AUTH_STATE_PATH: ${{ secrets.NOTIFY_E2E_AUTH_STATE_PATH }}
           NOTIFY_E2E_TEST_EMAIL: ${{ secrets.NOTIFY_E2E_TEST_EMAIL }}
           NOTIFY_E2E_TEST_PASSWORD: ${{ secrets.NOTIFY_E2E_TEST_PASSWORD }}
-          NOTIFY_E2E_TEST_URI: http://localhost:6012
-      - name: Run E2E tests
-        # Run the E2E tests against the code found in this PR.
-        # run: poetry run pytest -v --browser chromium --browser firefox --browser webkit tests/end_to_end
-        # --browser webkit doesn't work at this time.
-        run: make e2e-test
-        # Debugging for now to troubleshoot a connectivity issue to the local servers
-        # run: curl --request GET --url "http://localhost:6012"
-        env:
-          NOTIFY_ENVIRONMENT: e2etest
-          NOTIFY_E2E_AUTH_STATE_PATH: ${{ secrets.NOTIFY_E2E_AUTH_STATE_PATH }}
-          NOTIFY_E2E_TEST_EMAIL: ${{ secrets.NOTIFY_E2E_TEST_EMAIL }}
-          NOTIFY_E2E_TEST_PASSWORD: ${{ secrets.NOTIFY_E2E_TEST_PASSWORD }}
-          NOTIFY_E2E_TEST_URI: http://localhost:6012
-
+          NOTIFY_E2E_TEST_URI: http://localhost:6012/
+          VCAP_SERVICES: ${{ secrets.VCAP_SERVICES }}
   validate-new-relic-config:
     runs-on: ubuntu-latest
     environment: staging
@@ -160,6 +142,8 @@ jobs:
       - uses: pypa/gh-action-pip-audit@v1.0.8
         with:
           inputs: requirements.txt
+          ignore-vulns: |
+            PYSEC-2024-60
       - name: Run npm audit
         run: make npm-audit
 
@@ -183,12 +167,12 @@ jobs:
       - name: Run OWASP Baseline Scan
         uses: zaproxy/action-baseline@v0.9.0
         with:
-          docker_name: 'ghcr.io/zaproxy/zaproxy:weekly'
-          target: 'http://localhost:6012'
+          docker_name: "ghcr.io/zaproxy/zaproxy:weekly"
+          target: "http://localhost:6012"
           fail_action: true
           allow_issue_writing: false
-          rules_file_name: 'zap.conf'
-          cmd_options: '-I'
+          rules_file_name: "zap.conf"
+          cmd_options: "-I"
 
   a11y-scan:
     runs-on: ubuntu-20.04

.github/workflows/deploy-demo.yml

@@ -47,11 +47,12 @@ jobs:
         run: poetry export --without-hashes --format=requirements.txt > requirements.txt
 
       - name: Deploy to cloud.gov
-        uses: 18f/cg-deploy-action@main
+        uses: cloud-gov/cg-cli-tools@main
         env:
           DANGEROUS_SALT: ${{ secrets.DANGEROUS_SALT }}
           SECRET_KEY: ${{ secrets.SECRET_KEY }}
           ADMIN_CLIENT_SECRET: ${{ secrets.ADMIN_CLIENT_SECRET }}
+          ADMIN_CLIENT_USERNAME: "notify-admin"
           NEW_RELIC_LICENSE_KEY: ${{ secrets.NEW_RELIC_LICENSE_KEY }}
           NR_BROWSER_KEY: ${{ secrets.NR_BROWSER_KEY }}
           COMMIT_HASH: ${{ github.sha }}
@@ -63,21 +64,22 @@ jobs:
           LOGIN_DOT_GOV_BASE_LOGOUT_URL: "https://secure.login.gov/openid_connect/logout?"
           LOGIN_DOT_GOV_SIGNOUT_REDIRECT: "https://notify-demo.app.cloud.gov/sign-out"
           LOGIN_DOT_GOV_INITIAL_SIGNIN_URL: "https://secure.login.gov/openid_connect/authorize?acr_values=http%3A%2F%2Fidmanagement.gov%2Fns%2Fassurance%2Fial%2F1&client_id=urn:gov:gsa:openidconnect.profiles:sp:sso:gsa:notify-gov&nonce=NONCE&prompt=select_account&redirect_uri=https://notify-demo.app.cloud.gov/sign-in&response_type=code&scope=openid+email&state=STATE"
+          LOGIN_DOT_GOV_CERTS_URL: "https://secure.login.gov/api/openid_connect/certs"
         with:
           cf_username: ${{ secrets.CLOUDGOV_USERNAME }}
           cf_password: ${{ secrets.CLOUDGOV_PASSWORD }}
           cf_org: gsa-tts-benefits-studio
           cf_space: notify-demo
           push_arguments: >-
+            push -f manifest.yml
             --vars-file deploy-config/demo.yml
             --var DANGEROUS_SALT="$DANGEROUS_SALT"
             --var SECRET_KEY="$SECRET_KEY"
-            --var ADMIN_CLIENT_USERNAME="notify-admin"
             --var ADMIN_CLIENT_SECRET="$ADMIN_CLIENT_SECRET"
+            --var ADMIN_CLIENT_USERNAME="$ADMIN_CLIENT_USERNAME"
             --var NEW_RELIC_LICENSE_KEY="$NEW_RELIC_LICENSE_KEY"
             --var NR_BROWSER_KEY="$NR_BROWSER_KEY"
             --var COMMIT_HASH="$COMMIT_HASH"
-            --var LOGIN_PEM="$LOGIN_PEM"
             --var LOGIN_DOT_GOV_CLIENT_ID="$LOGIN_DOT_GOV_CLIENT_ID"
             --var LOGIN_DOT_GOV_USER_INFO_URL="$LOGIN_DOT_GOV_USER_INFO_URL"
             --var LOGIN_DOT_GOV_ACCESS_TOKEN_URL="$LOGIN_DOT_GOV_ACCESS_TOKEN_URL"
@@ -85,6 +87,9 @@ jobs:
             --var LOGIN_DOT_GOV_BASE_LOGOUT_URL="$LOGIN_DOT_GOV_BASE_LOGOUT_URL"
             --var LOGIN_DOT_GOV_SIGNOUT_REDIRECT="$LOGIN_DOT_GOV_SIGNOUT_REDIRECT"
             --var LOGIN_DOT_GOV_INITIAL_SIGNIN_URL="$LOGIN_DOT_GOV_INITIAL_SIGNIN_URL"
+            --var LOGIN_DOT_GOV_CERTS_URL="$LOGIN_DOT_GOV_CERTS_URL"
+            --var LOGIN_PEM="$LOGIN_PEM"
+            --strategy rolling
 
       - name: Check for changes to egress config
         id: changed-egress-config
@@ -97,6 +102,10 @@ jobs:
       - name: Deploy egress proxy
         if: steps.changed-egress-config.outputs.any_changed == 'true'
         uses: ./.github/actions/deploy-proxy
+        env:
+          CF_USERNAME: ${{ secrets.CLOUDGOV_USERNAME }}
+          CF_PASSWORD: ${{ secrets.CLOUDGOV_PASSWORD }}
         with:
+          cf_org: gsa-tts-benefits-studio
           cf_space: notify-demo
           app: notify-admin-demo

.github/workflows/deploy-prod.yml

@@ -47,11 +47,12 @@ jobs:
         run: poetry export --without-hashes --format=requirements.txt > requirements.txt
 
       - name: Deploy to cloud.gov
-        uses: 18f/cg-deploy-action@main
+        uses: cloud-gov/cg-cli-tools@main
         env:
           DANGEROUS_SALT: ${{ secrets.DANGEROUS_SALT }}
           SECRET_KEY: ${{ secrets.SECRET_KEY }}
           ADMIN_CLIENT_SECRET: ${{ secrets.ADMIN_CLIENT_SECRET }}
+          ADMIN_CLIENT_USERNAME: "notify-admin"
           NEW_RELIC_LICENSE_KEY: ${{ secrets.NEW_RELIC_LICENSE_KEY }}
           NR_BROWSER_KEY: ${{ secrets.NR_BROWSER_KEY }}
           COMMIT_HASH: ${{ github.sha }}
@@ -63,21 +64,22 @@ jobs:
           LOGIN_DOT_GOV_BASE_LOGOUT_URL: "https://secure.login.gov/openid_connect/logout?"
           LOGIN_DOT_GOV_SIGNOUT_REDIRECT: "https://beta.notify.gov/sign-out"
           LOGIN_DOT_GOV_INITIAL_SIGNIN_URL: "https://secure.login.gov/openid_connect/authorize?acr_values=http%3A%2F%2Fidmanagement.gov%2Fns%2Fassurance%2Fial%2F1&client_id=urn:gov:gsa:openidconnect.profiles:sp:sso:gsa:notify-gov&nonce=NONCE&prompt=select_account&redirect_uri=https://beta.notify.gov/sign-in&response_type=code&scope=openid+email&state=STATE"
+          LOGIN_DOT_GOV_CERTS_URL: "https://secure.login.gov/api/openid_connect/certs"
         with:
           cf_username: ${{ secrets.CLOUDGOV_USERNAME }}
           cf_password: ${{ secrets.CLOUDGOV_PASSWORD }}
           cf_org: gsa-tts-benefits-studio
           cf_space: notify-production
           push_arguments: >-
+            push -f manifest.yml
             --vars-file deploy-config/production.yml
             --var DANGEROUS_SALT="$DANGEROUS_SALT"
             --var SECRET_KEY="$SECRET_KEY"
-            --var ADMIN_CLIENT_USERNAME="notify-admin"
             --var ADMIN_CLIENT_SECRET="$ADMIN_CLIENT_SECRET"
+            --var ADMIN_CLIENT_USERNAME="$ADMIN_CLIENT_USERNAME"
             --var NEW_RELIC_LICENSE_KEY="$NEW_RELIC_LICENSE_KEY"
             --var NR_BROWSER_KEY="$NR_BROWSER_KEY"
             --var COMMIT_HASH="$COMMIT_HASH"
-            --var LOGIN_PEM="$LOGIN_PEM"
             --var LOGIN_DOT_GOV_CLIENT_ID="$LOGIN_DOT_GOV_CLIENT_ID"
             --var LOGIN_DOT_GOV_USER_INFO_URL="$LOGIN_DOT_GOV_USER_INFO_URL"
             --var LOGIN_DOT_GOV_ACCESS_TOKEN_URL="$LOGIN_DOT_GOV_ACCESS_TOKEN_URL"
@@ -85,6 +87,9 @@ jobs:
             --var LOGIN_DOT_GOV_BASE_LOGOUT_URL="$LOGIN_DOT_GOV_BASE_LOGOUT_URL"
             --var LOGIN_DOT_GOV_SIGNOUT_REDIRECT="$LOGIN_DOT_GOV_SIGNOUT_REDIRECT"
             --var LOGIN_DOT_GOV_INITIAL_SIGNIN_URL="$LOGIN_DOT_GOV_INITIAL_SIGNIN_URL"
+            --var LOGIN_DOT_GOV_CERTS_URL="$LOGIN_DOT_GOV_CERTS_URL"
+            --var LOGIN_PEM="$LOGIN_PEM"
+            --strategy rolling
 
       - name: Check for changes to egress config
         id: changed-egress-config
@@ -97,6 +102,10 @@ jobs:
       - name: Deploy egress proxy
         if: steps.changed-egress-config.outputs.any_changed == 'true'
         uses: ./.github/actions/deploy-proxy
+        env:
+          CF_USERNAME: ${{ secrets.CLOUDGOV_USERNAME }}
+          CF_PASSWORD: ${{ secrets.CLOUDGOV_PASSWORD }}
         with:
-          cf_space: notify-production
-          app: notify-admin-production
+          cf_org: gsa-tts-benefits-studio
+          cf_space: notify-prod
+          app: notify-admin-prod

.github/workflows/deploy.yml

@@ -53,11 +53,12 @@ jobs:
 
 
     - name: Deploy to cloud.gov
-      uses: 18f/cg-deploy-action@main
+      uses: cloud-gov/cg-cli-tools@main
       env:
         DANGEROUS_SALT: ${{ secrets.DANGEROUS_SALT }}
         SECRET_KEY: ${{ secrets.SECRET_KEY }}
         ADMIN_CLIENT_SECRET: ${{ secrets.ADMIN_CLIENT_SECRET }}
+        ADMIN_CLIENT_USERNAME: "notify-admin"
         NEW_RELIC_LICENSE_KEY: ${{ secrets.NEW_RELIC_LICENSE_KEY }}
         NR_BROWSER_KEY: ${{ secrets.NR_BROWSER_KEY }}
         COMMIT_HASH: ${{ github.sha }}
@@ -69,21 +70,22 @@ jobs:
         LOGIN_DOT_GOV_BASE_LOGOUT_URL: "https://secure.login.gov/openid_connect/logout?"
         LOGIN_DOT_GOV_SIGNOUT_REDIRECT: "https://notify-staging.app.cloud.gov/sign-out"
         LOGIN_DOT_GOV_INITIAL_SIGNIN_URL: "https://secure.login.gov/openid_connect/authorize?acr_values=http%3A%2F%2Fidmanagement.gov%2Fns%2Fassurance%2Fial%2F1&client_id=urn:gov:gsa:openidconnect.profiles:sp:sso:gsa:notify-gov&nonce=NONCE&prompt=select_account&redirect_uri=https://notify-staging.app.cloud.gov/sign-in&response_type=code&scope=openid+email&state=STATEE"
+        LOGIN_DOT_GOV_CERTS_URL: "https://secure.login.gov/api/openid_connect/certs"
       with:
         cf_username: ${{ secrets.CLOUDGOV_USERNAME }}
         cf_password: ${{ secrets.CLOUDGOV_PASSWORD }}
         cf_org: gsa-tts-benefits-studio
         cf_space: notify-staging
-        push_arguments: >-
+        cf_command: >-
+          push -f manifest.yml
           --vars-file deploy-config/staging.yml
           --var DANGEROUS_SALT="$DANGEROUS_SALT"
           --var SECRET_KEY="$SECRET_KEY"
-          --var ADMIN_CLIENT_USERNAME="notify-admin"
           --var ADMIN_CLIENT_SECRET="$ADMIN_CLIENT_SECRET"
+          --var ADMIN_CLIENT_USERNAME="$ADMIN_CLIENT_USERNAME"
           --var NEW_RELIC_LICENSE_KEY="$NEW_RELIC_LICENSE_KEY"
           --var NR_BROWSER_KEY="$NR_BROWSER_KEY"
           --var COMMIT_HASH="$COMMIT_HASH"
-          --var LOGIN_PEM="$LOGIN_PEM"
           --var LOGIN_DOT_GOV_CLIENT_ID="$LOGIN_DOT_GOV_CLIENT_ID"
           --var LOGIN_DOT_GOV_USER_INFO_URL="$LOGIN_DOT_GOV_USER_INFO_URL"
           --var LOGIN_DOT_GOV_ACCESS_TOKEN_URL="$LOGIN_DOT_GOV_ACCESS_TOKEN_URL"
@@ -91,6 +93,9 @@ jobs:
           --var LOGIN_DOT_GOV_BASE_LOGOUT_URL="$LOGIN_DOT_GOV_BASE_LOGOUT_URL"
           --var LOGIN_DOT_GOV_SIGNOUT_REDIRECT="$LOGIN_DOT_GOV_SIGNOUT_REDIRECT"
           --var LOGIN_DOT_GOV_INITIAL_SIGNIN_URL="$LOGIN_DOT_GOV_INITIAL_SIGNIN_URL"
+          --var LOGIN_DOT_GOV_CERTS_URL="$LOGIN_DOT_GOV_CERTS_URL"
+          --var LOGIN_PEM="$LOGIN_PEM"
+          --strategy rolling
 
 
     - name: Check for changes to egress config
@@ -104,7 +109,11 @@ jobs:
     - name: Deploy egress proxy
       if: steps.changed-egress-config.outputs.any_changed == 'true'
       uses: ./.github/actions/deploy-proxy
+      env:
+          CF_USERNAME: ${{ secrets.CLOUDGOV_USERNAME }}
+          CF_PASSWORD: ${{ secrets.CLOUDGOV_PASSWORD }}
       with:
+        cf_org: gsa-tts-benefits-studio
         cf_space: notify-staging
         app: notify-admin-staging
 

.gitignore

@@ -123,6 +123,8 @@ app/templates/vendor
 secrets.auto.tfvars
 terraform.tfstate
 terraform.tfstate.backup
+requirements.txt
+terraform/sandbox/requirements.txt
 
 # Playwright
 playwright/
@@ -132,3 +134,8 @@ playwright/
 
 # Nodenv
 .node-version
+
+# BackstopJS
+backstop_data/bitmaps_test/
+backstop_data/html_report/
+backstop_data/engine_scripts/playwright/

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}

Makefile

@@ -88,7 +88,7 @@ dead-code: ## 60% is our aspirational goal, but currently breaks the build
 .PHONY: e2e-test
 e2e-test: export NEW_RELIC_ENVIRONMENT=test
 e2e-test: ## Run end-to-end integration tests; note that --browser webkit isn't currently working
-	poetry run pytest -vv --browser chromium  --browser firefox tests/end_to_end
+	DEBUG=pw:api,pw:browser poetry run pytest -vv --browser chromium  --browser firefox tests/end_to_end
 
 .PHONY: js-lint
 js-lint: ## Run javascript linting scanners

README.md

@@ -507,3 +507,13 @@ insurance.
 For more information on what we're working on, the Notify tool, and how to get
 involved with our team,
 [see our flyer.](https://github.com/GSA/notifications-admin/blob/main/docs/notify-pilot-flyer.md)
+
+## Updating secrets for the E2E tests
+
+At some point, E2E tests will fail because the secrets held in VCAP_SERVICES have expired.  To refresh
+them, you will need to do the following:
+
+1. Log in the normal way to access cloudfoundry command line options
+2. In your terminal, run `chmod +x print_vcap.sh`
+3. In your terminal, run `./print_vcap.sh`
+4. Copy the value in your terminal and paste it into the VCAP_SERVICES secret in Github on the staging tier.

app/__init__.py

@@ -18,7 +18,6 @@ from flask import (
 )
 from flask.globals import request_ctx
 from flask_login import LoginManager, current_user
-from flask_socketio import SocketIO
 from flask_talisman import Talisman
 from flask_wtf import CSRFProtect
 from flask_wtf.csrf import CSRFError
@@ -119,8 +118,6 @@ from notifications_utils.recipients import format_phone_number_human_readable
 login_manager = LoginManager()
 csrf = CSRFProtect()
 talisman = Talisman()
-socketio = SocketIO()
-
 
 # The current service attached to the request stack.
 current_service = LocalProxy(partial(getattr, request_ctx, "service"))
@@ -177,7 +174,6 @@ def create_app(application):
 
     init_govuk_frontend(application)
     init_jinja(application)
-    socketio.init_app(application)
 
     for client in (
         csrf,
@@ -368,11 +364,23 @@ def make_session_permanent():
 
 
 def create_beta_url(url):
-    url_created = urlparse(url)
-    url_list = list(url_created)
-    url_list[1] = "beta.notify.gov"
-    url_for_redirect = urlunparse(url_list)
-    return url_for_redirect
+    url_created = None
+    try:
+        url_created = urlparse(url)
+        url_list = list(url_created)
+        url_list[1] = "beta.notify.gov"
+        url_for_redirect = urlunparse(url_list)
+        return url_for_redirect
+    except ValueError:
+        # This might be happening due to IPv6, see issue # 1395.
+        # If we see "'RequestContext' object has no attribute 'service'" in the logs
+        # we can search around that timestamp and find this output, hopefully.
+        # It may be sufficient to just catch and log, and prevent the stack trace from being in the logs
+        # but we need to confirm the root cause first.
+        current_app.logger.error(
+            f"create_beta_url orig_url: {url} \
+                                 url_created = {str(url_created)} url_for_redirect {str(url_for_redirect)}"
+        )
 
 
 def redirect_notify_to_beta():
@@ -380,6 +388,7 @@ def redirect_notify_to_beta():
         current_app.config["NOTIFY_ENVIRONMENT"] == "production"
         and "beta.notify.gov" not in request.url
     ):
+        # TODO add debug here to trace what is going on with the URL for the 'RequestContext' error
         url_to_beta = create_beta_url(request.url)
         return redirect(url_to_beta, 302)
 

app/assets/error_pages/5xx.html

@@ -17,7 +17,7 @@
     href="/static/images/apple-touch-icon.png?a0f7e1b728a42016b247dc54ee40d055">
   <link rel="icon" type="image/png" sizes="32x32" href="/static/images/favicon-32x32.png">
   <link rel="icon" type="image/png" sizes="16x16" href="/static/images/favicon-16x16.png">
-  <link rel="manifest" href="/static/images/site.webmanifest">
+  <link rel="manifest" href="{{ asset_url('images/site.webmanifest') }}">
 
   <link rel="stylesheet" media="screen" href="/static/stylesheets/main.css?d077f86473501ab244de0b30600536ee" />
   <link rel="stylesheet" media="print" href="/static/stylesheets/print.css?28010888ca5719dc83d7c2c80f6ed2b2" />
@@ -68,11 +68,8 @@
           <p class="usa-body">
             Try again later.
           </p>
-          <p class="usa-body">
-            You can check our <a class="usa-link"
-              href="https://status.notifications.service.gov.uk/">system status</a> page to see if there are any known
-            issues.<br />To report a problem, email <a
-              href="mailto:gov-uk-notify-support@digital.cabinet-office.gov.uk">gov-uk-notify-support@digital.cabinet-office.gov.uk</a>
+          <p>To report a problem you can email us at <a class="usa-link" href="mailto:notify-support@gsa.gov">notify-support@gsa.gov</a>.</p>
+          <p>You can expect a response within one business day.</p>
         </div>
       </div>
     </main>

app/assets/images/gsa-logo.svg

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 13.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 14948)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="719px" height="720px" viewBox="0 0 129.996 130.238" enable-background="new 0 0 129.996 130.238"
+	 xml:space="preserve">
+<rect fill="#00538E" width="129.996" height="130.238"/>
+<path fill="#FFFFFF" d="M78.611,96.076c0,9.138-7.175,12.953-15.451,12.688c-2.938-0.095-5.799-0.838-8.916-1.855l0.707-6.578
+	c2.638,1.086,6.057,2.263,8.92,2.219c3.74-0.058,7.477-1.794,7.477-6.124c0-3.335-2.67-4.976-5.252-6.283
+	c-5.709-2.896-12.275-4.907-12.275-12.998c0-7.65,6.084-11.64,13.625-11.64c2.741,0,6.014,0.477,9.299,1.641l-0.985,6.478
+	c-3.577-1.403-5.14-1.901-8.078-1.901c-3.253,0-6.597,1.143-6.597,4.896c0,2.933,3.01,4.456,5.248,5.573
+	C72.398,85.218,78.611,87.703,78.611,96.076"/>
+<path fill="#FFFFFF" d="M44.561,106.8c-2.632,0.901-6.662,1.964-13.092,1.964c-13.195,0-22.027-8.529-22.027-21.805
+	c0-12.882,9.375-21.455,22.086-21.455c6.036,0,8.727,0.896,12.541,2.212l-0.574,7.216c-3.51-2.294-6.498-3.211-11.674-3.211
+	c-9.09,0-15.158,6.578-15.115,15.412c0.043,9.506,6.648,15.416,14.822,15.416c2.437,0,4.508-0.178,5.996-0.569V91.15h-7.861v-6.103
+	h14.898V106.8"/>
+<polyline fill="#FFFFFF" points="102.041,64.587 112.063,86.918 105.08,86.918 102.041,79.497 98.996,86.918 92.014,86.918
+	102.041,64.587 "/>
+<polyline fill="#FFFFFF" points="112.178,87.179 121.507,108.029 114.176,108.029 107.203,91.839 112.178,87.179 "/>
+<polyline fill="#FFFFFF" points="91.9,87.183 96.873,91.841 93.199,100.24 102.027,95.611 107.109,99.525 89.727,108.031
+	82.57,108.031 91.9,87.183 "/>
+</svg>

app/assets/javascripts/activityChart.js

@@ -0,0 +1,300 @@
+(function (window) {
+
+    if (document.getElementById('activityChartContainer')) {
+
+        const COLORS = {
+            delivered: '#0076d6',
+            failed: '#fa9441',
+            text: '#666'
+        };
+
+        const FONT_SIZE = 16;
+        const FONT_WEIGHT = 'bold';
+        const MAX_Y = 120;
+
+        const createChart = function(containerId, labels, deliveredData, failedData) {
+            const container = d3.select(containerId);
+            container.selectAll('*').remove(); // Clear any existing content
+
+            const margin = { top: 60, right: 20, bottom: 40, left: 20 }; // Adjusted top margin for legend
+            const width = container.node().getBoundingClientRect().width - margin.left - margin.right;
+            const height = 400 - margin.top - margin.bottom;
+
+            const svg = container.append('svg')
+                .attr('width', width + margin.left + margin.right)
+                .attr('height', height + margin.top + margin.bottom)
+                .append('g')
+                .attr('transform', `translate(${margin.left},${margin.top})`);
+
+            let tooltip = d3.select('#tooltip');
+
+            if (tooltip.empty()) {
+                tooltip = d3.select('body').append('div')
+                    .attr('id', 'tooltip')
+                    .style('display', 'none');
+            }
+            // Create legend
+            const legendContainer = d3.select('.chart-legend');
+            legendContainer.selectAll('*').remove(); // Clear any existing legend
+
+            const legendData = [
+                { label: 'Delivered', color: COLORS.delivered },
+                { label: 'Failed', color: COLORS.failed }
+            ];
+
+            const legendItem = legendContainer.selectAll('.legend-item')
+                .data(legendData)
+                .enter()
+                .append('div')
+                .attr('class', 'legend-item');
+
+            legendItem.append('div')
+                .attr('class', 'legend-rect')
+                .style('background-color', d => d.color)
+                .style('display', 'inline-block')
+                .style('margin-right', '5px');
+
+            legendItem.append('span')
+                .attr('class', 'legend-label')
+                .text(d => d.label);
+
+            const x = d3.scaleBand()
+                .domain(labels)
+                .range([0, width])
+                .padding(0.1);
+                            // Adjust the y-axis domain to add some space above the tallest bar
+            const maxY = d3.max(deliveredData.map((d, i) => d + (failedData[i] || 0)));
+            const y = d3.scaleSqrt()
+                .domain([0, maxY + 2]) // Add 2 units of space at the top
+                .nice()
+                .range([height, 0]);
+
+            svg.append('g')
+                .attr('class', 'x axis')
+                .attr('transform', `translate(0,${height})`)
+                .call(d3.axisBottom(x));
+
+            // Generate the y-axis with whole numbers
+            const yAxis = d3.axisLeft(y)
+                .ticks(Math.min(maxY + 2, 10)) // Generate up to 10 ticks based on the data
+                .tickFormat(d3.format('d')); // Ensure whole numbers on the y-axis
+
+            svg.append('g')
+                .attr('class', 'y axis')
+                .call(yAxis);
+
+            // Data for stacking
+            const stackData = labels.map((label, i) => ({
+                label: label,
+                delivered: deliveredData[i],
+                failed: failedData[i] || 0 // Ensure there's a value for failed, even if it's 0
+            }));
+
+            // Stack the data
+            const stack = d3.stack()
+                .keys(['delivered', 'failed'])
+                .order(d3.stackOrderNone)
+                .offset(d3.stackOffsetNone);
+
+            const series = stack(stackData);
+
+            // Color scale
+            const color = d3.scaleOrdinal()
+                .domain(['delivered', 'failed'])
+                .range([COLORS.delivered, COLORS.failed]);
+
+        // Create bars with animation
+        const barGroups = svg.selectAll('.bar-group')
+            .data(series)
+            .enter()
+            .append('g')
+            .attr('class', 'bar-group')
+            .attr('fill', d => color(d.key));
+
+        barGroups.selectAll('rect')
+            .data(d => d)
+            .enter()
+            .append('rect')
+            .attr('x', d => x(d.data.label))
+            .attr('y', height)
+            .attr('height', 0)
+            .attr('width', x.bandwidth())
+            .on('mouseover', function(event, d) {
+                const key = d3.select(this.parentNode).datum().key;
+                const capitalizedKey = key.charAt(0).toUpperCase() + key.slice(1);
+                tooltip.style('display', 'block')
+                    .html(`${d.data.label}<br>${capitalizedKey}: ${d.data[key]}`);
+            })
+            .on('mousemove', function(event) {
+                tooltip.style('left', `${event.pageX + 10}px`)
+                    .style('top', `${event.pageY - 20}px`);
+            })
+            .on('mouseout', function() {
+                tooltip.style('display', 'none');
+            })
+            .transition()
+            .duration(1000)
+            .attr('y', d => y(d[1]))
+            .attr('height', d => y(d[0]) - y(d[1]));
+    };
+
+    // Function to create an accessible table
+    const createTable = function(tableId, chartType, labels, deliveredData, failedData) {
+        const table = document.getElementById(tableId);
+        table.innerHTML = ""; // Clear previous data
+
+        const captionText = document.querySelector(`#${chartType} .chart-subtitle`).textContent;
+        const caption = document.createElement('caption');
+        caption.textContent = captionText;
+        const thead = document.createElement('thead');
+        const tbody = document.createElement('tbody');
+
+        // Create table header
+        const headerRow = document.createElement('tr');
+        const headers = ['Day', 'Delivered', 'Failed'];
+        headers.forEach(headerText => {
+            const th = document.createElement('th');
+            th.textContent = headerText;
+            headerRow.appendChild(th);
+        });
+        thead.appendChild(headerRow);
+
+        // Create table body
+        labels.forEach((label, index) => {
+            const row = document.createElement('tr');
+            const cellDay = document.createElement('td');
+            cellDay.textContent = label;
+            row.appendChild(cellDay);
+
+            const cellDelivered = document.createElement('td');
+            cellDelivered.textContent = deliveredData[index];
+            row.appendChild(cellDelivered);
+
+            const cellFailed = document.createElement('td');
+            cellFailed.textContent = failedData[index];
+            row.appendChild(cellFailed);
+
+            tbody.appendChild(row);
+        });
+
+        table.appendChild(caption);
+        table.appendChild(thead);
+        table.append(tbody);
+    };
+
+    const fetchData = function(type) {
+        var ctx = document.getElementById('weeklyChart');
+        if (!ctx) {
+            return;
+        }
+
+        var url = type === 'service' ? `/daily_stats.json` : `/daily_stats_by_user.json`;
+        return fetch(url)
+            .then(response => {
+                if (!response.ok) {
+                    throw new Error('Network response was not ok');
+                }
+                return response.json();
+            })
+            .then(data => {
+                labels = [];
+                deliveredData = [];
+                failedData = [];
+
+                let totalMessages = 0;
+
+                for (var dateString in data) {
+                    if (data.hasOwnProperty(dateString)) {
+                        const dateParts = dateString.split('-');
+                        const formattedDate = `${dateParts[1]}/${dateParts[2]}/${dateParts[0].slice(2)}`;
+
+                        labels.push(formattedDate);
+                        deliveredData.push(data[dateString].sms.delivered);
+                        failedData.push(data[dateString].sms.failure);
+
+                        // Calculate the total number of messages
+                        totalMessages += data[dateString].sms.delivered + data[dateString].sms.failure;
+                    }
+                }
+
+                // Check if there are no messages sent
+                const subTitle = document.querySelector(`#activityChartContainer .chart-subtitle`);
+                if (totalMessages === 0) {
+                    // Remove existing chart and render the alert message
+                    d3.select('#weeklyChart').selectAll('*').remove();
+                    d3.select('#weeklyChart')
+                        .append('div')
+                        .html(`
+                            <div class="usa-alert usa-alert--info usa-alert--slim">
+                                <div class="usa-alert__body">
+                                    <p class="usa-alert__text">
+                                        No messages sent in the last 7 days
+                                    </p>
+                                </div>
+                            </div>
+                        `);
+                    // Hide the subtitle
+                    if (subTitle) {
+                        subTitle.style.display = 'none';
+                    }
+                } else {
+                    // If there are messages, create the chart and table
+                    createChart('#weeklyChart', labels, deliveredData, failedData);
+                    createTable('weeklyTable', 'activityChart', labels, deliveredData, failedData);
+                }
+
+                return data;
+            })
+            .catch(error => console.error('Error fetching daily stats:', error));
+    };
+
+    const handleDropdownChange = function(event) {
+        const selectedValue = event.target.value;
+        const subTitle = document.querySelector(`#activityChartContainer .chart-subtitle`);
+        const selectElement = document.getElementById('options');
+        const selectedText = selectElement.options[selectElement.selectedIndex].text;
+
+        subTitle.textContent = `${selectedText} - last 7 days`;
+        fetchData(selectedValue);
+
+        // Update ARIA live region
+        const liveRegion = document.getElementById('aria-live-account');
+        liveRegion.textContent = `Data updated for ${selectedText} - last 7 days`;
+
+        // Switch tables based on dropdown selection
+        const selectedTable = selectedValue === "individual" ? "table1" : "table2";
+        const tables = document.querySelectorAll('.table-overflow-x-auto');
+        tables.forEach(function(table) {
+            table.classList.add('hidden'); // Hide all tables by adding the hidden class
+            table.classList.remove('visible'); // Ensure they are not visible
+        });
+        const tableToShow = document.getElementById(selectedTable);
+        tableToShow.classList.remove('hidden'); // Remove hidden class
+        tableToShow.classList.add('visible'); // Add visible class
+    };
+
+    document.addEventListener('DOMContentLoaded', function() {
+        // Initialize activityChart chart and table with service data by default
+        fetchData('service');
+
+        // Add event listener to the dropdown
+        const dropdown = document.getElementById('options');
+        dropdown.addEventListener('change', handleDropdownChange);
+    });
+
+        // Resize chart on window resize
+        window.addEventListener('resize', function() {
+            if (labels.length > 0 && deliveredData.length > 0 && failedData.length > 0) {
+                createChart('#weeklyChart', labels, deliveredData, failedData);
+                createTable('weeklyTable', 'activityChart', labels, deliveredData, failedData);
+            }
+        });
+
+        // Export functions for testing
+        window.createChart = createChart;
+        window.createTable = createTable;
+        window.handleDropdownChange = handleDropdownChange;
+        window.fetchData = fetchData;
+    }
+
+})(window);

app/assets/javascripts/sampleChartDashboard.js

@@ -1,67 +0,0 @@
-(function (window) {
-
-    function initializeChartAndSocket() {
-        var ctx = document.getElementById('myChart');
-        if (!ctx) {
-            return;
-        }
-
-        var myBarChart = new Chart(ctx.getContext('2d'), {
-            type: 'bar',
-            data: {
-                labels: [],
-                datasets: [
-                    {
-                        label: 'Delivered',
-                        data: [],
-                        backgroundColor: '#0076d6',
-                        stack: 'Stack 0'
-                    },
-                ]
-            },
-            options: {
-                scales: {
-                    y: {
-                        beginAtZero: true
-                    }
-                }
-            }
-        });
-
-        var socket = io();
-
-        socket.on('connect', function() {
-            socket.emit('fetch_daily_stats_by_user');
-        });
-
-        socket.on('daily_stats_by_user_update', function(data) {
-            // console.log('Data received:', data);
-            var labels = [];
-            var deliveredData = [];
-
-            for (var date in data) {
-                labels.push(date);
-                deliveredData.push(data[date].sms.delivered);
-            }
-
-            myBarChart.data.labels = labels;
-            myBarChart.data.datasets[0].data = deliveredData;
-            myBarChart.update();
-        });
-
-        socket.on('error', function(data) {
-            // console.log('Error:', data);
-        });
-
-        var sevenDaysButton = document.getElementById('sevenDaysButton');
-        if (sevenDaysButton) {
-            sevenDaysButton.addEventListener('click', function() {
-                socket.emit('fetch_daily_stats_by_user');
-                // console.log('clicked');
-            });
-        }
-    }
-
-    document.addEventListener('DOMContentLoaded', initializeChartAndSocket);
-
-})(window);

app/assets/javascripts/totalMessagesChart.js

@@ -0,0 +1,150 @@
+(function (window) {
+    function createTotalMessagesChart() {
+        var chartContainer = document.getElementById('totalMessageChartContainer');
+        if (!chartContainer) return;
+
+        var chartTitle = document.getElementById('chartTitle').textContent;
+
+        // Access data attributes from the HTML
+        var sms_sent = parseInt(chartContainer.getAttribute('data-sms-sent'));
+        var sms_remaining_messages = parseInt(chartContainer.getAttribute('data-sms-allowance-remaining'));
+        var totalMessages = sms_sent + sms_remaining_messages;
+
+        // Update the message below the chart
+        document.getElementById('message').innerText = `${sms_sent.toLocaleString()} sent / ${sms_remaining_messages.toLocaleString()} remaining`;
+
+        // Calculate minimum width for "Messages Sent" as 1% of the total chart width
+        var minSentPercentage = (sms_sent === 0) ? 0 : 0.02;
+        var minSentValue = totalMessages * minSentPercentage;
+        var displaySent = Math.max(sms_sent, minSentValue);
+        var displayRemaining = totalMessages - displaySent;
+
+        var svg = d3.select("#totalMessageChart");
+        var width = chartContainer.clientWidth;
+        var height = 48;
+
+        // Ensure the width is set correctly
+        if (width === 0) {
+            console.error('Chart container width is 0, cannot set SVG width.');
+            return;
+        }
+
+        svg.attr("width", width).attr("height", height);
+
+        var x = d3.scaleLinear()
+            .domain([0, totalMessages])
+            .range([0, width]);
+
+        // Create tooltip dynamically
+        var tooltip = d3.select("body").append("div")
+            .attr("id", "tooltip");
+
+        // Create the initial bars
+        var sentBar = svg.append("rect")
+            .attr("x", 0)
+            .attr("y", 0)
+            .attr("height", height)
+            .attr("fill", '#0076d6')
+            .attr("width", 0) // Start with width 0 for animation
+            .on('mouseover', function(event) {
+                tooltip.style('display', 'block')
+                    .html(`Messages Sent: ${sms_sent.toLocaleString()}`);
+            })
+            .on('mousemove', function(event) {
+                tooltip.style('left', `${event.pageX + 10}px`)
+                    .style('top', `${event.pageY - 20}px`);
+            })
+            .on('mouseout', function() {
+                tooltip.style('display', 'none');
+            });
+
+        var remainingBar = svg.append("rect")
+            .attr("x", 0) // Initially set to 0, will be updated during animation
+            .attr("y", 0)
+            .attr("height", height)
+            .attr("fill", '#C7CACE')
+            .attr("width", 0) // Start with width 0 for animation
+            .on('mouseover', function(event) {
+                tooltip.style('display', 'block')
+                    .html(`Remaining: ${sms_remaining_messages.toLocaleString()}`);
+            })
+            .on('mousemove', function(event) {
+                tooltip.style('left', `${event.pageX + 10}px`)
+                    .style('top', `${event.pageY - 20}px`);
+            })
+            .on('mouseout', function() {
+                tooltip.style('display', 'none');
+            });
+
+        // Animate the bars together as a single cohesive line
+        svg.transition()
+            .duration(1000)  // Total animation duration
+            .attr("width", width)
+            .tween("resize", function() {
+                var interpolator = d3.interpolate(0, width);
+                return function(t) {
+                    var newWidth = interpolator(t);
+                    var sentWidth = x(displaySent) / width * newWidth;
+                    var remainingWidth = x(displayRemaining) / width * newWidth;
+                    sentBar.attr("width", sentWidth);
+                    remainingBar.attr("x", sentWidth).attr("width", remainingWidth);
+                };
+            });
+
+        // Create and populate the accessible table
+        var tableContainer = document.getElementById('totalMessageTable');
+        var table = document.createElement('table');
+        table.className = 'usa-sr-only usa-table';
+
+        var caption = document.createElement('caption');
+        caption.textContent = chartTitle;
+        table.appendChild(caption);
+
+        var thead = document.createElement('thead'); // Ensure thead is created
+        var theadRow = document.createElement('tr');
+        var thMessagesSent = document.createElement('th');
+        thMessagesSent.textContent = 'Messages Sent'; // First column header
+        var thRemaining = document.createElement('th');
+        thRemaining.textContent = 'Remaining'; // Second column header
+        theadRow.appendChild(thMessagesSent);
+        theadRow.appendChild(thRemaining);
+        thead.appendChild(theadRow); // Append theadRow to the thead
+        table.appendChild(thead);
+
+        var tbody = document.createElement('tbody');
+        var tbodyRow = document.createElement('tr');
+
+        var tdMessagesSent = document.createElement('td');
+        tdMessagesSent.textContent = sms_sent.toLocaleString(); // Value for Messages Sent
+        var tdRemaining = document.createElement('td');
+        tdRemaining.textContent = sms_remaining_messages.toLocaleString(); // Value for Remaining
+
+        tbodyRow.appendChild(tdMessagesSent);
+        tbodyRow.appendChild(tdRemaining);
+        tbody.appendChild(tbodyRow);
+
+        table.appendChild(tbody);
+        tableContainer.appendChild(table);
+
+        table.appendChild(tbody);
+        tableContainer.appendChild(table);
+
+        // Ensure the chart resizes correctly on window resize
+        window.addEventListener('resize', function () {
+            width = chartContainer.clientWidth;
+            x.range([0, width]);
+            svg.attr("width", width);
+            sentBar.attr("width", x(displaySent));
+            remainingBar.attr("x", x(displaySent)).attr("width", x(displayRemaining));
+        });
+    }
+
+    // Initialize total messages chart if the container exists
+    document.addEventListener('DOMContentLoaded', function() {
+        createTotalMessagesChart();
+    });
+
+    // Export function for testing
+    window.createTotalMessagesChart = createTotalMessagesChart;
+
+})(window);

app/assets/js/setTimezone.js

@@ -0,0 +1,4 @@
+document.addEventListener('DOMContentLoaded', function() {
+    var timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+    document.cookie = `timezone=${timeZone}; path=/`;
+})

app/assets/sass/uswds/_data-visualization.scss

@@ -0,0 +1,159 @@
+@use "uswds-core" as *;
+
+$delivered: color('blue-50v');
+$pending: color('green-cool-40v');
+$failed: color('gray-cool-20');
+
+.chart-container {
+  display: flex;
+  &.usage {
+    height: units(4);
+  }
+  svg {
+    overflow: visible;
+  }
+}
+
+#totalMessageChartContainer {
+  max-width: 600px;
+}
+
+.bar {
+  border-radius: units(0.5);
+  &.delivered, &.usage {
+    background-color: $delivered;
+    margin-right: 1px;
+  }
+  &.pending{
+    background-color: $pending;
+    margin-right: 1px;
+  }
+  &.failed, &.remaining {
+    background-color: $failed;
+  }
+}
+
+.legend {
+  display: flex;
+  margin: units(1) 0;
+  .legend-item {
+    display: flex;
+    align-items: flex-start;
+    margin-right: units(2);
+  }
+  .legend-color {
+    width: units(3);
+    height: units(3);
+    margin-right: 0;
+    padding: 0;
+    border-radius: 2px;
+    background-color: $delivered;
+    &.pending {
+      background-color: $pending;
+    }
+    &.failed, &.remaining {
+      background-color: $failed;
+    }
+  }
+  .legend-value {
+    margin: 0 units(1);
+  }
+}
+
+.usa-tooltip {
+  line-height: 1;
+  .usa-tooltip__body {
+    width: units(mobile);
+      font-size: size("body", 2);
+    height: auto;
+    white-space: wrap;
+    line-height: units(1);
+  }
+}
+
+.progress-bar {
+  width: 300px;
+  height: 20px;
+  background-color: #eee;
+  border-radius: 5px;
+  margin-bottom: 10px;
+}
+
+.progress-bar-inner {
+  height: 100%;
+  background-color: #007bff;
+  border-radius: inherit;
+}
+
+.chart {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+}
+
+.chart-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: units(1) units(1) 0;
+}
+
+.chart-subtitle {
+  font-size: size("body", 6);
+  font-weight: bold;
+  text-align: left;
+  width: 100%;
+  padding: 0;
+  margin: 0;
+}
+
+.axis text {
+  font-size: size("body", 1);
+}
+
+.axis line,
+.axis path {
+  shape-rendering: crispEdges;
+  stroke: #000;
+  fill: none;
+}
+
+.bar {
+  fill-opacity: 0.8;
+}
+
+.chart-container {
+  width: 100%;
+  position: relative;
+}
+
+.chart-legend {
+    display: flex;
+    align-items: center;
+}
+
+.legend-item {
+    display: flex;
+    align-items: center;
+    margin-right: units(2);
+    .legend-rect {
+      width: units(2);
+      height: units(2);
+      margin-right: units(1);
+  }
+}
+
+#tooltip {
+  position: absolute;
+  display: none;
+  background: color('ink');
+  color: #FFF;
+  border: 1px solid #ccc;
+  padding: units(1);
+  border-radius: units(1);
+  pointer-events: none;
+  z-index: 100;
+  font-size: size("body", 3);
+  line-height: 1.3;
+}

app/assets/sass/uswds/_legacy-styles.scss

@@ -344,11 +344,3 @@ h2.recipient-list {
     }
   }
 }
-
-.js-focus-style {
-  outline: 3px solid color("blue-40v");
-  box-shadow: 0 0 0 7px color("blue-40v");
-  *:focus {
-    outline: none;
-  }
-}

app/assets/sass/uswds/_uswds-theme-custom-styles.scss

@@ -22,9 +22,8 @@ i.e.
 
 @use "uswds-core" as *;
 
-iframe:focus, [href]:focus, [tabindex]:focus, [contentEditable=true]:focus {
-    outline: units(1px) dotted color('blue-40v');
-    outline: units(1px) auto color('blue-40v');
+iframe:focus, [href]:focus, [tabindex]:focus, [contentEditable=true]:focus, button:not([disabled]):focus {
+    outline: units(2px) solid color('blue-40v');
     outline-offset: 0.3rem;
 }
 
@@ -277,6 +276,12 @@ td.table-empty-message {
    display: block;
 }
 
+.usa-table {
+   th {
+      border-bottom: 0 !important;
+   }
+}
+
 .js-stick-at-bottom-when-scrolling {
    display: flex;
    align-items: flex-end;
@@ -327,6 +332,22 @@ td.table-empty-message {
    bottom: 0;
 }
 
+.table-overflow-x-auto {
+   &.hidden {
+      display: none;
+   }
+}
+
+@media (max-width: units('desktop-lg')) {
+   .table-overflow-x-auto {
+      overflow-x: auto;
+      table {
+         min-width: 768px;
+      }
+   }
+}
+
+
 // Dashboard
 
 .dashboard {
@@ -376,9 +397,6 @@ td.table-empty-message {
          background-image: url(../img/material-icons/description.svg);
       }
    }
-   .table-wrapper {
-      overflow-x: scroll;
-   }
 }
 
 .dashboard-table {
@@ -402,6 +420,30 @@ td.table-empty-message {
    }
 }
 
+.job-status-table {
+   table-layout: fixed;
+
+   thead tr th {
+      border-bottom: 0;
+   }
+
+   thead,
+   tbody,
+   tr {
+     width: 100%;
+   }
+
+   th:first-child,
+   td:first-child {
+     width: 75%;
+   }
+
+   th:nth-child(2),R
+   td:nth-child(2) {
+     width: 25%;
+   }
+}
+
 .usage-table {
    ul {
       list-style: none;
@@ -421,27 +463,51 @@ td.table-empty-message {
       width: 25%;
       overflow-wrap: anywhere;
    }
+   td.jobid {
+      width: 5%;
+   }
    td.template {
-      width: 20%;
+      width: 25%;
    }
    td.time-sent {
-      width: 20%;
+      width: 15%;
    }
    td.sender {
-      width: 15%;
+      width: 20%;
+      overflow-wrap: break-word;
    }
    td.count-of-recipients {
       width: 5%;
    }
    td.report {
-      width: 5%;
+      width: 2%;
+      text-align: center;
+   }
+   td.delivered {
+      width: 2%;
+      text-align: center;
+   }
+   td.failed {
+      width: 2%;
+      text-align: center;
+   }
+   td.report img {
+      padding-top: 5px;
    }
    th {
       padding: 0.5rem 1rem
    }
-   td {
-      padding: 0.5rem 1rem
-  }
+}
+
+@media (max-width: 768px) {
+   .usa-table-container--scrollable-mobile {
+      margin: 0;
+      overflow-y:hidden;
+   }
+}
+
+.usa-table th[data-sortable][aria-sort=ascending], .usa-table th[data-sortable][aria-sort=descending] {
+   background-color: #a1d3ff;
 }
 
 #template-list {
@@ -456,6 +522,10 @@ td.table-empty-message {
    }
 }
 
+.usa-prose > p.max-width-full {
+   max-width: 100%;
+}
+
 // Tabs
 
 .tabs {

app/assets/sass/uswds/_uswds-theme.scss

@@ -13,5 +13,6 @@ in the form $setting: value,
    $theme-banner-max-width: "desktop-lg",
    $theme-grid-container-max-width: "desktop-lg",
    $theme-footer-max-width: "desktop-lg",
-   $theme-header-max-width: "desktop-lg"
+   $theme-header-max-width: "desktop-lg",
+   $theme-identifier-max-width: "desktop-lg"
 );

app/assets/sass/uswds/styles.scss

@@ -1,4 +1,5 @@
 @forward "uswds-theme";
 @forward "uswds";
 @forward "uswds-theme-custom-styles";
-@forward "legacy-styles";
+@forward "legacy-styles";
+@forward "data-visualization";

app/assets/stylesheets/main.scss

@@ -34,6 +34,11 @@ $path: '/static/images/';
 // Dependencies from GOV.UK Frontend, packaged to be specific to this application
 @import './govuk-frontend/all';
 
+// Custom overrides
+.govuk-link {
+    font-weight: bold;
+}
+
 // Specific to this application
 @import 'local/typography';
 @import 'grids';

app/config.py

@@ -8,6 +8,7 @@ from notifications_utils import DAILY_MESSAGE_LIMIT
 
 
 class Config(object):
+    SIMULATED_SMS_NUMBERS = ("+14254147755", "+14254147167")
     NOTIFY_APP_NAME = "admin"
     NOTIFY_ENVIRONMENT = getenv("NOTIFY_ENVIRONMENT", "development")
     API_HOST_NAME = getenv("API_HOST_NAME", "localhost")

app/content/get-started.md

@@ -14,7 +14,7 @@ Learn how to [personalize messages](/using-notify/guidance) to increase response
 Learn about message _parts_ and [how limits are calculated](/using-notify/pricing).
 
 5. ## Start sending messages
-To remove the restrictions of Trial Mode and begin sending messages to clients complete the [Live Campaign Form](https://airtable.com/appe4n7jYOALPLcyU/shrIPWnLTw9U1fclL).
+To remove the restrictions of Trial Mode and begin sending messages to clients complete the <a class="usa-link usa-link--external" href="https://docs.google.com/forms/d/1fnaBtxuGf3q-OdGVyt2LqBKvp9_P21kmKJa0yIK8rWM/edit">Go-Live Form</a>.
 We’ll respond within one business day.
 
 ### Questions?

app/formatters.py

@@ -231,6 +231,11 @@ def naturaltime_without_indefinite_article(date):
     )
 
 
+def convert_time_unixtimestamp(date_string):
+    dt = datetime.fromisoformat(date_string)
+    return int(dt.timestamp())
+
+
 def format_delta(date):
     # This method assumes that date is in UTC
     date = parse_naive_dt(date)

app/main/__init__.py

@@ -3,6 +3,7 @@ from flask import Blueprint
 main = Blueprint("main", __name__)
 
 from app.main.views import (  # noqa isort:skip
+    activity,
     add_service,
     api_keys,
     choose_account,

app/main/forms.py

@@ -50,6 +50,7 @@ from app.main.validators import (
     CommonlyUsedPassword,
     CsvFileValidator,
     DoesNotStartWithDoubleZero,
+    FieldCannotContainComma,
     LettersNumbersSingleQuotesFullStopsAndUnderscoresOnly,
     MustContainAlphanumericCharacters,
     NoCommasInPlaceHolders,
@@ -1650,7 +1651,11 @@ def get_placeholder_form_instance(
             )  # TODO: replace with us_mobile_number
     else:
         field = GovukTextInputField(
-            placeholder_name, validators=[DataRequired(message="Cannot be empty")]
+            placeholder_name,
+            validators=[
+                DataRequired(message="Cannot be empty"),
+                FieldCannotContainComma(),
+            ],
         )
 
     PlaceholderForm.placeholder_value = field

app/main/validators.py

@@ -161,6 +161,15 @@ class DoesNotStartWithDoubleZero:
             raise ValidationError(self.message)
 
 
+class FieldCannotContainComma:
+    def __init__(self, message="Cannot contain a comma"):
+        self.message = message
+
+    def __call__(self, form, field):
+        if field.data and "," in field.data:
+            raise ValidationError(self.message)
+
+
 class MustContainAlphanumericCharacters:
     regex = re.compile(r".*[a-zA-Z0-9].*[a-zA-Z0-9].*")
 

app/main/views/activity.py

@@ -0,0 +1,124 @@
+from flask import abort, render_template, request, url_for
+
+from app import current_service, job_api_client
+from app.formatters import convert_time_unixtimestamp, get_time_left
+from app.main import main
+from app.utils.pagination import (
+    generate_next_dict,
+    generate_pagination_pages,
+    generate_previous_dict,
+    get_page_from_request,
+)
+from app.utils.user import user_has_permissions
+
+
+@main.route("/activity/services/<uuid:service_id>")
+@user_has_permissions("view_activity")
+def all_jobs_activity(service_id):
+    service_data_retention_days = 7
+    page = get_page_from_request()
+    jobs = job_api_client.get_page_of_jobs(service_id, page=page)
+    all_jobs_dict = generate_job_dict(jobs)
+    prev_page, next_page, pagination = handle_pagination(jobs, service_id, page)
+    message_type = ("sms",)
+    return render_template(
+        "views/activity/all-activity.html",
+        all_jobs_dict=all_jobs_dict,
+        service_data_retention_days=service_data_retention_days,
+        next_page=next_page,
+        prev_page=prev_page,
+        pagination=pagination,
+        download_link_one_day=url_for(
+            ".download_notifications_csv",
+            service_id=current_service.id,
+            message_type=message_type,
+            status=request.args.get("status"),
+            number_of_days="one_day",
+        ),
+        download_link_three_day=url_for(
+            ".download_notifications_csv",
+            service_id=current_service.id,
+            message_type=message_type,
+            status=request.args.get("status"),
+            number_of_days="three_day",
+        ),
+        download_link_five_day=url_for(
+            ".download_notifications_csv",
+            service_id=current_service.id,
+            message_type=message_type,
+            status=request.args.get("status"),
+            number_of_days="five_day",
+        ),
+        download_link_seven_day=url_for(
+            ".download_notifications_csv",
+            service_id=current_service.id,
+            message_type=message_type,
+            status=request.args.get("status"),
+            number_of_days="seven_day",
+        ),
+    )
+
+
+def handle_pagination(jobs, service_id, page):
+    if page is None:
+        abort(404, "Invalid page argument ({}).".format(request.args.get("page")))
+    prev_page = (
+        generate_previous_dict("main.all_jobs_activity", service_id, page)
+        if page > 1
+        else None
+    )
+    next_page = (
+        generate_next_dict("main.all_jobs_activity", service_id, page)
+        if jobs.get("links", {}).get("next")
+        else None
+    )
+    pagination = generate_pagination_pages(
+        jobs.get("total", {}), jobs.get("page_size", {}), page
+    )
+    return prev_page, next_page, pagination
+
+
+def generate_job_dict(jobs):
+    return [
+        {
+            "job_id": job["id"],
+            "time_left": get_time_left(job["created_at"]),
+            "download_link": url_for(
+                ".view_job_csv", service_id=current_service.id, job_id=job["id"]
+            ),
+            "view_job_link": url_for(
+                ".view_job", service_id=current_service.id, job_id=job["id"]
+            ),
+            "created_at": job["created_at"],
+            "time_sent_data_value": convert_time_unixtimestamp(
+                job["processing_finished"]
+                if job["processing_finished"]
+                else (
+                    job["processing_started"]
+                    if job["processing_started"]
+                    else job["created_at"]
+                )
+            ),
+            "processing_finished": job["processing_finished"],
+            "processing_started": job["processing_started"],
+            "created_by": job["created_by"],
+            "template_name": job["template_name"],
+            "delivered_count": next(
+                (
+                    stat["count"]
+                    for stat in job.get("statistics", [])
+                    if stat["status"] == "delivered"
+                ),
+                None,
+            ),
+            "failed_count": next(
+                (
+                    stat["count"]
+                    for stat in job.get("statistics", [])
+                    if stat["status"] == "failed"
+                ),
+                None,
+            ),
+        }
+        for job in jobs["data"]
+    ]

app/main/views/dashboard.py

@@ -1,25 +1,22 @@
 import calendar
-from collections import defaultdict
 from datetime import datetime
 from functools import partial
 from itertools import groupby
 
 from flask import Response, abort, jsonify, render_template, request, session, url_for
 from flask_login import current_user
-from flask_socketio import emit
 from werkzeug.utils import redirect
 
 from app import (
     billing_api_client,
     current_service,
     job_api_client,
-    notification_api_client,
     service_api_client,
-    socketio,
     template_statistics_client,
 )
 from app.formatters import format_date_numeric, format_datetime_numeric, get_time_left
 from app.main import main
+from app.main.views.user_profile import set_timezone
 from app.statistics_utils import get_formatted_percentage
 from app.utils import (
     DELIVERED_STATUSES,
@@ -34,38 +31,6 @@ from app.utils.user import user_has_permissions
 from notifications_utils.recipients import format_phone_number_human_readable
 
 
-@socketio.on("fetch_daily_stats")
-def handle_fetch_daily_stats():
-    service_id = session.get('service_id')
-    if service_id:
-        date_range = get_stats_date_range()
-        daily_stats = service_api_client.get_service_notification_statistics_by_day(
-            service_id, start_date=date_range["start_date"], days=date_range["days"]
-        )
-        emit("daily_stats_update", daily_stats)
-    else:
-        emit("error", {"error": "No service_id provided"})
-
-
-@socketio.on("fetch_daily_stats_by_user")
-def handle_fetch_daily_stats_by_user():
-    service_id = session.get("service_id")
-    user_id = session.get("user_id")
-    if service_id and user_id:
-        date_range = get_stats_date_range()
-        daily_stats_by_user = (
-            service_api_client.get_user_service_notification_statistics_by_day(
-                service_id,
-                user_id,
-                start_date=date_range["start_date"],
-                days=date_range["days"],
-            )
-        )
-        emit("daily_stats_by_user_update", daily_stats_by_user)
-    else:
-        emit("error", {"error": "No service_id or user_id provided"})
-
-
 @main.route("/services/<uuid:service_id>/dashboard")
 @user_has_permissions("view_activity", "send_messages")
 def old_service_dashboard(service_id):
@@ -75,6 +40,7 @@ def old_service_dashboard(service_id):
 @main.route("/services/<uuid:service_id>")
 @user_has_permissions()
 def service_dashboard(service_id):
+
     if session.get("invited_user_id"):
         session.pop("invited_user_id", None)
         session["service_id"] = service_id
@@ -82,19 +48,21 @@ def service_dashboard(service_id):
     if not current_user.has_permissions("view_activity"):
         return redirect(url_for("main.choose_template", service_id=service_id))
 
+    yearly_usage = billing_api_client.get_annual_usage_for_service(
+        service_id,
+        get_current_financial_year(),
+    )
+    free_sms_allowance = billing_api_client.get_free_sms_fragment_limit_for_year(
+        current_service.id,
+    )
+    usage_data = get_annual_usage_breakdown(yearly_usage, free_sms_allowance)
+    sms_sent = usage_data["sms_sent"]
+    sms_allowance_remaining = usage_data["sms_allowance_remaining"]
+
     job_response = job_api_client.get_jobs(service_id)["data"]
-    notifications_response = notification_api_client.get_notifications_for_service(
-        service_id
-    )["notifications"]
     service_data_retention_days = 7
 
-    aggregate_notifications_by_job = defaultdict(list)
-    for notification in notifications_response:
-        job_id = notification.get("job", {}).get("id", None)
-        if job_id:
-            aggregate_notifications_by_job[job_id].append(notification)
-
-    job_and_notifications = [
+    jobs = [
         {
             "job_id": job["id"],
             "time_left": get_time_left(job["created_at"]),
@@ -105,22 +73,52 @@ def service_dashboard(service_id):
                 ".view_job", service_id=current_service.id, job_id=job["id"]
             ),
             "created_at": job["created_at"],
+            "processing_finished": job.get("processing_finished"),
+            "processing_started": job.get("processing_started"),
             "notification_count": job["notification_count"],
             "created_by": job["created_by"],
-            "notifications": aggregate_notifications_by_job.get(job["id"], []),
+            "template_name": job["template_name"],
+            "original_file_name": job["original_file_name"],
         }
         for job in job_response
-        if aggregate_notifications_by_job.get(job["id"], [])
+        if job["job_status"] != "cancelled"
     ]
     return render_template(
         "views/dashboard/dashboard.html",
         updates_url=url_for(".service_dashboard_updates", service_id=service_id),
         partials=get_dashboard_partials(service_id),
-        job_and_notifications=job_and_notifications,
+        jobs=jobs,
         service_data_retention_days=service_data_retention_days,
+        sms_sent=sms_sent,
+        sms_allowance_remaining=sms_allowance_remaining,
     )
 
 
+@main.route("/daily_stats.json")
+def get_daily_stats():
+    service_id = session.get("service_id")
+    date_range = get_stats_date_range()
+
+    stats = service_api_client.get_service_notification_statistics_by_day(
+        service_id, start_date=date_range["start_date"], days=date_range["days"]
+    )
+    return jsonify(stats)
+
+
+@main.route("/daily_stats_by_user.json")
+def get_daily_stats_by_user():
+    service_id = session.get("service_id")
+    date_range = get_stats_date_range()
+    user_id = current_user.id
+    stats = service_api_client.get_user_service_notification_statistics_by_day(
+        service_id,
+        user_id,
+        start_date=date_range["start_date"],
+        days=date_range["days"],
+    )
+    return jsonify(stats)
+
+
 @main.route("/services/<uuid:service_id>/dashboard.json")
 @user_has_permissions("view_activity")
 def service_dashboard_updates(service_id):
@@ -327,13 +325,19 @@ def aggregate_template_usage(template_statistics, sort_key="count"):
         key=lambda x: x["template_id"],
     ):
         template_stats = list(v)
-
+        first_stat = template_stats[0] if template_stats else None
         templates.append(
             {
                 "template_id": k,
-                "template_name": template_stats[0]["template_name"],
-                "template_type": template_stats[0]["template_type"],
+                "template_name": first_stat.get("template_name"),
+                "template_type": first_stat.get("template_type"),
                 "count": sum(s["count"] for s in template_stats),
+                "created_by": first_stat.get("created_by"),
+                "created_by_id": first_stat.get("created_by_id"),
+                "last_used": first_stat.get("last_used"),
+                "status": first_stat.get("status"),
+                "template_folder": first_stat.get("template_folder"),
+                "template_folder_id": first_stat.get("template_folder_id"),
             }
         )
 
@@ -406,11 +410,13 @@ def get_dashboard_partials(service_id):
 
 
 def get_dashboard_totals(statistics):
+
     for msg_type in statistics.values():
         msg_type["failed_percentage"] = get_formatted_percentage(
             msg_type["failed"], msg_type["requested"]
         )
         msg_type["show_warning"] = float(msg_type["failed_percentage"]) > 3
+
     return statistics
 
 
@@ -469,6 +475,8 @@ def get_months_for_financial_year(year, time_format="%B"):
 
 
 def get_current_month_for_financial_year(year):
+    # Setting the timezone here because we need to set it somewhere.
+    set_timezone()
     current_month = datetime.now().month
     return current_month
 

app/main/views/index.py

@@ -1,6 +1,15 @@
 import os
+import secrets
 
-from flask import abort, current_app, redirect, render_template, request, url_for
+from flask import (
+    abort,
+    current_app,
+    redirect,
+    render_template,
+    request,
+    session,
+    url_for,
+)
 from flask_login import current_user
 
 from app import status_api_client
@@ -23,8 +32,12 @@ def index():
     )
     url = os.getenv("LOGIN_DOT_GOV_INITIAL_SIGNIN_URL")
     # handle unit tests
+
+    nonce = secrets.token_urlsafe()
+    session["nonce"] = nonce
+
     if url is not None:
-        url = url.replace("NONCE", token)
+        url = url.replace("NONCE", nonce)
         url = url.replace("STATE", token)
     return render_template(
         "views/signedout.html",

app/main/views/jobs.py

@@ -312,7 +312,7 @@ def get_status_filters(service, message_type, statistics):
     filters = [
         # key, label, option
         ("requested", "total", "sending,delivered,failed"),
-        ("pending", "pending", "pending"),
+        ("pending", "pending", "sending,pending"),
         ("delivered", "delivered", "delivered"),
         ("failed", "failed", "failed"),
     ]

app/main/views/platform_admin.py

@@ -1,9 +1,20 @@
+import csv
 import itertools
 import json
 from collections import OrderedDict
 from datetime import datetime
+from io import StringIO
 
-from flask import abort, flash, render_template, request, url_for
+from flask import (
+    Response,
+    abort,
+    current_app,
+    flash,
+    render_template,
+    request,
+    session,
+    url_for,
+)
 from notifications_python_client.errors import HTTPError
 
 from app import (
@@ -23,6 +34,7 @@ from app.main.forms import (
     DateFilterForm,
     RequiredDateFilterForm,
 )
+from app.main.views.send import _send_notification
 from app.statistics_utils import (
     get_formatted_percentage,
     get_formatted_percentage_two_dp,
@@ -70,6 +82,40 @@ def platform_admin():
     )
 
 
+@main.route("/platform-admin/download-all-users")
+@user_is_platform_admin
+def download_all_users():
+
+    # Create a CSV string from the user data
+    users = user_api_client.get_all_users_detailed()
+
+    if len(users) == 0:
+        return "No data to download."
+
+    output = StringIO()
+    header = ["Name", "Email Address", "Phone Number", "Service"]
+    fieldnames = ["name", "email_address", "mobile_number", "service"]
+    writer = csv.DictWriter(
+        output,
+        fieldnames=fieldnames,
+        delimiter=",",
+    )
+    # Write custom header
+    writer.writerow(dict(zip(fieldnames, header)))
+    for user in users:
+        user_no_commas = {key: value.replace(",", "") for key, value in user.items()}
+        if user_no_commas["name"].startswith("e2e"):
+            continue
+        writer.writerow(user_no_commas)
+    csv_data = output.getvalue()
+
+    # Create a direct download response with the CSV data and appropriate headers
+    response = Response(csv_data, content_type="text/csv; charset=utf-8")
+    response.headers["Content-Disposition"] = "attachment; filename=users.csv"
+
+    return response
+
+
 def is_over_threshold(number, total, threshold):
     percentage = number / total * 100 if total else 0
     return percentage > threshold
@@ -735,3 +781,80 @@ def _get_user_row(r):
     row.append(r["password_changed_at"])
     row.append(r["state"])
     return row
+
+
+@main.route(
+    "/platform-admin/load-test",
+    methods=["POST", "GET"],
+)
+@user_is_platform_admin
+def load_test():
+    """
+    The load test assumes that a service called 'Test service' exists.  It will make
+    the platform admin a member of this service if the platform is not already. All
+    messagese will be sent in this service.
+    """
+    service = _find_load_test_service()
+    _prepare_load_test_service(service)
+    example_template = _find_example_template(service)
+
+    # Simulated success
+    for _ in range(0, 250):
+        session["recipient"] = current_app.config["SIMULATED_SMS_NUMBERS"][0]
+        session["placeholders"] = {
+            "day of week": "Monday",
+            "color": "blue",
+            "phone number": current_app.config["SIMULATED_SMS_NUMBERS"][0],
+        }
+        _send_notification(service["id"], example_template["id"])
+    # Simulated failure
+    for _ in range(0, 250):
+        session["recipient"] = current_app.config["SIMULATED_SMS_NUMBERS"][1]
+        session["placeholders"] = {
+            "day of week": "Wednesday",
+            "color": "orange",
+            "phone number": current_app.config["SIMULATED_SMS_NUMBERS"][1],
+        }
+        _send_notification(service["id"], example_template["id"])
+
+    # For now, just redirect to the splash page so we know it's done
+    return render_template(
+        "views/platform-admin/splash-page.html",
+    )
+
+
+def _find_example_template(service):
+    templates = service_api_client.get_service_templates(service["id"])
+    templates = templates["data"]
+    for template in templates:
+        # template = json.loads(template)
+        if template["name"] == "Example text message template":
+            return template
+
+    raise Exception("Could not find example template for load test")
+
+
+def _find_load_test_service():
+    services = service_api_client.find_services_by_name("Test service")
+    services = services["data"]
+
+    for service in services:
+        if service["name"] == "Test service":
+            return service
+
+    raise Exception("Could not find 'Test service' for load test")
+
+
+def _prepare_load_test_service(service):
+    users = user_api_client.get_all_users()
+    for user in users:
+        if user["platform_admin"] == "t":
+            try:
+                user_api_client.add_user_to_service(
+                    service["id"], user["id"], ["send messages"]
+                )
+            except Exception:
+                current_app.logger.exception(
+                    "Couldnt add user, may already be part of service"
+                )
+                pass

app/main/views/register.py

@@ -230,7 +230,12 @@ def set_up_your_profile():
         debug_msg(
             f"Added user {usr.email_address} to service {invite_data['service_id']}"
         )
-        return redirect(url_for("main.show_accounts_or_dashboard"))
+        # notify-admin-1766
+        # redirect new users to templates area of new service instead of dashboard
+        service_id = invite_data["service_id"]
+        url = url_for(".service_dashboard", service_id=service_id)
+        url = f"{url}/templates"
+        return redirect(url)
 
     elif login_gov_error:
         current_app.logger.error(f"login.gov error: {login_gov_error}")

app/main/views/send.py

@@ -1,4 +1,4 @@
-from pipes import quote
+import os
 import time
 import uuid
 from string import ascii_uppercase
@@ -34,6 +34,7 @@ from app.main.forms import (
     SetSenderForm,
     get_placeholder_form_instance,
 )
+from app.main.views.user_profile import set_timezone
 from app.models.user import Users
 from app.s3_client.s3_csv_client import (
     get_csv_metadata,
@@ -94,7 +95,6 @@ def get_example_csv_rows(template, use_example_as_example=True, submitted_fields
 )
 @user_has_permissions("send_messages", restrict_admin_usage=True)
 def send_messages(service_id, template_id):
-    print(hilite("top of send_messages"))
     notification_count = service_api_client.get_notification_count(service_id)
     remaining_messages = current_service.message_limit - notification_count
 
@@ -487,7 +487,6 @@ def send_one_off_step(service_id, template_id, step_index):
 
 
 def _check_messages(service_id, template_id, upload_id, preview_row, **kwargs):
-    print(hilite("top of _check_messages"))
     try:
         # The happy path is that the job doesn’t already exist, so the
         # API will return a 404 and the client will raise HTTPError.
@@ -623,7 +622,6 @@ def _check_messages(service_id, template_id, upload_id, preview_row, **kwargs):
 @user_has_permissions("send_messages", restrict_admin_usage=True)
 def check_messages(service_id, template_id, upload_id, row_index=2):
     data = _check_messages(service_id, template_id, upload_id, row_index)
-    print(hilite(f"data after checking messages: \n {data}"))
     data["allowed_file_extensions"] = Spreadsheet.ALLOWED_FILE_EXTENSIONS
 
     if (
@@ -804,9 +802,15 @@ def get_skip_link(step_index, template):
 )
 @user_has_permissions("send_messages", restrict_admin_usage=True)
 def send_one_off_to_myself(service_id, template_id):
-    db_template = current_service.get_template_with_user_permission_or_403(
-        template_id, current_user
-    )
+    current_app.logger.info("Send one off to myself")
+    try:
+        db_template = current_service.get_template_with_user_permission_or_403(
+            template_id, current_user
+        )
+    except Exception:
+        current_app.logger.exception("Couldnt get template for one off")
+        # Use 406 just because we're limited to certain codes here and it will point us back to a problem here
+        abort(406)
 
     if db_template["template_type"] not in ("sms", "email"):
         abort(404)
@@ -945,8 +949,8 @@ def preview_notification(service_id, template_id):
 )
 @user_has_permissions("send_messages", restrict_admin_usage=True)
 def send_notification(service_id, template_id):
-    scheduled_for = session.pop("scheduled_for", "")
     recipient = get_recipient()
+
     if not recipient:
         return redirect(
             url_for(
@@ -955,56 +959,10 @@ def send_notification(service_id, template_id):
                 template_id=template_id,
             )
         )
+    upload_id = _send_notification(service_id, template_id)
 
-    keys = []
-    values = []
-    for k, v in session["placeholders"].items():
-        keys.append(k)
-        print(hilite(f"value: {v} type: {type(v)}"))
-        value_quotes = '"' + v + '"'
-        print(hilite(f"value with quotes: {value_quotes}"))
-        values.append(value_quotes)
-
-    data = ",".join(keys)
-    vals = ",".join(values)
-    data = f"{data}\r\n{vals}"
-
-    filename = (
-        f"one-off-{uuid.uuid4()}.csv"  # {current_user.name} removed from filename
-    )
-    my_data = {"filename": filename, "template_id": template_id, "data": data}
-    upload_id = s3upload(service_id, my_data)
-
-    # To debug messages that the user reports have not been sent, we log
-    # the csv filename and the job id.  The user will give us the file name,
-    # so we can search on that to obtain the job id, which we can use elsewhere
-    # on the API side to find out what happens to the message.
-    current_app.logger.info(
-        hilite(
-            f"One-off file: {filename} job_id: {upload_id} s3 location: service-{service_id}-notify/{upload_id}.csv"
-        )
-    )
-
-    form = CsvUploadForm()
-    form.file.data = my_data
-    form.file.name = filename
-
-    check_message_output = check_messages(service_id, template_id, upload_id, 2)
-    if "You cannot send to" in check_message_output:
-        return check_messages(service_id, template_id, upload_id, 2)
-
-    job_api_client.create_job(
-        upload_id,
-        service_id,
-        scheduled_for=scheduled_for,
-        template_id=template_id,
-        original_file_name=filename,
-        notification_count=1,
-        valid="True",
-    )
-
-    session.pop("recipient")
-    session.pop("placeholders")
+    session.pop("recipient", "")
+    session.pop("placeholders", "")
 
     # We have to wait for the job to run and create the notification in the database
     time.sleep(0.1)
@@ -1052,6 +1010,63 @@ def send_notification(service_id, template_id):
     )
 
 
+def _send_notification(service_id, template_id):
+    scheduled_for = session.pop("scheduled_for", "")
+
+    keys = []
+    values = []
+    # Guarantee that the real phone number comes last, because some
+    # users will have placeholders like "add your second phone number"
+    # or something like as custom placeholders.
+    for k, v in session["placeholders"].items():
+        if k != "phone number":
+            keys.append(k)
+            values.append(v)
+    if "phone number" in session["placeholders"].keys():
+        keys.append("phone number")
+        values.append(session["placeholders"]["phone number"])
+
+    data = ",".join(keys)
+    vals = ",".join(values)
+    data = f"{data}\r\n{vals}"
+    filename = (
+        f"one-off-{uuid.uuid4()}.csv"  # {current_user.name} removed from filename
+    )
+    my_data = {"filename": filename, "template_id": template_id, "data": data}
+    upload_id = s3upload(service_id, my_data)
+    # To debug messages that the user reports have not been sent, we log
+    # the csv filename and the job id.  The user will give us the file name,
+    # so we can search on that to obtain the job id, which we can use elsewhere
+    # on the API side to find out what happens to the message.
+    current_app.logger.info(
+        hilite(
+            f"One-off file: {filename} job_id: {upload_id} s3 location: {service_id}-service-notify/{upload_id}.csv"
+        )
+    )
+
+    # For load testing we want to skip these checks.  They are doing some fine-grained
+    # comparison about what is in the preview, but the load test just blast messages
+    # and doesn't care about the preview.
+    if os.getenv("NOTIFY_ENVIRONMENT") not in ("development", "staging", "demo"):
+        form = CsvUploadForm()
+        form.file.data = my_data
+        form.file.name = filename
+        check_message_output = check_messages(service_id, template_id, upload_id, 2)
+        if "You cannot send to" in check_message_output:
+            return check_messages(service_id, template_id, upload_id, 2)
+
+    job_api_client.create_job(
+        upload_id,
+        service_id,
+        scheduled_for=scheduled_for,
+        template_id=template_id,
+        original_file_name=filename,
+        notification_count=1,
+        valid="True",
+    )
+    return upload_id
+
+
 def get_email_reply_to_address_from_session():
     if session.get("sender_id"):
         return current_service.get_email_reply_to_address(session["sender_id"])[
@@ -1060,8 +1075,13 @@ def get_email_reply_to_address_from_session():
 
 
 def get_sms_sender_from_session():
-    if session.get("sender_id"):
-        return current_service.get_sms_sender(session["sender_id"])["sms_sender"]
+    sender_id = session.get("sender_id")
+    if sender_id:
+        sms_sender = current_service.get_sms_sender(session["sender_id"])["sms_sender"]
+        current_app.logger.info(f"SMS Sender ({sender_id}) #: {sms_sender}")
+        return sms_sender
+    else:
+        current_app.logger.error("No SMS Sender!!!!!!")
 
 
 def get_spreadsheet_column_headings_from_template(template):
@@ -1077,6 +1097,7 @@ def get_spreadsheet_column_headings_from_template(template):
 
 
 def get_recipient():
+    set_timezone()
     if {"recipient", "placeholders"} - set(session.keys()):
         return None
 

app/main/views/sign_in.py

@@ -1,4 +1,6 @@
+import json
 import os
+import secrets
 import time
 import uuid
 
@@ -12,6 +14,7 @@ from flask import (
     redirect,
     render_template,
     request,
+    session,
     url_for,
 )
 from flask_login import current_user
@@ -28,21 +31,19 @@ from app.utils.user import is_gov_user
 from notifications_utils.url_safe_token import generate_token
 
 
-def _reformat_keystring(orig):
-    new_keystring = orig.replace("-----BEGIN PRIVATE KEY-----", "")
-    new_keystring = new_keystring.replace("-----END PRIVATE KEY-----", "")
-    new_keystring = new_keystring.strip()
-    new_keystring = new_keystring.replace(" ", "\n")
-    new_keystring = "\n".join(
-        ["-----BEGIN PRIVATE KEY-----", new_keystring, "-----END PRIVATE KEY-----"]
-    )
-    new_keystring = f"{new_keystring}\n"
+def _reformat_keystring(orig):  # pragma: no cover
+    arr = orig.split("-----")
+    begin = arr[1]
+    end = arr[3]
+    middle = arr[2].strip()
+    new_keystring = f"-----{begin}-----\n{middle}\n-----{end}-----\n"
     return new_keystring
 
 
-def _get_access_token(code, state):
+def _get_access_token(code, state):  # pragma: no cover
     client_id = os.getenv("LOGIN_DOT_GOV_CLIENT_ID")
     access_token_url = os.getenv("LOGIN_DOT_GOV_ACCESS_TOKEN_URL")
+    certs_url = os.getenv("LOGIN_DOT_GOV_CERTS_URL")
     keystring = os.getenv("LOGIN_PEM")
     if " " in keystring:
         keystring = _reformat_keystring(keystring)
@@ -63,15 +64,47 @@ def _get_access_token(code, state):
     url = f"{base_url}{cli_assert}&{cli_assert_type}&{code_param}&grant_type=authorization_code"
     headers = {"Authorization": "Bearer %s" % token}
     response = requests.post(url, headers=headers)
-    if response.json().get("access_token") is None:
-        # Capture the response json here so it hopefully shows up in error reports
-        current_app.logger.error(f"Error when getting access token {response.json()}")
-        raise KeyError(f"'access_token' {response.json()}")
-    access_token = response.json()["access_token"]
+
+    response_json = response.json()
+    try:
+        encoded_id_token = response_json["id_token"]
+    except KeyError as e:
+        current_app.logger.exception(f"Error when getting id token {response_json}")
+        raise KeyError(f"'access_token' {response.json()}") from e
+
+    # Getting Login.gov signing keys for unpacking the id_token correctly.
+    jwks = requests.get(certs_url).json()
+    public_keys = {
+        jwk["kid"]: {
+            "key": jwt.algorithms.RSAAlgorithm.from_jwk(json.dumps(jwk)),
+            "algo": jwk["alg"],
+        }
+        for jwk in jwks["keys"]
+    }
+    kid = jwt.get_unverified_header(encoded_id_token)["kid"]
+    pub_key = public_keys[kid]["key"]
+    algo = public_keys[kid]["algo"]
+    id_token = jwt.decode(
+        encoded_id_token, pub_key, audience=client_id, algorithms=[algo]
+    )
+
+    nonce = id_token["nonce"]
+    saved_nonce = session.pop("nonce")
+    if nonce != saved_nonce:
+        current_app.logger.error(f"Nonce Error: {nonce} != {saved_nonce}")
+        abort(403)
+
+    try:
+        access_token = response_json["access_token"]
+    except KeyError as e:
+        current_app.logger.exception(
+            f"Error when getting access token {response.json()} #notify-admin-1505"
+        )
+        raise KeyError(f"'access_token' {response.json()}") from e
     return access_token
 
 
-def _get_user_email_and_uuid(access_token):
+def _get_user_email_and_uuid(access_token):  # pragma: no cover
     headers = {"Authorization": "Bearer %s" % access_token}
     user_info_url = os.getenv("LOGIN_DOT_GOV_USER_INFO_URL")
     user_attributes = requests.get(
@@ -83,14 +116,16 @@ def _get_user_email_and_uuid(access_token):
     return user_email, user_uuid
 
 
-def _do_login_dot_gov():
+def _do_login_dot_gov():  # $ pragma: no cover
     # start login.gov
     code = request.args.get("code")
     state = request.args.get("state")
     login_gov_error = request.args.get("error")
 
     if login_gov_error:
-        current_app.logger.error(f"login.gov error: {login_gov_error}")
+        current_app.logger.error(
+            f"login.gov error: {login_gov_error} #notify-admin-1505"
+        )
         raise Exception(f"Could not login with login.gov {login_gov_error}")
     elif code and state:
 
@@ -100,12 +135,15 @@ def _do_login_dot_gov():
             user_email, user_uuid = _get_user_email_and_uuid(access_token)
             if not is_gov_user(user_email):
                 current_app.logger.error(
-                    "invited user has a non-government email address."
+                    "invited user has a non-government email address. #notify-admin-1505"
                 )
                 flash("You must use a government email address.")
                 abort(403)
             redirect_url = request.args.get("next")
             user = user_api_client.get_user_by_uuid_or_email(user_uuid, user_email)
+            current_app.logger.info(
+                f"Retrieved user {user['id']} from db #notify-admin-1505"
+            )
 
             # Check if the email needs to be revalidated
             is_fresh_email = is_less_than_days_ago(
@@ -115,16 +153,18 @@ def _do_login_dot_gov():
                 return verify_email(user, redirect_url)
 
             usr = User.from_email_address(user["email_address"])
+            current_app.logger.info(f"activating user {usr.id} #notify-admin-1505")
             activate_user(usr.id)
         except BaseException as be:  # noqa B036
-            current_app.logger.error(be)
+            current_app.logger.error(f"Error signing in: {be} #notify-admin-1505 ")
             error(401)
+
         return redirect(url_for("main.show_accounts_or_dashboard", next=redirect_url))
 
     # end login.gov
 
 
-def verify_email(user, redirect_url):
+def verify_email(user, redirect_url):  # pragma: no cover
     user_api_client.send_verify_code(user["id"], "email", None, redirect_url)
     title = "Email resent" if request.args.get("email_resent") else "Check your email"
     redirect_url = request.args.get("next")
@@ -133,19 +173,41 @@ def verify_email(user, redirect_url):
     )
 
 
-def _handle_e2e_tests(redirect_url):
-    current_app.logger.warning("E2E TESTS ARE ENABLED.")
-    current_app.logger.warning(
-        "If you are getting a 404 on signin, comment out E2E vars in .env file!"
-    )
-    user = user_api_client.get_user_by_email(os.getenv("NOTIFY_E2E_TEST_EMAIL"))
-    activate_user(user["id"])
-    return redirect(url_for("main.show_accounts_or_dashboard", next=redirect_url))
+def _handle_e2e_tests(redirect_url):  # pragma: no cover
+    try:
+        current_app.logger.warning("E2E TESTS ARE ENABLED.")
+        current_app.logger.warning(
+            "If you are getting a 404 on signin, comment out E2E vars in .env file!"
+        )
+        user = user_api_client.get_user_by_email(os.getenv("NOTIFY_E2E_TEST_EMAIL"))
+        activate_user(user["id"])
+
+        # Check if the redirect URL is present and safe before proceeding further
+        if redirect_url and is_safe_redirect_url(redirect_url):
+            return redirect(redirect_url)
+
+        return redirect(
+            url_for(
+                "main.show_accounts_or_dashboard",
+                next="EMAIL_IS_OK",
+            )
+        )
+
+    except Exception as e:
+        stre = str(e)
+        stre = stre.replace(" ", "_")
+        # Trying to get a message back to playwright somehow since we can't raise an error
+        return redirect(url_for(f"https://{stre}"))
 
 
 @main.route("/sign-in", methods=(["GET", "POST"]))
 @hide_from_search_engines
-def sign_in():
+def sign_in():  # pragma: no cover
+    redirect_url = request.args.get("next")
+
+    if os.getenv("NOTIFY_E2E_TEST_EMAIL"):
+        return _handle_e2e_tests(redirect_url)
+
     # If we have to revalidated the email, send the message
     # via email and redirect to the "verify your email page"
     # and don't proceed further with login
@@ -157,11 +219,6 @@ def sign_in():
     ):
         return email_verify_template
 
-    redirect_url = request.args.get("next")
-
-    if os.getenv("NOTIFY_E2E_TEST_EMAIL"):
-        return _handle_e2e_tests(redirect_url)
-
     if current_user and current_user.is_authenticated:
         if redirect_url and is_safe_redirect_url(redirect_url):
             return redirect(redirect_url)
@@ -173,10 +230,15 @@ def sign_in():
         current_app.config["DANGEROUS_SALT"],
     )
     url = os.getenv("LOGIN_DOT_GOV_INITIAL_SIGNIN_URL")
+
+    nonce = secrets.token_urlsafe()
+    session["nonce"] = nonce
+
     # handle unit tests
     if url is not None:
-        url = url.replace("NONCE", token)
+        url = url.replace("NONCE", nonce)
         url = url.replace("STATE", token)
+
     return render_template(
         "views/signin.html",
         again=bool(redirect_url),
@@ -185,5 +247,5 @@ def sign_in():
 
 
 @login_manager.unauthorized_handler
-def sign_in_again():
+def sign_in_again():  # pragma: no cover
     return redirect(url_for("main.sign_in", next=request.path))

app/main/views/sign_out.py

@@ -1,7 +1,7 @@
 import os
 
 import requests
-from flask import current_app, redirect, url_for
+from flask import current_app, redirect, session, url_for
 from flask_login import current_user
 
 from app.main import main
@@ -25,12 +25,16 @@ def _sign_out_at_login_dot_gov():
 
 @main.route("/sign-out", methods=(["GET", "POST"]))
 def sign_out():
-    # An AnonymousUser does not have an id
-    current_app.logger.info("HIT THE REGULAR SIGN OUT")
+
     if current_user.is_authenticated:
-        # TODO This doesn't work yet, due to problems above.
+        current_user.deactivate()
+        session.clear()
         current_user.sign_out()
+
+        session.permanent = False
+
         login_dot_gov_logout_url = os.getenv("LOGIN_DOT_GOV_LOGOUT_URL")
         if login_dot_gov_logout_url:
+            current_app.config["SESSION_PERMANENT"] = False
             return redirect(login_dot_gov_logout_url)
     return redirect(url_for("main.index"))

app/main/views/user_profile.py

@@ -29,6 +29,7 @@ from app.main.forms import (
     TwoFactorForm,
 )
 from app.models.user import User
+from app.utils import hilite
 from app.utils.user import user_is_gov_user, user_is_logged_in
 from notifications_utils.url_safe_token import check_token
 
@@ -189,32 +190,19 @@ def user_profile_mobile_number_delete():
 @main.route("/user-profile/mobile-number/authenticate", methods=["GET", "POST"])
 @user_is_logged_in
 def user_profile_mobile_number_authenticate():
-    # Validate password for form
-    def _check_password(pwd):
-        return user_api_client.verify_password(current_user.id, pwd)
-
-    form = ConfirmPasswordForm(_check_password)
 
     if NEW_MOBILE not in session:
         return redirect(url_for(".user_profile_mobile_number"))
 
-    if form.validate_on_submit():
-        session[NEW_MOBILE_PASSWORD_CONFIRMED] = True
-        current_user.send_verify_code(to=session[NEW_MOBILE])
-        create_mobile_number_change_event(
-            user_id=current_user.id,
-            updated_by_id=current_user.id,
-            original_mobile_number=current_user.mobile_number,
-            new_mobile_number=session[NEW_MOBILE],
-        )
-        return redirect(url_for(".user_profile_mobile_number_confirm"))
-
-    return render_template(
-        "views/user-profile/authenticate.html",
-        thing="mobile number",
-        form=form,
-        back_link=url_for(".user_profile_mobile_number_confirm"),
+    session[NEW_MOBILE_PASSWORD_CONFIRMED] = True
+    current_user.send_verify_code(to=session[NEW_MOBILE])
+    create_mobile_number_change_event(
+        user_id=current_user.id,
+        updated_by_id=current_user.id,
+        original_mobile_number=current_user.mobile_number,
+        new_mobile_number=session[NEW_MOBILE],
     )
+    return redirect(url_for(".user_profile_mobile_number_confirm"))
 
 
 @main.route("/user-profile/mobile-number/confirm", methods=["GET", "POST"])
@@ -288,3 +276,15 @@ def user_profile_disable_platform_admin_view():
     return render_template(
         "views/user-profile/disable-platform-admin-view.html", form=form
     )
+
+
+def set_timezone():
+    # Cookie is set in dashboard.html on page load
+    try:
+        timezone = request.cookies.get("timezone", "US/Eastern")
+        current_app.logger.debug(hilite(f"User's timezone is {timezone}"))
+        serialized_user = current_user.serialize()
+        if serialized_user["preferred_timezone"] is not timezone:
+            current_user.update(preferred_timezone=timezone)
+    except Exception:
+        current_app.logger.exception(hilite("Can't get timezone"))

app/main/views/verify.py

@@ -38,6 +38,7 @@ def verify_email(token):
             current_app.config["EMAIL_EXPIRY_SECONDS"],
         )
     except SignatureExpired:
+        current_app.logger.error("Email link expired #notify-admin-1505")
         flash(
             "The link in the email we sent you has expired. We've sent you a new one."
         )
@@ -50,6 +51,9 @@ def verify_email(token):
         abort(404)
 
     if user.is_active:
+        current_app.logger.error(
+            f"User is using an invite link but is already logged in {user.id} #notify-admin-1505"
+        )
         flash("That verification link has expired.")
         return redirect(url_for("main.sign_in"))
 
@@ -59,6 +63,7 @@ def verify_email(token):
 
     user.send_verify_code()
     session["user_details"] = {"email": user.email_address, "id": user.id}
+    current_app.logger.info(f"Email verified for user {user.id} #notify-admin-1505")
     return redirect(url_for("main.verify"))
 
 
@@ -78,6 +83,7 @@ def activate_user(user_id):
         return redirect(url_for("main.organization_dashboard", org_id=organization_id))
     else:
         activated_user = user.activate()
+        current_app.logger.info(f"Activated user {user.id} #notify-admin-1505")
         activated_user.login()
-
+        current_app.logger.info(f"Logged in user {user.id} #notify-admin-1505")
         return redirect(url_for("main.add_service", first="first"))

app/models/user.py

@@ -1,3 +1,4 @@
+import os
 from datetime import datetime
 
 from flask import abort, current_app, request, session
@@ -24,11 +25,15 @@ from app.utils.user_permissions import (
 
 
 def _get_service_id_from_view_args():
-    return str(request.view_args.get("service_id", "")) or None
+    if request and request.view_args:
+        return str(request.view_args.get("service_id", ""))
+    return None
 
 
 def _get_org_id_from_view_args():
-    return str(request.view_args.get("org_id", "")) or None
+    if request and request.view_args:
+        return str(request.view_args.get("org_id", ""))
+    return None
 
 
 class User(JSONModel, UserMixin):
@@ -54,6 +59,7 @@ class User(JSONModel, UserMixin):
         super().__init__(_dict)
         self.permissions = _dict.get("permissions", {})
         self._platform_admin = _dict["platform_admin"]
+        self.preferred_timezone = _dict.get("preferred_timezone", "America/New_York")
 
     @classmethod
     def from_id(cls, user_id):
@@ -147,6 +153,13 @@ class User(JSONModel, UserMixin):
         else:
             return self
 
+    def deactivate(self):
+        if self.is_active:
+            user_data = user_api_client.deactivate_user(self.id)
+            return self.__class__(user_data["data"])
+        else:
+            return self
+
     def login(self):
         login_user(self)
         session["user_id"] = self.id
@@ -188,7 +201,7 @@ class User(JSONModel, UserMixin):
     @property
     def is_gov_user(self):
         is_gov = is_gov_user(self.email_address)
-        current_app.logger.info(f"User {self.id} is_gov_user: {is_gov}")
+        # current_app.logger.info(f"User {self.id} is_gov_user: {is_gov}")
         return is_gov
 
     @property
@@ -197,9 +210,9 @@ class User(JSONModel, UserMixin):
 
     @property
     def platform_admin(self):
-        current_app.logger.warn(
-            f"Checking User {self.id} for platform admin: {self._platform_admin}"
-        )
+        # current_app.logger.warning(
+        #    f"Checking User {self.id} for platform admin: {self._platform_admin}"
+        # )
         return self._platform_admin and not session.get(
             "disable_platform_admin_view", False
         )
@@ -207,6 +220,14 @@ class User(JSONModel, UserMixin):
     def has_permissions(
         self, *permissions, restrict_admin_usage=False, allow_org_user=False
     ):
+        # TODO need this for load test, but breaks unit tests
+        if self.platform_admin and os.getenv("NOTIFY_ENVIRONMENT") in (
+            "development",
+            "staging",
+            "demo",
+        ):
+            return True
+
         unknown_permissions = set(permissions) - all_ui_permissions
         if unknown_permissions:
             raise TypeError(
@@ -220,25 +241,32 @@ class User(JSONModel, UserMixin):
         if not service_id and not org_id:
             # we shouldn't have any pages that require permissions, but don't specify a service or organization.
             # use @user_is_platform_admin for platform admin only pages
-            raise NotImplementedError
+            # raise NotImplementedError
+            # current_app.logger.warning(f"VIEW ARGS ARE {request.view_args}")
+            pass
 
-        log_msg = f"has_permissions user: {self.id} service: {service_id}"
         # platform admins should be able to do most things (except eg send messages, or create api keys)
         if self.platform_admin and not restrict_admin_usage:
-            current_app.logger.warn(f"{log_msg} true because user is platform_admin")
+            current_app.logger.debug(
+                "has_permissions is true because user is platform_admin"
+            )
             return True
 
         if org_id:
             value = self.belongs_to_organization(org_id)
-            current_app.logger.warn(f"{log_msg} org: {org_id} returning {value}")
+            current_app.logger.debug(
+                f"has_permissions returns org: {org_id} returning {value}"
+            )
             return value
 
         if not permissions and self.belongs_to_service(service_id):
-            current_app.logger.warn(f"{log_msg} True because belongs_to_service")
+            current_app.logger.debug("has_permissions True because belongs_to_service")
             return True
 
         if any(self.permissions_for_service(service_id) & set(permissions)):
-            current_app.logger.warn(f"{log_msg} permissions valid")
+            current_app.logger.debug(
+                "has_permissions returns True because permissions valid"
+            )
             return True
 
         from app.models.service import Service
@@ -246,7 +274,7 @@ class User(JSONModel, UserMixin):
         org_value = allow_org_user and self.belongs_to_organization(
             Service.from_id(service_id).organization_id
         )
-        current_app.logger.warn(f"{log_msg} returning {org_value}")
+        current_app.logger.debug(f"has_permissions returning {org_value}")
         return org_value
 
     def permissions_for_service(self, service_id):
@@ -254,7 +282,7 @@ class User(JSONModel, UserMixin):
 
     def has_permission_for_service(self, service_id, permission):
         has_permission = permission in self.permissions_for_service(service_id)
-        current_app.logger.warn(
+        current_app.logger.debug(
             f"has_permission_for_service user: {self.id} service: {service_id} "
             f"permission: {permission} retuning {has_permission}"
         )
@@ -535,17 +563,17 @@ class InvitedUser(JSONModel):
         return cls.by_id(invited_user_id) if invited_user_id else None
 
     def has_permissions(self, *permissions):
-        current_app.logger.warn(
-            f"Checking invited user {self.id} for permissions: {permissions}"
-        )
+        # current_app.logger.warning(
+        #    f"Checking invited user {self.id} for permissions: {permissions}"
+        # )
         if self.status == "cancelled":
             return False
         return set(self.permissions) > set(permissions)
 
     def has_permission_for_service(self, service_id, permission):
-        current_app.logger.warn(
-            f"Checking invited user {self.id} for permission: {permission} on service {service_id}"
-        )
+        # current_app.logger.warn(
+        #    f"Checking invited user {self.id} for permission: {permission} on service {service_id}"
+        # )
         if self.status == "cancelled":
             return False
         return self.service == service_id and permission in self.permissions

app/navigation.py

@@ -123,6 +123,7 @@ class HeaderNavigation(Navigation):
             "get_billing_report",
             "get_users_report",
             "get_daily_volumes",
+            "download_all_users",
             "get_daily_sms_provider_volumes",
             "get_volumes_by_service",
             "organizations",
@@ -153,6 +154,9 @@ class HeaderNavigation(Navigation):
 
 class MainNavigation(Navigation):
     mapping = {
+        "activity": {
+            "all_jobs_activity",
+        },
         "dashboard": {
             "conversation",
             "inbox",

app/notify_client/__init__.py

@@ -1,4 +1,6 @@
-from flask import abort, has_request_context, request
+import os
+
+from flask import abort, current_app, has_request_context, request
 from flask_login import current_user
 from notifications_python_client import __version__
 from notifications_python_client.base import BaseAPIClient
@@ -54,16 +56,47 @@ class NotifyAdminAPIClient(BaseAPIClient):
         ):
             abort(403)
 
+    def is_calling_signin_url(self, arg):
+        return arg.startswith("('/user")
+
+    def check_inactive_user(self, *args):
+        still_signing_in = False
+
+        # TODO clean up and add testing etc.
+        # We really should be checking for exact matches
+        # and we only want to check the first arg
+        for arg in args:
+            arg = str(arg)
+            if self.is_calling_signin_url(arg):
+                still_signing_in = True
+
+            # This seems to be a weird edge case that happens intermittently with invites
+            if str(arg) == "()":
+                still_signing_in = True
+        # TODO:  Update this once E2E tests are managed by a feature flag or some other main config option.
+        if os.getenv("NOTIFY_E2E_TEST_EMAIL"):
+            # allow end-to-end tests to skip check
+            pass
+        elif still_signing_in is True:
+            # we are not full signed in yet
+            pass
+        elif not current_user or not current_user.is_active:
+            current_app.logger.error(f"Unauthorized URL #notify-compliance-46 {args}")
+            abort(403)
+
     def post(self, *args, **kwargs):
         self.check_inactive_service()
+        self.check_inactive_user(args)
         return super().post(*args, **kwargs)
 
     def put(self, *args, **kwargs):
         self.check_inactive_service()
+        self.check_inactive_user()
         return super().put(*args, **kwargs)
 
     def delete(self, *args, **kwargs):
         self.check_inactive_service()
+        self.check_inactive_user()
         return super().delete(*args, **kwargs)
 
 

app/notify_client/job_api_client.py

@@ -27,9 +27,7 @@ class JobApiClient(NotifyAdminAPIClient):
 
     def get_job(self, service_id, job_id):
         params = {}
-        job = self.get(
-            url="/service/{}/job/{}".format(service_id, job_id), params=params
-        )
+        job = self.get(url=f"/service/{service_id}/job/{job_id}", params=params)
 
         return job
 
@@ -40,13 +38,14 @@ class JobApiClient(NotifyAdminAPIClient):
         if statuses is not None:
             params["statuses"] = ",".join(statuses)
 
-        return self.get(url="/service/{}/job".format(service_id), params=params)
+        job = self.get(url=f"/service/{service_id}/job", params=params)
+        return job
 
     def get_uploads(self, service_id, limit_days=None, page=1):
         params = {"page": page}
         if limit_days is not None:
             params["limit_days"] = limit_days
-        return self.get(url="/service/{}/upload".format(service_id), params=params)
+        return self.get(url=f"/service/{service_id}/upload", params=params)
 
     def has_sent_previously(
         self, service_id, template_id, template_version, original_file_name

app/notify_client/user_api_client.py

@@ -2,6 +2,7 @@ from flask import current_app
 from notifications_python_client.errors import HTTPError
 
 from app.notify_client import NotifyAdminAPIClient, cache
+from app.utils import hilite
 from app.utils.user_permissions import translate_permissions_from_ui_to_db
 
 ALLOWED_ATTRIBUTES = {
@@ -109,13 +110,14 @@ class UserApiClient(NotifyAdminAPIClient):
             raise
 
     def send_verify_code(self, user_id, code_type, to, next_string=None):
+
         data = {"to": to}
         if next_string:
             data["next"] = next_string
         if code_type == "email":
             data["email_auth_link_host"] = self.admin_url
         endpoint = "/user/{0}/{1}-code".format(user_id, code_type)
-        current_app.logger.warn(f"Sending verify_code {code_type} to {user_id}")
+        current_app.logger.warn(hilite(f"Sending verify_code {code_type} to {user_id}"))
         self.post(endpoint, data=data)
 
     def send_verify_email(self, user_id, to):
@@ -157,6 +159,10 @@ class UserApiClient(NotifyAdminAPIClient):
         endpoint = "/user"
         return self.get(endpoint)["data"]
 
+    def get_all_users_detailed(self):
+        endpoint = "/user/report-all-users"
+        return self.get(endpoint)["data"]
+
     @cache.delete("service-{service_id}")
     @cache.delete("service-{service_id}-template-folders")
     @cache.delete("user-{user_id}")
@@ -217,6 +223,10 @@ class UserApiClient(NotifyAdminAPIClient):
     def activate_user(self, user_id):
         return self.post("/user/{}/activate".format(user_id), data=None)
 
+    @cache.delete("user-{user_id}")
+    def deactivate_user(self, user_id):
+        return self.post("/user/{}/deactivate".format(user_id), data=None)
+
     def send_change_email_verification(self, user_id, new_email):
         endpoint = "/user/{}/change-email-verification".format(user_id)
         data = {"email": new_email}

app/s3_client/__init__.py

@@ -29,7 +29,10 @@ def get_s3_object(
         aws_secret_access_key=secret_key,
         region_name=region,
     )
-    s3 = session.resource("s3", config=AWS_CLIENT_CONFIG)
+    s3 = session.resource(
+        "s3",
+        config=AWS_CLIENT_CONFIG,
+    )
     obj = s3.Object(bucket_name, filename)
     # This 'proves' that use of moto in the relevant tests in test_send.py
     # mocks everything related to S3.  What you will see in the logs is:

app/s3_client/s3_csv_client.py

@@ -1,3 +1,4 @@
+import os
 import uuid
 
 from flask import current_app
@@ -10,13 +11,13 @@ from app.s3_client import (
 )
 from notifications_utils.s3 import s3upload as utils_s3upload
 
-FILE_LOCATION_STRUCTURE = "service-{}-notify/{}.csv"
+NEW_FILE_LOCATION_STRUCTURE = "{}-service-notify/{}.csv"
 
 
 def get_csv_location(service_id, upload_id):
     return (
         current_app.config["CSV_UPLOAD_BUCKET"]["bucket"],
-        FILE_LOCATION_STRUCTURE.format(service_id, upload_id),
+        NEW_FILE_LOCATION_STRUCTURE.format(service_id, upload_id),
         current_app.config["CSV_UPLOAD_BUCKET"]["access_key_id"],
         current_app.config["CSV_UPLOAD_BUCKET"]["secret_access_key"],
         current_app.config["CSV_UPLOAD_BUCKET"]["region"],
@@ -33,6 +34,14 @@ def s3upload(service_id, filedata):
     bucket_name, file_location, access_key, secret_key, region = get_csv_location(
         service_id, upload_id
     )
+    if bucket_name == "":
+        exp_bucket = current_app.config["CSV_UPLOAD_BUCKET"]["bucket"]
+        exp_region = current_app.config["CSV_UPLOAD_BUCKET"]["region"]
+        tier = os.getenv("NOTIFY_ENVIRONMENT")
+        raise Exception(
+            f"NO BUCKET NAME SHOULD BE: {exp_bucket} WITH REGION {exp_region} TIER {tier}"
+        )
+
     utils_s3upload(
         filedata=filedata["data"],
         region=region,

app/templates/base.html

@@ -10,7 +10,7 @@
         {% block per_page_title %}{% endblock %} – Notify.gov
       {% endblock %}
     </title>
-    {% include "new/components/head.html" %}
+    {% include "components/head.html" %}
   </head>
   <body class="usa-template__body {{ bodyClasses }}">
     <script nonce="{{ csp_nonce() }}">document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>
@@ -32,8 +32,8 @@
 
 
     {% block header %}
-      {% include 'new/components/usa_banner.html' %}
-      {% include 'new/components/header.html' %}
+      {% include 'components/usa_banner.html' %}
+      {% include 'components/header.html' %}
     {% endblock %}
 
     {% block main %}
@@ -47,7 +47,7 @@
       {% endblock %}
         {% block content %}
           {% block flash_messages %}
-            {% include 'new/components/flash_messages.html' %}
+            {% include 'components/flash_messages.html' %}
           {% endblock %}
           {% block maincolumn_content %}
               <div class="grid-row">
@@ -78,7 +78,7 @@
         {% set meta_suffix = "Built by the " + long_link + commit_hash %}
       {% endif %}
 
-      {% include "new/components/footer.html" %}
+      {% include "components/footer.html" %}
 
       {% if current_user.is_authenticated %}
         {% block sessionUserWarning %}

app/templates/components/components/back-link/template.njk

@@ -1,2 +1,4 @@
-<a href="{%- if params.href %}{{ params.href }}{% else %}#{% endif -%}" class="usa-link usa-back-link display-inline-flex margin-bottom-3 {%- if params.classes %} {{ params.classes }}{% endif -%}"
-  {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ (params.html | safe if params.html else (params.text if params.text else 'Back')) }}</a>
+<nav class="usa-breadcrumb" aria-label="Breadcrumb">
+  <a href="{{ params.href or '#' }}" class="usa-link usa-back-link display-inline-flex {{ params.classes or '' }}"
+  {%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}" {% endfor %}>{{ params.html | safe or params.text or 'Back' }}</a>
+</nav>

app/templates/components/components/footer/README.md

@@ -1,15 +0,0 @@
-# Footer
-
-## Installation
-
-See the [main README quick start guide](https://github.com/alphagov/govuk-frontend#quick-start) for how to install this component.
-
-## Guidance and Examples
-
-Find out when to use the footer component in your service in the [GOV.UK Design System](https://design-system.service.gov.uk/components/footer).
-
-## Component options
-
-Use options to customize the appearance, content and behavior of a component when using a macro, for example, changing the text.
-
-See [options table](https://design-system.service.gov.uk/components/footer/#options-example-default) for details.

app/templates/components/components/footer/macro-options.json

@@ -1,115 +0,0 @@
-[
-    {
-        "name": "meta",
-        "type": "object",
-        "required": false,
-        "description": "Object containing options for the meta navigation.",
-        "params": [
-            {
-                "name": "visuallyHiddenTitle",
-                "type": "string",
-                "description": "Title for a meta item section, which defaults to Support links"
-            },
-            {
-                "name": "html",
-                "type": "string",
-                "description": "HTML to add to the meta section of the footer, which will appear below any links specified using meta.items."
-            },
-            {
-                "name": "text",
-                "type": "string",
-                "description": "Text to add to the meta section of the footer, which will appear below any links specified using meta.items. If meta.html is specified, this option is ignored."
-            },
-            {
-                "name": "items",
-                "type": "array",
-                "required": false,
-                "description": "Array of items for use in the meta section of the footer.",
-                "params": [
-                    {
-                        "name": "text",
-                        "type": "string",
-                        "required": false,
-                        "description": "List item text in the meta section of the footer."
-                    },
-                    {
-                        "name": "href",
-                        "type": "string",
-                        "required": false,
-                        "description": "List item href attribute in the meta section of the footer."
-                    },
-                    {
-                        "name": "attributes",
-                        "type": "object",
-                        "required": false,
-                        "description": "HTML attributes (for example data attributes) to add to the anchor in the footer meta section."
-                    }
-                ]
-            }
-        ]
-    },
-    {
-        "name": "navigation",
-        "type": "array",
-        "required": false,
-        "description": "Array of items for use in the navigation section of the footer.",
-        "params": [
-            {
-                "name": "title",
-                "type": "string",
-                "required": false,
-                "description": "Title for a section"
-            },
-            {
-                "name": "columns",
-                "type": "integer",
-                "required": false,
-                "description": "Amount of columns to display items in navigation section of the footer."
-            },
-            {
-                "name": "items",
-                "type": "array",
-                "required": false,
-                "description": "Array of items to display in the list in navigation section of the footer.",
-                "params": [
-                    {
-                        "name": "text",
-                        "type": "string",
-                        "required": false,
-                        "description": "List item text in the navigation section of the footer."
-                    },
-                    {
-                        "name": "href",
-                        "type": "string",
-                        "required": false,
-                        "description": "List item href attribute in the navigation section of the footer. Both `text` and `href` attributes need to be present to create a link."
-                    },
-                    {
-                        "name": "attributes",
-                        "type": "object",
-                        "required": false,
-                        "description": "HTML attributes (for example data attributes) to add to the anchor in the footer navigation section."
-                    }
-                ]
-            }
-        ]
-    },
-    {
-        "name": "containerClasses",
-        "type": "string",
-        "required": false,
-        "description": "Classes that can be added to the inner container, useful if you want to make the footer full width."
-    },
-    {
-        "name": "classes",
-        "type": "string",
-        "required": false,
-        "description": "Classes to add to the footer component container."
-    },
-    {
-        "name": "attributes",
-        "type": "object",
-        "required": false,
-        "description": "HTML attributes (for example data attributes) to add to the footer component container."
-    }
-]

app/templates/components/components/footer/macro.njk

@@ -1,3 +0,0 @@
-{% macro usaFooter(params) %}
-  {%- include "./template.njk" -%}
-{% endmacro %}

app/templates/components/components/footer/template.njk

@@ -1,85 +0,0 @@
-<footer class="usa-footer usa-footer--big">
-  {# <div class="grid-container usa-footer__return-to-top">
-    <a href="#">Return to top</a>
-  </div> #}
-  <div class="usa-footer__primary-section">
-    <div class="grid-container">
-      <div class="padding-y-1">
-          {% if params.meta %}
-          <h2 class="usa-sr-only">{{ params.meta.visuallyHiddenTitle | default("Support links") }}</h2>
-          {% if params.meta.items %}
-            {% for item in params.meta.items %}
-              <a class="usa-footer__link" href="{{ item.href }}" {% for attribute, value in item.attributes %}
-                {{attribute}}="{{value}}" {% endfor %}>
-                {{ item.text }}
-              </a>
-            {% endfor %}
-          {% endif %}
-          {% if params.meta.text or params.meta.html %}
-          <div>
-            {{ params.meta.html | safe if params.meta.html else params.meta.text }}
-          </div>
-          {% endif %}
-          {% endif %}
-        </div>
-      </div>
-    </div>
-  </div>
-</footer>
-
-<div class="usa-identifier site-identifier">
-  <section class="usa-identifier__section usa-identifier__section--masthead" aria-label="Agency identifier,,,,,,">
-    <div class="usa-identifier__container">
-      <div class="usa-identifier__logos"><a href="javascript:void(0);" class="usa-identifier__logo">
-          <img class="usa-identifier__logo-img" src="{{ params.assetsPath | default('/static/images') }}/gsa-logo.svg"  alt="GSA Logo" role="img" width="48"
-            height="48">
-        </a></div>
-      <section class="usa-identifier__identity" aria-label="Agency description">
-        <p class="usa-identifier__identity-domain">beta.notify.gov</p>
-        <p class="usa-identifier__identity-disclaimer">An official website of the <a href="https://gsa.gov">General
-            Services Administration</a></p>
-      </section>
-    </div>
-  </section>
-  <nav class="usa-identifier__section usa-identifier__section--required-links" aria-label="Important links">
-    <div class="usa-identifier__container">
-      <ul class="usa-identifier__required-links-list">
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsa.gov/about-us" class="usa-identifier__required-link">About GSA</a>
-        </li>
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsa.gov/website-information/accessibility-aids"
-            class="usa-identifier__required-link">Accessibility support</a>
-        </li>
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsa.gov/reference/freedom-of-information-act-foia"
-            class="usa-identifier__required-link">FOIA requests</a>
-        </li>
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsa.gov/reference/civil-rights-programs/notification-and-federal-employee-antidiscrimination-and-retaliation-act-of-2002"
-            class="usa-identifier__required-link">No FEAR Act data</a>
-        </li>
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsaig.gov/" class="usa-identifier__required-link">Office of the Inspector General</a>
-        </li>
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsa.gov/reference/reports/budget-performance"
-            class="usa-identifier__required-link">Performance reports</a>
-        </li>
-        <li class="usa-identifier__required-links-item">
-          <a href="https://www.gsa.gov/website-information/website-policies"
-            class="usa-identifier__required-link">Privacy policy</a>
-        </li>
-      </ul>
-    </div>
-  </nav>
-  <section class="usa-identifier__section usa-identifier__section--usagov"
-    aria-label="Government information and services">
-    <div class="usa-identifier__container">
-      <div class="usa-identifier__usagov-description">
-        Looking for U.S. government information and services?
-      </div>
-      <a href="https://www.usa.gov/" class="usa-link">Visit USA.gov</a>
-    </div>
-  </section>
-</div>

app/templates/components/components/header/README.md

@@ -1,15 +0,0 @@
-# Header
-
-## Installation
-
-See the [main README quick start guide](https://github.com/alphagov/govuk-frontend#quick-start) for how to install this component.
-
-## Guidance and Examples
-
-Find out when to use the header component in your service in the [GOV.UK Design System](https://design-system.service.gov.uk/components/header).
-
-## Component options
-
-Use options to customize the appearance, content and behavior of a component when using a macro, for example, changing the text.
-
-See [options table](https://design-system.service.gov.uk/components/header/#options-example-default) for details.

app/templates/components/components/header/macro-options.json

@@ -1,88 +0,0 @@
-[
-    {
-        "name": "homepageUrl",
-        "type": "string",
-        "required": false,
-        "description": "The url of the homepage. Defaults to /"
-    },
-    {
-        "name": "assetsPath",
-        "type": "string",
-        "required": false,
-        "description": "The public path for the assets folder. If not provided it defaults to /assets/images"
-    },
-    {
-        "name": "productName",
-        "type": "string",
-        "required": false,
-        "description": "Header title that is placed next to GOV.UK. Used for product names (i.e. Pay, Verify)"
-    },
-    {
-        "name": "serviceName",
-        "type": "string",
-        "required": false,
-        "description": "Header title that is placed next to GOV.UK. Used for product names (i.e. Pay, Verify)"
-    },
-    {
-        "name": "serviceUrl",
-        "type": "string",
-        "required": false,
-        "description": "Url for the service name anchor."
-    },
-    {
-        "name": "navigation",
-        "type": "array",
-        "required": false,
-        "description": "An array of navigation item objects.",
-        "params": [
-            {
-                "name": "text",
-                "type": "string",
-                "required": false,
-                "description": "Text of the navigation item."
-            },
-            {
-                "name": "href",
-                "type": "string",
-                "required": false,
-                "description": "Url of the navigation item anchor. Both `href` and `text` attributes for navigation items need to be provided to create an item."
-            },
-            {
-                "name": "active",
-                "type": "boolean",
-                "required": false,
-                "description": "Flag to mark the navigation item as active or not."
-            },
-            {
-                "name": "attributes",
-                "type": "object",
-                "required": false,
-                "description": "HTML attributes (for example data attributes) to add to the navigation item anchor."
-            }
-        ]
-    },
-    {
-        "name": "navigationClasses",
-        "type": "string",
-        "required": false,
-        "description": "Classes for the navigation section of the header."
-    },
-    {
-        "name": "containerClasses",
-        "type": "string",
-        "required": false,
-        "description": "Classes for the container, useful if you want to make the header fixed width."
-    },
-    {
-        "name": "classes",
-        "type": "string",
-        "required": false,
-        "description": "Classes to add to the header container."
-    },
-    {
-        "name": "attributes",
-        "type": "object",
-        "required": false,
-        "description": "HTML attributes (for example data attributes) to add to the header container."
-    }
-]

app/templates/components/components/header/macro.njk

@@ -1,3 +0,0 @@
-{% macro usaHeader(params) %}
-  {%- include "./template.njk" -%}
-{% endmacro %}

app/templates/components/components/header/template.njk

@@ -1,105 +0,0 @@
-<!-- usa banner -->
-<section class="usa-banner site-banner" aria-label="Official website of the United States government,,,,,,">
-  <div class="usa-accordion">
-    <header class="usa-banner__header">
-      <div class="usa-banner__inner">
-        <div class="grid-col-auto">
-          <img aria-hidden="true" class="usa-banner__header-flag" src="/static/img/us_flag_small.png" alt="" />
-        </div>
-        <div class="grid-col-fill tablet:grid-col-auto" aria-hidden="true">
-          <p class="usa-banner__header-text">An official website of the United States government</p>
-          <p class="usa-banner__header-action">Here’s how you know</p>
-        </div>
-        <button type="button" class="usa-accordion__button usa-banner__button" aria-expanded="false" aria-controls="gov-banner">
-          <span class="usa-banner__button-text">Here’s how you know</span>
-        </button>
-      </div>
-    </header>
-    <div class="usa-banner__content usa-accordion__content" id="gov-banner" hidden="">
-      <div class="grid-row grid-gap-lg">
-        <div class="usa-banner__guidance tablet:grid-col-6">
-          <img class="usa-banner__icon usa-media-block__img" src="/static/img/icon-dot-gov.svg" role="img" alt="" aria-hidden="true">
-          <div class="usa-media-block__body">
-            <p>
-              <strong>Official websites use .gov</strong>
-              <br>
-              A <strong>.gov</strong> website belongs to an official government organization in the United States.
-            </p>
-          </div>
-        </div>
-        <div class="usa-banner__guidance tablet:grid-col-6">
-          <img class="usa-banner__icon usa-media-block__img" src="/static/img/icon-https.svg" role="img" alt="" aria-hidden="true">
-          <div class="usa-media-block__body">
-            <p>
-              <strong>Secure .gov websites use HTTPS</strong>
-              <br>
-              A <strong>lock</strong> ( <span class="icon-lock"><svg xmlns="http://www.w3.org/2000/svg" width="52" height="64" viewBox="0 0 52 64" class="usa-banner__lock-image" role="img" aria-labelledby="banner-lock-description" focusable="false"><title id="banner-lock-title">Lock</title><desc id="banner-lock-description">Locked padlock</desc><path fill="#000000" fill-rule="evenodd" d="M26 0c10.493 0 19 8.507 19 19v9h3a4 4 0 0 1 4 4v28a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4h3v-9C7 8.507 15.507 0 26 0zm0 8c-5.979 0-10.843 4.77-10.996 10.712L15 19v9h22v-9c0-6.075-4.925-11-11-11z"></path></svg></span> ) or <strong>https://</strong> means you’ve safely connected to the .gov website. Share sensitive information only on official, secure websites.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-<!-- usa header -->
-<header class="usa-header usa-header--extended">
-  <div class="usa-nav-container">
-    <div class="usa-navbar">
-      <div class="usa-logo display-flex flex-align-center flex-justify" id="-logo">
-        <div class="logo-img display-flex">
-          <a href="/">
-            <span class="usa-sr-only">Notify.gov logo</span>
-            <image src="{{ params.assetsPath | default('/static/images') }}/notify-logo.png" alt="Notify.gov logo" xlink:href=""
-              class="usa-flag-logo margin-right-1"></image>
-          </a>
-        </div>
-        {% if params.navigation %}
-          <button type="button" class="usa-menu-btn">Menu</button>
-        {% endif %}
-      </div>
-    </div>
-    <nav aria-label="Primary navigation" class="usa-nav">
-      <div class="usa-nav__inner">
-        <button type="button" class="usa-nav__close">
-          <img src="/static/images/usa-icons/close.svg" role="img" alt="Close" />
-        </button>
-        <ul class="usa-nav__primary usa-accordion margin-right-1">
-          {% for item in params.navigation %}
-            {% if item.href and item.text %}
-            <li class="usa-nav__primary-item{{ ' is-current' if item.active }}">
-              <a class="usa-nav__link {{ ' usa-current' if item.active }}" href="{{ item.href }}" {% for attribute, value in
-                item.attributes %} {{attribute}}="{{value}}" {% endfor %}>
-                <span>{{ item.text }}</span>
-              </a>
-            </li>
-            {% endif %}
-          {% endfor %}
-        </ul>
-        <div class="usa-nav__secondary margin-bottom-6">
-          <ul class="usa-nav__secondary-links">
-            {% for item in params.secondaryNavigation %}
-              {% if item.href and item.text %}
-                <li class="usa-nav__secondary-item{{ ' is-current' if item.active }}">
-                  <a class="usa-nav__link {{ ' usa-current' if item.active }}" href="{{ item.href }}" {% for attribute, value in
-                    item.attributes %} {{attribute}}="{{value}}" {% endfor %}>
-                    <span>{{ item.text }}</span>
-                  </a>
-                </li>
-            {% endif %}
-          {% endfor %}
-          </ul>
-          <!-- <section aria-label="Search component">
-            <form class="usa-search usa-search--small margin-bottom-2" role="search">
-              <label class="usa-sr-only" for="search-field">Search</label>
-              <input class="usa-input" id="search-field" type="search" name="search" />
-              <button class="usa-button" type="submit">
-                <img src="/static/images/usa-icons-bg/search--white.svg" class="usa-search__submit-icon" alt="Search" />
-              </button>
-            </form>
-          </section> -->
-        </div>
-      </div>
-    </nav>
-  </div>
-</header>

app/templates/components/components/skip-link/template.njk

@@ -1,7 +1,3 @@
 <a href="{{ params.href | default('#content') }}" class="usa-skipnav{%- if params.classes %} {{ params.classes }}{% endif -%}"{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
   {{- params.html | safe if params.html else params.text -}}
 </a>
-
-<a class="usa-skipnav " href="#main-content">
-  Skip to main content
-</a>

app/templates/components/footer.html

@@ -58,6 +58,20 @@
         </ul>
       </div>
     </nav>
+    <section class="usa-identifier__section usa-identifier__section--usagov"
+      aria-label="Github Repos">
+      <div class="usa-identifier__container">
+        <div class="usa-identifier__required-links-item">
+          Find us on Github:
+        </div>
+        <ul>
+          <li><a href="https://github.com/gsa/notifications-admin" class="usa-identifier__required-link">Notify.gov Admin repo</a></li>
+        <li><a href="https://github.com/gsa/notifications-api" class="usa-identifier__required-link">Notify.gov API repo</a></li>
+      </ul>
+
+      </div>
+    </section>
+
     <section class="usa-identifier__section usa-identifier__section--usagov"
       aria-label="Government information and services">
       <div class="usa-identifier__container">

app/templates/components/head.html

@@ -11,17 +11,16 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
 
-    <link rel="shortcut icon" href="{{ assetPath | default('/assets') }}/images/favicon.ico" />
-    <link rel="icon" type="image/png" sizes="32x32" href="{{ assetPath | default('/assets') }}/images/favicon-32x32.png" />
-    <link rel="icon" type="image/png" sizes="16x16" href="{{ assetPath | default('/assets') }}/images/favicon-16x16.png" />
-    <link rel="mask-icon" href="{{ assetPath | default('/assets') }}/images/safari-pinned-tab.svg" color="#5bbad5">
-    <link rel="apple-touch-icon" sizes="180x180" href="{{ assetPath | default('/assets') }}/images/apple-touch-icon.png">
-    <link rel="manifest" href="/site.webmanifest">
+    <link rel="shortcut icon" href="{{ assetPath | default('/static') }}/images/favicon.ico" />
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ assetPath | default('/static') }}/images/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ assetPath | default('/static') }}/images/favicon-16x16.png" />
+    <link rel="mask-icon" href="{{ assetPath | default('/static') }}/images/safari-pinned-tab.svg" color="#5bbad5">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ assetPath | default('/static') }}/images/apple-touch-icon.png">
+    <link rel="manifest" href="{{ asset_url('images/site.webmanifest') }}">
     <meta name="msapplication-TileColor" content="#da532c">
-    <link href="{{ assetPath | default('/assets') }}/images/notify-dark-favicon.png" rel="icon" media="(prefers-color-scheme: dark)">
+    <link href="{{ assetPath | default('/static') }}/images/notify-dark-favicon.png" rel="icon" media="(prefers-color-scheme: dark)">
     <meta name="theme-color" content="#ffffff">
 
-
     <link rel="stylesheet" media="screen" href="{{ asset_url('css/styles.css') }}" />
     {% block extra_stylesheets %}{% endblock %}
 
@@ -31,7 +30,7 @@
     <meta property="og:image" content="/static/images/notify-og-image.png">
     {# google #}
     <script type="text/javascript" src="{{ asset_url('js/gtm_head.js') }}"></script>
-    <meta name="google-site-verification" content="niWnSqImOWz6mVQTYqNb5tFK8HaKSB4b3ED4Z9gtUQ0" />
+    <meta name="google-site-verification" content="niWnSqImOWz6mVQTYqNb5tFK8HaKSB4b3ED4Z9gtUQ0" /> {# pragma: allowlist secret #}
     {% if g.hide_from_search_engines %}
     <meta name="robots" content="noindex" />
     {% endif %}

app/templates/components/header.html

@@ -1,4 +1,3 @@
-{# setting navigation and secondarynavigation #}
 {% if current_user.is_authenticated %}
   {% set navigation = [
     {"href": url_for("main.show_accounts_or_dashboard"), "text": "Current service", "active": header_navigation.is_selected('accounts-or-dashboard')},
@@ -14,16 +13,22 @@
   {% endif %}
 
   {% if current_service %}
-    {% set secondaryNavigation = [
-        {"href": url_for('main.service_settings', service_id=current_service.id), "text": "Settings", "active": secondary_navigation.is_selected('settings')},
+    {% if current_user.has_permissions('manage_service') %}
+      {% set secondaryNavigation = [
+          {"href": url_for('main.service_settings', service_id=current_service.id), "text": "Settings", "active": secondary_navigation.is_selected('settings')},
+          {"href": url_for('main.sign_out'), "text": "Sign out"}
+      ] %}
+    {% else %}
+      {% set secondaryNavigation = [
         {"href": url_for('main.sign_out'), "text": "Sign out"}
-    ] %}
+      ] %}
+
+    {% endif %}
   {% else %}
     {% set secondaryNavigation = [{"href": url_for('main.sign_out'), "text": "Sign out"}] %}
   {% endif %}
 {% endif %}
 
-{# usa header #}
 <header class="usa-header usa-header--extended">
   <div class="usa-nav-container">
     <div class="usa-navbar">
@@ -31,7 +36,7 @@
         <div class="logo-img display-flex">
           <a href="/">
             <span class="usa-sr-only">Notify.gov logo</span>
-            <img src="{{ (asset_path | default('/static')) + 'images/notify-logo.png' }}" alt="Notify.gov logo" class="usa-flag-logo margin-right-1">
+            <img src="{{ (asset_path | default('/static')) + 'images/notify-logo.svg' }}" alt="Notify.gov logo" class="usa-flag-logo margin-right-1">
 
           </a>
         </div>
@@ -43,7 +48,7 @@
     <nav aria-label="Primary navigation" class="usa-nav">
       <div class="usa-nav__inner">
         <button type="button" class="usa-nav__close">
-          <img src="/static/images/usa-icons/close.svg" role="img" alt="Close" />
+          <img src="{{ asset_url('img/usa-icons/close.svg') }}" role="img" alt="Close" />
         </button>
         <ul class="usa-nav__primary usa-accordion margin-right-1">
           {% for item in navigation %}

app/templates/components/main_nav.html

@@ -1,26 +1,18 @@
 {% if help %}
   {% include 'partials/tour.html' %}
 {% else %}
-<nav class="nav margin-bottom-4">
+<nav id="nav-main-nav" aria-label="Main navigation" class="nav margin-bottom-4">
   <a class="usa-button margin-top-1 margin-bottom-5 width-full"
     href="{{ url_for('.choose_template', service_id=current_service.id) }}">Send messages</a>
   <ul class="usa-sidenav">
   {% if current_user.has_permissions() %}
     {% if current_user.has_permissions('view_activity') %}
       <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('dashboard') }}" href="{{ url_for('.service_dashboard', service_id=current_service.id) }}">Dashboard</a></li>
+      <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('activity') }}" href="{{ url_for('.all_jobs_activity', service_id=current_service.id) }}">Activity</a></li>
     {% endif %}
     {% if not current_user.has_permissions('view_activity') %}
       <li class="usa-sidenav__item"><a class="{{ casework_navigation.is_selected('sent-messages') }}" href="{{ url_for('.view_notifications', service_id=current_service.id, status='sending,delivered,failed') }}">Sent messages</a></li>
     {% endif %}
-    {% if current_user.has_permissions('manage_service', allow_org_user=True) %}
-      {# <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('usage') }}" href="{{ url_for('.usage', service_id=current_service.id) }}">Usage</a></li> #}
-    {% endif %}
-    <!-- {% if current_user.has_permissions('manage_api_keys', 'manage_service') %}
-      <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('settings') }}" href="{{ url_for('.service_settings', service_id=current_service.id) }}">Settings</a></li>
-    {% endif %} -->
-    {% if current_user.has_permissions('manage_api_keys') %}
-      <!-- <li><a class="usa-link{{ main_navigation.is_selected('api-integration') }}" href="{{ url_for('.api_integration', service_id=current_service.id) }}">API integration</a></li> -->
-    {% endif %}
   {% elif current_user.has_permissions(allow_org_user=True) %}
     <li class="usa-sidenav__item"><a class="usa-link{{ main_navigation.is_selected('usage') }}" href="{{ url_for('.usage', service_id=current_service.id) }}">Usage</a></li>
     <li class="usa-sidenav__item"><a class="usa-link{{ main_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_users', service_id=current_service.id) }}">Team members</a></li>

app/templates/components/org_nav.html

@@ -1,4 +1,4 @@
-<nav class="nav margin-bottom-4">
+<nav id="nav-org-nav" aria-label="Organization navigation" class="nav margin-bottom-4">
   <ul class="usa-sidenav">
     <li class="usa-sidenav__item"><a class="usa-link{{ org_navigation.is_selected('dashboard') }}" href="{{ url_for('.organization_dashboard', org_id=current_org.id) }}">Usage</a></li>
     <li class="usa-sidenav__item"><a class="usa-link{{ org_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_org_users', org_id=current_org.id) }}">Team members</a></li>

app/templates/components/service_nav.html

@@ -1,3 +1,4 @@
+<nav id="nav-service-nav" aria-label="Service navigation">
 <div class="navigation-service margin-top-5 display-flex flex-align-end flex-justify border-bottom padding-bottom-1">
   {% if current_service.organization_id %}
     {% if current_user.platform_admin or
@@ -13,3 +14,4 @@
   </div>
   <a href="{{ url_for('main.choose_account') }}" class="usa-link">Switch service</a>
 </div>
+</nav>

app/templates/components/table.html

@@ -6,7 +6,7 @@
     <thead class="table-field-headings{% if field_headings_visible %}-visible{% endif %}">
       <tr>
         {% for field_heading in field_headings %}
-          <th scope="col" class="table-field-heading{% if loop.first %}-first{% endif %}" width="{% if equal_length %}{{ (100 / field_headings|length)|int }}%{% endif %}">
+          <th class="table-field-heading{% if loop.first %}-first{% endif %}" width="{% if equal_length %}{{ (100 / field_headings|length)|int }}%{% endif %}">
             {% if field_headings_visible %}
               {{ field_heading }}
             {% else %}
@@ -79,9 +79,9 @@
 {%- endmacro %}
 
 {% macro row_heading() -%}
-  <th class="table-field">
+  <td>
     {{ caller() }}
-  </th>
+  </td>
 {%- endmacro %}
 
 {% macro index_field(text=None, rowspan=None) -%}

app/templates/components/usa_banner.html

@@ -1,5 +1,3 @@
-
-{# usa banner #}
 <section class="usa-banner site-banner" aria-label="Official website of the United States government,,,,,,">
   <div class="usa-accordion">
     <header class="usa-banner__header">

app/templates/old/admin_template.html

@@ -1,302 +0,0 @@
-{% extends "main_template.html" %}
-{% from "components/banner.html" import banner %}
-
-{% block headIcons %}
-  <link rel="shortcut icon" sizes="16x16 32x32 48x48" href="{{ asset_url('images/favicon.ico') }}" type="image/x-icon" />
-  <link rel="mask-icon" href="{{ asset_url('images/usa-mask-icon.svg') }}" color="{{ themeColor | default('#F0F0F0') }}">
-  <link rel="apple-touch-icon" sizes="180x180" href="{{ asset_url('images/apple-touch-icon.png') }}">
-  <link rel="apple-touch-icon" href="{{ asset_url('images/apple-touch-icon.png') }}">
-{% endblock %}
-
-{% block head %}
-  <link rel="stylesheet" media="screen" href="{{ asset_url('css/styles.css') }}" />
-  {% block extra_stylesheets %}
-  {% endblock %}
-  {% if g.hide_from_search_engines %}
-    <meta name="robots" content="noindex" />
-  {% endif %}
-  <meta name="google-site-verification" content="niWnSqImOWz6mVQTYqNb5tFK8HaKSB4b3ED4Z9gtUQ0" />
-  {% block meta_format_detection %}
-    <meta name="format-detection" content="telephone=no">
-  {% endblock %}
-  {% block meta %}
-    <meta property="og:site_name" content="Notify.gov">
-    <meta property="og:image" content="{{ asset_url('images/notify-og-image.png') }}">
-  {% endblock %}
-  <script type="text/javascript" src="{{ asset_url('js/gtm_head.js') }}"></script>
-{% endblock %}
-
-{% block pageTitle %}
-   {% block per_page_title %}{% endblock %} – Notify.gov
-{% endblock %}
-
-{% block bodyStart %}
-  {% block extra_javascripts_before_body %}
-  <!-- Google Tag Manager (noscript) -->
-  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WX5NGWF"
-  height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
-  <!-- End Google Tag Manager (noscript) -->
-  {% endblock %}
-{% endblock %}
-
-{% block header %}
-  {% if current_user.is_authenticated %}
-    {% if current_user.platform_admin %}
-      {% set navigation = [
-        {
-          "href": url_for("main.show_accounts_or_dashboard"),
-          "text": "Current service",
-          "active": header_navigation.is_selected('accounts-or-dashboard')
-        },
-        {
-          "href": url_for('main.get_started'),
-          "text": "Using Notify",
-          "active": header_navigation.is_selected('using_notify')
-        },
-        {
-          "href": url_for('main.features'),
-          "text": "Features",
-          "active": header_navigation.is_selected('features')
-        },
-        {
-          "href": url_for('main.platform_admin_splash_page'),
-          "text": "Platform admin",
-          "active": header_navigation.is_selected('platform-admin')
-        },
-        {
-          "href": url_for('main.support'),
-          "text": "Contact us",
-          "active": header_navigation.is_selected('support')
-        }
-      ] %}
-      {% if current_service %}
-        {% set secondaryNavigation = [
-          {
-            "href": url_for('main.service_settings', service_id=current_service.id),
-            "text": "Settings",
-            "active": secondary_navigation.is_selected('settings')
-          },
-          {
-            "href": url_for('main.sign_out'),
-            "text": "Sign out"
-          }
-      ] %}
-      {% else %}
-        {% set secondaryNavigation = [
-          {
-            "href": url_for('main.sign_out'),
-            "text": "Sign out"
-          }
-        ] %}
-      {% endif %}
-    {% else %}
-      {% set navigation = [
-        {
-          "href": url_for("main.show_accounts_or_dashboard"),
-          "text": "Current service",
-          "active": header_navigation.is_selected('accounts-or-dashboard')
-        },
-        {
-          "href": url_for('main.get_started'),
-          "text": "Using Notify",
-          "active": header_navigation.is_selected('using_notify')
-        },
-        {
-          "href": url_for('main.features'),
-          "text": "Features",
-          "active": header_navigation.is_selected('features')
-        },
-        {
-          "href": url_for('main.support'),
-          "text": "Contact us",
-          "active": header_navigation.is_selected('support')
-        },
-        {
-          "href": url_for('main.user_profile'),
-          "text": "User profile",
-          "active": header_navigation.is_selected('user-profile')
-        }
-      ] %}
-      {% if current_service %}
-        {% set secondaryNavigation = [
-          {
-            "href": url_for('main.service_settings', service_id=current_service.id),
-            "text": "Settings",
-            "active": secondary_navigation.is_selected('settings')
-          },
-          {
-            "href": url_for('main.sign_out'),
-            "text": "Sign out"
-          }
-        ] %}
-        {% else %}
-          {% set secondaryNavigation = [
-            {
-            "href": url_for('main.sign_out'),
-            "text": "Sign out"
-            }
-          ] %}
-        {% endif %}
-      {% endif %}
-  {% else %}
-  <!-- Add navigation back after pilot -->
-    {# {% set navigation = [
-      {
-        "href": url_for('main.get_started'),
-        "text": "Using Notify",
-        "active": header_navigation.is_selected('using_notify')
-      },
-      {
-        "href": url_for('main.features'),
-        "text": "Features",
-        "active": header_navigation.is_selected('features')
-      },
-      {
-        "href": url_for('main.support'),
-        "text": "Contact us",
-        "active": header_navigation.is_selected('support')
-      },
-      {
-        "href": url_for('main.sign_in'),
-        "text": "Sign in",
-        "active": header_navigation.is_selected('sign-in')
-      }
-    ] %} #}
-  {% endif %}
-
-  {{ usaHeader({
-    "homepageUrl": url_for('main.show_accounts_or_dashboard'),
-    "productName": "Notify",
-    "navigation": navigation,
-    "navigationClasses": "govuk-header__navigation--end",
-    "secondaryNavigation": secondaryNavigation,
-    "assetsPath": asset_path + "images"
-  }) }}
-{% endblock %}
-
-{% block footer %}
-  <!-- lines 179 - 251 can all be deleted and replaced with {% include "new/components/footer.html" %} -->
-  {% if current_service and current_service.research_mode %}
-    {% set meta_suffix = 'Built by the <a href="https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services/tts-solutions" class="usa-link">Technology Transformation Services</a><span id="research-mode" class="research-mode">research mode</span>' %}
-  {% else %}
-    {% set commit_hash = ", Latest version: " + config['COMMIT_HASH'] %}
-    {% set long_link = '<a href="https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services/tts-solutions" class="usa-link">Technology Transformation Services</a>' %}
-    {% set meta_suffix = "Built by the " + long_link + commit_hash %}
-  {% endif %}
-
-  {{ usaFooter({
-    "classes": "js-footer",
-    "navigation": [
-      {
-        "title": "About Notify",
-        "columns": 1,
-        "items": [
-          {
-            "href": url_for("main.features"),
-            "text": "Features"
-          },
-          {
-            "href": url_for("main.roadmap"),
-            "text": "Roadmap"
-          },
-          {
-            "href": url_for("main.security"),
-            "text": "Security"
-          },
-        ]
-      },
-      {
-        "title": "Using Notify",
-        "columns": 1,
-        "items": [
-          {
-            "href": url_for("main.get_started"),
-            "text": "Get started"
-          },
-          {
-            "href": url_for("main.pricing"),
-            "text": "Pricing"
-          },
-          {
-            "href": url_for("main.trial_mode_new"),
-            "text": "Trial mode"
-          },
-          {
-            "href": url_for("main.message_status"),
-            "text": "Delivery status"
-          },
-          {
-            "href": url_for("main.guidance_index"),
-            "text": "Guidance"
-          },
-          {
-            "href": url_for("main.documentation"),
-            "text": "API documentation"
-          }
-        ]
-      },
-      {
-        "title": "Support",
-        "columns": 1,
-        "items": [
-          {
-            "href": url_for('main.support'),
-            "text": "Contact us"
-          }
-        ]
-      },
-    ],
-    "meta": {
-      "items": meta_items,
-      "html": meta_suffix
-    }
-  }) }}
-  {% if current_user.is_authenticated %}
-    {% block sessionUserWarning %}
-    <dialog class="usa-modal" id="sessionTimer" aria-labelledby="sessionTimerHeading" aria-describedby="timerWarning">
-      <div class="usa-modal__content">
-        <div class="usa-modal__main">
-          <h2 class="usa-modal__heading" id="sessionTimerHeading">
-            Your session will end soon.
-            <span class="usa-sr-only">Please choose to extend your session or sign out. Your session will expire in 5 minutes or less.</span>
-          </h2>
-          <div class="usa-prose">
-            <p>You have been inactive for too long.
-              Your session will expire in <span id="timeLeft" role="timer"></span>.
-            </p>
-          </div>
-          <div class="usa-modal__footer">
-            <ul class="usa-button-group">
-              <li class="usa-button-group__item">
-                <button type="button" class="usa-button" id="extendSessionTimer" data-close-modal>
-                  Extend Session
-                </button>
-              </li>
-              <li class="usa-button-group__item">
-                <button type="button" class="usa-button usa-button--unstyled padding-105 text-center" id="logOutTimer"
-                  data-close-modal>
-                  Sign out
-                </button>
-              </li>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </dialog>
-    {% endblock %}
-  {% endif %}
-
-{% endblock %}
-
-
-{% block bodyEnd %}
-  {% block extra_javascripts %}
-
-  {% endblock %}
-  <!--[if gt IE 8]><!-->
-  <script type="text/javascript" src="{{ asset_url('javascripts/all.js') }}"></script>
-  <script type="text/javascript" src="{{ asset_url('js/uswds.min.js') }}"></script>
-
-  <!--<![endif]-->
-
-{% endblock %}

app/templates/old/content_template.html

@@ -1,28 +0,0 @@
-{% extends "base.html" %}
-{% from "components/sub-navigation.html" import sub_navigation %}
-{% from "components/page-header.html" import page_header %}
-
-{% block per_page_title %}
-  {{ content_page_title }}
-{% endblock %}
-
-{% block maincolumn_content %}
-
-  <div class="grid-row">
-
-    {% if navigation_links %}
-      <div class="tablet:grid-col-2 margin-bottom-4">
-        {{ sub_navigation(navigation_links) }}
-      </div>
-      <div class="tablet:grid-col-10 tablet:padding-left-4 usa-prose site-prose">
-    {% else %}
-      <div class="tablet:grid-col-10">
-    {% endif %}
-
-    {% block content_column_content %}
-    {% endblock %}
-
-    </div>
-  </div>
-
-{% endblock %}

app/templates/old/main_nav.html

@@ -1,32 +0,0 @@
-{# This template is an old version #}
-{% if help %}
-  {% include 'partials/tour.html' %}
-{% else %}
-<nav class="nav margin-bottom-4">
-  <a class="usa-button margin-top-1 margin-bottom-5 width-full"
-    href="{{ url_for('.choose_template', service_id=current_service.id) }}">Send messages</a>
-  <ul class="usa-sidenav">
-  {% if current_user.has_permissions() %}
-    {% if current_user.has_permissions('view_activity') %}
-      <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('dashboard') }}" href="{{ url_for('.service_dashboard', service_id=current_service.id) }}">Dashboard</a></li>
-    {% endif %}
-      {# <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('templates') }}" href="{{ url_for('.choose_template', service_id=current_service.id) }}">Send messages</a></li> #}
-    {% if not current_user.has_permissions('view_activity') %}
-      <li class="usa-sidenav__item"><a class="{{ casework_navigation.is_selected('sent-messages') }}" href="{{ url_for('.view_notifications', service_id=current_service.id, status='sending,delivered,failed') }}">Sent messages</a></li>
-    {% endif %}
-    {% if current_user.has_permissions('manage_service', allow_org_user=True) %}
-      {# <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('usage') }}" href="{{ url_for('.usage', service_id=current_service.id) }}">Usage</a></li> #}
-    {% endif %}
-    <!-- {% if current_user.has_permissions('manage_api_keys', 'manage_service') %}
-      <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('settings') }}" href="{{ url_for('.service_settings', service_id=current_service.id) }}">Settings</a></li>
-    {% endif %} -->
-    {% if current_user.has_permissions('manage_api_keys') %}
-      <!-- <li><a class="usa-link{{ main_navigation.is_selected('api-integration') }}" href="{{ url_for('.api_integration', service_id=current_service.id) }}">API integration</a></li> -->
-    {% endif %}
-  {% elif current_user.has_permissions(allow_org_user=True) %}
-    <li class="usa-sidenav__item"><a class="usa-link{{ main_navigation.is_selected('usage') }}" href="{{ url_for('.usage', service_id=current_service.id) }}">Usage</a></li>
-    <li class="usa-sidenav__item"><a class="usa-link{{ main_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_users', service_id=current_service.id) }}">Team members</a></li>
-  {% endif %}
-  </ul>
-</nav>
-{% endif %}

app/templates/old/main_template.html

@@ -1,70 +0,0 @@
-{% from "./components/components/skip-link/macro.njk" import usaSkipLink -%}
-{% from "./components/components/header/macro.njk" import usaHeader -%}
-{% from "./components/components/footer/macro.njk" import usaFooter -%}
-{# specify absolute url for the static assets folder e.g. http://wwww.domain.com/assets #}
-{%- set assetUrl = assetUrl | default(assetPath) -%}
-<!DOCTYPE html>
-<html lang="{{ htmlLang | default('en') }}" class="{{ htmlClasses }}">
-  <head>
-    <meta charset="utf-8" />
-    <title>{% block pageTitle %}Notify.gov{% endblock %}</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
-    <meta name="theme-color" media="(prefers-color-scheme: light)" content="f0f0f0" />
-    <meta name="theme-color" media="(prefers-color-scheme: dark)" content="1b1b1b" />
-    {% if config['NR_MONITOR_ON'] %}
-      {% include "partials/newrelic.html" -%}
-    {% endif %}
-
-    {# Ensure that older IE versions always render with the correct rendering engine #}
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-
-    {% block headIcons %}
-      <link rel="shortcut icon" href="{{ assetPath | default('/assets') }}/images/favicon.ico" />
-      <link rel="icon" type="image/png" sizes="32x32"href="{{ assetPath | default('/assets') }}/images/favicon-32x32.png"/>
-      <link rel="icon" type="image/png" sizes="16x16" href="{{ assetPath | default('/assets') }}/images/favicon-16x16.png" />
-      <link rel="mask-icon" href="{{ assetPath | default('/assets') }}/images/safari-pinned-tab.svg" color="#5bbad5">
-      <link rel="apple-touch-icon" sizes="180x180" href="{{ assetPath | default('/assets') }}/images/apple-touch-icon.png">
-      <link rel="manifest" href="/site.webmanifest">
-      <meta name="msapplication-TileColor" content="#da532c">
-      <link href="{{ assetPath | default('/assets') }}/images/notify-dark-favicon.png" rel="icon" media="(prefers-color-scheme: dark)">
-      <meta name="theme-color" content="#ffffff">
-    {% endblock %}
-
-    {% block head %}{% endblock %}
-    {# The default og:image is added below head so that scrapers see any custom metatags first, and this is just a fallback #}
-    {% block meta %}
-      <meta property="og:site_name" content="Notify.gov">
-      <meta property="og:image" content="{{ asset_url('images/notify-og-image.png') }}">
-    {% endblock %}
-  </head>
-  <body class="usa-template__body {{ bodyClasses }}">
-    <script nonce="{{ csp_nonce() }}">document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>
-    {% block bodyStart %}{% endblock %}
-
-    {% block skipLink %}
-      {{ usaSkipLink({
-        "href": '#main-content',
-        "text": 'Skip to main content'
-      }) }}
-    {% endblock %}
-
-    {% block header %}
-      {{ usaHeader({}) }}
-    {% endblock %}
-
-    {% block main %}
-      <div class="grid-container">
-        {% block beforeContent %}{% endblock %}
-        <main class="{{ mainClasses }}" id="main-content" role="main">
-          {% block content %}{% endblock %}
-        </main>
-      </div>
-    {% endblock %}
-
-    {% block footer %}
-      {{ usaFooter({}) }}
-    {% endblock %}
-
-    {% block bodyEnd %}{% endblock %}
-  </body>
-</html>

app/templates/old/org_nav.html

@@ -1,12 +0,0 @@
-{# This template is an old version #}
-<nav class="navigation">
-  <ul>
-    <li><a class="usa-link{{ org_navigation.is_selected('dashboard') }}" href="{{ url_for('.organization_dashboard', org_id=current_org.id) }}">Usage</a></li>
-    <li><a class="usa-link{{ org_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_org_users', org_id=current_org.id) }}">Team members</a></li>
-    {% if current_user.platform_admin %}
-    <li><a class="usa-link{{ org_navigation.is_selected('settings') }}" href="{{ url_for('.organization_settings', org_id=current_org.id) }}">Settings</a></li>
-    <li><a class="usa-link{{ org_navigation.is_selected('trial-services') }}" href="{{ url_for('.organization_trial_mode_services', org_id=current_org.id) }}">Trial mode services</a></li>
-    <li><a class="usa-link{{ org_navigation.is_selected('billing') }}" href="{{ url_for('.organization_billing', org_id=current_org.id) }}">Billing</a></li>
-    {% endif %}
-  </ul>
-</nav>

app/templates/old/org_template.html

@@ -1,35 +0,0 @@
-{% extends "base.html" %}
-
-{% block per_page_title %}
-  {% block org_page_title %}{% endblock %} – {{ current_org.name }}
-{% endblock %}
-
-{% block main %}
-  <div class="grid-container">
-    <div class="navigation-service usa-breadcrumb">
-      {% if current_user.platform_admin %}
-        <a href="{{ url_for('.organizations') }}" class="usa-link navigation-organization-link">Organizations</a>
-      {% endif %}
-      <div class="navigation-service">
-        {{ current_org.name }}
-      </div>
-      <a href="{{ url_for('main.choose_account') }}" class="usa-link navigation-service">Switch service</a>
-    </div>
-    <div class="grid-row">
-      <div class="grid-col-3">
-        {% include "org_nav.html" %}
-      </div>
-      <div class="grid-col-9">
-        {% block beforeContent %}
-          {% block backLink %}{% endblock %}
-        {% endblock %}
-        <main class="main" id="main-content" role="main" >
-          {% block content %}
-            {% include 'flash_messages.html' %}
-            {% block maincolumn_content %}{% endblock %}
-          {% endblock %}
-        </main>
-      </div>
-    </div>
-  </div>
-{% endblock %}

app/templates/old/service_navigation.html

@@ -1,20 +0,0 @@
-{# This template is an old version #}
-{% macro navigation_service_name(service) %}
-  <div class="font-body-2xl text-bold">
-    {{ service.name }}
-    {% if not service.active %}
-      <span class="navigation-service-name navigation-service-type--suspended">Suspended</span>
-    {% endif %}
-  </div>
-{% endmacro %}
-
-<div class="navigation-service margin-top-5 display-flex flex-align-end flex-justify border-bottom padding-bottom-1">
-  {% if current_service.organization_id %}
-    {% if current_user.platform_admin or
-      (current_user.belongs_to_organization(current_service.organization_id) and current_service.live) %}
-      <a href="{{ url_for('.organization_dashboard', org_id=current_service.organization_id) }}" class="usa-link navigation-organization-link">{{ current_service.organization_name }}</a>
-    {% endif %}
-  {% endif %}
-  {{ navigation_service_name(current_service) }}
-  <a href="{{ url_for('main.choose_account') }}" class="usa-link">Switch service</a>
-</div>

app/templates/old/settings_nav.html

@@ -1,17 +0,0 @@
-{# This template is an old version #}
-{% if help %}
-{% include 'partials/tour.html' %}
-{% else %}
-<nav class="nav">
-  <ul class="usa-sidenav">
-    {# {% if current_user.has_permissions() %} #}
-    <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('settings') }}"
-      href="{{ url_for('main.service_settings', service_id=current_service.id) }}">General</a></li>
-    <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('user-profile') }}"
-      href="{{ url_for('main.user_profile', service_id=current_service.id) }}">User profile</a></li>
-    <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('team-members') }}"
-        href="{{ url_for('main.manage_users', service_id=current_service.id) }}">Team members</a></li>
-    {# {% endif %} #}
-  </ul>
-</nav>
-{% endif %}

app/templates/old/settings_template.html

@@ -1,35 +0,0 @@
-{# This template is an old version #}
-{% extends "admin_template.html" %}
-
-{% block per_page_title %}
-  {% block service_page_title %}{% endblock %} – {{ current_service.name }}
-{% endblock %}
-
-{% block main %}
-  <div class="grid-container">
-    <div class="grid-row margin-top-5">
-      {% if help %}
-        <div class="tablet:grid-col-3">
-      {% else %}
-        <div class="tablet:grid-col-3 margin-bottom-4">
-      {% endif %}
-          {% include "settings_nav.html" %}
-        </div>
-      {% if help %}
-        <div class="tablet:grid-col-8">
-      {% else %}
-        <div class="tablet:grid-col-9 tablet:padding-left-4">
-      {% endif %}
-        {% block beforeContent %}
-          {% block backLink %}{% endblock %}
-        {% endblock %}
-        <main id="main-content" role="main" class="usa-prose site-prose margin-bottom-10">
-        {% block content %}
-          {% include 'flash_messages.html' %}
-          {% block maincolumn_content %}{% endblock %}
-        {% endblock %}
-        </main>
-      </div>
-    </div>
-  </div>
-{% endblock %}

app/templates/old/withnav_template.html

@@ -1,36 +0,0 @@
-{# This template is an old version #}
-{% extends "admin_template.html" %}
-
-{% block per_page_title %}
-  {% block service_page_title %}{% endblock %} – {{ current_service.name }}
-{% endblock %}
-
-{% block main %}
-  <div class="grid-container">
-    {% include "service_navigation.html" %}
-    <div class="grid-row margin-top-5">
-      {% if help %}
-        <div class="tablet:grid-col-3">
-      {% else %}
-        <div class="tablet:grid-col-3">
-      {% endif %}
-          {% include "main_nav.html" %}
-        </div>
-      {% if help %}
-        <div class="grid-col-8">
-      {% else %}
-        <div class="tablet:grid-col-9 tablet:padding-left-4">
-      {% endif %}
-        {% block beforeContent %}
-          {% block backLink %}{% endblock %}
-        {% endblock %}
-        <main id="main-content" role="main" class="usa-prose site-prose margin-bottom-10">
-        {% block content %}
-          {% include 'flash_messages.html' %}
-          {% block maincolumn_content %}{% endblock %}
-        {% endblock %}
-        </main>
-      </div>
-    </div>
-  </div>
-{% endblock %}

app/templates/old/withoutnav_template.html

@@ -1,17 +0,0 @@
-{% extends "base.html" %}
-
-{% set mainClasses = "margin-top-5 padding-bottom-5" %}
-
-{% block beforeContent %}
-    {% if current_service and current_service.active and current_user.is_authenticated and current_user.belongs_to_service(current_service.id) %}
-    <!-- <div class="navigation-service usa-breadcrumb">
-      <a href="{{ url_for('main.show_accounts_or_dashboard') }}" class="usa-link usa-breadcrumb__link usa-breadcrumb-back-to">Back to {{ current_service.name }}</a>
-    </div> -->
-    {% endif %}
-    {% block backLink %}{% endblock %}
-{% endblock %}
-
-{% block content %}
-    {% include 'flash_messages.html' %}
-    {% block maincolumn_content %}{% endblock %}
-{% endblock %}

app/templates/partials/jobs/notifications.html

@@ -22,7 +22,7 @@
   {% else %}
 
     {% if notifications %}
-      <div class="dashboard-table bottom-gutter-3-2">
+      <div class="dashboard-table job-status-table table-overflow-x-auto">
     {% endif %}
       {% if job.still_processing %}
         <p class="bottom-gutter hint">
@@ -40,15 +40,16 @@
         notifications,
         caption=uploaded_file_name,
         caption_visible=False,
+        border_visible=True,
         empty_message='No messages to show yet…' if job.awaiting_processing_or_recently_processed else 'These messages have been deleted because they were sent more than {} days ago'.format(service_data_retention_days),
         field_headings=[
           'Recipient',
-          'Status'
+          'Message status'
         ],
         field_headings_visible=False
       ) %}
         {% call row_heading() %}
-          <a class="usa-link file-list-filename" href="{{ url_for('.view_notification', service_id=current_service.id, notification_id=item.id, from_job=job.id) }}">{{ item.to }}</a>
+          <a class="usa-link file-list-filename" href="{{ url_for('.view_notification', service_id=current_service.id, notification_id=item.id, from_job=job.id) }}">{{ item.to | format_phone_number_human_readable }}</a>
           <p class="file-list-hint">
             {{ item.preview_of_content }}
           </p>

app/templates/partials/jobs/status.html

@@ -25,7 +25,7 @@
       {% if job.scheduled_for %}
         <div class="usa-alert usa-alert--info">
           <div class="usa-alert__body">
-            <h4 class="usa-alert__heading">Your text has been scheduled</h4>
+            <h2 class="usa-alert__heading">Your text has been scheduled</h2>
             <p class="usa-alert__text">
               {{ job.template_name }} - {{ current_service.name }} was scheduled on {{ job.scheduled_for|format_datetime_normal }} by {{ job.created_by.name }}
             </p>
@@ -35,9 +35,11 @@
       {% else %}
         <div class="usa-alert usa-alert--success">
           <div class="usa-alert__body">
-            <h4 class="usa-alert__heading">Your text has been sent</h4>
+            <h2 class="usa-alert__heading">Your text has been sent</h2>
             <p class="usa-alert__text">
-              {{ job.template_name }} - {{ current_service.name }} was sent on {{ job.created_at|format_datetime_normal }} by {{ job.created_by.name }}
+              {{ job.template_name }} - {{ current_service.name }} was sent on {% if job.processing_started %}
+              {{ job.processing_started|format_datetime_table }} {% else %}
+              {{ job.created_at|format_datetime_table }} {% endif %} by {{ job.created_by.name }}
             </p>
           </div>
         </div>

app/templates/partials/notifications/notifications.html

@@ -1,8 +1,8 @@
 {% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading, notification_status_field %}
 {% from "components/page-footer.html" import page_footer %}
 
-<div class="ajax-block-container table-wrapper" aria-labelledby='pill-selected-item'>
-  <div class="dashboard-table bottom-gutter-3-2">
+<div class="ajax-block-container" aria-labelledby='pill-selected-item'>
+  <div class="dashboard-table table-overflow-x-auto">
 
   {% call(item, row_number) list_table(
     [notification],

app/templates/views/activity/all-activity.html

@@ -0,0 +1,143 @@
+{% extends "withnav_template.html" %}
+
+{% block service_page_title %}
+  All activity
+{% endblock %}
+
+{% set show_pagination %}
+  {% if prev_page or next_page %}
+  <nav aria-label="Pagination" class="usa-pagination">
+    <ul class="usa-pagination__list">
+      {% if prev_page %}
+      <li class="usa-pagination__item usa-pagination__arrow">
+        <a
+          href="{{prev_page['url']}}"
+          class="usa-pagination__link usa-pagination__previous-page"
+          aria-label="Previous page"
+          >
+          <img src="{{ asset_url('img/usa-icons/navigate_before.svg') }}" alt="arrow">
+          <span class="usa-pagination__link-text">Previous</span></a
+        >
+      </li>
+      {% endif %}
+      {% if pagination %}
+        {% for page in pagination.pages %}
+          {% if page == pagination.current %}
+          <li class="usa-pagination__item usa-pagination__page-no">
+            <span class="usa-pagination__button usa-current" aria-label="Page {{ page }}" aria-current="true">
+              {{ page }}
+            </span>
+          </li>
+          {% else %}
+            <li class="usa-pagination__item">
+              <a class="usa-pagination__button" href="?page={{ page }}">
+                {{ page }}
+              </a>
+            </li>
+          {% endif %}
+        {% endfor %}
+      {% endif %}
+      {% if next_page %}
+      <li class="usa-pagination__item usa-pagination__arrow">
+        <a
+          href="{{ next_page['url'] }}"
+          class="usa-pagination__link usa-pagination__next-page"
+          aria-label="Next page"
+        >
+          <span class="usa-pagination__link-text">Next </span>
+          <img src="{{ asset_url('img/usa-icons/navigate_next.svg') }}" alt="arrow">
+        </a>
+      </li>
+      {% endif %}
+    </ul>
+  </nav>
+  {% endif %}
+{% endset %}
+{% block maincolumn_content %}
+  <div class="margin-bottom-8">
+    <h1 class="usa-sr-only">All activity</h1>
+    <h2 class="font-body-2xl line-height-sans-2 margin-0">All activity</h2>
+    <h2 class="margin-top-4 margin-bottom-1">Sent jobs</h2>
+    <div class="usa-table-container--scrollable-mobile">
+      <table class="usa-table usa-table--compact job-table">
+        <caption></caption>
+        <thead class="table-field-headings">
+          <tr>
+            <th scope="col" role="columnheader" class="table-field-heading-first" id="jobId">
+              <span>Job ID#</span>
+            </th>
+            <th data-sortable scope="col" role="columnheader" class="table-field-heading">
+              <span>Template</span>
+            </th>
+            <th data-sortable scope="col" role="columnheader" class="table-field-heading">
+              <span>Time sent</span>
+            </th>
+            <th data-sortable scope="col" role="columnheader" class="table-field-heading">
+              <span>Sender</span>
+            </th>
+            <th data-sortable scope="col" role="columnheader" class="table-field-heading">
+              <span>Report</span>
+            </th>
+            <th data-sortable scope="col" role="columnheader" class="table-field-heading">
+              <span>Delivered</span>
+            </th>
+            <th data-sortable scope="col" role="columnheader" class="table-field-heading">
+              <span>Failed</span>
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          {% if all_jobs_dict %}
+            {% for job in all_jobs_dict %}
+              <tr class="table-row">
+                <td class="table-field jobid" scope="row" role="rowheader">
+                  <a class="usa-link" href="{{ job.view_job_link }}">
+                    {{ job.job_id[:8] if job.job_id else 'Manually entered number' }}
+                  </a>
+                </td>
+                <td class="table-field template">{{ job.template_name }}</td>
+                <td data-sort-value="{{job.time_sent_data_value}}" class="table-field time-sent">
+                  {{ (job.processing_finished if job.processing_finished else job.processing_started
+                    if job.processing_started else job.created_at)|format_datetime_table }}
+                </td>
+                <td class="table-field sender">{{ job.created_by.name }}</td>
+                <td class="table-field report">
+                  {% if job.time_left != "Data no longer available" %}
+                    <a href="{{ job.download_link }}"><img src="{{ url_for('static', filename='img/material-icons/file_download.svg') }}" alt="File Download Icon"></a>
+                  {% else %}
+                    <span>N/A</span>
+                  {% endif %}
+                </td>
+                <td class="table-field delivered">{{ job.delivered_count if job.delivered_count is not none else '0' }}</td>
+                <td class="table-field failed">{{ job.failed_count if job.failed_count is not none else '0' }}</td>
+              </tr>
+            {% endfor %}
+          {% else %}
+            <tr class="table-row">
+              <td class="table-empty-message" colspan="10">No messages found</td>
+            </tr>
+          {% endif %}
+        </tbody>
+      </table>
+      <div class="usa-sr-only usa-table__announcement-region" aria-live="polite"></div>
+      <p><b>Note: </b>Report data is only available for 7 days after your message has been sent</p>
+    </div>
+    {{show_pagination}}
+    {% if current_user.has_permissions('view_activity') %}
+      <h2 class="line-height-sans-2 margin-bottom-0 margin-top-4">Download recent reports</h2>
+      <p class="font-body-sm">
+        <a href="{{ download_link_one_day }}" download="download" class="usa-link">Download all data last 24 hours (<abbr title="Comma separated values">CSV</abbr>)</a>
+      </p>
+      <p class="font-body-sm">
+        <a href="{{ download_link_three_day }}" download="download" class="usa-link">Download all data last 3 days (<abbr title="Comma separated values">CSV</abbr>)</a>
+        &emsp;
+      </p>
+      <p class="font-body-sm">
+        <a href="{{ download_link_five_day }}" download="download" class="usa-link">Download all data last 5 days (<abbr title="Comma separated values">CSV</abbr>)</a>
+      </p>
+      <p class="font-body-sm">
+        <a href="{{ download_link_seven_day }}" download="download" class="usa-link">Download all data last 7 days (<abbr title="Comma separated values">CSV</abbr>)</a>
+      </p>
+    {% endif %}
+  </div>
+{% endblock %}

app/templates/views/activity/notifications.html

@@ -5,7 +5,7 @@
 <div class="ajax-block-container" id='pill-selected-item'>
 
   {% if notifications %}
-  <div class="table-wrapper">
+  <div class="table-overflow-x-auto">
     <div class='dashboard-table'>
   {% endif %}
     {% call(item, row_number) list_table(

app/templates/views/api/callbacks.html

@@ -14,8 +14,8 @@
 
 {% block maincolumn_content %}
   {{ page_header('Callbacks') }}
-	<div class="table-wrapper">
-		<div class="bottom-gutter-3-2 dashboard-table body-copy-table">
+	<div class="table-overflow-x-auto">
+		<div class="bottom-gutter-3-2 dashboard-table body-copy-table table-overflow-x-auto">
 				{% call mapping_table(
 				caption='General',
 				field_headings=['Label', 'Value', 'Action'],

app/templates/views/check/preview.html

@@ -41,7 +41,7 @@
       </li>
     </ul>
   </div>
-  <div class="usa-table-container--scrollable" tabindex="0">
+  <div class="usa-table-container--scrollable table-overflow-x-auto" tabindex="0">
     <table class="usa-table usa-table--borderless width-full">
       <caption class="font-body-lg table-heading">
         Note: Only the first 5 rows are displayed here.

app/templates/views/dashboard/_jobs.html

@@ -1,6 +1,6 @@
 {% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading %}
 
-<div class="table-wrapper">
+<div class="table-overflow-x-auto">
   <div class='dashboard-table ajax-block-container'>
     {% call(item, row_number) list_table(
       jobs,

app/templates/views/dashboard/all-template-statistics.html

@@ -28,7 +28,7 @@
           No messages sent
         </p>
       {% else %}
-        <div class='template-statistics-table'>
+        <div class='template-statistics-table table-overflow-x-auto'>
           {% call(item, row_number) list_table(
             month.templates_used,
             caption=month.name,

app/templates/views/dashboard/dashboard.html

@@ -1,3 +1,5 @@
+
+
 {% extends "withnav_template.html" %}
 
 {% from "components/table.html" import list_table, field, text_field, link_field, right_aligned_field_heading, hidden_field_heading, row_heading, notification_status_field, notification_carrier_field, notification_carrier_message_field %}
@@ -8,8 +10,10 @@
 {% endblock %}
 
 {% block maincolumn_content %}
+  <script type="text/javascript" src="{{ asset_url('js/setTimezone.js') }}"></script>
 
-  <div class="dashboard margin-bottom-8">
+
+  <div class="dashboard margin-bottom-2">
 
     <h1 class="usa-sr-only">Dashboard</h1>
     {% if current_user.has_permissions('manage_templates') and not current_service.all_templates %}
@@ -18,96 +22,122 @@
 
     {{ ajax_block(partials, updates_url, 'upcoming') }}
 
-    <h2 class="font-body-2xl line-height-sans-2 margin-0">
-      Messages sent
-    </h2>
+    <h2 class="font-body-xl margin-top-0">{{ current_service.name }} Dashboard</h2>
 
-    <!-- <button id="sevenDaysButton">7 Days</button>
-    <canvas id="myChart"></canvas> -->
     {{ ajax_block(partials, updates_url, 'inbox') }}
 
-    {{ ajax_block(partials, updates_url, 'totals') }}
-
-    {{ ajax_block(partials, updates_url, 'template-statistics') }}
-    <h2 class="margin-top-4 margin-bottom-1">Recent Batches</h2>
-    <div class="table-wrapper">
-      <table class="usa-table usa-table--borderless job-table">
-        <thead class="table-field-headings">
-          <tr>
-            <th scope="col" class="table-field-heading-first">
-              <span>File name</span>
-            </th>
-            <th scope="col" class="table-field-heading">
-              <span>Template</span>
-            </th>
-            <th scope="col" class="table-field-heading">
-              <span>Time sent</span>
-            </th>
-            <th scope="col" class="table-field-heading">
-              <span>Sender</span>
-            </th>
-            <th scope="col" class="table-field-heading">
-              <span># of Recipients</span>
-            </th>
-            <th scope="col" class="table-field-heading">
-              <span>Report</span>
-            </th>
-          </tr>
-        </thead>
-        <tbody>
-          {% if job_and_notifications %}
-            {% for job in job_and_notifications[:5] %}
-              {% if job.job_id and job.notifications %}
-                {% set notification = job.notifications[0] %}
-                <tr class="table-row" id="{{ job.job_id }}">
-                  <td class="table-field file-name">
-                    {{ notification.job.original_file_name[:12] if notification.job.original_file_name else 'Manually entered number'}}
-                    <br>
-                    <a class="usa-link file-list-filename" href="{{ job.view_job_link }}">View Batch</a>
-                  </td>
-                  <td class="table-field template">
-                    {{ notification.template.name }}
-                  </td>
-                  <td class="table-field time-sent">
-                    {{ job.created_at | format_datetime_table }}
-                  </td>
-                  <td class="table-field sender">
-                    {{ notification.created_by.name }}
-                  </td>
-                  <td class="table-field count-of-recipients">
-                    {{ job.notification_count}}
-                  </td>
-                  <td class="table-field report">
-                    {% if notification and job.time_left != "Data no longer available" %}
-                      <a class="usa-link file-list-filename" href="{{ job.download_link }}">Download</a>
-                      <span class="usa-hint">{{ job.time_left }}</span>
-                    {% elif job %}
-                      <span>{{ job.time_left }}</span>
-                    {% endif %}
-                  </td>
-                </tr>
-              {% endif %}
-            {% endfor %}
-          {% else %}
-            <tr class="table-row">
-              <td class="table-empty-message" colspan="10">No batched job messages found &thinsp;(messages are kept for {{ service_data_retention_days }} days).</td>
-            </tr>
-        {% endif %}
-        </tbody>
-      </table>
+    <div id="totalMessageChartContainer" data-sms-sent="{{ sms_sent }}" data-sms-allowance-remaining="{{ sms_allowance_remaining }}">
+      <h2 id="chartTitle">Total messages</h2>
+      <svg id="totalMessageChart"></svg>
+      <div id="message"></div>
     </div>
+    <div id="totalMessageTable" class="margin-0"></div>
 
-    <h2 class="margin-top-4 margin-bottom-1">Message count</h2>
-    {% if current_user.has_permissions('manage_service') %}
-      <h3 class='margin-bottom-0' id="current-year"></h3>
-      {{ ajax_block(partials, updates_url, 'usage') }}
-      <p class="margin-top-0">During the pilot period, each service has an allowance of 250,000 message parts. Once this allowance is met, the
-      application will stop delivering messages. There's no monthly charge, no setup fee, and no procurement cost.</p>
-      <p class="align-with-heading-copy">
-        What counts as 1 text message part?<br />
-        See <a class="usa-link" href="{{ url_for('.pricing') }}">pricing</a>.
-      </p>
-    {% endif %}
+    <h2 class="line-height-sans-2 margin-bottom-0 margin-top-4">Recent activity</h2>
+    <div id="activityChartContainer">
+      <form class="usa-form">
+        <label class="usa-label" for="options">Account</label>
+        <select class="usa-select margin-bottom-2" name="options" id="options">
+          <option value>- Select -</option>
+          <option value="service" selected>{{ current_service.name }}</option>
+          <option value="individual">{{ current_user.name }}</option>
+        </select>
+      </form>
+      <div id="activityChart">
+        <div class="chart-header">
+          <div class="chart-subtitle">{{ current_service.name }} - last 7 days</div>
+          <div class="chart-legend" role="region" aria-label="Legend"></div>
+        </div>
+        <div class="chart-container" id="weeklyChart"></div>
+        <table id="weeklyTable" class="usa-sr-only usa-table"></table>
+      </div>
+    </div>
+    <div id="aria-live-account" class="usa-sr-only" aria-live="polite"></div>
+
+    {% if current_user.has_permissions('manage_service') %}{% endif %}
+
+    <div class="table-container">
+      <div id="table1" class="table-overflow-x-auto hidden">
+        <h2 class="margin-top-4 margin-bottom-1">My activity</h2>
+        <table class="usa-table job-table">
+          <thead class="table-field-headings">
+            <tr>
+              <th scope="col" class="table-field-heading-first" id="jobId"><span>Job ID#</span></th>
+              <th data-sortable scope="col" class="table-field-heading"><span>Template</span></th>
+              <th data-sortable scope="col" class="table-field-heading"><span>Job status</span></th>
+              <th data-sortable scope="col" class="table-field-heading"><span># of Recipients</span></th>
+            </tr>
+          </thead>
+          <tbody>
+            {% if jobs %}
+              {% for job in jobs[:5] %}
+                {% if job.created_by.name == current_user.name %}
+                  {% set notification = job.notifications[0] %}
+                  <tr id="{{ job.job_id }}">
+                    <td class="table-field jobid" scope="row" role="rowheader">
+                      <a class="usa-link" href="{{ job.view_job_link }}">
+                        {{ job.job_id[:8] if job.job_id else 'Manually entered number' }}
+                      </a>
+                    </td>
+                    <td class="table-field template">{{ job.template_name }}</td>
+                    <td class="table-field time-sent">Sent on
+                      {{ (job.processing_finished if job.processing_finished else job.processing_started
+                        if job.processing_started else job.created_at)|format_datetime_table }}
+                    </td>
+                    <td class="table-field count-of-recipients">{{ job.notification_count }}</td>
+                  </tr>
+                {% endif %}
+              {% endfor %}
+            {% else %}
+              <tr class="table-row">
+                <td class="table-empty-message" colspan="10">No batched job messages found &thinsp;(messages are kept for {{ service_data_retention_days }} days).</td>
+              </tr>
+            {% endif %}
+          </tbody>
+        </table>
+      </div>
+
+      <div id="table2" class="table-overflow-x-auto visible">
+        <h2 class="margin-top-4 margin-bottom-1">Service activity</h2>
+        <table class="usa-table job-table">
+          <thead class="table-field-headings">
+            <tr>
+              <th scope="col" role="columnheader" class="table-field-heading-first" id="jobId"><span>Job ID#</span></th>
+              <th data-sortable scope="col" role="columnheader" class="table-field-heading"><span>Template</span></th>
+              <th data-sortable scope="col" role="columnheader" class="table-field-heading"><span>Job status</span></th>
+              <th data-sortable scope="col" role="columnheader" class="table-field-heading"><span>Sender</span></th>
+              <th data-sortable scope="col" role="columnheader" class="table-field-heading"><span># of Recipients</span></th>
+            </tr>
+          </thead>
+          <tbody>
+            {% if jobs %}
+              {% for job in jobs[:5] %}
+                {% set notification = job.notifications[0] %}
+                <tr id="{{ job.job_id }}">
+                  <td class="table-field jobid" scope="row" role="rowheader">
+                    <a class="usa-link" href="{{ job.view_job_link }}">
+                      {{ job.job_id[:8] if job.job_id else 'Manually entered number' }}
+                    </a>
+                  </td>
+                  <td class="table-field template">{{ job.template_name }}</td>
+                  <td class="table-field time-sent">Sent on
+                    {{ (job.processing_finished if job.processing_finished else job.processing_started
+                      if job.processing_started else job.created_at)|format_datetime_table }}
+                  </td>
+                  <td class="table-field sender">{{ job.created_by.name }}</td>
+                  <td class="table-field count-of-recipients">{{ job.notification_count }}</td>
+                </tr>
+              {% endfor %}
+            {% else %}
+              <tr class="table-row">
+                <td class="table-empty-message" colspan="10">No batched job messages found &thinsp;(messages are kept for {{ service_data_retention_days }} days).</td>
+              </tr>
+            {% endif %}
+          </tbody>
+        </table>
+      </div>
+    </div>
+    {{ ajax_block(partials, updates_url, 'template-statistics') }}
   </div>
 
 {% endblock %}

app/templates/views/dashboard/template-statistics.html

@@ -1,33 +1,45 @@
-{% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading, spark_bar_field %}
-
 <div class="ajax-block-container">
   {% if template_statistics|length > 1 %}
-    <div class='template-statistics-table'>
-      {% call(item, row_number) list_table(
-        template_statistics,
-        caption="Messages sent by template",
-        caption_visible=True,
-        empty_message='',
-        field_headings=[
-          'Template',
-          'Messages sent'
-        ],
-        field_headings_visible=False
-      ) %}
-
-        {% call row_heading() %}
-          <a class="usa-link template-statistics-table-template-name" href="{{ url_for('.view_template', service_id=current_service.id, template_id=item.template_id) }}">{{ item.template_name }}</a>
-          <span class="template-statistics-table-hint">
-            {{ 1|message_count_label(item.template_type, suffix='template')|capitalize }}
-          </span>
-        {% endcall %}
-
-        {{ spark_bar_field(item.count, most_used_template_count, id=item.template_id) }}
-      {% endcall %}
-      <a
-        href="{{ url_for('.template_usage', service_id=current_service.id) }}"
-        class="usa-link show-more-no-border"
-      ><span>See templates used by month</span></a>
+  <h2 class="margin-top-4 margin-bottom-1">Most Used Templates</h2>
+    <div class="template-statistics-table table-overflow-x-auto">
+      <table class="usa-table width-full">
+        <caption class="font-body-lg table-heading usa-sr-only">
+          Messages sent by template
+        </caption>
+        <thead class="table-field-headings">
+          <tr>
+            <th class="table-field-heading-first" width="">
+              <span>Template name</span>
+            </th>
+            <th class="table-field-heading" width="">
+              <span>Folder</span>
+            </th>
+            <th class="table-field-heading" width="">
+              <span>Last used</span>
+            </th>
+            <th class="table-field-heading" width="">
+              <span>Created by</span>
+            </th>
+            <th class="table-field-heading" width="">
+              <span># Times used</span>
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          {% for item in template_statistics[:8] %}
+            <tr class="table-row">
+              <td>
+                <a class="usa-link template-statistics-table-template-name" href="{{ url_for('.view_template', service_id=current_service.id, template_id=item.template_id) }}">{{ item.template_name }}</a>
+              </td>
+              <td><p>{{ item.template_folder }}</p></td>
+              <td><p>{{ item.last_used|format_datetime_table}}</p></td>
+              <td><p>{{ item.created_by }}</p></td>
+              <td><p>{{ item.count }}</p></td>
+            </tr>
+          {% endfor %}
+        </tbody>
+      </table>
+        <a href="/services/78409625-0c0a-485e-b82c-b19c8f4b1bdb/template-usage" class="usa-link show-more-no-border"><span>See templates by month</span></a>
     </div>
   {% endif %}
 </div>

app/templates/views/features.html

@@ -24,6 +24,10 @@
 <p class="usa-body">To send a text with Notify, you need to create a reusable message template first.</p>
 <p class="usa-body">Templates let you send the same thing to lots of people, as often as you need to, without writing a new message each time.</p>
 
+<h2 class="heading-medium" id="organizing-content">Organizing your content</h2>
+<p class="usa-body">You can organize your content by grouping templates, and putting them into folders.</p>
+<p class="usa-body">Set up folders within the Send message section of Notify, where you find templates. You can choose to create a Folder before or after a template is made. If you want to change a user’s ability to view or edit folders, you may control this through their individual team member permissions.</p>
+
 <h2 class="heading-medium" id="personalised-messages">Personalized content</h2>
 <p class="usa-body">Notify makes it easy to send personalized messages from a single template.</p>
 <p class="usa-body">See <a class="usa-link" href="{{ url_for('.guidance_index', _anchor='personalized-content') }}">how to personalize your content</a>.</p>
@@ -44,7 +48,6 @@
 <p class="usa-body">Notify lets you:</p>
 <ul class="list list-bullet">
   <li>set different permission levels for each team member</li>
-  <li>invite team members who do not have a government email address</li>
   <li>choose who else can manage team members</li>
 </ul>
 

app/templates/views/guidance/index.html

@@ -162,55 +162,57 @@
   location, the flag to receive the content needs to be captured in its own column with a Yes or No (Y/N) flag.</p>
 
   <h3>Example</h3>
-  <table class="usa-table">
-    <caption class="usa-sr-only">
-      Example
-    </caption>
-    <thead>
-      <tr>
-        <th scope="col">Phone number</th>
-        <th scope="col">First name</th>
-        <th scope="col">Last name</th>
-        <th scope="col">Spanish</th>
-        <th scope="col">English</th>
-        <th scope="col">Date</th>
-        <th scope="col">Time</th>
-        <th scope="col">Location</th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr>
-        <td>123-456-7890</td>
-        <td>Lulu</td>
-        <td>Praether</td>
-        <td>N</td>
-        <td>Y</td>
-        <td>November 2, 2023</td>
-        <td>3:25</td>
-        <td>123 Ford Rd.</td>
-      </tr>
-      <tr>
-        <td>234-567-8901</td>
-        <td>Sela</td>
-        <td>Appel</td>
-        <td>Y</td>
-        <td>N</td>
-        <td>November 2, 2023</td>
-        <td>4:00</td>
-        <td>123 Ford Rd.</td>
-      </tr>
-      <tr>
-        <td>123-456-7890</td>
-        <td>Dexter</td>
-        <td>Moseley</td>
-        <td>N</td>
-        <td>Y</td>
-        <td>November 2, 2023</td>
-        <td>2:00</td>
-        <td>123 Ford Rd.</td>
-      </tr>
-    </tbody>
-  </table>
+  <div class="table-overflow-x-auto">
+    <table class="usa-table">
+      <caption class="usa-sr-only">
+        Example
+      </caption>
+      <thead>
+        <tr>
+          <th scope="col">Phone number</th>
+          <th scope="col">First name</th>
+          <th scope="col">Last name</th>
+          <th scope="col">Spanish</th>
+          <th scope="col">English</th>
+          <th scope="col">Date</th>
+          <th scope="col">Time</th>
+          <th scope="col">Location</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>123-456-7890</td>
+          <td>Lulu</td>
+          <td>Praether</td>
+          <td>N</td>
+          <td>Y</td>
+          <td>November 2, 2023</td>
+          <td>3:25</td>
+          <td>123 Ford Rd.</td>
+        </tr>
+        <tr>
+          <td>234-567-8901</td>
+          <td>Sela</td>
+          <td>Appel</td>
+          <td>Y</td>
+          <td>N</td>
+          <td>November 2, 2023</td>
+          <td>4:00</td>
+          <td>123 Ford Rd.</td>
+        </tr>
+        <tr>
+          <td>123-456-7890</td>
+          <td>Dexter</td>
+          <td>Moseley</td>
+          <td>N</td>
+          <td>Y</td>
+          <td>November 2, 2023</td>
+          <td>2:00</td>
+          <td>123 Ford Rd.</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
 
   {# Preventing fraud #}
   <h2 class="padding-top-1" id="prevent-fraud">Preventing fraud</h2>

app/templates/views/inbound-sms-admin.html

@@ -23,36 +23,34 @@ Inbound SMS
   <h1 class="font-body-2xl">
     Inbound SMS
   </h1>
-
-  <table class="usa-table usa-table--borderless inbound">
-          <thread>
-              <tr>
-                <th>{{table_headings.field_headings[0]}}</th>
-                <th>{{table_headings.field_headings[1]}}</th>
-                <th>{{table_headings.field_headings[2]}}</th>
-              </tr>
-          </thread>
-          <tbody>
-
-          {% for value in inbound_num_list.data: %}
+  <div class="table-overflow-x-auto">
+    <table class="usa-table usa-table--borderless inbound width-full">
+      <thead>
           <tr>
-              <td>{{value.number}}</td>
-              <td>
-
-              {% if value.active %}
-                Active
-              {% elif not value.service.name  %}
-                  Not used
-              {% else %}
-                Inactive
-              {% endif %}
-              </td>
-              <td>
-                  <a href="{{ url_for('main.service_dashboard', service_id=value.service.id) }}" class="usa-link bold">{{ value.service.name }}</a>
-              </td>
+            <th>{{table_headings.field_headings[0]}}</th>
+            <th>{{table_headings.field_headings[1]}}</th>
+            <th>{{table_headings.field_headings[2]}}</th>
           </tr>
-          {% endfor %}
-          </tbody>
-  </table>
-
+      </thead>
+      <tbody>
+      {% for value in inbound_num_list.data: %}
+      <tr>
+          <td>{{value.number}}</td>
+          <td>
+          {% if value.active %}
+            Active
+          {% elif not value.service.name  %}
+              Not used
+          {% else %}
+            Inactive
+          {% endif %}
+          </td>
+          <td>
+              <a href="{{ url_for('main.service_dashboard', service_id=value.service.id) }}" class="usa-link bold">{{ value.service.name }}</a>
+          </td>
+      </tr>
+      {% endfor %}
+      </tbody>
+    </table>
+  </div>
 {% endblock %}

app/templates/views/invite-user.html

@@ -15,7 +15,7 @@
 {% block maincolumn_content %}
 
   {{ page_header('Invite {}'.format(user_to_invite.name if user_to_invite else 'a team member')) }}
-
+  <a href="#permissions">Learn more about user permissions.</a>
   {% call form_wrapper() %}
 
     {% if user_to_invite %}
@@ -36,5 +36,99 @@
     {{ page_footer('Send invitation email') }}
 
   {% endcall %}
+  <h2 id="permissions">Set up user permissions</h2>
+  <p>Setting the right digital control is one of many aspects to keep content and information on a need to know basis. Permissions allow you to do this. Give team members access to important views related to their responsibilities.</p>
+  <h3 class="site-preview-heading">Permissions</h3>
 
+  <div class="usa-accordion usa-accordion--bordered margin-top-1">
+    <h4 class="usa-accordion__heading">
+      <button
+        type="button"
+        class="usa-accordion__button"
+        aria-expanded="true"
+        aria-controls="b-a1"
+      >
+      See dashboard
+      </button>
+    </h4>
+    <div id="b-a1" class="usa-accordion__content usa-prose">
+      <p>Allows users to view the dashboard but not have access to any other functions on the site.
+        Dashboard viewers can see: Weekly message quantity</p>
+        <ul>
+          <li>Message templates used</li>
+          <li>Recent batches of sent messages</li>
+        </ul>
+        <p>This also gives access to:</p>
+        <ul>
+          <li>List of templates used by month</li>
+          <li>Batch details with message status</li>
+        </ul>
+    </div>
+    <h4 class="usa-accordion__heading">
+      <button
+        type="button"
+        class="usa-accordion__button"
+        aria-expanded="false"
+        aria-controls="b-a2"
+      >
+      Send messages
+      </button>
+    </h4>
+    <div id="b-a2" class="usa-accordion__content usa-prose">
+      <p>
+        Allows users to view, select and send approved messages, but restricts users from editing templates
+        and/or folders. Team members responsible for sending message batches can use templates to prepare
+        and schedule texts. Actions they take in this section:
+      </p>
+      <ul>
+        <li>View and use templates</li>
+        <li>Enter personalized message field content</li>
+        <li>Schedule messages for sending</li>
+        <li>Send messages</li>
+      </ul>
+    </div>
+    <h4 class="usa-accordion__heading">
+      <button
+        type="button"
+        class="usa-accordion__button"
+        aria-expanded="false"
+        aria-controls="b-a3"
+      >
+      Add and edit templates
+      </button>
+    </h4>
+    <div id="b-a3" class="usa-accordion__content usa-prose">
+      <p>
+        Allows users to view, create or edit, and more or delete templates and folders. They will set up real
+        messages, but are restricted from uploading data or sending or seeing previous versions. Some actions
+        they can take:
+      </p>
+      <ul>
+        <li>Create a new template</li>
+        <li>Create a new folder</li>
+        <li>Move (or organize) folders and templates</li>
+        <li>Delete templates and/or folders</li>
+      </ul>
+    </div>
+    <h4 class="usa-accordion__heading">
+      <button
+        type="button"
+        class="usa-accordion__button"
+        aria-expanded="false"
+        aria-controls="b-a4"
+      >
+      Manage settings and team
+      </button>
+    </h4>
+    <div id="b-a4" class="usa-accordion__content usa-prose">
+      <p>Leads with service management responsibility may do so in Settings. Managed within Settings:</p>
+      <ul>
+        <li>Change service name</li>
+        <li>Invite team members</li>
+        <li>Remove unnecessary team members</li>
+        <li>Turn off the ability to send text messages</li>
+        <li>Turn off the ability to send service name with text message</li>
+      </ul>
+    </div>
+  </div>
 {% endblock %}

app/templates/views/jobs/job.html

@@ -25,8 +25,8 @@
       </div>
     {% endif %}
 
-    <p class="notification-status">
-      Messages will remain in pending state until carrier status is received, typically 5 minutes.
+    <p class="notification-status max-width-full">
+      Messages are sent immediately to the cell phone carrier, but will remain in "pending" status until we hear back from the carrier they have received it and attempted deliver. More information on <a class="usa-link" href="{{ url_for('main.message_status') }}">delivery status</a>.
     </p>
     {% if not job.processing_finished %}
       <div

app/templates/views/manage-users.html

@@ -10,7 +10,7 @@
 {% block serviceNavigation %}{% endblock %}
 
 {% block sideNavigation %}
-  {% include "/new/components/settings_nav.html" %}
+  {% include "components/settings_nav.html" %}
 {% endblock %}
 
 {% block maincolumn_content %}

app/templates/views/message-status.html

@@ -49,7 +49,7 @@
   <p>Notify cannot tell you if your users open an email or click on the links in an email. We do not track open rates and click-throughs because there are privacy issues. Tracking emails without asking permission from users could breach General Data Protection Regulations (GDPR).</p> -->
 
   <h2 id="text-message-statuses" class="heading-medium">Text messages</h2>
-  <div class="margin-bottom-8">
+  <div class="margin-bottom-8 table-overflow-x-auto">
     {% call mapping_table(
       caption='Message statuses – text messages',
       field_headings=['Status', 'Description'],