UI/remove empty rows from DB config pages (#12819)

* adds helper so only rows with values display

* adds changelog

* add argument to is-empty-value helper to check for default

* adds test to helper for added named argument
This commit is contained in:
claire bontempo 2021-10-14 13:14:33 -07:00 committed by GitHub
parent d016fafdf8
commit 529e3c4073
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 36 additions and 9 deletions

3
changelog/12819.txt Normal file
View File

@ -0,0 +1,3 @@
```release-note:improvement
ui: Removes empty rows from DB config views
```

View File

@ -1,6 +1,9 @@
import { helper } from '@ember/component/helper';
export default helper(function isEmptyValue([value] /*, hash*/) {
export default helper(function isEmptyValue([value], { hasDefault = false }) {
if (hasDefault) {
value = hasDefault;
}
if (typeof value === 'object' && value !== null) {
return Object.keys(value).length === 0;
}

View File

@ -310,14 +310,14 @@
{{#let attr.options.defaultShown as |defaultDisplay|}}
{{#if (eq attr.type "object")}}
<InfoTableRow
@alwaysRender={{true}}
@alwaysRender={{not (is-empty-value (get @model attr.name) hasDefault=defaultDisplay)}}
@defaultShown={{defaultDisplay}}
@label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
@value={{stringify (get @model attr.name)}}
/>
{{else if (eq attr.type "array")}}
<InfoTableRow
@alwaysRender={{true}}
@alwaysRender={{not (is-empty-value (get @model attr.name) hasDefault=defaultDisplay)}}
@defaultShown={{defaultDisplay}}
@label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
@value={{get @model attr.name}}
@ -327,7 +327,7 @@
/>
{{else}}
<InfoTableRow
@alwaysRender={{true}}
@alwaysRender={{not (is-empty-value (get @model attr.name) hasDefault=defaultDisplay)}}
@defaultShown={{defaultDisplay}}
@label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
@value={{get @model attr.name}}

View File

@ -4,7 +4,7 @@ import { render } from '@ember/test-helpers';
import { hbs } from 'ember-cli-htmlbars';
const template = hbs`
{{#if (is-empty-value inputValue)}}
{{#if (is-empty-value inputValue hasDefault=defaultValue)}}
Empty
{{else}}
Full
@ -18,34 +18,55 @@ const nonEmptyObject = { thing: 0 };
module('Integration | Helper | is-empty-value', function(hooks) {
setupRenderingTest(hooks);
test('it is truthy if the value evaluated is undefined', async function(assert) {
test('it is truthy if the value evaluated is undefined and no default', async function(assert) {
this.set('inputValue', undefined);
this.set('defaultValue', false);
await render(template);
assert.dom(this.element).hasText('Empty');
});
test('it is truthy if the value evaluated is an empty string', async function(assert) {
test('it is truthy if the value evaluated is an empty string and no default', async function(assert) {
this.set('inputValue', '');
this.set('defaultValue', false);
await render(template);
assert.dom(this.element).hasText('Empty');
});
test('it is truthy if the value evaluated is an empty object', async function(assert) {
test('it is truthy if the value evaluated is an empty object and no default', async function(assert) {
this.set('inputValue', emptyObject);
this.set('defaultValue', false);
await render(template);
assert.dom(this.element).hasText('Empty');
});
test('it is falsy if the value evaluated is not an empty object', async function(assert) {
test('it is falsy if the value evaluated is not an empty object and no default', async function(assert) {
this.set('inputValue', nonEmptyObject);
this.set('defaultValue', false);
await render(template);
assert.dom(this.element).hasText('Full');
});
test('it is falsy if the value evaluated is empty but a default exists', async function(assert) {
this.set('defaultValue', 'Some default');
this.set('inputValue', emptyObject);
await render(template);
assert.dom(this.element).hasText('Full', 'shows default when value is empty object');
this.set('inputValue', '');
await render(template);
assert.dom(this.element).hasText('Full', 'shows default when value is empty string');
this.set('inputValue', undefined);
await render(template);
assert.dom(this.element).hasText('Full', 'shows default when value is undefined');
});
});