jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui) - metric filters metadata and performance filters

Browse source
This commit is contained in:
Shekar Siri 2022-08-09 14:29:58 +02:00
parent 52df7f2f4e
commit 8c99821242
2 changed files with 65 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/app/components/shared/Filters/FilterItem/FilterItem.tsx
View file

@ -73,7 +73,7 @@ function FilterItem(props: Props) {
)}
{/* Filter values */}
{!isSubFilter && (
{!isSubFilter && filter.operatorOptions && (
<>
<FilterOperator
options={filter.operatorOptions}

115
frontend/app/mstore/types/filterItem.ts
View file

@ -1,21 +1,25 @@
import { makeAutoObservable, runInAction, observable, action, reaction } from "mobx"
import { FilterKey, FilterType } from 'Types/filter/filterType'
import { filtersMap } from 'Types/filter/newFilter'
import { makeAutoObservable, runInAction, observable, action, reaction } from 'mobx';
import { FilterKey, FilterType, FilterCategory } from 'Types/filter/filterType';
import { filtersMap } from 'Types/filter/newFilter';
export default class FilterItem {
type: string = ''
key: string = ''
label: string = ''
value: any = [""]
isEvent: boolean = false
operator: string = ''
source: string = ''
filters: FilterItem[] = []
operatorOptions: any[] = []
options: any[] = []
isActive: boolean = true
completed: number = 0
dropped: number = 0
type: string = '';
category: FilterCategory = FilterCategory.METADATA;
key: string = '';
label: string = '';
value: any = [''];
isEvent: boolean = false;
operator: string = '';
hasSource: boolean = false;
source: string = '';
sourceOperator: string = '';
sourceOperatorOptions: any = [];
filters: FilterItem[] = [];
operatorOptions: any[] = [];
options: any[] = [];
isActive: boolean = true;
completed: number = 0;
dropped: number = 0;
constructor(data: any = {}) {
makeAutoObservable(this, {
@ -26,9 +30,10 @@ export default class FilterItem {
source: observable,
filters: observable,
isActive: observable,
sourceOperator: observable,
merge: action
})
merge: action,
});
if (Array.isArray(data.filters)) {
data.filters = data.filters.map(function (i) {
@ -36,55 +41,63 @@ export default class FilterItem {
});
}
this.merge(data)
this.merge(data);
}
updateKey(key: string, value: any) {
this[key] = value
this[key] = value;
}
merge(data) {
Object.keys(data).forEach(key => {
this[key] = data[key]
})
merge(data: any) {
Object.keys(data).forEach((key) => {
this[key] = data[key];
});
}
fromJson(json, mainFilterKey = '') {
let _filter = filtersMap[json.type] || {}
fromJson(json: any, mainFilterKey = '') {
const isMetadata = json.type === FilterKey.METADATA;
let _filter: any = (isMetadata ? filtersMap[json.source] : filtersMap[json.type]) || {};
if (mainFilterKey) {
const mainFilter = filtersMap[mainFilterKey];
const subFilterMap = {}
mainFilter.filters.forEach(option => {
subFilterMap[option.key] = option
})
_filter = subFilterMap[json.type]
const subFilterMap = {};
mainFilter.filters.forEach((option: any) => {
subFilterMap[option.key] = option;
});
_filter = subFilterMap[json.type];
}
this.type = _filter.type
this.key = _filter.key
this.label = _filter.label
this.operatorOptions = _filter.operatorOptions
this.options = _filter.options
this.isEvent = _filter.isEvent
this.type = _filter.type;
this.key = _filter.key;
this.label = _filter.label;
this.operatorOptions = _filter.operatorOptions;
this.hasSource = _filter.hasSource;
this.category = _filter.category;
this.sourceOperatorOptions = _filter.sourceOperatorOptions;
this.options = _filter.options;
this.isEvent = _filter.isEvent;
this.value = json.value.length === 0 || !json.value ? [""] : json.value,
this.operator = json.operator
this.filters = _filter.type === FilterType.SUB_FILTERS && json.filters ? json.filters.map(i => new FilterItem().fromJson(i, json.type)) : []
(this.value = json.value.length === 0 || !json.value ? [''] : json.value), (this.operator = json.operator);
this.sourceOperator = json.sourceOperator;
this.completed = json.completed
this.dropped = json.dropped
return this
this.filters =
_filter.type === FilterType.SUB_FILTERS && json.filters ? json.filters.map((i: any) => new FilterItem().fromJson(i, json.type)) : [];
this.completed = json.completed;
this.dropped = json.dropped;
return this;
}
toJson() {
toJson(): any {
const isMetadata = this.category === FilterCategory.METADATA;
const json = {
type: this.key,
type: isMetadata ? FilterKey.METADATA : this.key,
isEvent: this.isEvent,
value: this.value,
operator: this.operator,
source: this.source,
filters: Array.isArray(this.filters) ? this.filters.map(i => i.toJson()) : [],
}
return json
source: isMetadata ? this.key : this.source,
sourceOperator: this.sourceOperator,
filters: Array.isArray(this.filters) ? this.filters.map((i) => i.toJson()) : [],
};
return json;
}
}
}