diff --git a/frontend/app/components/BugFinder/BugFinder.js b/frontend/app/components/BugFinder/BugFinder.js index 93ad66347..dee0470ce 100644 --- a/frontend/app/components/BugFinder/BugFinder.js +++ b/frontend/app/components/BugFinder/BugFinder.js @@ -1,5 +1,6 @@ import cn from 'classnames'; import { connect } from 'react-redux'; +import { List } from 'immutable'; import withPageTitle from 'HOCs/withPageTitle'; import { fetchFavoriteList as fetchFavoriteSessionList @@ -30,6 +31,8 @@ import SessionSearchField from 'Shared/SessionSearchField' import SavedSearch from 'Shared/SavedSearch' import LiveSessionList from './LiveSessionList' import SessionSearch from 'Shared/SessionSearch'; +import { edit as editSearch } from 'Duck/search'; +import { Button } from 'UI'; const weakEqual = (val1, val2) => { if (!!val1 === false && !!val2 === false) return true; @@ -78,7 +81,8 @@ const allowedQueryKeys = [ fetchFunnelsList, resetFunnel, resetFunnelFilters, - setFunnelPage + setFunnelPage, + editSearch, }) @withPageTitle("Sessions - OpenReplay") export default class BugFinder extends React.PureComponent { @@ -174,8 +178,13 @@ export default class BugFinder extends React.PureComponent { className="mb-5" >
-
- +
+
+ + +
{/* */} diff --git a/frontend/app/components/shared/Filters/FilterList/FilterList.tsx b/frontend/app/components/shared/Filters/FilterList/FilterList.tsx index 2f9174eb0..67919fc1a 100644 --- a/frontend/app/components/shared/Filters/FilterList/FilterList.tsx +++ b/frontend/app/components/shared/Filters/FilterList/FilterList.tsx @@ -1,6 +1,6 @@ import React, { useState} from 'react'; import FilterItem from '../FilterItem'; -import { SegmentSelection } from 'UI'; +import { SegmentSelection, Popup } from 'UI'; interface Props { // filters: any[]; // event/filter @@ -29,9 +29,17 @@ function FilterList(props: Props) { { hasEvents && ( <>
-
EVENTS
+
EVENTS
-
Events Order
+
+ Events Order
} + content={ `Events Order` } + size="tiny" + inverted + position="top center" + /> +
- {hasEvents &&
} + {hasEvents &&
}
FILTERS
{filters.map((filter, filterIndex) => !filter.isEvent ? (
{filters && Object.keys(filters).map((key) => ( -
-
{key}
+
+
{key}
{filters[key].map((filter: any) => (
onFilterClick(filter)}> diff --git a/frontend/app/components/shared/SavedSearch/SavedSearch.tsx b/frontend/app/components/shared/SavedSearch/SavedSearch.tsx index 170e90004..cd08d2137 100644 --- a/frontend/app/components/shared/SavedSearch/SavedSearch.tsx +++ b/frontend/app/components/shared/SavedSearch/SavedSearch.tsx @@ -22,19 +22,28 @@ function SavedSearch(props) { onClickOutside={() => setShowMenu(false)} >
- +
+ + +
+ + Viewing: + Login ... +
+
+ { showMenu && (
- + setShowMenu(false)} />
)}
diff --git a/frontend/app/components/shared/SavedSearch/components/SavedSearchDropdown/SavedSearchDropdown.tsx b/frontend/app/components/shared/SavedSearch/components/SavedSearchDropdown/SavedSearchDropdown.tsx index 8ba2cfc91..b25bbb8e8 100644 --- a/frontend/app/components/shared/SavedSearch/components/SavedSearchDropdown/SavedSearchDropdown.tsx +++ b/frontend/app/components/shared/SavedSearch/components/SavedSearchDropdown/SavedSearchDropdown.tsx @@ -1,15 +1,18 @@ import React from 'react'; import stl from './SavedSearchDropdown.css'; import { Icon } from 'UI'; -import { applyFilter } from 'Duck/search' +import { applyFilter, remove } from 'Duck/search' import { connect } from 'react-redux'; +import { confirm } from 'UI/Confirmation'; interface Props { list: Array applyFilter: (filter: any) => void + remove: (id: string) => Promise + onClose: () => void } -function Row ({ name, onClick }) { +function Row ({ name, onClick, onClickEdit, onDelete }) { return (
{name}
-
-
+
+
) @@ -27,14 +30,38 @@ function Row ({ name, onClick }) { function SavedSearchDropdown(props: Props) { const onClick = (item) => { props.applyFilter(item.filter) + props.onClose() } + + const onDelete = async (instance) => { + if (await confirm({ + header: 'Confirm', + confirmButton: 'Yes, Delete', + confirmation: `Are you sure you want to permanently delete this search?` + })) { + props.remove(instance.alertId).then(() => { + // toggleForm(null, false); + }); + } + } + + const onClickEdit = (instance) => { + // toggleForm(instance); + } + return (
{props.list.map(item => ( - onClick(item)} /> + onClick(item)} + onDelete={() => onDelete(item) } + onClickEdit={() => onClickEdit(item)} + /> ))}
); } -export default connect(null, { applyFilter })(SavedSearchDropdown); \ No newline at end of file +export default connect(null, { applyFilter, remove })(SavedSearchDropdown); \ No newline at end of file diff --git a/frontend/app/components/shared/SessionSearch/SessionSearch.tsx b/frontend/app/components/shared/SessionSearch/SessionSearch.tsx index 370c7977f..0955f3c1f 100644 --- a/frontend/app/components/shared/SessionSearch/SessionSearch.tsx +++ b/frontend/app/components/shared/SessionSearch/SessionSearch.tsx @@ -84,7 +84,6 @@ function SessionSearch(props) {
-