Add CSV help dialog

application/frontend/src/app/core/containers/csv-help-dialog/csv-help-dialog.component.html

@@ -0,0 +1,6 @@
+<h3 class="strong">What data can I upload via CSV?</h3>
+<p>
+  If you have data for vehicles, shipments, or vehicle operators in individual .csv files, you can
+  use this option to upload your data. You can also use this option get sample files to see how your
+  data should be structured.
+</p>

application/frontend/src/app/core/containers/csv-help-dialog/csv-help-dialog.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CsvHelpDialogComponent } from './csv-help-dialog.component';
+
+describe('CsvHelpDialogComponent', () => {
+  let component: CsvHelpDialogComponent;
+  let fixture: ComponentFixture<CsvHelpDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [CsvHelpDialogComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(CsvHelpDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

application/frontend/src/app/core/containers/csv-help-dialog/csv-help-dialog.component.ts

@@ -0,0 +1,9 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'app-csv-help-dialog',
+  templateUrl: './csv-help-dialog.component.html',
+  styleUrls: ['./csv-help-dialog.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class CsvHelpDialogComponent {}

application/frontend/src/app/core/containers/upload-dialog/upload-dialog.component.html

@@ -116,9 +116,7 @@ <h4 class="strong d-flex mb-2">
     </div>
     <h4 class="strong d-flex mt-4 mb-2">
       Load shipment, vehicle, and operator data individually
-      <a
-        (click)="openScenarioSolutionHelp()"
-        class="ml-1 scenario-solution-help-icon blue-svg-icon">
+      <a (click)="openCsvHelp()" class="ml-1 scenario-solution-help-icon blue-svg-icon">
         <mat-icon svgIcon="help-filled"></mat-icon>
       </a>
     </h4>

application/frontend/src/app/core/containers/upload-dialog/upload-dialog.component.ts

@@ -28,6 +28,7 @@ import { DispatcherService, FileService, PlacesService, UploadService } from '..
 import { toDispatcherLatLng } from 'src/app/util';
 import { ScenarioSolutionHelpDialogComponent } from 'src/app/core/containers/scenario-solution-help-dialog/scenario-solution-help-dialog.component';
 import { UploadActions } from '../../actions';
+import { CsvHelpDialogComponent } from '../csv-help-dialog/csv-help-dialog.component';
 
 @Component({
   selector: 'app-upload-dialog',
@@ -84,6 +85,12 @@ export class UploadDialogComponent {
     });
   }
 
+  openCsvHelp(): void {
+    this.dialog.open(CsvHelpDialogComponent, {
+      maxWidth: '600px',
+    });
+  }
+
   loadFromCsv(): void {
     this.dialogRef.close();
     this.store.dispatch(UploadActions.openCsvDialog());

application/frontend/src/app/core/core.module.ts

@@ -89,6 +89,7 @@ import { ConfirmBulkEditDialogComponent } from './components/confirm-bulk-edit-d
 import { VehicleOperatorsControlBarComponent } from './containers/vehicle-operators-control-bar/vehicle-operators-control-bar.component';
 import { BaseEditVehicleOperatorDialogComponent } from './components/base-edit-vehicle-operator-dialog/base-edit-vehicle-operator-dialog.component';
 import { PreSolveEditVehicleOperatorDialogComponent } from './containers/pre-solve-edit-vehicle-operator-dialog/pre-solve-edit-vehicle-operator-dialog.component';
+import { CsvHelpDialogComponent } from './containers/csv-help-dialog/csv-help-dialog.component';
 
 export const COMPONENTS = [
   BaseDocumentationDialogComponent,
@@ -180,6 +181,7 @@ export const CONTAINERS = [
     VehicleOperatorsControlBarComponent,
     PreSolveEditVehicleOperatorDialogComponent,
     BaseEditVehicleOperatorDialogComponent,
+    CsvHelpDialogComponent,
   ],
   exports: [COMPONENTS, CONTAINERS, CsvUploadDialogComponent],
 })