;
+
+ beforeEach(waitForAsync(() => {
+ TestBed.configureTestingModule({
+ declarations: [TestRecoveredBannerComponent],
+ imports: [IonicModule],
+ });
+
+ fixture = TestBed.createComponent(TestRecoveredBannerComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ }));
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/components/common/test-recovered-banner/test-recovered-banner.html b/src/components/common/test-recovered-banner/test-recovered-banner.html
new file mode 100644
index 000000000..151834d86
--- /dev/null
+++ b/src/components/common/test-recovered-banner/test-recovered-banner.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
+ This test has been successfully recorded.
+
No further action is required.
+
+
+
+
+
+
diff --git a/src/components/common/test-recovered-banner/test-recovered-banner.scss b/src/components/common/test-recovered-banner/test-recovered-banner.scss
new file mode 100644
index 000000000..8b5facce5
--- /dev/null
+++ b/src/components/common/test-recovered-banner/test-recovered-banner.scss
@@ -0,0 +1,29 @@
+:host {
+ .alert-icon {
+ color: var(--mes-white);
+ font-size: 50px;
+ }
+
+ div {
+ background: var(--gds-dark-green);
+ border-left: 10px solid var(--gds-black);
+ }
+
+ .center-icon {
+ text-align: center;
+ }
+
+ .modal-alert-header {
+ margin: 0 0 24px;
+ }
+
+ .recovered-centre {
+ display: flex;
+ align-items: center;
+ }
+
+ .recovered-text {
+ color: var(--mes-white);
+ }
+}
+
diff --git a/src/components/common/test-recovered-banner/test-recovered-banner.ts b/src/components/common/test-recovered-banner/test-recovered-banner.ts
new file mode 100644
index 000000000..ed09baba4
--- /dev/null
+++ b/src/components/common/test-recovered-banner/test-recovered-banner.ts
@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+ selector: 'test-recovered-banner',
+ templateUrl: 'test-recovered-banner.html',
+ styleUrls: ['test-recovered-banner.scss'],
+})
+export class TestRecoveredBannerComponent {
+}
diff --git a/src/components/test-slot/autosave-status/__tests__/autosave-status.spec.ts b/src/components/test-slot/autosave-status/__tests__/autosave-status.spec.ts
new file mode 100644
index 000000000..e178afcd2
--- /dev/null
+++ b/src/components/test-slot/autosave-status/__tests__/autosave-status.spec.ts
@@ -0,0 +1,23 @@
+import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+import { AutosaveStatusComponent } from '@components/test-slot/autosave-status/autosave-status';
+
+describe('AutosaveStatusComponent', () => {
+ let component: AutosaveStatusComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(waitForAsync(() => {
+ TestBed.configureTestingModule({
+ declarations: [AutosaveStatusComponent],
+ imports: [IonicModule],
+ });
+
+ fixture = TestBed.createComponent(AutosaveStatusComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ }));
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/components/test-slot/autosave-status/autosave-status.html b/src/components/test-slot/autosave-status/autosave-status.html
new file mode 100644
index 000000000..781d48fd8
--- /dev/null
+++ b/src/components/test-slot/autosave-status/autosave-status.html
@@ -0,0 +1,3 @@
+
+
+
diff --git a/src/components/test-slot/autosave-status/autosave-status.scss b/src/components/test-slot/autosave-status/autosave-status.scss
new file mode 100644
index 000000000..3d371fb82
--- /dev/null
+++ b/src/components/test-slot/autosave-status/autosave-status.scss
@@ -0,0 +1,8 @@
+.recovered-text {
+ font-size: 15px !important;
+ background: var(--gds-dark-green);
+ color: var(--mes-white) !important;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
diff --git a/src/components/test-slot/autosave-status/autosave-status.ts b/src/components/test-slot/autosave-status/autosave-status.ts
new file mode 100644
index 000000000..8a700e4d7
--- /dev/null
+++ b/src/components/test-slot/autosave-status/autosave-status.ts
@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+ selector: 'autosave-status',
+ templateUrl: 'autosave-status.html',
+ styleUrls: ['autosave-status.scss'],
+})
+export class AutosaveStatusComponent {
+}
diff --git a/src/components/test-slot/candidate-link/candidate-link.html b/src/components/test-slot/candidate-link/candidate-link.html
index 0542752aa..916b657a6 100644
--- a/src/components/test-slot/candidate-link/candidate-link.html
+++ b/src/components/test-slot/candidate-link/candidate-link.html
@@ -12,6 +12,7 @@
'candidate-name-portrait': isPortrait,
'candidate-name-landscape': !isPortrait,
'team-journal': isTeamJournal,
+ 'recovered': isRecovered,
'extra-large-mode': accessibilityService.getTextZoomClass() === 'text-zoom-x-large'
}"
>{{name.title}} {{name.firstName}} {{name.lastName}} {
});
});
+ describe('isAutosavedTest', () => {
+ it('should return true when remoteAutosaved is true and testStatus is not Autosaved', () => {
+ const result = component.isAutosavedTest(true, TestStatus.Completed);
+ expect(result).toEqual(true);
+ });
+
+ it('should return false when remoteAutosaved is true and testStatus is Autosaved', () => {
+ const result = component.isAutosavedTest(true, TestStatus.Autosaved);
+ expect(result).toEqual(false);
+ });
+
+ it('should return false when remoteAutosaved is false regardless of testStatus', () => {
+ const resultWithAutosavedStatus = component.isAutosavedTest(false, TestStatus.Autosaved);
+ const resultWithCompletedStatus = component.isAutosavedTest(false, TestStatus.Completed);
+
+ expect(resultWithAutosavedStatus).toEqual(false);
+ expect(resultWithCompletedStatus).toEqual(false);
+ });
+ });
+
describe('DOM', () => {
describe('Component Interaction', () => {
it('should pass the special needs status to a indicator component', () => {
diff --git a/src/components/test-slot/test-slot/test-slot.html b/src/components/test-slot/test-slot/test-slot.html
index afc5a1401..3f09d0823 100644
--- a/src/components/test-slot/test-slot/test-slot.html
+++ b/src/components/test-slot/test-slot/test-slot.html
@@ -29,6 +29,11 @@
class="full-width"
>
+
+
@@ -157,6 +162,7 @@
[isTeamJournal]="isTeamJournal"
[name]="slot.booking.candidate.candidateName"
[slotChanged]="hasSlotChanged"
+ [isRecovered]="isAutosavedTest(derivedAutosaveStatus, componentState.testStatus$ | async)"
[slot]="slot"
[slots]="slots"
>
diff --git a/src/components/test-slot/test-slot/test-slot.ts b/src/components/test-slot/test-slot/test-slot.ts
index f7ab96870..9f2f576f7 100644
--- a/src/components/test-slot/test-slot/test-slot.ts
+++ b/src/components/test-slot/test-slot/test-slot.ts
@@ -70,6 +70,9 @@ export class TestSlotComponent implements SlotComponent, OnInit {
@Input()
derivedTestStatus: TestStatus | null = null;
+ @Input()
+ derivedAutosaveStatus: boolean | null = null;
+
@Input()
derivedActivityCode: ActivityCode | null = null;
@@ -205,6 +208,16 @@ export class TestSlotComponent implements SlotComponent, OnInit {
isCompletedTest = (testStatus: TestStatus): boolean => testStatus === TestStatus.Completed;
+ /**
+ * Determines if the test held locally in an autosaved state
+ * and exists remotely as autosaved
+ * @param autosaved
+ * @param testStatus
+ */
+ isAutosavedTest = (remoteAutosaved: boolean, testStatus: TestStatus): boolean => {
+ return remoteAutosaved && testStatus !== TestStatus.Autosaved;
+ }
+
showOutcome(status: TestStatus): boolean {
return [TestStatus.Completed, TestStatus.Submitted].includes(status);
}
diff --git a/src/index.html b/src/index.html
index 66dca0a36..c259ac11d 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,37 +1,37 @@
-
-
- DVSA DES
+
+
+ DVSA DES
-
+
-
-
-
-
+
+
+
+
-
+
-
+ gtag('js', new Date());
+
-
-
-
-
+
+
+
+
-
-
-
+
+
+
diff --git a/src/store/journal/__tests__/journal.selector.spec.ts b/src/store/journal/__tests__/journal.selector.spec.ts
index 9fd3a7b6c..a447c20ea 100644
--- a/src/store/journal/__tests__/journal.selector.spec.ts
+++ b/src/store/journal/__tests__/journal.selector.spec.ts
@@ -412,6 +412,7 @@ describe('JournalSelector', () => {
applicationReference: 1234561014,
category: 'B',
activityCode: '1',
+ autosave: 1,
},
],
};
@@ -444,6 +445,7 @@ describe('JournalSelector', () => {
applicationReference: 1234567031,
category: 'category',
activityCode: '2',
+ autosave: 1,
},
{
costCode: 'costCode',
@@ -453,6 +455,7 @@ describe('JournalSelector', () => {
applicationReference: 1234569019,
category: 'category',
activityCode: '11',
+ autosave: 1,
},
],
};