From 0fe23200951cbad411e74f655658d9bdb506699a Mon Sep 17 00:00:00 2001 From: Manan Vaghasiya Date: Thu, 24 Oct 2024 18:49:25 +0530 Subject: [PATCH] fix cloud account filter for integration form (#2351) --- deepfence_frontend/apps/dashboard/api-spec.json | 1 + .../api/generated/models/ModelIntegrationFilters.ts | 8 ++++++++ .../components/forms/SearchableCloudAccountsList.tsx | 7 +++++-- .../integrations/components/IntegrationForm.tsx | 3 ++- .../components/integration-form/AdvancedFilter.tsx | 5 +++-- .../integration-form/NotificationTypeField.tsx | 9 +++++---- .../integrations/components/integration-form/utils.ts | 2 +- .../features/integrations/pages/IntegrationAdd.tsx | 11 +++++++++-- 8 files changed, 34 insertions(+), 12 deletions(-) diff --git a/deepfence_frontend/apps/dashboard/api-spec.json b/deepfence_frontend/apps/dashboard/api-spec.json index 02952e9e6a..509977a48e 100644 --- a/deepfence_frontend/apps/dashboard/api-spec.json +++ b/deepfence_frontend/apps/dashboard/api-spec.json @@ -14951,6 +14951,7 @@ "required": ["node_ids"], "type": "object", "properties": { + "cloud_provider": { "type": "string" }, "container_names": { "type": "array", "items": { "type": "string" }, diff --git a/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationFilters.ts b/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationFilters.ts index 45da7bfc3b..89f3d4d9a3 100644 --- a/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationFilters.ts +++ b/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationFilters.ts @@ -32,6 +32,12 @@ import { * @interface ModelIntegrationFilters */ export interface ModelIntegrationFilters { + /** + * + * @type {string} + * @memberof ModelIntegrationFilters + */ + cloud_provider?: string; /** * * @type {Array} @@ -72,6 +78,7 @@ export function ModelIntegrationFiltersFromJSONTyped(json: any, ignoreDiscrimina } return { + 'cloud_provider': !exists(json, 'cloud_provider') ? undefined : json['cloud_provider'], 'container_names': !exists(json, 'container_names') ? undefined : json['container_names'], 'fields_filters': !exists(json, 'fields_filters') ? undefined : ReportersFieldsFiltersFromJSON(json['fields_filters']), 'node_ids': (json['node_ids'] === null ? null : (json['node_ids'] as Array).map(ModelNodeIdentifierFromJSON)), @@ -87,6 +94,7 @@ export function ModelIntegrationFiltersToJSON(value?: ModelIntegrationFilters | } return { + 'cloud_provider': value.cloud_provider, 'container_names': value.container_names, 'fields_filters': ReportersFieldsFiltersToJSON(value.fields_filters), 'node_ids': (value.node_ids === null ? null : (value.node_ids as Array).map(ModelNodeIdentifierToJSON)), diff --git a/deepfence_frontend/apps/dashboard/src/components/forms/SearchableCloudAccountsList.tsx b/deepfence_frontend/apps/dashboard/src/components/forms/SearchableCloudAccountsList.tsx index bceb51fa59..5ed3f7cb0e 100644 --- a/deepfence_frontend/apps/dashboard/src/components/forms/SearchableCloudAccountsList.tsx +++ b/deepfence_frontend/apps/dashboard/src/components/forms/SearchableCloudAccountsList.tsx @@ -20,6 +20,7 @@ export type SearchableCloudAccountsListProps = { helperText?: string; displayValue?: string; color?: 'error' | 'default'; + name?: string; }; const fieldName = 'cloudAccountsFilter'; @@ -36,6 +37,7 @@ const SearchableCloudAccounts = ({ helperText, color, displayValue, + name, }: SearchableCloudAccountsListProps) => { const [searchText, setSearchText] = useState(''); @@ -85,7 +87,7 @@ const SearchableCloudAccounts = ({ startIcon={ isFetchingNextPage ? : undefined } - name={fieldName} + name={name ?? fieldName} getDisplayValue={() => isSelectVariantType && selectedAccounts.length > 0 ? `${selectedAccounts.length} selected` @@ -136,13 +138,14 @@ export const SearchableCloudAccountsList = (props: SearchableCloudAccountsListPr triggerVariant, displayValue, defaultSelectedAccounts = [], + name, } = props; return ( { setAccounts(value); }} + name="targetAWSAccount" helperText={fieldErrors?.aws_account_id} color={fieldErrors?.aws_account_id ? 'error' : 'default'} /> diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/AdvancedFilter.tsx b/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/AdvancedFilter.tsx index afffde30b4..32cb8c7da1 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/AdvancedFilter.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/AdvancedFilter.tsx @@ -1,3 +1,4 @@ +import { upperCase } from 'lodash-es'; import { useState } from 'react'; import { useUpdateEffect } from 'react-use'; import { Listbox, ListboxOption } from 'ui-components'; @@ -87,10 +88,10 @@ export const AdvancedFilters = ({
{isCloudComplianceNotification(notificationType) && cloudProvider ? ( { setSelectedCloudAccounts([]); }} diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/NotificationTypeField.tsx b/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/NotificationTypeField.tsx index 9ae75b700e..8c3e92960e 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/NotificationTypeField.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/NotificationTypeField.tsx @@ -1,3 +1,4 @@ +import { upperCase } from 'lodash-es'; import { useState } from 'react'; import { useParams } from 'react-router-dom'; import { Checkbox, Listbox, ListboxOption, Tooltip } from 'ui-components'; @@ -50,7 +51,7 @@ export const NotificationTypeField = ({ const [notificationType, setNotificationType] = useState( defaultNotificationType, ); - const [cloud, setCloud] = useState('AWS'); + const [cloud, setCloud] = useState(data?.filters?.cloud_provider ?? 'aws'); const { integrationType } = useParams() as { integrationType: string; @@ -116,13 +117,13 @@ export const NotificationTypeField = ({ }} placeholder="Select provider" getDisplayValue={() => { - return cloud; + return upperCase(cloud); }} > - {['AWS', 'GCP', 'AZURE'].map((cloud) => { + {['aws', 'gcp', 'azure'].map((cloud) => { return ( - {cloud} + {upperCase(cloud)} ); })} diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/utils.ts b/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/utils.ts index 73b75bc318..0e59ff0ee6 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/utils.ts +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/components/integration-form/utils.ts @@ -144,7 +144,7 @@ export const getCloudAccountsFilter = ( return []; } return nodeIds.reduce((acc: string[], current) => { - if (current.node_type === ModelNodeIdentifierNodeTypeEnum.CloudAccount) { + if (['aws', 'gcp', 'azure'].includes(current.node_type)) { acc.push(current.node_id); } return acc; diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx b/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx index 91b69f8c9a..f6c2e14664 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx @@ -109,7 +109,7 @@ const getConfigBodyNotificationType = (formData: FormData, integrationType: stri auth_header: formBody.authKey, }; case IntegrationType.awsSecurityHub: { - const accounts = getArrayTypeValuesFromFormData(formData, 'cloudAccountsFilter'); + const accounts = getArrayTypeValuesFromFormData(formData, 'targetAWSAccount'); return { aws_access_key: formBody.accessKey, aws_secret_key: formBody.secretKey, @@ -208,6 +208,7 @@ const action = async ({ request, params }: ActionFunctionArgs): Promise( (id) => { return { node_id: id, - node_type: ModelNodeIdentifierNodeTypeEnum.CloudAccount, + node_type: cloudType ?? ModelNodeIdentifierNodeTypeEnum.CloudAccount, }; }, );