search

DSD-DBS / capella-collab-manager

A web app for collaboration on Capella (MBSE) projects
https://dsd-dbs.github.io/capella-collab-manager/
Apache License 2.0
23 stars 5 forks source link

Update existing frontend logic to Angular 17 control flow syntax #1373

Open romeonicholas opened 8 months ago

romeonicholas commented 8 months ago

Angular 17 introduces new syntax for looping and conditionally displaying elements (https://blog.angulartraining.com/angular-17-new-control-flow-syntax-4fbec4772d04) which can introduce some performance improvements as well as just being a little easier to read in some cases. We have a lot of pre-existing ngifs and ngfors that we could refactor, though honestly some of them are pretty gnarly and may not actually be easier to read in the new system. I don't know if Angular has a roadmap for how long the old versions will continue to be supported, but it's probably worth it to update those sooner rather than later.

romeonicholas commented 6 months ago

@dominik003 made a nice dent in this with #1465, but it begged the question of exactly what, how, and where to update. For general testability and reviewer sanity I'd probably argue for doing this one file at at a time, but also apparently Angular offers a tool for migration that I completely overlooked? ng generate @angular/core:control-flow updated 68 files when I tested it, though someone would need to go over the results to confirm it didn't break anything and that we were happy with its choices. But reviewing hundreds of changes is probably easier than writing them.

MoritzWeber0 commented 6 months ago

@dominik003 made a nice dent in this with #1465, but it begged the question of exactly what, how, and where to update. For general testability and reviewer sanity I'd probably argue for doing this one file at at a time, but also apparently Angular offers a tool for migration that I completely overlooked? ng generate @angular/core:control-flow updated 68 files when I tested it, though someone would need to go over the results to confirm it didn't break anything and that we were happy with its choices. But reviewing hundreds of changes is probably easier than writing them.

Since we have Storybook now, it makes sense to add stories for the components in questions before changing them. In general, I'll now require stories for each changed components in the frontend, this makes testing and reviewing way easier and will push the coverage for stories 👍

With the new mocking approach, they are also really easy to implement.