Feat/1586 dq workplace restructure

frontend/src/app/features/new-dashboard/workplace-tab/workplace-tab.component.html

@@ -2,6 +2,7 @@
   [tab]="'workplace'"
   [workplace]="workplace"
   [updatedDate]="workplace.updated"
+  [return]="summaryReturnUrl"
 ></app-new-dashboard-header>
 <div class="govuk-width-container govuk-!-padding-top-2">
   <app-alert></app-alert>

frontend/src/app/features/subsidiary/workplace/view-subsidiary-workplace.component.html

@@ -1,4 +1,10 @@
-<app-new-dashboard-header [workplace]="workplace" tab="workplace" [updatedDate]="workplace.updated">
+<app-new-dashboard-header
+  [workplace]="workplace"
+  tab="workplace"
+  [updatedDate]="workplace.updated"
+  [return]="summaryReturnUrl"
+  data-testid="dashboard-header"
+>
 </app-new-dashboard-header>
 
 <div class="govuk-width-container govuk-!-padding-top-2" *ngIf="workplace">

frontend/src/app/features/subsidiary/workplace/view-subsidiary-workplace.component.spec.ts

@@ -0,0 +1,86 @@
+import { HttpClient } from '@angular/common/http';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ActivatedRoute, Router, RouterModule } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { BreadcrumbService } from '@core/services/breadcrumb.service';
+import { PermissionsService } from '@core/services/permissions/permissions.service';
+import { UserService } from '@core/services/user.service';
+import { MockBreadcrumbService } from '@core/test-utils/MockBreadcrumbService';
+import { MockPermissionsService } from '@core/test-utils/MockPermissionsService';
+import { SharedModule } from '@shared/shared.module';
+import { render } from '@testing-library/angular';
+
+import { Establishment } from '../../../../mockdata/establishment';
+import { ViewSubsidiaryWorkplaceComponent } from './view-subsidiary-workplace.component';
+import { FeatureFlagsService } from '@shared/services/feature-flags.service';
+import { MockFeatureFlagsService } from '@core/test-utils/MockFeatureFlagService';
+import { NewDashboardHeaderComponent } from '@shared/components/new-dashboard-header/dashboard-header.component';
+import { AuthService } from '@core/services/auth.service';
+import { MockAuthService } from '@core/test-utils/MockAuthService';
+import { EstablishmentService } from '@core/services/establishment.service';
+import { AlertService } from '@core/services/alert.service';
+import { WindowRef } from '@core/services/window.ref';
+import { MockUserService } from '@core/test-utils/MockUserService';
+import { Roles } from '@core/model/roles.enum';
+
+describe('ViewSubsidiaryWorkplaceComponent', () => {
+  const setup = async (override: any = { isAdmin: true }) => {
+    const setupTools = await render(ViewSubsidiaryWorkplaceComponent, {
+      imports: [SharedModule, RouterModule, RouterTestingModule, HttpClientTestingModule],
+      providers: [
+        AlertService,
+        WindowRef,
+        {
+          provide: PermissionsService,
+          useFactory: MockPermissionsService.factory(['canViewEstablishment', 'canViewListOfWorkers']),
+          deps: [HttpClient, Router, UserService],
+        },
+        {
+          provide: UserService,
+          useFactory: MockUserService.factory(1, Roles.Admin),
+          deps: [HttpClient],
+        },
+
+        {
+          provide: BreadcrumbService,
+          useClass: MockBreadcrumbService,
+        },
+        {
+          provide: FeatureFlagsService,
+          useClass: MockFeatureFlagsService,
+        },
+        {
+          provide: AuthService,
+          useFactory: MockAuthService.factory(true, override.isAdmin),
+          deps: [HttpClient, Router, EstablishmentService, UserService, PermissionsService],
+        },
+        {
+          provide: ActivatedRoute,
+          useValue: {
+            snapshot: {
+              data: {
+                establishment: Establishment,
+              },
+            },
+          },
+        },
+      ],
+      declarations: [NewDashboardHeaderComponent],
+    });
+    const component = setupTools.fixture.componentInstance;
+
+    return { component, ...setupTools };
+  };
+
+  it('should render a View Subsidiary Workplace Component', async () => {
+    const { component } = await setup();
+
+    expect(component).toBeTruthy();
+  });
+
+  it('should show the dashboard header', async () => {
+    const { getByTestId } = await setup();
+
+    expect(getByTestId('dashboard-header')).toBeTruthy();
+  });
+});

frontend/src/app/shared/components/new-dashboard-header/dashboard-header.component.html

@@ -1,7 +1,10 @@
 <div class="asc-dashboard-header" [class.asc-dashboard-header__full-height]="tab === 'home'">
   <div>
     <div class="govuk-width-container">
-      <div class="govuk-grid-row govuk-!-padding-bottom-6 govuk__flex govuk__align-items-flex-end">
+      <div
+        class="govuk-grid-row govuk__flex govuk__align-items-flex-end"
+        [ngClass]="tab === 'workplace' ? 'govuk-!-padding-bottom-2' : 'govuk-!-padding-bottom-6'"
+      >
         <div
           [ngClass]="tab === 'home' ? 'govuk-grid-column-one-half' : 'govuk-grid-column-two-thirds'"
           data-testid="column-one"
@@ -27,7 +30,7 @@ <h1 data-testid="workplaceName" class="govuk-heading-l govuk-!-margin-bottom-0">
             </h1>
           </ng-container>
           <ng-template #otherTab>
-            <h1 class="govuk-heading-l govuk-!-margin-bottom-0">
+            <h1 data-testid="workplaceName" class="govuk-heading-l govuk-!-margin-bottom-0">
               <span class="govuk-caption-xl govuk-!-margin-bottom-0">{{ workplace?.name }}</span>
               {{ header }}
             </h1>
@@ -77,6 +80,18 @@ <h2 class="govuk-heading-s govuk-!-margin-bottom-0">Contact Skills for Care</h2>
               </div>
             </ng-container>
 
+            <ng-container *ngSwitchCase="'workplace'">
+              <div class="do-as-parent-link">
+                <span
+                  *ngIf="isParent"
+                  class="govuk-width-container govuk-body govuk-!-font-size-19 govuk-util__align-right"
+                  data-testid="do-as-parent"
+                >
+                  <a [routerLink]="['/workplace/about-parents']">What you can do as a parent</a>
+                </span>
+              </div>
+            </ng-container>
+
             <ng-container *ngSwitchCase="'staff-records'">
               <div *ngIf="canAddWorker" class="govuk-util__align-right">
                 <a
@@ -108,3 +123,11 @@ <h2 class="govuk-heading-s govuk-!-margin-bottom-0">Contact Skills for Care</h2>
     </div>
   </div>
 </div>
+<ng-container *ngIf="tab === 'workplace'">
+  <app-workplace-name-address
+    [workplace]="workplace"
+    [canEditEstablishment]="canEditEstablishment"
+    [return]="return"
+    data-testid="workplace-address"
+  ></app-workplace-name-address>
+</ng-container>

frontend/src/app/shared/components/new-dashboard-header/dashboard-header.component.scss

@@ -11,3 +11,7 @@
     height: 215px;
   }
 }
+
+.do-as-parent-link {
+  margin-bottom: -1px;
+}