Files
vault/ui/lib/core/addon/components/info-table-item-array.hbs
lane-wetmore 4051cb4d4c UI: Remove custom tag class and replace with Hds::Badge (#29475)
* replace custom tag class with Hds::Badge

* another wave of custom class replacements

* remove tag class styles and cleanup

* add changelog entry

* fix changelog name

* remove changelog entry and old styles and clean up

* remove extra classes and clean up

* one more clean up section

* update tests

* fix value check

* updated test

* update tests

* switch to code elements with specific styling and cleanup
2025-02-07 15:29:12 -06:00

83 lines
3.4 KiB
Handlebars

{{!
Copyright (c) HashiCorp, Inc.
SPDX-License-Identifier: BUSL-1.1
~}}
{{! the class linked-block-item is needed for the read-more component }}
<div data-test-info-table-item-array {{did-insert this.fetchOptions}} class="linked-block-item">
{{#if @isLink}}
<div data-test-row-value={{@label}}>
{{#if this.fetchComplete}}
<ReadMore>
{{#each this.displayArrayTruncated as |item|}}
{{#if (is-wildcard-string item)}}
{{#let (filter-wildcard item this.allOptions) as |wildcardCount|}}
<span>{{item}}</span>
{{#if (not-eq wildcardCount undefined)}}
<Hds::Badge
@text="includes {{pluralize wildcardCount this.wildcardLabel}}"
data-test-count={{wildcardCount}}
/>
{{/if}}
{{#if (eq this.displayArrayTruncated.lastObject item)}}
<LinkTo @route={{this.rootRoute}} @query={{hash tab=@queryParam}}>
<span data-test-view-all={{lowercase @label}}>View all {{lowercase @label}}.</span>
</LinkTo>
{{/if}}
{{/let}}
{{else}}
{{#if (is-array this.itemRoute)}}
<LinkTo
@route={{(get this.itemRoute "0")}}
@models={{array (get this.itemRoute "1") item (get this.itemRoute "2")}}
>
{{or (get this.itemNameById item) item}}
</LinkTo>
{{else}}
<LinkTo
@route={{this.itemRoute}}
@model={{if @queryParam (concat @queryParam "/" item) item}}
data-test-item={{item}}
>
<span>{{or (get this.itemNameById item) item}}</span>
</LinkTo>
{{/if}}
{{/if}}
{{#if (not-eq item this.displayArrayTruncated.lastObject)}}
,&nbsp;
{{/if}}
{{#unless this.doNotTruncate}}
{{#if (and (eq item this.displayArrayTruncated.lastObject) (gte @displayArray.length 10))}}
{{! dec is a math helper that decrements by 5 the length of the array ex: 11-5 = "and 6 others."}}
<span data-test-and={{dec 5 @displayArray.length}}>
&nbsp;and
{{dec 5 @displayArray.length}}
others.&nbsp;
</span>
{{/if}}
{{#if (and (eq item this.displayArrayTruncated.lastObject) (gte @displayArray.length 10))}}
{{#if (is-array @rootRoute)}}
<LinkTo @route={{(get @rootRoute "0")}} @model={{(get @rootRoute "1")}}>
<span data-test-view-all={{lowercase @label}}>View all {{lowercase @label}}.</span>
</LinkTo>
{{else}}
<LinkTo @route={{this.rootRoute}} @query={{hash tab=@queryParam}}>
<span data-test-view-all={{lowercase @label}}>View all {{lowercase @label}}.</span>
</LinkTo>
{{/if}}
{{/if}}
{{/unless}}
{{/each}}
</ReadMore>
{{/if}}
</div>
{{else}}
<code class="is-word-break has-text-black" data-test-row-value={{@label}}>
{{if
(gte @displayArray.length 10)
(concat @displayArray ", and " (dec 5 @displayArray.length) " more.")
@displayArray
}}
</code>
{{/if}}
</div>