0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-24 23:48:13 -05:00

Refined filter builder UI to show multi-line labels

refs https://github.com/TryGhost/Team/issues/970

- refined labels dropdown on filter builder to multi-line
- cleaned up valid filter handling
This commit is contained in:
Rishabh 2021-08-13 22:12:17 +05:30
parent 6d9b8175a2
commit f3af99fada
2 changed files with 16 additions and 20 deletions

View file

@ -8,7 +8,6 @@ const FILTER_PROPERTIES = [
// Basic // Basic
{label: 'Name', name: 'name', group: 'Basic'}, {label: 'Name', name: 'name', group: 'Basic'},
{label: 'Email', name: 'email', group: 'Basic'}, {label: 'Email', name: 'email', group: 'Basic'},
{label: 'Name or Email', name: 'name_email', group: 'Basic'},
// {label: 'Location', name: 'location', group: 'Basic'}, // {label: 'Location', name: 'location', group: 'Basic'},
{label: 'Newsletter subscription', name: 'subscribed', group: 'Basic'}, {label: 'Newsletter subscription', name: 'subscribed', group: 'Basic'},
{label: 'Label', name: 'label', group: 'Basic'}, {label: 'Label', name: 'label', group: 'Basic'},
@ -32,9 +31,6 @@ const FILTER_PROPERTIES = [
]; ];
const FILTER_RELATIONS_OPTIONS = { const FILTER_RELATIONS_OPTIONS = {
name_email: [
{label: 'contains', name: 'contains'}
],
subscribed: [ subscribed: [
{label: 'is', name: 'is'}, {label: 'is', name: 'is'},
{label: 'is not', name: 'is-not'} {label: 'is not', name: 'is-not'}
@ -143,16 +139,14 @@ export default class GhMembersFilterLabsComponent extends Component {
generateNqlFilter(filters) { generateNqlFilter(filters) {
let query = ''; let query = '';
filters.forEach((filter) => { filters.forEach((filter) => {
if (filter.value && !['name_email'].includes(filter.type)) { if (filter.type === 'label' && filter.value?.length) {
if (filter.type === 'label') { const relationStr = filter.relation === 'is-not' ? '-' : '';
const relationStr = filter.relation === 'is-not' ? '-' : ''; const filterValue = '[' + filter.value.join(',') + ']';
const filterValue = '[' + filter.value.join(',') + ']'; query += `${filter.type}:${relationStr}${filterValue}+`;
query += `${filter.type}:${relationStr}${filterValue}+`; } else {
} else { const relationStr = filter.relation === 'is-not' ? '-' : '';
const relationStr = filter.relation === 'is-not' ? '-' : ''; const filterValue = filter.value.includes(' ') ? `'${filter.value}'` : filter.value;
const filterValue = filter.value.includes(' ') ? `'${filter.value}'` : filter.value; query += `${filter.type}:${relationStr}${filterValue}+`;
query += `${filter.type}:${relationStr}${filterValue}+`;
}
} }
}); });
return query.slice(0, -1); return query.slice(0, -1);
@ -195,8 +189,14 @@ export default class GhMembersFilterLabsComponent extends Component {
@action @action
applyFilter() { applyFilter() {
const query = this.generateNqlFilter(this.filters); const validFilters = this.filters.filter((fil) => {
this.args.onApplyFilter(query, this.filters); if (fil.type === 'label') {
return fil.value?.length;
}
return fil.value;
});
const query = this.generateNqlFilter(validFilters);
this.args.onApplyFilter(query, validFilters);
} }
@action @action

View file

@ -111,10 +111,6 @@
margin-top: 20px; margin-top: 20px;
} }
.gh-filter-block .ember-power-select-multiple-trigger {
height: 33px !important;
}
.gh-filter-block .label-token-labs{ .gh-filter-block .label-token-labs{
margin: 2px !important; margin: 2px !important;
} }