Fix clear filters on agents table not working (#71978)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Jen Huang 2020-07-16 10:36:44 -07:00 committed by GitHub
parent d0d271c07d
commit 9195ce4e39
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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"