diff --git a/frontend/app/components/Funnels/FunnelHeader/FunnelHeader.js b/frontend/app/components/Funnels/FunnelHeader/FunnelHeader.js index 5d4f6adf6..a94845294 100644 --- a/frontend/app/components/Funnels/FunnelHeader/FunnelHeader.js +++ b/frontend/app/components/Funnels/FunnelHeader/FunnelHeader.js @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react'; import { Icon, BackLink, IconButton, Dropdown, Popup, TextEllipsis, Button } from 'UI'; import { remove as deleteFunnel, fetch, fetchInsights, fetchIssuesFiltered, fetchSessionsFiltered } from 'Duck/funnels'; -import { applyFilter } from 'Duck/funnelFilters'; +import { editFilter, addFilter } from 'Duck/funnels'; import DateRange from 'Shared/DateRange'; import { connect } from 'react-redux'; import { confirm } from 'UI/Confirmation'; @@ -18,23 +18,18 @@ const Info = ({ label = '', value = '', className = 'mx-4' }) => { } const FunnelHeader = (props) => { - const { funnelFilters, funnel, insights, funnels, onBack, funnelId, showFilters = false, renameHandler } = props; + const { funnel, insights, funnels, onBack, funnelId, showFilters = false, renameHandler } = props; const [showSaveModal, setShowSaveModal] = useState(false) - const writeOption = (e, { name, value }) => { + const writeOption = (e, { name, value }) => { props.fetch(value) + props.fetchInsights(value, {}) + props.fetchIssuesFiltered(value, {}) + props.fetchSessionsFiltered(value, {}) props.redirect(value) } - useEffect(() => { - if (funnel.funnelId && funnel.funnelId !== funnelId) { - props.fetchInsights(funnel.funnelId, {}) - props.fetchIssuesFiltered(funnel.funnelId, {}) - props.fetchSessionsFiltered(funnel.funnelId, {}) - } - }, [funnel]) - const deleteFunnel = async (e, funnel) => { e.preventDefault(); e.stopPropagation(); @@ -49,7 +44,7 @@ const FunnelHeader = (props) => { } const onDateChange = (e) => { - props.applyFilter(e, funnel.funnelId) + props.editFilter(e, funnel.funnelId); } const options = funnels.map(({ funnelId, name }) => ({ text: name, value: funnelId })).toJS(); @@ -75,7 +70,7 @@ const FunnelHeader = (props) => { className={ stl.dropdown } name="funnel" value={ parseInt(funnelId) } - icon={null} + // icon={null} onChange={ writeOption } selectOnBlur={false} icon={ } @@ -104,9 +99,9 @@ const FunnelHeader = (props) => { /> @@ -117,5 +112,5 @@ const FunnelHeader = (props) => { } export default connect(state => ({ - funnelFilters: state.getIn([ 'funnels', 'instance' ]), -}), { applyFilter, deleteFunnel, fetch, fetchInsights, fetchIssuesFiltered, fetchSessionsFiltered })(FunnelHeader) + funnel: state.getIn([ 'funnels', 'instance' ]), +}), { editFilter, deleteFunnel, fetch, fetchInsights, fetchIssuesFiltered, fetchSessionsFiltered })(FunnelHeader) diff --git a/frontend/app/components/shared/SaveFunnelButton/SaveFunnelButton.tsx b/frontend/app/components/shared/SaveFunnelButton/SaveFunnelButton.tsx index c68c451d0..2dfd76ee3 100644 --- a/frontend/app/components/shared/SaveFunnelButton/SaveFunnelButton.tsx +++ b/frontend/app/components/shared/SaveFunnelButton/SaveFunnelButton.tsx @@ -1,14 +1,24 @@ import React, { useState } from 'react'; import { IconButton } from 'UI'; import FunnelSaveModal from 'App/components/Funnels/FunnelSaveModal'; - -export default function SaveFunnelButton() { +import { connect } from 'react-redux'; +import { init } from 'Duck/funnels'; +interface Props { + filter: any + init: (instance: any) => void +} +function SaveFunnelButton(props: Props) { const [showModal, setshowModal] = useState(false) + + const handleClick = () => { + props.init({ filter: props.filter }) + setshowModal(true) + } return (
setshowModal(true)} primaryText label="SAVE FUNNEL" icon="funnel" + onClick={handleClick} primaryText label="SAVE FUNNEL" icon="funnel" /> ) } + +export default connect(state => ({ + filter: state.getIn(['search', 'instance']), +}), { init })(SaveFunnelButton); \ No newline at end of file diff --git a/frontend/app/duck/funnelFilters.js b/frontend/app/duck/funnelFilters.js index 468887afb..298cdd445 100644 --- a/frontend/app/duck/funnelFilters.js +++ b/frontend/app/duck/funnelFilters.js @@ -112,9 +112,9 @@ const reducer = (state = initialState, action = {}) => { return action.fromUrl ? state.set('appliedFilter', Filter(action.filter) - .set('events', state.getIn([ 'appliedFilter', 'events' ])) + // .set('events', state.getIn([ 'appliedFilter', 'events' ])) ) - : state.mergeIn(['instance'], action.filter); + : state.mergeIn(['instance', 'filter'], action.filter); case ADD_CUSTOM_FILTER: return state.update('customFilters', vars => vars.set(action.filter, action.value)); case REMOVE_CUSTOM_FILTER: diff --git a/frontend/app/duck/search.js b/frontend/app/duck/search.js index cf742e556..3d15ae950 100644 --- a/frontend/app/duck/search.js +++ b/frontend/app/duck/search.js @@ -60,7 +60,6 @@ function reducer(state = initialState, action = {}) { case EDIT: return state.mergeIn(['instance'], action.instance); case APPLY: - console.log('APPLY', action.filter); return action.fromUrl ? state.set('instance', Filter(action.filter)) : state.mergeIn(['instance'], action.filter);