fix: build (nrwl#754)

apps/vscode/src/app/tree-view/current-workspace-tree-provider.ts

@@ -1,12 +1,12 @@
 import { WorkspaceDefinition } from '@angular-console/schema';
+import { join } from 'path';
+import { TreeItem } from 'vscode';
 
 import {
   WorkspaceRoute,
   WorkspaceRouteTitle
 } from '../tree-item/workspace-route';
 import { AbstractTreeProvider } from './abstract-tree-provider';
-import { TreeItem } from 'vscode';
-import { join } from 'path';
 
 const SCANNING_FOR_WORKSPACE = new TreeItem(
   'Scanning for your Angular Workspace...'
@@ -87,7 +87,7 @@ export class CurrentWorkspaceTreeProvider extends AbstractTreeProvider<
       }
     }
 
-    return Promise.resolve([
+    return [
       ...[
         'Projects',
         'Generate',
@@ -105,6 +105,6 @@ export class CurrentWorkspaceTreeProvider extends AbstractTreeProvider<
           )
       ),
       SELECT_A_DIFFERENT_WORKSPACE
-    ]);
+    ];
   }
 }

apps/vscode/src/app/webview.factory.ts

@@ -14,27 +14,33 @@ import {
 
 let webviewPanel: WebviewPanel | undefined;
 
+function getWebviewTitle(
+  workspaceDef: WorkspaceDefinition | undefined,
+  workspaceRouteTitle: WorkspaceRouteTitle | undefined
+) {
+  let panelTitle = workspaceRouteTitle || 'Angular Console';
+  if (workspaceDef && workspaceDef.name) {
+    panelTitle = `${workspaceDef.name} | ${workspaceRouteTitle}`;
+  }
+  return panelTitle;
+}
+
 export function createWebViewPanel(
   context: ExtensionContext,
   viewColumn: ViewColumn,
   serverUrl: string,
   routePath: string,
   workspaceDef: WorkspaceDefinition | undefined,
-  route: WorkspaceRouteTitle | undefined
+  workspaceRouteTitle: WorkspaceRouteTitle | undefined
 ) {
-  let panelTitle = route || 'Angular Console';
-  if (workspaceDef && workspaceDef.name) {
-    panelTitle = `${workspaceDef.name} | ${route}`;
-  }
-
   if (webviewPanel) {
-    webviewPanel.title = panelTitle;
+    webviewPanel.title = getWebviewTitle(workspaceDef, workspaceRouteTitle);
     webviewPanel.webview.postMessage({ routePath });
     webviewPanel.reveal();
   } else {
     webviewPanel = window.createWebviewPanel(
       'angular-console', // Identifies the type of the webview. Used internally
-      panelTitle, // Title of the panel displayed to the user
+      getWebviewTitle(workspaceDef, workspaceRouteTitle), // Title of the panel displayed to the user
       viewColumn, // Editor column to show the new webview panel in.
       {
         retainContextWhenHidden: true,
@@ -51,7 +57,7 @@ export function createWebViewPanel(
 
   webviewPanel.iconPath = WorkspaceRoute.getIconUriForRoute(
     context.extensionPath,
-    route
+    workspaceRouteTitle
   );
 
   return webviewPanel;
@@ -96,6 +102,12 @@ export function getIframeHtml(serverUrl: string, routePath: string) {
             window.ANGULAR_CONSOLE_NAVIGATE_BY_URL(routePath);
           }
         });
+        window.SET_PANEL_TITLE = (workspaceRouteTitle) => {
+          console.log(workspaceRouteTitle);
+          vscode.postMessage({
+            workspaceRouteTitle
+          });
+        };
       </script>
     </head>
 

apps/vscode/src/main.ts

@@ -1,11 +1,14 @@
 import { WorkspaceDefinition } from '@angular-console/schema';
+import { stream } from 'fast-glob';
+import { existsSync } from 'fs';
 import { Server } from 'http';
-import { join, parse, dirname } from 'path';
+import { dirname, join, parse } from 'path';
 import {
   commands,
   ExtensionContext,
   TreeView,
   ViewColumn,
+  WebviewPanel,
   window,
   workspace
 } from 'vscode';
@@ -22,11 +25,11 @@ import {
   LOCATE_YOUR_WORKSPACE
 } from './app/tree-view/current-workspace-tree-provider';
 import { createWebViewPanel } from './app/webview.factory';
-import { stream } from 'fast-glob';
-import { existsSync } from 'fs';
+
 let server: Promise<Server>;
 let currentWorkspace: TreeView<Workspace | WorkspaceRoute>;
 let treeDataProvider: CurrentWorkspaceTreeProvider;
+let webViewPanel: WebviewPanel | undefined;
 
 export function activate(context: ExtensionContext) {
   treeDataProvider = CurrentWorkspaceTreeProvider.create({
@@ -112,6 +115,9 @@ export function activate(context: ExtensionContext) {
 }
 
 function setAngularWorkspace(context: ExtensionContext, workspacePath: string) {
+  if (webViewPanel) {
+    webViewPanel.dispose();
+  }
   treeDataProvider.setWorkspacePath(workspacePath);
   import('./app/start-server').then(({ startServer }) => {
     server = startServer(context, workspacePath);
@@ -144,7 +150,7 @@ async function main(config: {
     throw new Error(`Server address format is unsupported: ${address}`);
   }
 
-  const webViewPanel = createWebViewPanel(
+  webViewPanel = createWebViewPanel(
     context,
     viewColumn,
     `http://localhost:${address!.port}/`,
@@ -154,6 +160,10 @@ async function main(config: {
   );
   context.subscriptions.push(webViewPanel);
 
+  webViewPanel.onDidDispose(() => {
+    webViewPanel = undefined;
+  });
+
   webViewPanel.onDidChangeViewState(e => {
     if (e.webviewPanel.visible) {
       revealWorkspaceRoute(currentWorkspace);

libs/feature-generate/src/lib/schematic/schematic.component.html

@@ -18,11 +18,6 @@
   </ui-command-output>
 </ui-task-runner>
 <ng-template #emptyMessage>
-  <ui-entity-docs
-    *ngIf="(docs$ | async) as docks; else noDocs"
-    [docs]="docs$ | async"
-    style="margin-left: 15px"
-  ></ui-entity-docs>
   <ng-template #noDocs>
     Click the Generate button to start this task.
   </ng-template>

libs/feature-generate/src/lib/schematic/schematic.component.ts

@@ -1,15 +1,14 @@
 import { Schematic } from '@angular-console/schema';
 import {
+  CommandOutputComponent,
   FlagsComponent,
-  TaskRunnerComponent,
-  CommandOutputComponent
+  TaskRunnerComponent
 } from '@angular-console/ui';
 import {
-  IncrementalCommandOutput,
   CommandRunner,
-  Serializer,
   CommandStatus,
-  Settings
+  IncrementalCommandOutput,
+  Serializer
 } from '@angular-console/utils';
 import {
   ChangeDetectionStrategy,
@@ -31,11 +30,11 @@ import {
   tap,
   withLatestFrom
 } from 'rxjs/operators';
+
 import {
   GenerateGQL,
   GenerateUsingNmpGQL,
-  SchematicCollectionsByNameGQL,
-  SchematicDocsGQL
+  SchematicCollectionsByNameGQL
 } from '../generated/graphql';
 
 const DEBOUNCE_TIME = 300;
@@ -69,8 +68,6 @@ export class SchematicComponent implements OnInit {
   taskRunner: TaskRunnerComponent;
   @ViewChild(FlagsComponent, { static: false }) flags: FlagsComponent;
 
-  docs$: Observable<any[]>;
-
   hasNeverBeenValid = true;
 
   private readonly ngGen$ = new Subject<void>();
@@ -84,8 +81,6 @@ export class SchematicComponent implements OnInit {
     private readonly contextActionService: ContextualActionBarService,
     private readonly generateGQL: GenerateGQL,
     private readonly generateUsingNpmGQL: GenerateUsingNmpGQL,
-    private readonly schematicDocsGQL: SchematicDocsGQL,
-    private readonly settings: Settings,
     private readonly schematicCollectionsByNameGQL: SchematicCollectionsByNameGQL
   ) {}
 
@@ -238,31 +233,6 @@ export class SchematicComponent implements OnInit {
         );
       })
     );
-
-    if (this.settings.showDocs) {
-      this.docs$ = schematicDescription$.pipe(
-        switchMap((d: any) => {
-          if (d === null) {
-            return of(null);
-          } else {
-            return this.schematicDocsGQL.fetch({
-              path: d.path,
-              collectionName: d.collection,
-              name: d.schematic
-            });
-          }
-        }),
-        map(r => {
-          if (!r) {
-            return [];
-          } else {
-            return r.data.workspace.docs.schematicDocs;
-          }
-        })
-      );
-    } else {
-      this.docs$ = of([]);
-    }
   }
 
   private runCommand(

libs/feature-run/src/lib/target/target.component.html

@@ -20,10 +20,5 @@
   </ui-command-output>
 </ui-task-runner>
 <ng-template #emptyMessage>
-  <ui-entity-docs
-    *ngIf="(docs$ | async) as docks; else noDocs"
-    [docs]="docs$ | async"
-    style="margin-left: 15px"
-  ></ui-entity-docs>
   <ng-template #noDocs> Click the Run button to start this task. </ng-template>
 </ng-template>

libs/feature-run/src/lib/target/target.component.ts

@@ -1,11 +1,31 @@
 import { Architect, Project } from '@angular-console/schema';
-import { CommandOutputComponent, FlagsComponent, TaskRunnerComponent } from '@angular-console/ui';
-import { CommandRunner, IncrementalCommandOutput, Serializer } from '@angular-console/utils';
-import { ChangeDetectionStrategy, Component, OnInit, ViewChild } from '@angular/core';
+import {
+  CommandOutputComponent,
+  FlagsComponent,
+  TaskRunnerComponent
+} from '@angular-console/ui';
+import {
+  CommandRunner,
+  IncrementalCommandOutput,
+  Serializer
+} from '@angular-console/utils';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  OnInit,
+  ViewChild
+} from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { ContextualActionBarService } from '@nrwl/angular-console-enterprise-frontend';
 import { BehaviorSubject, Observable, of, Subject } from 'rxjs';
-import { map, publishReplay, refCount, switchMap, tap, withLatestFrom } from 'rxjs/operators';
+import {
+  map,
+  publishReplay,
+  refCount,
+  switchMap,
+  tap,
+  withLatestFrom
+} from 'rxjs/operators';
 
 import { ProjectsGQL, RunNgGQL } from '../generated/graphql';
 
@@ -29,8 +49,6 @@ export class TargetComponent implements OnInit {
   taskRunner: TaskRunnerComponent;
   @ViewChild(FlagsComponent, { static: false }) flags: FlagsComponent;
 
-  docs$: Observable<any[]> = of();
-
   private readonly ngRun$ = new Subject<any>();
   private readonly ngRunDisabled$ = new BehaviorSubject(true);
 
@@ -158,6 +176,10 @@ export class TargetComponent implements OnInit {
   }
 
   initSourceMapAndStatsJson(architect: Architect) {
+    if (architect.name !== 'build') {
+      return;
+    }
+
     const defaultValues = architect.configurations[0]
       ? architect.configurations[0].defaultValues
       : [];

libs/feature-settings/src/lib/settings/settings.component.html

@@ -23,6 +23,21 @@ <h4 mat-line>Disable Animations</h4>
         [checked]="settings.useDisableAnimations()"
       ></mat-slide-toggle>
     </div>
+    <div
+      fxLayout="row wrap"
+      *ngIf="!isElectron"
+      fxFill
+      fxLayoutAlign="start center"
+    >
+      <div fxFlex>
+        <h4 mat-line>Show Routes Sidenav</h4>
+        <p mat-line>Pin navigation buttons to the left hand side of console</p>
+      </div>
+      <mat-slide-toggle
+        (change)="settings.setShowRoutesSideNav($event.checked)"
+        [checked]="settings.showRoutesSideNav()"
+      ></mat-slide-toggle>
+    </div>
     <div fxLayout="row wrap" fxFill fxLayoutAlign="start center">
       <div fxFlex>
         <h4 mat-line>Use detailed status</h4>

libs/feature-settings/src/lib/settings/settings.component.ts

@@ -1,3 +1,4 @@
+import { IS_ELECTRON } from '@angular-console/environment';
 import { Settings, Telemetry } from '@angular-console/utils';
 import { Component, Inject, OnDestroy } from '@angular/core';
 import { NavigationEnd, Router } from '@angular/router';
@@ -15,6 +16,7 @@ export class SettingsComponent implements OnDestroy {
 
   constructor(
     readonly settings: Settings,
+    @Inject(IS_ELECTRON) readonly isElectron: boolean,
     @Inject('telemetry') private readonly telemetry: Telemetry,
     private readonly contextualActionBarService: ContextualActionBarService,
     router: Router

libs/feature-workspaces/src/lib/projects/projects.component.ts

@@ -22,7 +22,7 @@ import {
 import { FormControl } from '@angular/forms';
 import { ActivatedRoute, NavigationStart, Router } from '@angular/router';
 import { ContextualActionBarService } from '@nrwl/angular-console-enterprise-frontend';
-import { combineLatest, Observable, of, ReplaySubject } from 'rxjs';
+import { combineLatest, Observable, ReplaySubject } from 'rxjs';
 import {
   catchError,
   filter,
@@ -35,7 +35,6 @@ import {
 
 import {
   Workspace,
-  WorkspaceDocsGQL,
   WorkspaceGQL,
   WorkspaceSchematics,
   WorkspaceSchematicsGQL
@@ -94,12 +93,6 @@ export class ProjectsComponent implements OnInit, OnDestroy {
 
   workspacePath: string;
   pinnedProjectNames: string[];
-  docs$ = this.settings.showDocs
-    ? this.route.params.pipe(
-        switchMap(p => this.workspaceDocsGQL.fetch({ path: p.path })),
-        map(p => p.data.workspace.docs.workspaceDocs)
-      )
-    : of([]);
 
   readonly projectFilterFormControl = new FormControl('');
   readonly schematicFilterFormControl = new FormControl('');
@@ -202,7 +195,6 @@ export class ProjectsComponent implements OnInit, OnDestroy {
     readonly settings: Settings,
     private readonly route: ActivatedRoute,
     private readonly workspaceGQL: WorkspaceGQL,
-    private readonly workspaceDocsGQL: WorkspaceDocsGQL,
     private readonly commandRunner: CommandRunner,
     private readonly workspaceSchematicsGQL: WorkspaceSchematicsGQL,
     @Inject(IS_ELECTRON) private readonly isElectron: boolean