diff --git a/ui/app/components/clients/current.js b/ui/app/components/clients/current.js index b539102e65..0b10db1bdd 100644 --- a/ui/app/components/clients/current.js +++ b/ui/app/components/clients/current.js @@ -1,10 +1,14 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; +import { action } from '@ember/object'; export default class Current extends Component { chartLegend = [ { key: 'entity_clients', label: 'entity clients' }, { key: 'non_entity_clients', label: 'non-entity clients' }, ]; + @tracked namespaceArray = this.args.model.monthly?.byNamespace.map((namespace) => { + return { name: namespace['label'], id: namespace['label'] }; + }); @tracked selectedNamespace = null; // TODO CMB get from model @@ -46,4 +50,11 @@ export default class Current extends Component { filterByNamespace(namespace) { return this.byNamespaceCurrent.find((ns) => ns.label === namespace); } + + // ACTIONS + @action + selectNamespace([value]) { + // value comes in as [namespace0] + this.selectedNamespace = value; + } } diff --git a/ui/app/components/clients/dashboard.js b/ui/app/components/clients/dashboard.js index 253efad750..a94d39a383 100644 --- a/ui/app/components/clients/dashboard.js +++ b/ui/app/components/clients/dashboard.js @@ -45,7 +45,9 @@ export default class Dashboard extends Component { @tracked startYear = null; @tracked selectedNamespace = null; @tracked noActivityDate = ''; - // @tracked selectedNamespace = 'namespace18anotherlong/'; // for testing namespace selection view with mirage + @tracked namespaceArray = this.args.model.activity?.byNamespace.map((namespace) => { + return { name: namespace['label'], id: namespace['label'] }; + }); get startTimeDisplay() { if (!this.startTimeFromResponse) { @@ -173,16 +175,9 @@ export default class Dashboard extends Component { } @action - selectNamespace(value) { - // In case of search select component, value returned is an array - if (Array.isArray(value)) { - this.selectedNamespace = this.getNamespace(value[0]); - this.barChartSelection = false; - } else if (typeof value === 'object') { - // While D3 bar selection returns an object - this.selectedNamespace = this.getNamespace(value.label); - this.barChartSelection = true; - } + selectNamespace([value]) { + // value comes in as [namespace0] + this.selectedNamespace = value; } @action diff --git a/ui/app/styles/components/icon.scss b/ui/app/styles/components/icon.scss index e60da05337..bbb55ec205 100644 --- a/ui/app/styles/components/icon.scss +++ b/ui/app/styles/components/icon.scss @@ -47,6 +47,7 @@ .flight-icon { &.flight-icon-display-inline { vertical-align: middle; - margin: 0px 4px; + margin-left: 4px; + margin-right: 4px; } } diff --git a/ui/app/styles/components/search-select.scss b/ui/app/styles/components/search-select.scss index 478992482b..95594757f2 100644 --- a/ui/app/styles/components/search-select.scss +++ b/ui/app/styles/components/search-select.scss @@ -125,3 +125,11 @@ div > .ember-power-select-options { width: 20px; top: 5px; } + +.search-icon { + margin-top: 4px; +} + +.search-select.display-inherit { + display: inherit; +} diff --git a/ui/app/templates/components/clients/current.hbs b/ui/app/templates/components/clients/current.hbs index 8d3f96caec..4cc886f700 100644 --- a/ui/app/templates/components/clients/current.hbs +++ b/ui/app/templates/components/clients/current.hbs @@ -19,7 +19,16 @@ FILTERS - {{! ARG TODO more filters for namespace here }} + diff --git a/ui/app/templates/components/clients/dashboard.hbs b/ui/app/templates/components/clients/dashboard.hbs index 0caf9cb65f..fcf3809af0 100644 --- a/ui/app/templates/components/clients/dashboard.hbs +++ b/ui/app/templates/components/clients/dashboard.hbs @@ -61,8 +61,17 @@ @handleCurrentBillingPeriod={{this.handleCurrentBillingPeriod}} @startTimeDisplay={{this.startTimeDisplay}} /> - {{#if this.totalClientsData}} - {{! ARG TODO more filters for namespace here }} + {{#if this.namespaceArray}} + {{/if}} diff --git a/ui/lib/core/addon/components/search-select.js b/ui/lib/core/addon/components/search-select.js index dd85aa7f52..34d3a4ec54 100644 --- a/ui/lib/core/addon/components/search-select.js +++ b/ui/lib/core/addon/components/search-select.js @@ -26,10 +26,12 @@ import layout from '../templates/components/search-select'; * @param {string} [subText] - Text to be displayed below the label * @param {string} [subLabel] - a smaller label below the main Label * @param {string} [wildcardLabel] - when you want the searchSelect component to return a count on the model for options returned when using a wildcard you must provide a label of the count e.g. role. Should be singular. + * @param {string} [placeholder] - text you wish to replace the default "search" with + * @param {boolean} [displayInherit] - if you need the search select component to display inherit instead of box. * * @param {Array} options - *Advanced usage* - `options` can be passed directly from the outside to the * power-select component. If doing this, `models` should not also be passed as that will overwrite the - * passed value. + * passed value. ex: [{ name: 'namespace45', id: 'displayedName' }]; * @param {function} search - *Advanced usage* - Customizes how the power-select component searches for matches - * see the power-select docs for more information. * @@ -37,6 +39,7 @@ import layout from '../templates/components/search-select'; export default Component.extend({ layout, 'data-test-component': 'search-select', + classNameBindings: ['displayInherit:display-inherit'], classNames: ['field', 'search-select'], store: service(), diff --git a/ui/lib/core/addon/templates/components/search-select-placeholder.hbs b/ui/lib/core/addon/templates/components/search-select-placeholder.hbs index 8e9f09ccf5..2adbd9e3cf 100644 --- a/ui/lib/core/addon/templates/components/search-select-placeholder.hbs +++ b/ui/lib/core/addon/templates/components/search-select-placeholder.hbs @@ -1,6 +1,6 @@

- Search + {{or this.placeholder "Search"}}

\ No newline at end of file diff --git a/ui/lib/core/addon/templates/components/search-select.hbs b/ui/lib/core/addon/templates/components/search-select.hbs index 0e5fe04ad2..d0795af7da 100644 --- a/ui/lib/core/addon/templates/components/search-select.hbs +++ b/ui/lib/core/addon/templates/components/search-select.hbs @@ -24,6 +24,7 @@ {{#unless (gte this.selectedOptions.length this.selectLimit)}}