feat(@schematics/angular): Added multiselect guard implements option

[okeefem2]

Follow up to #13031, using the multiselect option for the guard schematic to ask the user which methods they would like to implement. I purposefully left out CanDeactivate because of the need to tie in a component. This would be a good candidate for a future PR though!

Fixes #13400

Thanks,

Michael

[clydin]

I apologize for the delay in reviewing. Looks good; just several comments.

[clydin]

You can remove the label. The label is optional and will use the value if not present.

[okeefem2]

@clydin Thanks for the review! I have pushed changes, let me know if any more are necessary.

[clydin]

Looks good.
Just two small suggestions.

[alan-agius4]

Can you add fixes #13400?

Thanks

[hansl]

This looks like an enum instead of general string.

[okeefem2]

@hansl If I change this to enum, I get the following build error:

Error: Invalid type enum in JSON Schema at Schema#/properties/implements/items

I realized that the way this is being used the items could be updated to just a list of strings, thank you for pointing that out. Let me know what you think!

[alan-agius4]

Should be something like;

    "implements": {
      "type": "array",
      "description": "Specifies which interfaces to implement.",
      "default": "CanActivate",
      "enum": [
           "CanActivate",
           "CanActivateChild",
           "CanLoad"
      ]
      ....
    },

[okeefem2]

@alan-agius4 I'm sorry I could be totally missing something (my first time working with json schema 😬), but the x prompt logic requires this array to be named as items: [] as seen in https://github.com/angular/angular-cli/blob/master/packages/angular/cli/models/schematic-command.ts#L311

Are you saying in addition to the x-prompt defintion, also include the enum definition you describe here?

Thanks for your help btw! Just trying to learn and make sure I understand.

[alan-agius4]

Not really, I think it should be something like;

 "implements": {
      "type": "array",
      "description": "Specifies which interfaces to implement.",
      "default": "CanActivate",
      "items": {
        "enum": [
          "CanActivate",
          "CanActivateChild",
          "CanLoad"
        ]
      },
      "x-prompt": {
        "message": "Which interfaces would you like to implement?",
        "type": "list",
        "multiselect": true,
        "items": [
          "CanActivate",
          "CanActivateChild",
          "CanLoad"
        ]
      }
}

The .... above meant, continuation with x-prompt definition.

[alan-agius4]

Note: updated the above is I spotted a mistake

[clydin]

Note also that I have a followup planned to add auto-configuration of multi-select based on the schema. It will eliminate the need to manually specify most of the prompt options and is the reason I originally suggested just using a string constraint for now (this schema would be adjusted in the process either way).

[alan-agius4]

in that case, it LGTM

[okeefem2]

@clydin would I be able to help out with the implementation of the multi select auto configuration?? I’d love to keep learning and contributing and this could transition well from the work I’ve done so far. Let me know what you think and thanks everyone for the help so far!

[cyrilletuzi]

@clydin @okeefem2 @alan-agius4 For info, the decision made here causes issues like this one: cyrilletuzi/vscode-angular-schematics#32. The x-prompts is a specific use of the schema, the classic schema properties should be respected for other tools to work (ie. possible values must be in anyOf - or similar, not sure of the good property for this case). For the same reason, implements should be flagged as required (or else it should generate a correct file without it, currently ng g guard without implements generates a file with errors).

[kyliau]

@okeefem2 Could you please fix the merge conflict?

[alan-agius4]

you can eventually use the enum type here.

[okeefem2]

@alan-agius4 Are you saying to create an enum for the values instead of comparing hard coded strings? If yes would this live in the index.ts file or should it have it’s own file?

[alan-agius4]

Hi, the enum is created from the json schema, you don't need to redefine it.

You can run yarn build it will generate an new schema with the enum you created in the json schema.

So you can import it like such

import { Schema as GuardOptions, Implement } from './schema';

[okeefem2]

Oh very cool. I will make these changes later today when I get home. Thanks!

[alan-agius4]

See comments above

[alan-agius4]

LGTM, following @clydin comment.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}