From c384934189da4fd26e028c18a8131e5fe886b5fb Mon Sep 17 00:00:00 2001
From: Jason McCollum <jason.mccollum@woolpert.com>
Date: Wed, 31 Jan 2024 14:44:47 -0800
Subject: [PATCH] Create scenario-solution help dialog

---
 application/frontend/src/app/app.module.ts    |  2 ++
 ...enario-solution-help-dialog.component.html | 10 +++++++++
 ...enario-solution-help-dialog.component.scss |  0
 ...rio-solution-help-dialog.component.spec.ts | 22 +++++++++++++++++++
 ...scenario-solution-help-dialog.component.ts |  9 ++++++++
 application/frontend/src/styles/main.scss     |  4 ++++
 6 files changed, 47 insertions(+)
 create mode 100644 application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.html
 create mode 100644 application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.scss
 create mode 100644 application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.spec.ts
 create mode 100644 application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.ts

diff --git a/application/frontend/src/app/app.module.ts b/application/frontend/src/app/app.module.ts
index 6423e530..f0f78dd4 100644
--- a/application/frontend/src/app/app.module.ts
+++ b/application/frontend/src/app/app.module.ts
@@ -48,6 +48,7 @@ import {
 } from './core/effects';
 import { HttpClientModule } from '@angular/common/http';
 import { initApp } from './app-initializer';
+import { ScenarioSolutionHelpDialogComponent } from './core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component';
 
 @NgModule({
   imports: [
@@ -105,5 +106,6 @@ import { initApp } from './app-initializer';
     },
   ],
   bootstrap: [AppComponent],
+  declarations: [ScenarioSolutionHelpDialogComponent],
 })
 export class AppModule {}
diff --git a/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.html b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.html
new file mode 100644
index 00000000..6b8c560b
--- /dev/null
+++ b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.html
@@ -0,0 +1,10 @@
+<h3 class="strong">What's the difference between a scenario and a solution?</h3>
+<p>
+  A scenario is a vehicle routing problem (VRP) request that Fleet Routing can solve. It consists of
+  one or more vehicles and one or more shipments to be delivered.
+</p>
+
+<p>
+  A solution is what the Fleet Routing API produces in response to a request to solve a scenario.
+  Solutions are visible in FleetRouting App via the Gantt chart, on a map, or in the Metadata view.
+</p>
diff --git a/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.scss b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.spec.ts b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.spec.ts
new file mode 100644
index 00000000..d8e3ce12
--- /dev/null
+++ b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.spec.ts
@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ScenarioSolutionHelpDialogComponent } from './scenario-solution-help-dialog.component';
+
+describe('ScenarioSolutionHelpDialogComponent', () => {
+  let component: ScenarioSolutionHelpDialogComponent;
+  let fixture: ComponentFixture<ScenarioSolutionHelpDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ScenarioSolutionHelpDialogComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ScenarioSolutionHelpDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.ts b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.ts
new file mode 100644
index 00000000..0975a57b
--- /dev/null
+++ b/application/frontend/src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component.ts
@@ -0,0 +1,9 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'app-scenario-solution-help-dialog',
+  templateUrl: './scenario-solution-help-dialog.component.html',
+  styleUrls: ['./scenario-solution-help-dialog.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ScenarioSolutionHelpDialogComponent {}
diff --git a/application/frontend/src/styles/main.scss b/application/frontend/src/styles/main.scss
index 961ff799..531f6208 100644
--- a/application/frontend/src/styles/main.scss
+++ b/application/frontend/src/styles/main.scss
@@ -882,3 +882,7 @@ app-csv-upload-dialog
 app-bulk-edit-unset {
   color: #f44336;
 }
+
+.strong {
+  font-weight: 500 !important;
+}