Added new Angular component: `workspaces/components/capability-request`

apps/web/src/app/app.module.ts

-import {BrowserModule} from '@angular/platform-browser';
-import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {ReactiveFormsModule} from "@angular/forms";
-import {NgModule} from '@angular/core';
-import {HttpClientModule} from "@angular/common/http";
+import { BrowserModule } from "@angular/platform-browser";
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
+import { ReactiveFormsModule } from "@angular/forms";
+import { NgModule } from "@angular/core";
+import { HttpClientModule } from "@angular/common/http";
 
-import {AppComponent} from './app.component';
-import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
-import {WebAnalyticsService} from "./web-analytics/web-analytics.service";
+import { AppComponent } from "./app.component";
+import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
+import { WebAnalyticsService } from "./web-analytics/web-analytics.service";
 
-import {HeaderComponent} from './header/header.component';
-import {FooterComponent} from './footer/footer.component';
+import { HeaderComponent } from "./header/header.component";
+import { FooterComponent } from "./footer/footer.component";
 
-import {AppRoutingModule} from './app-routing.module';
-import {SplashComponent} from './splash/splash.component';
-import {SharedModule} from "./shared/shared.module";
+import { AppRoutingModule } from "./app-routing.module";
+import { SplashComponent } from "./splash/splash.component";
+import { SharedModule } from "./shared/shared.module";
+import { CapabilityRequestComponent } from "./workspaces/components/capability-request/capability-request.component";
 
 @NgModule({
   declarations: [
     AppComponent,
     HeaderComponent,
     FooterComponent,
-    SplashComponent
+    SplashComponent,
+    CapabilityRequestComponent,
   ],
   entryComponents: [],
   imports: [
@@ -30,11 +32,9 @@ import {SharedModule} from "./shared/shared.module";
     NgbModule,
     AppRoutingModule,
     HttpClientModule,
-    SharedModule
+    SharedModule,
   ],
   providers: [WebAnalyticsService],
-  bootstrap: [AppComponent]
+  bootstrap: [AppComponent],
 })
-export class AppModule {
-
-}
+export class AppModule {}

apps/web/src/app/workspaces/components/components.md

+# Components
+
+1. Header:
+  - Request id
+  - Status badge/button(?) (running, finished, etc.)
+  - Created on date-time
+  - Last updated on date-time
+2. Capability definition
+  - Name of capability
+  - Steps and their statuses
+  - Download button if complete; cancel button if running
+3. Parameters
+  - Lists the parameters
+4. Previous version list
+  - Display 3 previous versions
+  - Show more... button that loads 3 more
+4. Previous version
+  - Version number
+  - Status of version's run (running, finished, etc.)
+  - Parameters (reuse 3(?))
+  - Last updated on date (may not exist in DB right now)

apps/web/src/app/workspaces/workspaces-routing.module.ts

-import {NgModule} from '@angular/core';
-import {Routes, RouterModule} from '@angular/router';
-import {WorkspacesComponent} from './workspaces.component';
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { WorkspacesComponent } from './workspaces.component';
 
 const routes: Routes = [
-  {path: '', component: WorkspacesComponent},
-  {path: '**', redirectTo: 'Search', pathMatch: 'full'}
+  { path: '', component: WorkspacesComponent },
+  { path: '**', redirectTo: 'Search', pathMatch: 'full' },
 ];
 
 @NgModule({
   imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
+  exports: [RouterModule],
 })
-export class WorkspacesRoutingModule {
-}
+export class WorkspacesRoutingModule {}

apps/web/src/app/workspaces/workspaces.module.ts

-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { WorkspacesRoutingModule } from './workspaces-routing.module';
-import { WorkspacesComponent } from './workspaces.component';
-import {FormsModule, ReactiveFormsModule} from "@angular/forms";
-
+import { NgModule } from "@angular/core";
+import { CommonModule } from "@angular/common";
+import { WorkspacesRoutingModule } from "./workspaces-routing.module";
+import { WorkspacesComponent } from "./workspaces.component";
+import { FormsModule, ReactiveFormsModule } from "@angular/forms";
+import { CapabilityRequestComponent } from "./components/capability-request/capability-request.component";
 
 @NgModule({
-  declarations: [WorkspacesComponent],
-  imports: [
-    CommonModule,
-    WorkspacesRoutingModule,
-    ReactiveFormsModule,
-    FormsModule
-  ]
+  declarations: [WorkspacesComponent, CapabilityRequestComponent],
+  imports: [CommonModule, WorkspacesRoutingModule, ReactiveFormsModule, FormsModule],
 })
 export class WorkspacesModule {}