Adds filtering to the KV listing page
This commit is contained in:
parent
c1742a89dd
commit
d38a25bb9a
|
@ -0,0 +1,2 @@
|
||||||
|
import Controller from './index';
|
||||||
|
export default Controller.extend();
|
|
@ -0,0 +1,18 @@
|
||||||
|
import Controller from '@ember/controller';
|
||||||
|
import { get } from '@ember/object';
|
||||||
|
import WithFiltering from 'consul-ui/mixins/with-filtering';
|
||||||
|
import rightTrim from 'consul-ui/utils/right-trim';
|
||||||
|
export default Controller.extend(WithFiltering, {
|
||||||
|
queryParams: {
|
||||||
|
s: {
|
||||||
|
as: 'filter',
|
||||||
|
replace: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
filter: function(item, { s = '' }) {
|
||||||
|
const key = rightTrim(get(item, 'Key'), '/')
|
||||||
|
.split('/')
|
||||||
|
.pop();
|
||||||
|
return key.toLowerCase().indexOf(s.toLowerCase()) !== -1;
|
||||||
|
},
|
||||||
|
});
|
|
@ -1,7 +1,6 @@
|
||||||
import { helper } from '@ember/component/helper';
|
import { helper } from '@ember/component/helper';
|
||||||
|
import leftTrim from 'consul-ui/utils/left-trim';
|
||||||
|
|
||||||
export function leftTrim([str = '', search = ''], hash) {
|
export default helper(function([str = '', search = ''], hash) {
|
||||||
return str.indexOf(search) === 0 ? str.substr(search.length) : str;
|
return leftTrim(str, search);
|
||||||
}
|
});
|
||||||
|
|
||||||
export default helper(leftTrim);
|
|
||||||
|
|
|
@ -1,8 +1,7 @@
|
||||||
import { helper } from '@ember/component/helper';
|
import { helper } from '@ember/component/helper';
|
||||||
|
|
||||||
export function rightTrim([str = '', search = ''], hash) {
|
import rightTrim from 'consul-ui/utils/right-trim';
|
||||||
const pos = str.length - search.length;
|
|
||||||
return str.indexOf(search) === pos ? str.substr(0, pos) : str;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default helper(rightTrim);
|
export default helper(function([str = '', search = ''], hash) {
|
||||||
|
return rightTrim(str, search);
|
||||||
|
});
|
||||||
|
|
|
@ -5,6 +5,12 @@ import { get } from '@ember/object';
|
||||||
import WithKvActions from 'consul-ui/mixins/kv/with-actions';
|
import WithKvActions from 'consul-ui/mixins/kv/with-actions';
|
||||||
|
|
||||||
export default Route.extend(WithKvActions, {
|
export default Route.extend(WithKvActions, {
|
||||||
|
queryParams: {
|
||||||
|
s: {
|
||||||
|
as: 'filter',
|
||||||
|
replace: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
repo: service('kv'),
|
repo: service('kv'),
|
||||||
model: function(params) {
|
model: function(params) {
|
||||||
const key = params.key || '/';
|
const key = params.key || '/';
|
||||||
|
|
|
@ -18,6 +18,13 @@
|
||||||
{{/if}}
|
{{/if}}
|
||||||
</h1>
|
</h1>
|
||||||
{{/block-slot}}
|
{{/block-slot}}
|
||||||
|
{{#block-slot 'toolbar'}}
|
||||||
|
{{#if (gt items.length 0) }}
|
||||||
|
<form class="filter-bar">
|
||||||
|
{{freetext-filter onchange=(action 'filter') value=filter.s placeholder="Search by name"}}
|
||||||
|
</form>
|
||||||
|
{{/if}}
|
||||||
|
{{/block-slot}}
|
||||||
{{#block-slot 'actions'}}
|
{{#block-slot 'actions'}}
|
||||||
{{#if (not-eq parent.Key '/') }}
|
{{#if (not-eq parent.Key '/') }}
|
||||||
<a href="{{href-to 'dc.kv.create' parent.Key}}" class="type-create">Create</a>
|
<a href="{{href-to 'dc.kv.create' parent.Key}}" class="type-create">Create</a>
|
||||||
|
@ -26,9 +33,9 @@
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{/block-slot}}
|
{{/block-slot}}
|
||||||
{{#block-slot 'content'}}
|
{{#block-slot 'content'}}
|
||||||
{{#if (gt items.length 0)}}
|
{{#if (gt filtered.length 0)}}
|
||||||
{{#tabular-collection
|
{{#tabular-collection
|
||||||
items=(sort-by 'isFolder:desc' items) as |item index|
|
items=(sort-by 'isFolder:desc' filtered) as |item index|
|
||||||
}}
|
}}
|
||||||
{{#block-slot 'header'}}
|
{{#block-slot 'header'}}
|
||||||
<th>Name</th>
|
<th>Name</th>
|
||||||
|
|
|
@ -0,0 +1,3 @@
|
||||||
|
export default function leftTrim(str = '', search = '') {
|
||||||
|
return str.indexOf(search) === 0 ? str.substr(search.length) : str;
|
||||||
|
}
|
|
@ -0,0 +1,4 @@
|
||||||
|
export default function rightTrim(str = '', search = '') {
|
||||||
|
const pos = str.length - search.length;
|
||||||
|
return str.lastIndexOf(search) === pos ? str.substr(0, pos) : str;
|
||||||
|
}
|
|
@ -1,4 +1,4 @@
|
||||||
import { moduleForComponent, skip } from 'ember-qunit';
|
import { moduleForComponent, test } from 'ember-qunit';
|
||||||
import hbs from 'htmlbars-inline-precompile';
|
import hbs from 'htmlbars-inline-precompile';
|
||||||
|
|
||||||
moduleForComponent('left trim', 'helper:left-trim', {
|
moduleForComponent('left trim', 'helper:left-trim', {
|
||||||
|
@ -6,7 +6,7 @@ moduleForComponent('left trim', 'helper:left-trim', {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Replace this with your real tests.
|
// Replace this with your real tests.
|
||||||
skip('it renders', function(assert) {
|
test('it renders', function(assert) {
|
||||||
this.set('inputValue', '1234');
|
this.set('inputValue', '1234');
|
||||||
|
|
||||||
this.render(hbs`{{left-trim inputValue}}`);
|
this.render(hbs`{{left-trim inputValue}}`);
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { moduleForComponent, skip } from 'ember-qunit';
|
import { moduleForComponent, test } from 'ember-qunit';
|
||||||
import hbs from 'htmlbars-inline-precompile';
|
import hbs from 'htmlbars-inline-precompile';
|
||||||
|
|
||||||
moduleForComponent('right-trim', 'helper:right-trim', {
|
moduleForComponent('right-trim', 'helper:right-trim', {
|
||||||
|
@ -6,7 +6,7 @@ moduleForComponent('right-trim', 'helper:right-trim', {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Replace this with your real tests.
|
// Replace this with your real tests.
|
||||||
skip('it renders', function(assert) {
|
test('it renders', function(assert) {
|
||||||
this.set('inputValue', '1234');
|
this.set('inputValue', '1234');
|
||||||
|
|
||||||
this.render(hbs`{{right-trim inputValue}}`);
|
this.render(hbs`{{right-trim inputValue}}`);
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
import { moduleFor, test } from 'ember-qunit';
|
||||||
|
|
||||||
|
moduleFor('controller:dc/kv/folder', 'Unit | Controller | dc/kv/folder', {
|
||||||
|
// Specify the other units that are required for this test.
|
||||||
|
// needs: ['controller:foo']
|
||||||
|
});
|
||||||
|
|
||||||
|
// Replace this with your real tests.
|
||||||
|
test('it exists', function(assert) {
|
||||||
|
let controller = this.subject();
|
||||||
|
assert.ok(controller);
|
||||||
|
});
|
|
@ -0,0 +1,12 @@
|
||||||
|
import { moduleFor, test } from 'ember-qunit';
|
||||||
|
|
||||||
|
moduleFor('controller:dc/kv/index', 'Unit | Controller | dc/kv/index', {
|
||||||
|
// Specify the other units that are required for this test.
|
||||||
|
// needs: ['controller:foo']
|
||||||
|
});
|
||||||
|
|
||||||
|
// Replace this with your real tests.
|
||||||
|
test('it exists', function(assert) {
|
||||||
|
let controller = this.subject();
|
||||||
|
assert.ok(controller);
|
||||||
|
});
|
|
@ -0,0 +1,44 @@
|
||||||
|
import { module } from 'ember-qunit';
|
||||||
|
import test from 'ember-sinon-qunit/test-support/test';
|
||||||
|
import leftTrim from 'consul-ui/utils/left-trim';
|
||||||
|
module('Unit | Utility | left trim');
|
||||||
|
|
||||||
|
test('it trims characters from the left hand side', function(assert) {
|
||||||
|
[
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here', '/'],
|
||||||
|
expected: 'a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here', ''],
|
||||||
|
expected: '/a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['a/folder/here', '/'],
|
||||||
|
expected: 'a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['a/folder/here/', '/'],
|
||||||
|
expected: 'a/folder/here/',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: [],
|
||||||
|
expected: '',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here', '/a/folder'],
|
||||||
|
expected: '/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here/', '/a/folder/here'],
|
||||||
|
expected: '/',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here/', '/a/folder/here/'],
|
||||||
|
expected: '',
|
||||||
|
},
|
||||||
|
].forEach(function(item) {
|
||||||
|
const actual = leftTrim(...item.args);
|
||||||
|
assert.equal(actual, item.expected);
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,44 @@
|
||||||
|
import { module } from 'ember-qunit';
|
||||||
|
import test from 'ember-sinon-qunit/test-support/test';
|
||||||
|
import rightTrim from 'consul-ui/utils/right-trim';
|
||||||
|
module('Unit | Utility | right trim');
|
||||||
|
|
||||||
|
test('it trims characters from the right hand side', function(assert) {
|
||||||
|
[
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here/', '/'],
|
||||||
|
expected: '/a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here', ''],
|
||||||
|
expected: '/a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['a/folder/here', '/'],
|
||||||
|
expected: 'a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['a/folder/here/', '/'],
|
||||||
|
expected: 'a/folder/here',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: [],
|
||||||
|
expected: '',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here', '/folder/here'],
|
||||||
|
expected: '/a',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here', 'a/folder/here'],
|
||||||
|
expected: '/',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
args: ['/a/folder/here/', '/a/folder/here/'],
|
||||||
|
expected: '',
|
||||||
|
},
|
||||||
|
].forEach(function(item) {
|
||||||
|
const actual = rightTrim(...item.args);
|
||||||
|
assert.equal(actual, item.expected);
|
||||||
|
});
|
||||||
|
});
|
Loading…
Reference in New Issue