Fix clear filters on agents table not working (#71978)
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
parent
d0d271c07d
commit
9195ce4e39
|
@ -3,7 +3,7 @@
|
||||||
* or more contributor license agreements. Licensed under the Elastic License;
|
* or more contributor license agreements. Licensed under the Elastic License;
|
||||||
* you may not use this file except in compliance with the Elastic License.
|
* you may not use this file except in compliance with the Elastic License.
|
||||||
*/
|
*/
|
||||||
import React, { useState, useMemo } from 'react';
|
import React, { useState, useMemo, useCallback } from 'react';
|
||||||
import {
|
import {
|
||||||
EuiBasicTable,
|
EuiBasicTable,
|
||||||
EuiButton,
|
EuiButton,
|
||||||
|
@ -144,13 +144,20 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
|
||||||
const [search, setSearch] = useState(defaultKuery);
|
const [search, setSearch] = useState(defaultKuery);
|
||||||
const { pagination, pageSizeOptions, setPagination } = usePagination();
|
const { pagination, pageSizeOptions, setPagination } = usePagination();
|
||||||
|
|
||||||
// Configs state (for filtering)
|
// Configs state for filtering
|
||||||
const [isConfigsFilterOpen, setIsConfigsFilterOpen] = useState<boolean>(false);
|
const [isConfigsFilterOpen, setIsConfigsFilterOpen] = useState<boolean>(false);
|
||||||
const [selectedConfigs, setSelectedConfigs] = useState<string[]>([]);
|
const [selectedConfigs, setSelectedConfigs] = useState<string[]>([]);
|
||||||
|
|
||||||
// Status for filtering
|
// Status for filtering
|
||||||
const [isStatusFilterOpen, setIsStatutsFilterOpen] = useState<boolean>(false);
|
const [isStatusFilterOpen, setIsStatutsFilterOpen] = useState<boolean>(false);
|
||||||
const [selectedStatus, setSelectedStatus] = useState<string[]>([]);
|
const [selectedStatus, setSelectedStatus] = useState<string[]>([]);
|
||||||
|
|
||||||
|
const clearFilters = useCallback(() => {
|
||||||
|
setSearch('');
|
||||||
|
setSelectedConfigs([]);
|
||||||
|
setSelectedStatus([]);
|
||||||
|
}, [setSearch, setSelectedConfigs, setSelectedStatus]);
|
||||||
|
|
||||||
// Add a config id to current search
|
// Add a config id to current search
|
||||||
const addConfigFilter = (configId: string) => {
|
const addConfigFilter = (configId: string) => {
|
||||||
setSelectedConfigs([...selectedConfigs, configId]);
|
setSelectedConfigs([...selectedConfigs, configId]);
|
||||||
|
@ -500,7 +507,7 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
|
||||||
<EuiBasicTable<Agent>
|
<EuiBasicTable<Agent>
|
||||||
className="fleet__agentList__table"
|
className="fleet__agentList__table"
|
||||||
data-test-subj="fleetAgentListTable"
|
data-test-subj="fleetAgentListTable"
|
||||||
loading={isLoading && agentsRequest.isInitialRequest}
|
loading={isLoading}
|
||||||
hasActions={true}
|
hasActions={true}
|
||||||
noItemsMessage={
|
noItemsMessage={
|
||||||
isLoading && agentsRequest.isInitialRequest ? (
|
isLoading && agentsRequest.isInitialRequest ? (
|
||||||
|
@ -508,15 +515,13 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
|
||||||
id="xpack.ingestManager.agentList.loadingAgentsMessage"
|
id="xpack.ingestManager.agentList.loadingAgentsMessage"
|
||||||
defaultMessage="Loading agents…"
|
defaultMessage="Loading agents…"
|
||||||
/>
|
/>
|
||||||
) : !search.trim() && selectedConfigs.length === 0 && totalAgents === 0 ? (
|
) : search.trim() || selectedConfigs.length || selectedStatus.length ? (
|
||||||
emptyPrompt
|
|
||||||
) : (
|
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
id="xpack.ingestManager.agentList.noFilteredAgentsPrompt"
|
id="xpack.ingestManager.agentList.noFilteredAgentsPrompt"
|
||||||
defaultMessage="No agents found. {clearFiltersLink}"
|
defaultMessage="No agents found. {clearFiltersLink}"
|
||||||
values={{
|
values={{
|
||||||
clearFiltersLink: (
|
clearFiltersLink: (
|
||||||
<EuiLink onClick={() => setSearch('')}>
|
<EuiLink onClick={() => clearFilters()}>
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
id="xpack.ingestManager.agentList.clearFiltersLinkText"
|
id="xpack.ingestManager.agentList.clearFiltersLinkText"
|
||||||
defaultMessage="Clear filters"
|
defaultMessage="Clear filters"
|
||||||
|
@ -525,7 +530,9 @@ export const AgentListPage: React.FunctionComponent<{}> = () => {
|
||||||
),
|
),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)
|
) : !isLoading && totalAgents === 0 ? (
|
||||||
|
emptyPrompt
|
||||||
|
) : undefined
|
||||||
}
|
}
|
||||||
items={totalAgents ? agents : []}
|
items={totalAgents ? agents : []}
|
||||||
itemId="id"
|
itemId="id"
|
||||||
|
|
Loading…
Reference in a new issue