BCIERS\Dashboard - split 'Registration' tile into "Administration" and "Registration" tiles

[suhafa]

Describe the task

Based off user engagement done in June 2024 (Miro: Usability Test Findings | June 2024), users indicated a preference for the following design:

We need to also rid the system of the acronym in the top header '(BCIERS)':

Development Steps

• [x] Rename Nx app registration to administration
• [x] Add folder administration-e2e
• [x] Create Nx app registration using terminal command to use the flags that are consistent with the rest of our setup.

  npx nx generate @nx/next:application registration --directory apps/registration --appDir --src=false --unitTestRunner=none --e2eTestRunner=playwright --projectNameAndRootFormat=as-provided

• [x] In bciers/apps/administration/next.config.js/const nextConfig update to

  // To deploy a Next.js application under a sub-path of a domain you can use the basePath config option
  basePath: "/administration"

• [x] In bciers/apps/registration/next.config.js/const nextConfig update to

  // To deploy a Next.js application under a sub-path of a domain you can use the basePath config option
  basePath: "/registration"

• [x] In bciers/apps/dashboard/next.config.js/./async rewrites() add

  
  const { HOST_ADMINISTRATION, HOST_REGISTRATION, HOST_REPORTING } = process.env;

const localRoutes = HOST_ADMINISTRATION && HOST_REGISTRATION && HOST_REPORTING ? [ { source: "/administration", destination: ${HOST_ADMINISTRATION}/administration, }, { source: "/administration/:path", destination: `${HOST_ADMINISTRATION}/administration/:path`, },

- [x] In `bciers/apps/administration/vitest.config.mts` replace `registration` with `administration`
- [x] In `bciers/apps/administration/project.json` replace `registration` with `administration`
- [x] In `bciers/apps/administration/tsconfig.json` replace `registration` with `administration`
- [x] In `bciers/apps/administration/app/layout.tsx` update code for defaultLinks
- [x] In `bciers/tsconfig.base.json\paths` object add ` "@/administration/*": ["apps/administration/*"],`
- [x] In `bciers/package.json\scripts` object add:

"admin": "nx dev administration -p 4001",
"admin:build": "nx build administration",
"admin:e2e": "nx run administration:e2e",
"admin:e2e:ui": "nx run administration:e2e:ui",
"admin:e2e:report": "nx run administration:report",
"admin:coverage": "nx run administration:test --coverage",
"admin:test": "nx run administration:test",

- [x] In `bciers/package.json/scripts/dev-all`  update to

"dev-all": "nx run-many -t dev -p dashboard,administration,registration,reporting,coam --maxParallel=5",

- [x] In `bciers/apps/registration/project.json` replace `registration` with `administration` and set port=4001 (reference: `bciers/apps/administration/project.json`)
- [x] In `bciers/.env.example/# MULTI ZONES` add

HOST_ADMINISTRATION="http://localhost:4001"

- [x] In `bciers/.env/# MULTI ZONES` add

HOST_ADMINISTRATION="http://localhost:4001"

- [x] Implement middleware routing similar to `bciers/apps/reporting/src/middleware.ts`
- [x] create file `bciers/apps/registration/tailwind.config.js` similar to file `bciers/apps/administration/tailwind.config.js` 
- [x] create file `bciers/apps/registration/postcss.config.js` similar to file `bciers/apps/administration/postcss.config.js` 
- [x] create file `bciers/apps/registration/vitest.config.mts` (reference: `bciers/apps/administration/vitest.config.mts`)
- [x] In `bciers/apps/registration/app/layout.tsx` update code to:

/ A layout is UI that is shared between routes. The app directory must include a root app/layout.js. /

import "@bciers/styles/globals.css"; import { RootLayout } from "@bciers/components/server"; const defaultLinks = [ { label: "Dashboard", href: "/" }, { label: "Registration", href: "/registration" }, ]; export default function RegistrationLayout({ children, }: { children: React.ReactNode; }) { return {children}; }

- [x] In  `bciers/apps/registration/app` create `/page.tsx` 
- [x] In  `bciers/apps/registration/app/page.tsx` update code to:

import Tiles from "@bciers/components/navigation/Tiles"; import { fetchDashboardData } from "@bciers/actions/server"; import { ContentItem } from "@bciers/types";

export default async function Page() { // 🚀 API fetch dashboard tiles // 🚩 Source: bc_obps/common/fixtures/dashboard/administration/[IdProviderType]/role? const data = (await fetchDashboardData( "common/dashboard-data?dashboard=registration", )) as ContentItem[];

return ( <> // Display role based tiles here

</>

); }

- [x] create new icon `bciers/libs/components/src/icons/Entrance.tsx` from Figma design using `copy as SVG`
![image](https://github.com/bcgov/cas-obps/assets/120038448/94e24d06-6dfb-4200-ad6f-33208ac824d9)

- [x] update bciers dashboard fixtures `bc_obps/common/fixtures/dashboard/bciers` for `administration` & `registration`
- [x] create fixtures for administration dashboard `bc_obps/common/fixtures/dashboard/administration`
- [x] create fixtures for registration dashboard `bc_obps/common/fixtures/dashboard/registration`
- [x] add administration to `bc_obps/common/api/v1/dashboard_data/tiles.py`
- [x] run terminal command `make migrations` 
- [x] run terminal command `make reset_db` 
- [x] create file `build-administration.yaml`
- [x] in file .github/workflows/main.yaml add step build-administration: similar to build-dashboard:
- [x] create helm templates in folder `helm/cas-bciers/templates/administration`
- [x] update `.sonarcloud.properties` fir middleware test ignore
- [x] update `bciers/apps/administration/.eslintrc.json` and `bciers/apps/administration-e2e/.eslintrc.json` with 

"parserOptions": { "project": ["apps/administration/tsconfig(.*)?.json"], "tsConfigRootDir": "./" },

(test using nx run administration:lint)

#### Acceptance Criteria:

Given I'm an Given I'm an Operator Admin
When I log into BCIERS
Then I see the BCIERS dashboard with all 5 tiles as in the [design] (https://www.figma.com/design/LsDmLDCdnJqI8UahyqvOD8/BCIERS-Designs?node-id=11589-2176&t=4vjNzzbOHnG80cq6-1):

**Definition of Ready** (Note: If any of these points are not applicable, mark N/A)

- [ ] User story is included
- [ ] User role and type are identified
- [ ] Acceptance criteria are included
- [ ] Wireframes are included (if required)
- [ ] Design / Solution is accepted by Product Owner
- [ ] Dependencies are identified (technical, business, regulatory/policy)
- [ ] Story has been estimated (under 13 pts)

·**Definition of Done** (Note: If any of these points are not applicable, mark N/A)

- [ ] Acceptance criteria are tested by the CI pipeline
- [ ] UI meets accessibility requirements
- [ ] Configuration changes are documented, documentation and designs are updated
- [ ] Passes code peer-review
- [ ] Passes QA of Acceptance Criteria with verification in Dev and Test
- [ ] Ticket is ready to be merged to main branch
- [ ] Can be demoed in Sprint Review
- [ ] Bugs or future work cards are identified and created
- [ ] Reviewed and approved by Product Owner

#### Notes:

#### Dependencies

[suhafa]

Looks good! Nothing to note here as of now

[shon-button]

@patriciarussellCAS

Reachable at: https://cas-bciers-frontend-dev.apps.silver.devops.gov.bc.ca/dashboard

[patriciarussellCAS]

Reviewed in test - will create a follow-up design ticket for updates to the content in each tile. Otherwise this is good to close!