open-vault/ui/lib/core/addon/components/info-table-row.hbs
2022-12-02 16:42:14 +00:00

109 lines
3.9 KiB
Handlebars

{{#if (or (has-block) this.isVisible)}}
<div class="info-table-row" data-test-component="info-table-row" ...attributes>
<div
class="column is-one-quarter {{if this.hasLabelOverflow 'label-overflow'}}"
data-test-label-div
{{did-insert this.calculateLabelOverflow}}
>
{{#if @label}}
{{#if this.hasLabelOverflow}}
<ToolTip @verticalPosition="below" @horizontalPosition="left" as |T|>
<T.Trigger @tabindex={{false}}>
<span class="is-label has-text-grey-dark" data-test-row-label={{@label}}>{{@label}}</span>
</T.Trigger>
<T.Content @defaultClass="tool-tip">
<div class="box fit-content" data-test-label-tooltip>
{{@label}}
</div>
</T.Content>
</ToolTip>
{{else}}
<span class="is-label has-text-grey-dark" data-test-row-label={{@label}}>{{@label}}</span>
{{/if}}
{{#if @helperText}}
<div>
<span class="is-label helper-text has-text-grey">{{@helperText}}</span>
</div>
{{/if}}
{{else}}
<Icon @name="minus" />
{{/if}}
</div>
<div class="column is-flex" data-test-value-div={{@label}}>
{{#if @addCopyButton}}
<div class="display-only">
<CopyButton
@clipboardText={{@value}}
@success={{action (set-flash-message "Data copied!")}}
class="button copy-button is-compact"
data-test-copy-button
>
<Icon @name="clipboard-copy" aria-hidden="Copy value" />
</CopyButton>
</div>
{{/if}}
{{#if (has-block)}}
{{yield}}
{{else if this.valueIsBoolean}}
{{#if @value}}
<Icon class="icon-true" @name="check-circle" data-test-boolean-true />
Yes
{{else}}
<Icon @name="x-square" class="icon-false" data-test-boolean-false />
No
{{/if}}
{{! @alwaysRender (this.isVisible) is still true }}
{{else if this.valueIsEmpty}}
{{#if @defaultShown}}
<span data-test-row-value={{@label}}>{{@defaultShown}}</span>
{{else}}
<Icon @name="minus" />
{{/if}}
{{else if @formatDate}}
{{date-format @value @formatDate}}
{{else if @formatTtl}}
{{this.formattedTtl}}
{{else}}
{{#if (eq @type "array")}}
<InfoTableItemArray
@label={{@label}}
@backend={{@backend}}
@displayArray={{@value}}
@isLink={{@isLink}}
@modelType={{@modelType}}
@queryParam={{@queryParam}}
@wildcardLabel={{@wildcardLabel}}
@rootRoute={{@rootRoute}}
@itemRoute={{@itemRoute}}
@doNotTruncate={{@doNotTruncate}}
@renderItemName={{@renderItemName}}
/>
{{else}}
{{#if @tooltipText}}
<ToolTip @verticalPosition="above" @horizontalPosition="left" as |T|>
<T.Trigger @tabindex={{false}}>
<span class="is-word-break has-text-black" data-test-row-value={{this.label}}>{{this.value}}</span>
</T.Trigger>
<T.Content @defaultClass="tool-tip">
<CopyButton
@clipboardText={{@tooltipText}}
@success={{action (set-flash-message "Data copied!")}}
@tagName="div"
disabled={{not @isTooltipCopyable}}
class={{if @isTooltipCopyable "has-pointer"}}
data-test-tooltip-copy
>
<div class="box">
{{@tooltipText}}
</div>
</CopyButton>
</T.Content>
</ToolTip>
{{else}}
<span class="is-word-break has-text-black" data-test-row-value={{@label}}>{{@value}}</span>
{{/if}}
{{/if}}
{{/if}}
</div>
</div>
{{/if}}