diff --git a/frontend/app/components/BugFinder/BugFinder.js b/frontend/app/components/BugFinder/BugFinder.js index f85dc0525..24952ac61 100644 --- a/frontend/app/components/BugFinder/BugFinder.js +++ b/frontend/app/components/BugFinder/BugFinder.js @@ -10,7 +10,6 @@ import { fetchList as fetchFunnelsList } from 'Duck/funnels'; import { defaultFilters, preloadedFilters } from 'Types/filter'; import { KEYS } from 'Types/filter/customFilter'; import SessionList from './SessionList'; -import FunnelList from 'Components/Funnels/FunnelList'; import stl from './bugFinder.css'; import { fetchList as fetchSiteList } from 'Duck/site'; import withLocationHandlers from "HOCs/withLocationHandlers"; @@ -84,21 +83,22 @@ export default class BugFinder extends React.PureComponent { state = {showRehydratePanel: false} constructor(props) { super(props); - // props.fetchFavoriteSessionList(); - // TODO should cache the response - props.fetchSources().then(() => { - defaultFilters[6] = { - category: 'Collaboration', - type: 'CUSTOM', - keys: this.props.sources.filter(({type}) => type === 'collaborationTool').map(({ label, key }) => ({ type: 'CUSTOM', source: key, label: label, key, icon: 'integrations/' + key, isFilter: false })).toJS() - }; - defaultFilters[7] = { - category: 'Logging Tools', - type: 'ERROR', - keys: this.props.sources.filter(({type}) => type === 'logTool').map(({ label, key }) => ({ type: 'ERROR', source: key, label: label, key, icon: 'integrations/' + key, isFilter: false })).toJS() - }; - }); + // props.fetchFavoriteSessionList(); + // TODO should cache the response + // props.fetchSources().then(() => { + // defaultFilters[6] = { + // category: 'Collaboration', + // type: 'CUSTOM', + // keys: this.props.sources.filter(({type}) => type === 'collaborationTool').map(({ label, key }) => ({ type: 'CUSTOM', source: key, label: label, key, icon: 'integrations/' + key, isFilter: false })).toJS() + // }; + // defaultFilters[7] = { + // category: 'Logging Tools', + // type: 'ERROR', + // keys: this.props.sources.filter(({type}) => type === 'logTool').map(({ label, key }) => ({ type: 'ERROR', source: key, label: label, key, icon: 'integrations/' + key, isFilter: false })).toJS() + // }; + // }); + // // TODO should cache the response props.fetchIntegrationVariables().then(() => { defaultFilters[5] = { category: 'Metadata', @@ -125,28 +125,28 @@ export default class BugFinder extends React.PureComponent { this.setState({ showRehydratePanel: !this.state.showRehydratePanel }) } - fetchPreloadedFilters = () => { - this.props.fetchFilterVariables('filterValues').then(function() { - const { filterValues } = this.props; - const keys = [ - {key: KEYS.USER_OS, label: 'OS'}, - {key: KEYS.USER_BROWSER, label: 'Browser'}, - {key: KEYS.USER_DEVICE, label: 'Device'}, - {key: KEYS.REFERRER, label: 'Referrer'}, - {key: KEYS.USER_COUNTRY, label: 'Country'}, - ] - if (filterValues && filterValues.size != 0) { - keys.forEach(({key, label}) => { - const _keyFilters = filterValues.get(key) - if (key === KEYS.USER_COUNTRY) { - preloadedFilters.push(_keyFilters.map(item => ({label, type: key, key, value: item, actualValue: countries[item], isFilter: true}))); - } else { - preloadedFilters.push(_keyFilters.map(item => ({label, type: key, key, value: item, isFilter: true}))); - } - }) - } - }.bind(this)); - } + // fetchPreloadedFilters = () => { + // this.props.fetchFilterVariables('filterValues').then(function() { + // const { filterValues } = this.props; + // const keys = [ + // {key: KEYS.USER_OS, label: 'OS'}, + // {key: KEYS.USER_BROWSER, label: 'Browser'}, + // {key: KEYS.USER_DEVICE, label: 'Device'}, + // {key: KEYS.REFERRER, label: 'Referrer'}, + // {key: KEYS.USER_COUNTRY, label: 'Country'}, + // ] + // if (filterValues && filterValues.size != 0) { + // keys.forEach(({key, label}) => { + // const _keyFilters = filterValues.get(key) + // if (key === KEYS.USER_COUNTRY) { + // preloadedFilters.push(_keyFilters.map(item => ({label, type: key, key, value: item, actualValue: countries[item], isFilter: true}))); + // } else { + // preloadedFilters.push(_keyFilters.map(item => ({label, type: key, key, value: item, isFilter: true}))); + // } + // }) + // } + // }.bind(this)); + // } setActiveTab = tab => { this.props.setActiveTab(tab); @@ -175,7 +175,6 @@ export default class BugFinder extends React.PureComponent { - { activeFlow && activeFlow.type === 'flows' && } { activeTab.type !== 'live' && } { activeTab.type === 'live' && } diff --git a/frontend/app/components/BugFinder/SessionList/SessionList.js b/frontend/app/components/BugFinder/SessionList/SessionList.js index bad305cbe..5d53116a2 100644 --- a/frontend/app/components/BugFinder/SessionList/SessionList.js +++ b/frontend/app/components/BugFinder/SessionList/SessionList.js @@ -1,12 +1,10 @@ import { connect } from 'react-redux'; -import { Loader, NoContent, Message, Icon, Button, LoadMoreButton } from 'UI'; +import { Loader, NoContent, Button, LoadMoreButton } from 'UI'; import { applyFilter, addAttribute, addEvent } from 'Duck/filters'; import { fetchSessions } from 'Duck/search'; import SessionItem from 'Shared/SessionItem'; import SessionListHeader from './SessionListHeader'; -// import { KEYS } from 'Types/filter/customFilter'; -import { addFilter } from 'Duck/search'; -import { filtersMap } from 'Types/filter/newFilter'; +import { addFilterByKeyAndValue } from 'Duck/search'; import { FilterKey } from 'Types/filter/filterType'; const ALL = 'all'; @@ -27,7 +25,7 @@ var timeoutId; addAttribute, addEvent, fetchSessions, - addFilter, + addFilterByKeyAndValue, }) export default class SessionList extends React.PureComponent { state = { @@ -47,20 +45,11 @@ export default class SessionList extends React.PureComponent { addPage = () => this.setState({ showPages: this.state.showPages + 1 }) onUserClick = (userId, userAnonymousId) => { - let userFilter = filtersMap[FilterKey.USERID]; if (userId) { - userFilter = filtersMap[FilterKey.USERID]; - userFilter.value = [userId]; - // userFilter = { label: 'User Id', key: KEYS.USERID, type: KEYS.USERID, operator: 'is', value: userId } - // this.props.addAttribute({ label: 'User Id', key: KEYS.USERID, type: KEYS.USERID, operator: 'is', value: userId }) + this.props.addFilterByKeyAndValue(FilterKey.USERID, userId); } else { - userFilter = filtersMap[FilterKey.USERANONYMOUSID]; - userFilter.value = [userAnonymousId]; - // this.props.addAttribute({ label: 'Anonymous ID', key: 'USERANONYMOUSID', type: "USERANONYMOUSID", operator: 'is', value: userAnonymousId }) + this.props.addFilterByKeyAndValue(FilterKey.USERANONYMOUSID, userAnonymousId); } - - this.props.addFilter(userFilter); - // this.props.applyFilter() } timeout = () => { diff --git a/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx b/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx index 85b98525c..bc7c6917d 100644 --- a/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx +++ b/frontend/app/components/shared/Filters/FilterModal/FilterModal.tsx @@ -4,7 +4,7 @@ import { connect } from 'react-redux'; import cn from 'classnames'; import stl from './FilterModal.css'; import { filtersMap, getMetaDataFilter } from 'Types/filter/newFilter'; -import { FilterKey, FilterType } from 'Types/filter/filterType'; +// import { FilterKey, FilterType } from 'Types/filter/filterType'; interface Props { filters: any, @@ -25,7 +25,7 @@ function FilterModal(props: Props) { fetchingFilterSearchList, searchQuery = '', } = props; - const hasFilerSearchList = filterSearchList && Object.keys(filterSearchList).length > 0; + // const hasFilerSearchList = filterSearchList && Object.keys(filterSearchList).length > 0; const hasSearchQuery = searchQuery && searchQuery.length > 0; const showSearchList = isMainSearch && searchQuery.length > 0; diff --git a/frontend/app/constants/filterOptions.js b/frontend/app/constants/filterOptions.js index b59f4744d..868379e86 100644 --- a/frontend/app/constants/filterOptions.js +++ b/frontend/app/constants/filterOptions.js @@ -1,124 +1,36 @@ export const options = [ - { - key: 'is', - text: 'is', - value: 'is' - }, - { - key: 'isAny', - text: 'is any', - value: 'isAny' - }, { - key: 'isNot', - text: 'is not', - value: 'isNot' - }, { - key: 'startsWith', - text: 'starts with', - value: 'startsWith' - }, { - key: 'endsWith', - text: 'ends with', - value: 'endsWith' - }, { - key: 'contains', - text: 'contains', - value: 'contains' - }, { - key: 'notContains', - text: 'not contains', - value: 'notContains' - }, { - key: 'hasAnyValue', - text: 'has any value', - value: 'hasAnyValue' - }, { - key: 'hasNoValue', - text: 'has no value', - value: 'hasNoValue' - }, - { - key: 'isSignedUp', - text: 'is signed up', - value: 'isSignedUp' - }, { - key: 'notSignedUp', - text: 'not signed up', - value: 'notSignedUp' - }, - { - key: 'before', - text: 'before', - value: 'before' - }, { - key: 'after', - text: 'after', - value: 'after' - }, { - key: 'on', - text: 'on', - value: 'on' - }, { - key: 'notOn', - text: 'not on', - value: 'notOn' - }, { - key: 'inRage', - text: 'in rage', - value: 'inRage' - }, { - key: 'notInRage', - text: 'not in rage', - value: 'notInRage' - }, { - key: 'withinLast', - text: 'within last', - value: 'withinLast' - }, { - key: 'notWithinLast', - text: 'not within last', - value: 'notWithinLast' - }, - { - key: 'greaterThan', - text: 'greater than', - value: 'greaterThan' - }, { - key: 'lessThan', - text: 'less than', - value: 'lessThan' - }, { - key: 'equal', - text: 'equal', - value: 'equal' - }, { - key: 'not equal', - text: 'not equal', - value: 'not equal' - }, - { - key: 'onSelector', - text: 'on selector', - value: 'onSelector' - }, { - key: 'onText', - text: 'on text', - value: 'onText' - }, { - key: 'onComponent', - text: 'on component', - value: 'onComponent' - }, - { - key: 'onAny', - text: 'on any', - value: 'onAny' - } + { key: 'on', text: 'on', value: 'on' }, + { key: 'notOn', text: 'not on', value: 'notOn' }, + { key: 'onAny', text: 'on any', value: 'onAny' }, + { key: 'is', text: 'is', value: 'is' }, + { key: 'isAny', text: 'is any', value: 'isAny' }, + { key: 'isNot', text: 'is not', value: 'isNot' }, + { key: 'startsWith', text: 'starts with', value: 'startsWith' }, + { key: 'endsWith', text: 'ends with', value: 'endsWith' }, + { key: 'contains', text: 'contains', value: 'contains' }, + { key: 'notContains', text: 'not contains', value: 'notContains' }, + { key: 'hasAnyValue', text: 'has any value', value: 'hasAnyValue' }, + { key: 'hasNoValue', text: 'has no value', value: 'hasNoValue' }, + { key: 'isSignedUp', text: 'is signed up', value: 'isSignedUp' }, + { key: 'notSignedUp', text: 'not signed up', value: 'notSignedUp' }, + { key: 'before', text: 'before', value: 'before' }, + { key: 'after', text: 'after', value: 'after' }, + { key: 'inRage', text: 'in rage', value: 'inRage' }, + { key: 'notInRage', text: 'not in rage', value: 'notInRage' }, + { key: 'withinLast', text: 'within last', value: 'withinLast' }, + { key: 'notWithinLast', text: 'not within last', value: 'notWithinLast' }, + { key: 'greaterThan', text: 'greater than', value: 'greaterThan' }, + { key: 'lessThan', text: 'less than', value: 'lessThan' }, + { key: 'equal', text: 'equal', value: 'equal' }, + { key: 'not equal', text: 'not equal', value: 'not equal' }, + { key: 'onSelector', text: 'on selector', value: 'onSelector' }, + { key: 'onText', text: 'on text', value: 'onText' }, + { key: 'onComponent', text: 'on component', value: 'onComponent' }, ]; const filterKeys = ['is', 'isNot']; const stringFilterKeys = ['is', 'isAny', 'isNot', 'contains', 'startsWith', 'endsWith', 'notContains']; -const targetFilterKeys = ['on', 'notOn', 'onAny']; +const targetFilterKeys = ['on', 'notOn', 'onAny', 'contains', 'startsWith', 'endsWith', 'notContains']; const signUpStatusFilterKeys = ['isSignedUp', 'notSignedUp']; const rangeFilterKeys = ['before', 'after', 'on', 'inRange', 'notInRange', 'withInLast', 'notWithInLast']; diff --git a/frontend/app/duck/search.js b/frontend/app/duck/search.js index 283bf9bf6..3c0092a3a 100644 --- a/frontend/app/duck/search.js +++ b/frontend/app/duck/search.js @@ -8,6 +8,7 @@ import { errors as errorsRoute, isRoute } from "App/routes"; import { fetchList as fetchSessionList } from './sessions'; import { fetchList as fetchErrorsList } from './errors'; import { FilterCategory, FilterKey } from '../types/filter/filterType'; +import { filtersMap } from 'Types/filter/newFilter'; const ERRORS_ROUTE = errorsRoute(); @@ -204,16 +205,27 @@ export const clearSearch = () => (dispatch, getState) => { }); } +const checkFilterValue = (value) => { + return Array.isArray(value) ? (value.length === 0 ? [""] : value) : [value]; +} + export const addFilter = (filter) => (dispatch, getState) => { - filter.value = Array.isArray(filter.value) ? (filter.value.length === 0 ? [""] : filter.value) : [filter.value]; + filter.value = checkFilterValue(filter.value); const instance = getState().getIn([ 'search', 'instance']); const filters = instance.filters.push(filter); return dispatch(edit(instance.set('filters', filters))); } +export const addFilterByKeyAndValue = (key, value) => (dispatch, getState) => { + let defaultFilter = filtersMap[key]; + defaultFilter.value = value; + dispatch(addFilter(defaultFilter)); +} + export const editSavedSearch = instance => { return { type: EDIT_SAVED_SEARCH, instance, } -}; \ No newline at end of file +}; + diff --git a/frontend/app/types/customMetric.js b/frontend/app/types/customMetric.js index 14b327cab..d5238a0aa 100644 --- a/frontend/app/types/customMetric.js +++ b/frontend/app/types/customMetric.js @@ -29,7 +29,7 @@ export default Record({ name: 'Series', viewType: 'lineChart', series: List(), - isPublic: false, + isPublic: true, startDate: '', endDate: '', active: true,