diff --git a/x-pack/plugins/observability/public/pages/rules/index.tsx b/x-pack/plugins/observability/public/pages/rules/index.tsx index 801ea24fb46c3..a409754a51a14 100644 --- a/x-pack/plugins/observability/public/pages/rules/index.tsx +++ b/x-pack/plugins/observability/public/pages/rules/index.tsx @@ -23,11 +23,11 @@ import { FormattedMessage } from '@kbn/i18n-react'; import { deleteRules, RuleTableItem, + RuleStatus, enableRule, disableRule, snoozeRule, useLoadRuleTypes, - RuleStatus, unsnoozeRule, } from '@kbn/triggers-actions-ui-plugin/public'; import { RuleExecutionStatus, ALERTS_FEATURE_ID } from '@kbn/alerting-plugin/common'; @@ -83,7 +83,6 @@ function RulesPage() { application: { capabilities }, notifications: { toasts }, } = useKibana().services; - const { lastResponse, setLastResponse } = useRulesPageStateContainer(); const documentationLink = docLinks.links.observability.createAlerts; const ruleTypeRegistry = triggersActionsUi.ruleTypeRegistry; const canExecuteActions = hasExecuteActionsCapability(capabilities); @@ -94,8 +93,9 @@ function RulesPage() { }); const [inputText, setInputText] = useState(); const [searchText, setSearchText] = useState(); - const [ruleStatusesFilter, setRuleStatusesFilter] = useState([]); const [typesFilter, setTypesFilter] = useState([]); + const { lastResponse, setLastResponse } = useRulesPageStateContainer(); + const { status, setStatus } = useRulesPageStateContainer(); const [currentRuleToEdit, setCurrentRuleToEdit] = useState(null); const [rulesToDelete, setRulesToDelete] = useState([]); const [createRuleFlyoutVisibility, setCreateRuleFlyoutVisibility] = useState(false); @@ -111,7 +111,7 @@ function RulesPage() { const { rulesState, setRulesState, reload, noData, initialLoad } = useFetchRules({ searchText, ruleLastResponseFilter: lastResponse, - ruleStatusesFilter, + ruleStatusesFilter: status, typesFilter, page, setPage, @@ -289,6 +289,13 @@ function RulesPage() { [] ); + const setRuleStatusFilter = useCallback( + (ids: RuleStatus[]) => { + setStatus(ids); + }, + [setStatus] + ); + const setExecutionStatusFilter = useCallback( (ids: string[]) => { setLastResponse(ids); @@ -311,9 +318,6 @@ function RulesPage() { return ; } - // const nextSearchParams = new URLSearchParams(history.location.search); - // const xx = [...nextSearchParams.getAll('executionStatus')] || []; - // console.log(xx, '!!'); return ( <> @@ -357,8 +361,8 @@ function RulesPage() { {triggersActionsUi.getRuleStatusFilter({ - selectedStatuses: ruleStatusesFilter, - onChange: setRuleStatusesFilter, + selectedStatuses: status, + onChange: setRuleStatusFilter, })} diff --git a/x-pack/plugins/observability/public/pages/rules/state_container/state_container.tsx b/x-pack/plugins/observability/public/pages/rules/state_container/state_container.tsx index b36ffca96972e..039218add3508 100644 --- a/x-pack/plugins/observability/public/pages/rules/state_container/state_container.tsx +++ b/x-pack/plugins/observability/public/pages/rules/state_container/state_container.tsx @@ -9,19 +9,23 @@ import { createStateContainer, createStateContainerReactHelpers, } from '@kbn/kibana-utils-plugin/public'; +import { RuleStatus } from '@kbn/triggers-actions-ui-plugin/public'; interface RulesPageContainerState { lastResponse: string[]; + status: RuleStatus[]; } const defaultState: RulesPageContainerState = { lastResponse: [], + status: [], }; interface RulesPageStateTransitions { setLastResponse: ( state: RulesPageContainerState ) => (lastResponse: string[]) => RulesPageContainerState; + setStatus: (state: RulesPageContainerState) => (status: RuleStatus[]) => RulesPageContainerState; } const transitions: RulesPageStateTransitions = { @@ -39,6 +43,20 @@ const transitions: RulesPageStateTransitions = { }); return { ...state, lastResponse: filteredIds }; }, + setStatus: (state) => (status) => { + const filteredIds = status; + status.forEach((id) => { + const isPreviouslyChecked = state.status.includes(id); + if (!isPreviouslyChecked) { + filteredIds.concat(id); + } else { + filteredIds.filter((val) => { + return val !== id; + }); + } + }); + return { ...state, status: filteredIds }; + }, }; const rulesPageStateContainer = createStateContainer(defaultState, transitions); diff --git a/x-pack/plugins/observability/public/pages/rules/state_container/use_rules_page_state_container.tsx b/x-pack/plugins/observability/public/pages/rules/state_container/use_rules_page_state_container.tsx index 6b44dc8ae31d5..cd20de3f95c29 100644 --- a/x-pack/plugins/observability/public/pages/rules/state_container/use_rules_page_state_container.tsx +++ b/x-pack/plugins/observability/public/pages/rules/state_container/use_rules_page_state_container.tsx @@ -27,12 +27,14 @@ export function useRulesPageStateContainer() { useUrlStateSyncEffect(stateContainer); - const { setLastResponse } = stateContainer.transitions; - const { lastResponse } = useContainerSelector(stateContainer, (state) => state); + const { setLastResponse, setStatus } = stateContainer.transitions; + const { lastResponse, status } = useContainerSelector(stateContainer, (state) => state); return { lastResponse, + status, setLastResponse, + setStatus, }; }