ui: Search/filtering 'Filtered by:' search status #9442
Conversation
| @@ -1 +1,48 @@ | |||
| common: | |||
| brand: | |||
There was a problem hiding this comment.
We need to have a chat about how we want to organise this before it gets used a lot.
In using it I figured these keys would be good keys to have, so common, common.brand, components.* to mirror our component tree etc. I had a few thoughts on some others like whether we should have a model.* key also to mirror our models for naming model key names etc. and one for routes.* again mirror the route tree.
I think I'd like to split this into files also, but I guess that can be decided on/done a little later.
Lastly, one thing I would really like to do is have every app/components/component-name/ folder contain its own translation.yaml file along with the hbs, js, css etc. I definitely like to look at doing this before we get too far into it.
There was a problem hiding this comment.
I can't remember if we discussed this. I do need to use a translation file atm for auth methods. Let's chat and get on the same page about this.
There was a problem hiding this comment.
Sounds good, ping me when you are around and we can decide how we want to do it
johncowen
force-pushed
the
ui/feature/services-filter-by
branch
from
8f34dfe
to
495c607
Compare
|
Thanks for the review! I decided to make this PR the base branch for integrating across the rest of the ui, so I'll merge some other PRs down onto this before merging it all together onto master, so I added some TODO in the PR description. |
johncowen
changed the title
|
This pull request is being automatically deployed with Vercel (learn more). consul-ui-staging – ./ui🔍 Inspect: https://vercel.com/hashicorp/consul-ui-staging/6s3pef2n1 [Deployment for 9524c7d canceled] |
1. Reworks popover-select option and optgroup to glimmer components 2. Reworks to use the components themselves to tracks state rather than a separate Set 3. Adds `required` for required at least one option to be selected and removes substractive, which we no longer need
1. This contains the 'Filter by' functionality that we are going to use on all search-bars
Also, make all filter names singular instead of plural
johncowen
force-pushed
the
ui/feature/services-filter-by
branch
from
23824d4
to
a8d9b9a
Compare
Previously when removing a special 'searchproperty' filter, it would remove all the search property filters instead of only the one you had clicked. This fixes that up, adds tests and adds copious amounts of documentation around the filter data reshaping function for future self/somebody
…9622) * Filter by for healthchecks search-bar * Add filter by for service instances * Service Instances needs to check brands * Update Service > Instances search-bar * Lowercase the check types
* Add filtered by to Upstreams and Linked Services * Filterby for upstream instances * More specific headers for definition tables * Add empty healthcheck filter predicate and related computed props * More i18n
|
🍒 If backport labels were added before merging, cherry-picking will start automatically. To retroactively trigger a backport after merging, add backport labels and re-run https://circleci.com/gh/hashicorp/consul/316285. |
|
🍒✅ Cherry pick of commit bb95738 onto |
Adds a 'status' for the filtering/searching in the UI, without this its not super clear that you are filtering a recordset due to the menu selections being hidden once closed. You can also use the pills in this status view to delete individual filters.
This PR adds a 'status' for the filtering/searching in the UI, without this its not super clear that you are filtering a recordset due to the menu selections being hidden once closed:
This is the first area where we begin to use the i18n
thelper, in this case to translate machine to human (en-US), which from a code perspective is probably the biggest change here. We've tried to get a good balance between providing some sort of nice fallback for non-translated text and sharing as many terms, words and phrases as possible.Notes:
requiredproperty to specify that the menu should have at least 1 option selected.twith itsdefaultfallbacks, if no key is found it will dash-split and titlecase the final part of the key so something likecommon.brand.unknown-brandwill end up asUnknown brandif the translation doesn't exist.This PR only contains this feature for the main Service listing, but will now be rolled out across the rest of the UI.
Internationalisation of text will be rolled out gradually as and when until we have a fully i18n'able UI, but moving forwards any new features should make use of
ember-intlfrom the start.Edit:
I decided to make this PR the base branch for integrating across the rest of the ui: