fix: builders should show the values from angular.json

libs/feature-run/src/lib/graphql/projects.graphql

@@ -7,8 +7,18 @@ query Projects($path: String!, $project: String!, $target: String!) {
       architect(name: $target) {
         name
         builder
+        options {
+          defaultValues {
+            name
+            defaultValue
+          }
+        }
         configurations {
           name
+          defaultValues {
+            name
+            defaultValue
+          }
         }
         schema {
           name

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

@@ -4,6 +4,7 @@
 >
   <ui-flags
     [configurations]="project.architect[0].configurations"
+    [options]="project.architect[0].options"
     [prefix]="getPrefix(project.architect[0].name, project.name)"
     [fields]="project.architect[0].schema"
     [runSyntax]="runSyntax(project.architect[0].name)"

libs/feature-workspaces/src/lib/new-workspace/new-workspace.component.ts

@@ -121,7 +121,8 @@ export class NewWorkspaceComponent {
 
       if (value && value.schema) {
         const formGroup = schematicFieldsToFormGroup({
-          fields: value.schema as any
+          fields: value.schema as any,
+          selectedConfiguration: null
         });
 
         this.ngNewForm.addControl('collectionOptions', formGroup);

libs/schema/src/lib/generated/graphql-types.ts

@@ -175,13 +175,27 @@ export interface Architect {
 
   description: string;
 
+  options: Options;
+
   configurations: ArchitectConfigurations[];
 
   schema: Schema[];
 }
 
+export interface Options {
+  defaultValues: FieldValue[];
+}
+
+export interface FieldValue {
+  name: string;
+
+  defaultValue?: Maybe<string>;
+}
+
 export interface ArchitectConfigurations {
   name: string;
+
+  defaultValues: FieldValue[];
 }
 
 export interface RecentAction {
@@ -1158,6 +1172,8 @@ export namespace ArchitectResolvers {
 
     description?: DescriptionResolver<string, TypeParent, Context>;
 
+    options?: OptionsResolver<any, TypeParent, Context>;
+
     configurations?: ConfigurationsResolver<any[], TypeParent, Context>;
 
     schema?: SchemaResolver<any[], TypeParent, Context>;
@@ -1183,6 +1199,11 @@ export namespace ArchitectResolvers {
     Parent = any,
     Context = any
   > = Resolver<R, Parent, Context>;
+  export type OptionsResolver<R = any, Parent = any, Context = any> = Resolver<
+    R,
+    Parent,
+    Context
+  >;
   export type ConfigurationsResolver<
     R = any[],
     Parent = any,
@@ -1195,16 +1216,54 @@ export namespace ArchitectResolvers {
   >;
 }
 
+export namespace OptionsResolvers {
+  export interface Resolvers<Context = any, TypeParent = any> {
+    defaultValues?: DefaultValuesResolver<any[], TypeParent, Context>;
+  }
+
+  export type DefaultValuesResolver<
+    R = any[],
+    Parent = any,
+    Context = any
+  > = Resolver<R, Parent, Context>;
+}
+
+export namespace FieldValueResolvers {
+  export interface Resolvers<Context = any, TypeParent = any> {
+    name?: NameResolver<string, TypeParent, Context>;
+
+    defaultValue?: DefaultValueResolver<Maybe<string>, TypeParent, Context>;
+  }
+
+  export type NameResolver<R = string, Parent = any, Context = any> = Resolver<
+    R,
+    Parent,
+    Context
+  >;
+  export type DefaultValueResolver<
+    R = Maybe<string>,
+    Parent = any,
+    Context = any
+  > = Resolver<R, Parent, Context>;
+}
+
 export namespace ArchitectConfigurationsResolvers {
   export interface Resolvers<Context = any, TypeParent = any> {
     name?: NameResolver<string, TypeParent, Context>;
+
+    defaultValues?: DefaultValuesResolver<any[], TypeParent, Context>;
   }
 
   export type NameResolver<R = string, Parent = any, Context = any> = Resolver<
     R,
     Parent,
     Context
   >;
+  export type DefaultValuesResolver<
+    R = any[],
+    Parent = any,
+    Context = any
+  > = Resolver<R, Parent, Context>;
 }
 
 export namespace RecentActionResolvers {
@@ -1918,6 +1977,8 @@ export interface IResolvers<Context = any> {
   NpmScript?: NpmScriptResolvers.Resolvers<Context>;
   Project?: ProjectResolvers.Resolvers<Context>;
   Architect?: ArchitectResolvers.Resolvers<Context>;
+  Options?: OptionsResolvers.Resolvers<Context>;
+  FieldValue?: FieldValueResolvers.Resolvers<Context>;
   ArchitectConfigurations?: ArchitectConfigurationsResolvers.Resolvers<Context>;
   RecentAction?: RecentActionResolvers.Resolvers<Context>;
   Docs?: DocsResolvers.Resolvers<Context>;

libs/server/src/assets/schema.graphql

@@ -3,12 +3,18 @@ type Architect {
   project: String!
   builder: String!
   description: String!
+  options: Options!,
   configurations: [ArchitectConfigurations!]!
   schema: [Schema!]!
 }
 
+type Options {
+  defaultValues: [FieldValue!]!
+}
+
 type ArchitectConfigurations {
   name: String!
+  defaultValues: [FieldValue!]!
 }
 
 type CommandResponse {
@@ -207,6 +213,11 @@ type SchematicCollectionForNgNew {
   schema: [Schema!]!
 }
 
+type FieldValue {
+  name: String!
+  defaultValue: String
+}
+
 type Schema {
   name: String!
   type: String!

libs/server/src/lib/api/read-projects.ts

@@ -1,5 +1,9 @@
-import { normalizeSchema, readJsonFile } from '../utils/utils';
-import { Project, Architect } from '@angular-console/schema';
+import {
+  getPrimitiveValue,
+  normalizeSchema,
+  readJsonFile
+} from '../utils/utils';
+import { Architect, Project } from '@angular-console/schema';
 import * as path from 'path';
 import { Store } from '@nrwl/angular-console-enterprise-electron';
 import { readRecentActions } from './read-recent-actions';
@@ -32,11 +36,23 @@ function compareProjects(a: Project, b: Project) {
 function readArchitect(project: string, architect: any): Architect[] {
   if (!architect) return [];
   return Object.entries(architect).map(([key, value]: [string, any]) => {
+    const options = {
+      defaultValues: serializeDefaultsForConfig(value.options)
+    };
     const configurations = value.configurations
-      ? Object.keys(value.configurations).map(name => ({ name }))
+      ? Object.keys(value.configurations).map(name => ({
+          name,
+          defaultValues: readDefaultValues(
+            value.options,
+            value.configurations,
+            name
+          )
+        }))
       : [];
+
     return {
       schema: [],
+      options,
       configurations,
       name: key,
       project,
@@ -46,6 +62,18 @@ function readArchitect(project: string, architect: any): Architect[] {
   });
 }
 
+function readDefaultValues(options: any, configurations: any, name: string) {
+  return serializeDefaultsForConfig({ ...options, ...configurations[name] });
+}
+
+function serializeDefaultsForConfig(config: any) {
+  if (!config) return [];
+  return Object.keys(config).reduce(
+    (m, k) => [...m, { name: k, defaultValue: getPrimitiveValue(config[k]) }],
+    [] as any[]
+  );
+}
+
 export function readSchema(basedir: string, builder: string) {
   const [npmPackage, builderName] = builder.split(':');
   return readBuildersFile(basedir, npmPackage)[builderName].schema;

libs/server/src/lib/utils/utils.ts

@@ -222,6 +222,19 @@ export function normalizeSchema(
   }
 }
 
+export function getPrimitiveValue(value: any) {
+  if (
+    typeof value === 'string' ||
+    typeof value === 'number' ||
+    typeof value === 'boolean' ||
+    value === null
+  ) {
+    return value.toString();
+  } else {
+    return undefined;
+  }
+}
+
 function getDefault(prop: any): any {
   if (prop.default === undefined && prop.$default === undefined) {
     return undefined;

libs/ui/src/lib/flags/flags.component.html

@@ -12,6 +12,7 @@
       name="configurations"
       fxLayout="row"
       fxLayoutGap="16px"
+      (change)="createFormUsingConfiguration($event.value)"
     >
       <mat-radio-button [value]="null">Default</mat-radio-button>
       <mat-radio-button

libs/ui/src/lib/flags/flags.component.ts

@@ -33,6 +33,7 @@ interface FieldGrouping {
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class FlagsComponent {
+  private _rawFields: Schema[];
   private _fields: Schema[];
   private subscription: Subscription;
 
@@ -44,7 +45,11 @@ export class FlagsComponent {
   fieldGroups: Array<FieldGrouping> = [];
 
   @Input() path: string;
-  @Input() configurations: { name: string }[];
+  @Input() options: { defaultValues: { name: string; defaultValue: string }[] };
+  @Input() configurations: {
+    name: string;
+    defaultValues: { name: string; defaultValue: string }[];
+  }[];
   @Input() prefix: string[];
   @Input() init: { [k: string]: any };
   @Input() runSyntax = false;
@@ -54,9 +59,8 @@ export class FlagsComponent {
     return this._fields;
   }
   set fields(f: Schema[]) {
-    this._fields = f;
-    this.fieldGroups = this.toFieldGroups(f);
-    this.setForm();
+    this._rawFields = f;
+    this.createFormUsingConfiguration(null);
   }
 
   @Output() readonly value = new EventEmitter();
@@ -109,13 +113,14 @@ export class FlagsComponent {
     }
   }
 
-  private setForm() {
+  private setForm(configuration: string | null) {
     this.formGroup = schematicFieldsToFormGroup({
       fields: this._fields,
       configurations: this.configurations && this.configurations.length > 0,
       init: this.init,
       getCompletions: (f, v) =>
-        this.completions.completionsFor(this.path, f, v || '')
+        this.completions.completionsFor(this.path, f, v || ''),
+      selectedConfiguration: configuration
     });
 
     if (this.subscription) {
@@ -166,4 +171,34 @@ export class FlagsComponent {
       });
     }
   }
+
+  createFormUsingConfiguration(configuration: string | null) {
+    this._fields = this.withConfigurationValues(configuration, this._rawFields);
+
+    this.fieldGroups = this.toFieldGroups(this._fields);
+    this.setForm(configuration);
+  }
+
+  private withConfigurationValues(configuration: string | null, f: Schema[]) {
+    const selectedConfiguration =
+      this.configurations &&
+      this.configurations.find(c => c.name === configuration);
+    const selectedOptions = selectedConfiguration
+      ? selectedConfiguration
+      : this.options;
+    return f.map(ff => {
+      const defaultFromOptions =
+        selectedOptions &&
+        selectedOptions.defaultValues.find(v => v.name === ff.name);
+      if (defaultFromOptions) {
+        const defaultValue = this.serializer.normalizeDefaultValue(
+          ff.type,
+          defaultFromOptions.defaultValue
+        );
+        return { ...ff, defaultValue };
+      } else {
+        return ff;
+      }
+    });
+  }
 }

libs/ui/src/lib/schematic-fields/schematic-fields.component.ts

@@ -43,6 +43,7 @@ export interface Payload {
   ) => Observable<CompletionResultType[]>;
   init?: { [k: string]: any };
   configurations?: boolean;
+  selectedConfiguration: string | null;
 }
 
 export const schematicFieldsToFormGroup = (payload: Payload): FormGroup => {
@@ -106,7 +107,9 @@ export const schematicFieldsToFormGroup = (payload: Payload): FormGroup => {
     {} as any
   );
   if (configurations) {
-    children.configurations = new FormControl(null);
+    children.configurations = new FormControl(
+      payload.selectedConfiguration ? payload.selectedConfiguration : null
+    );
   }
 
   return new FormGroup(children);

libs/utils/src/lib/serializer.service.ts

@@ -45,16 +45,23 @@ export class Serializer {
       ...fields.filter(r => !r.positional && !r.important)
     ].map(f => {
       let d = f.defaultValue as any;
-      if (f.type === 'boolean' && f.defaultValue === 'false') {
-        d = (f as any).defaultValue = false;
-      }
-      if (f.type === 'boolean' && f.defaultValue === 'true') {
-        d = (f as any).defaultValue = true;
-      }
+      d = (f as any).defaultValue = this.normalizeDefaultValue(f.type, d);
       return { ...f, defaultValue: d };
     });
   }
 
+  normalizeDefaultValue(type: string, defaultValue: string): any {
+    if (type === 'boolean' && defaultValue === 'false') {
+      return false;
+    } else if (type === 'boolean' && defaultValue === 'true') {
+      return true;
+    } else if (type === 'number') {
+      return Number(defaultValue);
+    } else {
+      return defaultValue;
+    }
+  }
+
   serializeArgs(value: { [p: string]: any }, schema: Schema[]): string[] {
     const fields = schema.filter(
       s =>