Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Security Solution][Endpoint] Hide agent types on Types filter when on a flyout and other UI changes #176280

Merged
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export const ActionLogButton = memo<EndpointResponderExtensionComponentProps>((p
</EuiTitle>
</EuiFlyoutHeader>
<EuiFlyoutBody>
<ResponseActionsLog agentIds={props.meta.agentId} />
<ResponseActionsLog agentIds={props.meta.agentId} agentType={props.meta.agentType} />
</EuiFlyoutBody>
</EuiFlyout>
)}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import {
isAgentType,
} from '../../../../../common/endpoint/service/response_actions/type_guards';
import { useIsExperimentalFeatureEnabled } from '../../../../common/hooks/use_experimental_features';
import type { ResponseActionAgentType } from '../../../../../common/endpoint/service/response_actions/constants';
import {
RESPONSE_ACTION_API_COMMAND_TO_CONSOLE_COMMAND_MAP,
type ResponseActionsApiCommandNames,
Expand All @@ -30,12 +31,14 @@ import { useTestIdGenerator } from '../../../hooks/use_test_id_generator';

export const ActionsLogFilter = memo(
({
agentType,
filterName,
typesFilters,
isFlyout,
onChangeFilterOptions,
'data-test-subj': dataTestSubj,
}: {
agentType?: ResponseActionAgentType;
filterName: ActionsLogPopupFilters;
typesFilters?: TypesFilters;
isFlyout: boolean;
Expand Down Expand Up @@ -74,6 +77,7 @@ export const ActionsLogFilter = memo(
setUrlTypesFilters,
setUrlTypeFilters,
} = useActionsLogFilter({
agentType,
filterName,
isFlyout,
searchString,
Expand Down Expand Up @@ -211,7 +215,13 @@ export const ActionsLogFilter = memo(
// update filter UI options state
setItems(
items.map((option) => {
option.checked = undefined;
// for flyout filter don't uncheck selected agent type
if (agentType && agentType === option.key) {
option.checked = 'on';
} else {
option.checked = undefined;
}

return option;
})
);
Expand All @@ -231,14 +241,15 @@ export const ActionsLogFilter = memo(

// update query state for flyout filters
if (typesFilters && typeof onChangeFilterOptions === 'undefined') {
typesFilters.agentTypes.onChangeFilterOptions([]);
typesFilters.agentTypes.onChangeFilterOptions(agentType ? [agentType] : []);
typesFilters.actionTypes.onChangeFilterOptions([]);
} else {
if (typeof onChangeFilterOptions !== 'undefined') {
onChangeFilterOptions([]);
}
}
}, [
agentType,
setItems,
items,
isFlyout,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import type {
DurationRange,
OnRefreshChangeProps,
} from '@elastic/eui/src/components/date_picker/types';
import type { ResponseActionAgentType } from '../../../../../common/endpoint/service/response_actions/constants';
import { useIsExperimentalFeatureEnabled } from '../../../../common/hooks/use_experimental_features';
import type { useGetEndpointActionList } from '../../../hooks';
import {
Expand All @@ -22,6 +23,7 @@ import { useTestIdGenerator } from '../../../hooks/use_test_id_generator';

export const ActionsLogFilters = memo(
({
agentType,
dateRangePickerState,
isDataLoading,
isFlyout,
Expand All @@ -38,6 +40,7 @@ export const ActionsLogFilters = memo(
showHostsFilter,
'data-test-subj': dataTestSubj,
}: {
agentType: ResponseActionAgentType | undefined;
dateRangePickerState: DateRangePickerValues;
isDataLoading: boolean;
isFlyout: boolean;
Expand Down Expand Up @@ -89,6 +92,7 @@ export const ActionsLogFilters = memo(
{isSentinelOneV1Enabled
? responseActionsEnabled && (
<ActionsLogFilter
agentType={agentType}
filterName={'types'}
typesFilters={{
agentTypes: { onChangeFilterOptions: onChangeAgentTypesFilter },
Expand All @@ -109,6 +113,7 @@ export const ActionsLogFilters = memo(
</>
);
}, [
agentType,
showHostsFilter,
isFlyout,
isSentinelOneV1Enabled,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import type {
import { useIsExperimentalFeatureEnabled } from '../../../../common/hooks/use_experimental_features';
import { getAgentTypeName } from '../../../../common/translations';
import { ExperimentalFeaturesService } from '../../../../common/experimental_features_service';
import type { ResponseActionAgentType } from '../../../../../common/endpoint/service/response_actions/constants';
import {
RESPONSE_ACTION_AGENT_TYPE,
RESPONSE_ACTION_API_COMMAND_TO_CONSOLE_COMMAND_MAP,
Expand Down Expand Up @@ -126,6 +127,7 @@ export type FilterItems = Array<{
label: string;
isGroupLabel?: boolean;
checked?: 'on' | undefined;
disabled?: boolean;
'data-test-subj'?: string;
}>;

Expand Down Expand Up @@ -166,14 +168,21 @@ export type ActionsLogPopupFilters = Extract<
const getTypesFilterInitialState = (
ashokaditya marked this conversation as resolved.
Show resolved Hide resolved
isSentinelOneV1Enabled: boolean,
isFlyout: boolean,
agentType?: ResponseActionAgentType,
ashokaditya marked this conversation as resolved.
Show resolved Hide resolved
agentTypes?: string[],
types?: string[]
): FilterItems => {
const getFilterOptions = ({ key, label, checked }: FilterItems[number]): FilterItems[number] => ({
const getFilterOptions = ({
key,
label,
checked,
disabled = false,
}: FilterItems[number]): FilterItems[number] => ({
key,
label,
isGroupLabel: false,
checked,
disabled,
'data-test-subj': `types-filter-option`,
});

Expand All @@ -189,6 +198,22 @@ const getTypesFilterInitialState = (
// v8.13 onwards
// for showing agent types and action types in the same filter
if (isSentinelOneV1Enabled) {
// compute if agent type option is checked
const getIsChecked = (type: ResponseActionAgentType) => {
// for page filters
if (!isFlyout) {
if (agentTypes?.includes(type)) {
return 'on';
}
}

// for flyout filters
// pre select the current agent type
if (type === agentType) {
return 'on';
}
};

return [
{
label: FILTER_NAMES.agentTypes,
Expand All @@ -198,7 +223,10 @@ const getTypesFilterInitialState = (
getFilterOptions({
key: type,
label: getAgentTypeName(type),
checked: !isFlyout && agentTypes?.includes(type) ? 'on' : undefined,
checked: getIsChecked(type),
// for flyout filters disable agent types,
// that are not the current agent type
disabled: isFlyout,
})
),
{
Expand All @@ -213,10 +241,12 @@ const getTypesFilterInitialState = (
};

export const useActionsLogFilter = ({
agentType,
filterName,
isFlyout,
searchString,
}: {
agentType?: ResponseActionAgentType;
filterName: ActionsLogPopupFilters;
isFlyout: boolean;
searchString: string;
Expand Down Expand Up @@ -274,7 +304,7 @@ export const useActionsLogFilter = ({
// filter options
const [items, setItems] = useState<FilterItems>(
isTypesFilter
? getTypesFilterInitialState(isSentinelOneV1Enabled, isFlyout, agentTypes, types)
? getTypesFilterInitialState(isSentinelOneV1Enabled, isFlyout, agentType, agentTypes, types)
: isStatusesFilter
? RESPONSE_ACTION_STATUS.map((statusName) => ({
key: statusName,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,13 +34,15 @@ import { ActionsLogTable } from './components/actions_log_table';

export const ResponseActionsLog = memo<
Pick<EndpointActionListRequestQuery, 'agentIds'> & {
agentType?: ResponseActionAgentType;
showHostNames?: boolean;
isFlyout?: boolean;
setIsDataInResponse?: (isData: boolean) => void;
'data-test-subj'?: string;
}
>(
({
agentType,
agentIds,
showHostNames = false,
isFlyout = true,
Expand Down Expand Up @@ -73,7 +75,7 @@ export const ResponseActionsLog = memo<
page: isFlyout ? 1 : paginationFromUrlParams.page,
pageSize: isFlyout ? 10 : paginationFromUrlParams.pageSize,
agentIds: isFlyout ? agentIds : agentIdsFromUrl?.length ? agentIdsFromUrl : agentIds,
agentTypes: [],
agentTypes: isFlyout && agentType ? [agentType] : [],
commands: [],
statuses: [],
userIds: [],
Expand Down Expand Up @@ -275,6 +277,7 @@ export const ResponseActionsLog = memo<
return (
<>
<ActionsLogFilters
agentType={agentType}
isFlyout={isFlyout}
dateRangePickerState={dateRangePickerState}
isDataLoading={isFetching}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ type ShowResponseActionsConsole = (props: ResponderInfoProps) => void;
export interface BasicConsoleProps {
agentId: string;
hostName: string;
agentType: ResponseActionAgentType;
ashokaditya marked this conversation as resolved.
Show resolved Hide resolved
}

type ResponderInfoProps =
Expand Down Expand Up @@ -124,6 +125,7 @@ export const useWithShowResponder = (): ShowResponseActionsConsole => {
meta: {
agentId,
hostName,
agentType,
ashokaditya marked this conversation as resolved.
Show resolved Hide resolved
},
consoleProps,
PageTitleComponent: () => <>{RESPONDER_PAGE_TITLE}</>,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ export const EndpointDetails = memo(() => {
name: 'endpointActivityLog',
selected_endpoint: id,
}),
content: <ResponseActionsLog agentIds={id} />,
content: <ResponseActionsLog agentIds={id} agentType={'endpoint'} />,
ashokaditya marked this conversation as resolved.
Show resolved Hide resolved
});
}
return tabs;
Expand Down