angular_components
angular_components copied to clipboard
Support deep linking into app based on main ACX class type name
For example, rather than
- https://dart-lang.github.io/angular_components_example/#/material_icon
it would be nice if
- https://dart-lang.github.io/angular_components_example/#/MaterialIconComponent
linked to this page:

cc @kwalrath
Related: https://github.com/dart-lang/site-webdev/issues/1533
Currently the route is computed from the display name for a given page in the gallery. The display name is hard coded by the engineer that wrote the example page for a component. See https://github.com/dart-lang/angular_components_example/blob/master/example/material_input_example/lib/gallery_section_config.dart#L15
There are pages in the gallery where multiple components appear together and it isn't clear what component name should be used for the route.
It'll be a bit cumbersome if we need to manually maintain a map from class names (for their API entries) to gallery pages. I might be able to autogenerate redirect rules, but to enforce such rules, we'd need the gallery to be hosted on webdev, not gh-pages.
Actually, the app seems to maintain a class-to-page mapping. Maybe we can capitalize on that? E.g., if I type "DateInputDirective" in the search box, it shows me "Material Datepicker" page as a choice. Maybe the app could support a "queried deep linking" functionality? E.g. ...gallery?q=DateInputDirective
could open up on the "Material Datepicker" page?
The search box is fairly basic and simply filters the list that is displayed. The keys it uses are the displayName
and all the components listed in the docs
list in the @GallerySectionConfig
annotation.
https://github.com/dart-lang/angular_components_example/blob/master/example/material_datepicker_example/lib/combined_demo.dart#L22
I was planning on adding the selectors as well so they would work in the filter like you suggested.
I guess the mapping that you would be looking for is in the annotations of all the examples except it isn't one-to-one. Some components appear in multiple pages in the gallery. For example searching for Material Dropdown Select should filter down to two pages because it is on both.
Maybe it would be best if each component appeared only in one page. Alternative pages can link back to the main page.
Looking at MaterialDropdownSelectComponent
, I get the impression that the entire contents of the "Material Dropdown Select" page is also found in the "Material Select" page. It seems reasonable to have two entries appear in the search, but both should link the user to the same place.
Maybe the app needs support for page anchors?