feat: Add Terraform configuration for frontend (#22)

Co-authored-by: Kevin Boyer <kevinboyer@navapbc.com>

Author: yoomlam

.github/workflows/cd-frontend.yml

@@ -0,0 +1,38 @@
+name: Deploy frontend
+# Need to set a default value for when the workflow is triggered from a git push
+# which bypasses the default configuration for inputs
+run-name: Deploy ${{inputs.version || 'main' }} to frontend ${{ inputs.environment || 'dev' }}
+
+on:
+  push:
+    branches:
+      - "main"
+    paths:
+      - "frontend/**"
+      - "bin/**"
+      - "infra/**"
+  workflow_dispatch:
+    inputs:
+      environment:
+        description: Environment to deploy to
+        required: true
+        default: "dev"
+        type: choice
+        options:
+          - dev
+          - staging
+          - prod
+      version:
+        required: true
+        default: "main"
+        description: Tag or branch or SHA to deploy
+
+jobs:
+  deploy:
+    name: " " # GitHub UI is noisy when calling reusable workflows, so use whitespace for name to reduce noise
+    uses: ./.github/workflows/deploy.yml
+    with:
+      app_name: "frontend"
+      environment: ${{ inputs.environment || 'dev' }}
+      version: ${{ inputs.version || 'main' }}
+    secrets: inherit

.github/workflows/ci-frontend-infra-service.yml

@@ -0,0 +1,62 @@
+name: CI Infra Service Checks - frontend
+
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - infra/frontend/service/**
+      - infra/modules/**
+      - infra/test/**
+      - .github/workflows/ci-frontend-infra-service.yml
+  pull_request:
+    paths:
+      - infra/frontend/service/**
+      - infra/modules/**
+      - infra/test/**
+      - .github/workflows/ci-frontend-infra-service.yml
+  workflow_dispatch:
+    inputs:
+      version:
+        required: true
+        default: "main"
+        description: Tag or branch or SHA to test
+
+jobs:
+  build-and-publish:
+    name: Build
+    uses: ./.github/workflows/build-and-publish.yml
+    with:
+      app_name: frontend
+      ref: ${{ inputs.version || github.ref }}
+
+  infra-test-e2e:
+    name: Test service
+    runs-on: ubuntu-latest
+    needs: [build-and-publish]
+
+    permissions:
+      contents: read
+      id-token: write
+
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          ref: ${{ inputs.version || github.ref }}
+
+      - name: Set up Terraform
+        uses: ./.github/actions/setup-terraform
+
+      - uses: actions/setup-go@v5
+        with:
+          go-version-file: "infra/test/go.mod"
+
+      - name: Configure AWS credentials
+        uses: ./.github/actions/configure-aws-credentials
+        with:
+          app_name: frontend
+          # Run infra CI on dev environment
+          environment: dev
+
+      - name: Run Terratest
+        run: make infra-test-service APP_NAME=frontend

.github/workflows/ci-frontend-pr-environment-checks.yml

@@ -0,0 +1,22 @@
+name: CI frontend PR Environment Checks
+on:
+  workflow_dispatch:
+    inputs:
+      pr_number:
+        required: true
+        type: string
+      commit_hash:
+        required: true
+        type: string
+  pull_request:
+
+jobs:
+  update:
+    name: " " # GitHub UI is noisy when calling reusable workflows, so use whitespace for name to reduce noise
+    uses: ./.github/workflows/pr-environment-checks.yml
+    if: github.event_name == 'workflow_dispatch' || github.event.pull_request.state == 'open'
+    with:
+      app_name: "frontend"
+      environment: "dev"
+      pr_number: ${{ inputs.pr_number || github.event.number }}
+      commit_hash: ${{ inputs.commit_hash || github.event.pull_request.head.sha }}

.github/workflows/ci-frontend-pr-environment-destroy.yml

@@ -0,0 +1,18 @@
+name: CI frontend PR Environment Destroy
+on:
+  workflow_dispatch:
+    inputs:
+      pr_number:
+        required: true
+        type: string
+  pull_request_target:
+    types: [closed]
+
+jobs:
+  destroy:
+    name: " " # GitHub UI is noisy when calling reusable workflows, so use whitespace for name to reduce noise
+    uses: ./.github/workflows/pr-environment-destroy.yml
+    with:
+      app_name: "frontend"
+      environment: "dev"
+      pr_number: ${{ inputs.pr_number || github.event.number }}

.github/workflows/ci-frontend-vulnerability-scans.yml

@@ -0,0 +1,28 @@
+name: CI Vulnerability Scans - frontend
+
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - frontend/**
+      - .grype.yml
+      - .hadolint.yaml
+      - .trivyignore
+      - .github/workflows/vulnerability-scans.yml
+      - .github/workflows/ci-frontend-vulnerability-scans.yml
+  pull_request:
+    paths:
+      - frontend/**
+      - .grype.yml
+      - .hadolint.yaml
+      - .trivyignore
+      - .github/workflows/vulnerability-scans.yml
+      - .github/workflows/ci-frontend-vulnerability-scans.yml
+
+jobs:
+  vulnerability-scans:
+    name: Vulnerability Scans
+    uses: ./.github/workflows/vulnerability-scans.yml
+    with:
+      app_name: "frontend"

.template-infra/app-frontend.yml

@@ -0,0 +1,7 @@
+# Changes here will be overwritten by Copier
+_commit: v0.15.6
+_src_path: https://github.com/navapbc/template-infra
+app_has_dev_env_setup: true
+app_local_port: 3001
+app_name: frontend
+template: app

e2e/frontend/playwright.config.js

@@ -0,0 +1,11 @@
+import baseConfig from '../playwright.config';
+import { deepMerge } from '../lib/util';
+import { defineConfig } from '@playwright/test';
+
+export default defineConfig(
+  deepMerge(baseConfig, {
+    use: {
+      baseURL: baseConfig.use.baseURL || 'localhost:3001',
+    },
+  })
+);

e2e/frontend/tests/index.spec.ts

@@ -0,0 +1,30 @@
+import { Page, expect, test } from '@playwright/test';
+
+import AxeBuilder from '@axe-core/playwright';
+
+test.describe('Generic Webpage Tests', () => {
+  test('should load the webpage successfully', async ({ page }) => {
+    const response = await page.goto('/');
+    const title = await page.title();
+    expect(response!.status()).toBe(200);
+  });
+
+  test('should take a screenshot of the webpage', async ({ page }) => {
+    await page.goto('/');
+    await page.screenshot({ path: 'example-screenshot.png', fullPage: true });
+  });
+
+  // https://playwright.dev/docs/accessibility-testing
+  test('should not have any automatically detectable accessibility issues', async ({ page }) => {
+    await page.goto('/');
+    const accessibilityScanResults = await new AxeBuilder({ page }).analyze();
+    expect(accessibilityScanResults.violations).toEqual([]);
+  });
+
+  // Example test of finding a an html element on the index/home page
+  // test('should check for an element to be visible', async ({ page }) => {
+  //   await page.goto('/');
+  //   const element = page.locator('h1');
+  //   await expect(element).toBeVisible();
+  // });
+});

infra/frontend/app-config/build_repository.tf

@@ -0,0 +1,20 @@
+data "external" "account_ids_by_name" {
+  program = ["${path.module}/../../../bin/account-ids-by-name"]
+}
+
+locals {
+  image_repository_name         = "${local.project_name}-${local.app_name}"
+  image_repository_region       = module.project_config.default_region
+  image_repository_account_name = module.project_config.network_configs[local.shared_network_name].account_name
+  image_repository_account_id   = data.external.account_ids_by_name.result[local.image_repository_account_name]
+
+  build_repository_config = {
+    name           = local.image_repository_name
+    region         = local.image_repository_region
+    network_name   = local.shared_network_name
+    account_name   = local.image_repository_account_name
+    account_id     = local.image_repository_account_id
+    repository_arn = "arn:aws:ecr:${local.image_repository_region}:${local.image_repository_account_id}:repository/${local.image_repository_name}"
+    repository_url = "${local.image_repository_account_id}.dkr.ecr.${local.image_repository_region}.amazonaws.com/${local.image_repository_name}"
+  }
+}

infra/frontend/app-config/dev.tf

@@ -0,0 +1,30 @@
+module "dev_config" {
+  source                          = "./env-config"
+  project_name                    = local.project_name
+  app_name                        = local.app_name
+  default_region                  = module.project_config.default_region
+  environment                     = "dev"
+  network_name                    = "dev"
+  domain_name                     = "app.referral-pilot-dev.navateam.com"
+  enable_https                    = true
+  has_database                    = local.has_database
+  has_incident_management_service = local.has_incident_management_service
+  enable_notifications            = local.enable_notifications
+
+  # Enable and configure identity provider.
+  enable_identity_provider = local.enable_identity_provider
+
+  # Support local development against the dev instance.
+  extra_identity_provider_callback_urls = ["http://localhost"]
+  extra_identity_provider_logout_urls   = ["http://localhost"]
+
+  # Enables ECS Exec access for debugging or jump access.
+  # See https://docs.aws.amazon.com/AmazonECS/latest/developerguide/ecs-exec.html
+  # Defaults to `false`. Uncomment the next line to enable.
+  # enable_command_execution = true
+
+  # Uncomment to override default feature flag values
+  # feature_flag_overrides = {
+  #   BAR = true
+  # }
+}