From cbba83117670051048767197c5a1593a520e10d5 Mon Sep 17 00:00:00 2001 From: milan-deepfence Date: Thu, 4 Jul 2024 16:24:24 +0530 Subject: [PATCH 1/4] add send scan summary option --- .../apps/dashboard/api-spec.json | 6 +- .../models/ModelIntegrationAddReq.ts | 8 +++ .../models/ModelIntegrationUpdateReq.ts | 8 +++ .../integration-form/AdvancedFilter.tsx | 62 ++++++++++++++++++- .../NotificationTypeField.tsx | 5 +- .../components/report-form/AdvanceFilter.tsx | 1 - .../components/useIntegrationTableColumn.tsx | 6 ++ .../integrations/pages/IntegrationAdd.tsx | 2 + .../src/components/select/Listbox.tsx | 44 +++++++++++-- 9 files changed, 133 insertions(+), 9 deletions(-) diff --git a/deepfence_frontend/apps/dashboard/api-spec.json b/deepfence_frontend/apps/dashboard/api-spec.json index 503677fd85..59f83056a1 100644 --- a/deepfence_frontend/apps/dashboard/api-spec.json +++ b/deepfence_frontend/apps/dashboard/api-spec.json @@ -14587,7 +14587,8 @@ "config": { "type": "object", "additionalProperties": {}, "nullable": true }, "filters": { "$ref": "#/components/schemas/ModelIntegrationFilters" }, "integration_type": { "type": "string" }, - "notification_type": { "type": "string" } + "notification_type": { "type": "string" }, + "send_summary": { "type": "boolean" } } }, "ModelIntegrationFilters": { @@ -14625,7 +14626,8 @@ "filters": { "$ref": "#/components/schemas/ModelIntegrationFilters" }, "id": { "type": "integer" }, "integration_type": { "type": "string" }, - "notification_type": { "type": "string" } + "notification_type": { "type": "string" }, + "send_summary": { "type": "boolean" } } }, "ModelInviteUserRequest": { diff --git a/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationAddReq.ts b/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationAddReq.ts index f5211dd456..7a68b9abfa 100644 --- a/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationAddReq.ts +++ b/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationAddReq.ts @@ -50,6 +50,12 @@ export interface ModelIntegrationAddReq { * @memberof ModelIntegrationAddReq */ notification_type: string; + /** + * + * @type {boolean} + * @memberof ModelIntegrationAddReq + */ + send_summary?: boolean; } /** @@ -77,6 +83,7 @@ export function ModelIntegrationAddReqFromJSONTyped(json: any, ignoreDiscriminat 'filters': !exists(json, 'filters') ? undefined : ModelIntegrationFiltersFromJSON(json['filters']), 'integration_type': json['integration_type'], 'notification_type': json['notification_type'], + 'send_summary': !exists(json, 'send_summary') ? undefined : json['send_summary'], }; } @@ -93,6 +100,7 @@ export function ModelIntegrationAddReqToJSON(value?: ModelIntegrationAddReq | nu 'filters': ModelIntegrationFiltersToJSON(value.filters), 'integration_type': value.integration_type, 'notification_type': value.notification_type, + 'send_summary': value.send_summary, }; } diff --git a/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationUpdateReq.ts b/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationUpdateReq.ts index d6406f84a5..c000619da9 100644 --- a/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationUpdateReq.ts +++ b/deepfence_frontend/apps/dashboard/src/api/generated/models/ModelIntegrationUpdateReq.ts @@ -56,6 +56,12 @@ export interface ModelIntegrationUpdateReq { * @memberof ModelIntegrationUpdateReq */ notification_type?: string; + /** + * + * @type {boolean} + * @memberof ModelIntegrationUpdateReq + */ + send_summary?: boolean; } /** @@ -82,6 +88,7 @@ export function ModelIntegrationUpdateReqFromJSONTyped(json: any, ignoreDiscrimi 'id': !exists(json, 'id') ? undefined : json['id'], 'integration_type': !exists(json, 'integration_type') ? undefined : json['integration_type'], 'notification_type': !exists(json, 'notification_type') ? undefined : json['notification_type'], + 'send_summary': !exists(json, 'send_summary') ? undefined : json['send_summary'], }; } @@ -99,6 +106,7 @@ export function ModelIntegrationUpdateReqToJSON(value?: ModelIntegrationUpdateRe 'id': value.id, 'integration_type': value.integration_type, 'notification_type': value.notification_type, + 'send_summary': value.send_summary, }; } 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 af624f0811..dd2624b38c 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,4 +1,5 @@ import { useState } from 'react'; +import { useParams } from 'react-router-dom'; import { useUpdateEffect } from 'react-use'; import { Listbox, ListboxOption } from 'ui-components'; @@ -26,11 +27,66 @@ import { getClustersFilter, getHostsFilter, getImagesFilter, + IntegrationType, isCloudComplianceNotification, isComplianceNotification, scanTypes, } from './utils'; +const sendSummaryList = [ + { + value: true, + label: 'Send scan summary', + }, + { + value: false, + label: 'Send complete scan results', + }, +]; + +const SendSummary = ({ sendSummary }: { sendSummary: boolean | undefined }) => { + const [value, setValue] = useState(!!sendSummary); + return ( + sendSummaryList.find((item) => item.value === value)!.label} + value={value} + variant="underline" + onChange={(value) => { + setValue(value); + }} + label="Send summary" + labelInfo="Either send scan summary or send complete scan results" + > + {sendSummaryList.map((item) => { + return ( + + {item.label} + + ); + })} + + ); +}; +/** + * + * @param notificationType + * @returns boolean when scan type is vulnerability, secret, malware or compliance and + * integration is slack or teams + */ +const canSendScanSummary = (notificationType: string) => { + const { integrationType } = useParams() as { + integrationType: string; + }; + return ( + ((integrationType === IntegrationType.slack || + integrationType === IntegrationType.microsoftTeams) && + scanTypes.includes(notificationType)) || + isComplianceNotification(notificationType) || + isCloudComplianceNotification(notificationType) + ); +}; + export const AdvancedFilters = ({ notificationType, cloudProvider, @@ -38,7 +94,7 @@ export const AdvancedFilters = ({ }: { notificationType: string; cloudProvider?: string; - filters?: ModelIntegrationFilters; + filters?: ModelIntegrationFilters & { sendSummary: boolean }; }) => { const fieldFilters = filters?.fields_filters; // severity @@ -83,6 +139,10 @@ export const AdvancedFilters = ({
Advanced Filter (Optional)
+ {canSendScanSummary(notificationType) ? ( + + ) : null} + {isCloudComplianceNotification(notificationType) && cloudProvider ? ( ) : null} diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/components/report-form/AdvanceFilter.tsx b/deepfence_frontend/apps/dashboard/src/features/integrations/components/report-form/AdvanceFilter.tsx index 7639d34bce..7887d4ab84 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/components/report-form/AdvanceFilter.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/components/report-form/AdvanceFilter.tsx @@ -1,4 +1,3 @@ -import { upperCase } from 'lodash-es'; import { useMemo, useState } from 'react'; import { Listbox, ListboxOption } from 'ui-components'; diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx b/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx index 40fdc2a011..1bde849b25 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx @@ -652,6 +652,7 @@ export const useIntegrationTableColumn = ( node_ids?: Array<{ node_id: string; node_type: string }> | null; custom_fields?: string[]; container_names?: string[]; + send_summary?: boolean; } = {}; const filters = row.original.filters; const containFilter = filters?.fields_filters?.contains_filter; @@ -680,11 +681,16 @@ export const useIntegrationTableColumn = ( const configs = row.original.config; const customFields = configs?.custom_fields; + const isSendScanSummary = configs?.send_summary; if (customFields) { displayFilters.custom_fields = customFields; } + if (isSendScanSummary) { + displayFilters.send_summary = isSendScanSummary; + } + if (isEmpty(displayFilters)) { return '-'; } 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 cc8a1ad082..1b3d7305c7 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx @@ -318,6 +318,7 @@ const action = async ({ request, params }: ActionFunctionArgs): Promise { ); }; +export const InfoStandardIcon = () => { + return ( + + + + + + ); +}; + const OptionsWrapper = ({ children, noDataText, @@ -176,6 +200,7 @@ interface ListboxProps variant?: 'underline' | 'default'; children?: React.ReactNode; label?: string; + labelInfo?: string; clearAll?: React.ReactNode; onClearAll?: () => void; placeholder?: string; @@ -194,6 +219,7 @@ export function Listbox({ children, value, label, + labelInfo, clearAll, onClearAll, placeholder, @@ -222,14 +248,24 @@ export function Listbox({ ) : null} From 1ee4775a25833284a7ac69667ec663cdeb7a42d7 Mon Sep 17 00:00:00 2001 From: milan-deepfence Date: Thu, 4 Jul 2024 16:27:42 +0530 Subject: [PATCH 2/4] rename variable name --- .../components/integration-form/AdvancedFilter.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) 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 dd2624b38c..aaa468eb02 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 @@ -33,7 +33,7 @@ import { scanTypes, } from './utils'; -const sendSummaryList = [ +const sendSummaryOption = [ { value: true, label: 'Send scan summary', @@ -49,7 +49,9 @@ const SendSummary = ({ sendSummary }: { sendSummary: boolean | undefined }) => { return ( sendSummaryList.find((item) => item.value === value)!.label} + getDisplayValue={() => + sendSummaryOption.find((item) => item.value === value)!.label + } value={value} variant="underline" onChange={(value) => { @@ -58,7 +60,7 @@ const SendSummary = ({ sendSummary }: { sendSummary: boolean | undefined }) => { label="Send summary" labelInfo="Either send scan summary or send complete scan results" > - {sendSummaryList.map((item) => { + {sendSummaryOption.map((item) => { return ( {item.label} From a3ff84c0925d03988896640334a0a8f76801519a Mon Sep 17 00:00:00 2001 From: milan-deepfence Date: Fri, 5 Jul 2024 12:19:32 +0530 Subject: [PATCH 3/4] remove from filters and replace by checkbox --- .../integration-form/AdvancedFilter.tsx | 64 +------------------ .../NotificationTypeField.tsx | 30 +++++++-- .../components/integration-form/utils.ts | 10 +++ .../components/useIntegrationTableColumn.tsx | 6 -- .../integrations/pages/IntegrationAdd.tsx | 4 +- .../src/components/select/Listbox.tsx | 44 ++----------- 6 files changed, 43 insertions(+), 115 deletions(-) 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 aaa468eb02..af624f0811 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,5 +1,4 @@ import { useState } from 'react'; -import { useParams } from 'react-router-dom'; import { useUpdateEffect } from 'react-use'; import { Listbox, ListboxOption } from 'ui-components'; @@ -27,68 +26,11 @@ import { getClustersFilter, getHostsFilter, getImagesFilter, - IntegrationType, isCloudComplianceNotification, isComplianceNotification, scanTypes, } from './utils'; -const sendSummaryOption = [ - { - value: true, - label: 'Send scan summary', - }, - { - value: false, - label: 'Send complete scan results', - }, -]; - -const SendSummary = ({ sendSummary }: { sendSummary: boolean | undefined }) => { - const [value, setValue] = useState(!!sendSummary); - return ( - - sendSummaryOption.find((item) => item.value === value)!.label - } - value={value} - variant="underline" - onChange={(value) => { - setValue(value); - }} - label="Send summary" - labelInfo="Either send scan summary or send complete scan results" - > - {sendSummaryOption.map((item) => { - return ( - - {item.label} - - ); - })} - - ); -}; -/** - * - * @param notificationType - * @returns boolean when scan type is vulnerability, secret, malware or compliance and - * integration is slack or teams - */ -const canSendScanSummary = (notificationType: string) => { - const { integrationType } = useParams() as { - integrationType: string; - }; - return ( - ((integrationType === IntegrationType.slack || - integrationType === IntegrationType.microsoftTeams) && - scanTypes.includes(notificationType)) || - isComplianceNotification(notificationType) || - isCloudComplianceNotification(notificationType) - ); -}; - export const AdvancedFilters = ({ notificationType, cloudProvider, @@ -96,7 +38,7 @@ export const AdvancedFilters = ({ }: { notificationType: string; cloudProvider?: string; - filters?: ModelIntegrationFilters & { sendSummary: boolean }; + filters?: ModelIntegrationFilters; }) => { const fieldFilters = filters?.fields_filters; // severity @@ -141,10 +83,6 @@ export const AdvancedFilters = ({
Advanced Filter (Optional)
- {canSendScanSummary(notificationType) ? ( - - ) : null} - {isCloudComplianceNotification(notificationType) && cloudProvider ? ( { + const [checked, setChecked] = useState(sendSummaryOnly); + return ( +
+ setChecked(check)} + /> + +
+ +
+ +
+ ); +}; export const NotificationTypeField = ({ fieldErrors, defaultNotificationType, @@ -81,6 +101,10 @@ export const NotificationTypeField = ({ ) : null} */} + {canSendScanSummary(notificationType, integrationType) ? ( + + ) : null} + {isCloudComplianceNotification(notificationType) && integrationType !== IntegrationType.s3 && ( ) : null} 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 e5106bbc4a..20b39fe93a 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 @@ -166,3 +166,13 @@ export const getDisplayNotification = (notificationType: string) => { } return notificationType; }; + +export const canSendScanSummary = (notificationType: string, integrationType: string) => { + return ( + ((integrationType === IntegrationType.slack || + integrationType === IntegrationType.microsoftTeams) && + scanTypes.includes(notificationType)) || + isComplianceNotification(notificationType) || + isCloudComplianceNotification(notificationType) + ); +}; diff --git a/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx b/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx index 1bde849b25..40fdc2a011 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/components/useIntegrationTableColumn.tsx @@ -652,7 +652,6 @@ export const useIntegrationTableColumn = ( node_ids?: Array<{ node_id: string; node_type: string }> | null; custom_fields?: string[]; container_names?: string[]; - send_summary?: boolean; } = {}; const filters = row.original.filters; const containFilter = filters?.fields_filters?.contains_filter; @@ -681,16 +680,11 @@ export const useIntegrationTableColumn = ( const configs = row.original.config; const customFields = configs?.custom_fields; - const isSendScanSummary = configs?.send_summary; if (customFields) { displayFilters.custom_fields = customFields; } - if (isSendScanSummary) { - displayFilters.send_summary = isSendScanSummary; - } - if (isEmpty(displayFilters)) { return '-'; } 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 1b3d7305c7..439f2eabd5 100644 --- a/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx +++ b/deepfence_frontend/apps/dashboard/src/features/integrations/pages/IntegrationAdd.tsx @@ -318,7 +318,7 @@ const action = async ({ request, params }: ActionFunctionArgs): Promise { ); }; -export const InfoStandardIcon = () => { - return ( - - - - - - ); -}; - const OptionsWrapper = ({ children, noDataText, @@ -200,7 +176,6 @@ interface ListboxProps variant?: 'underline' | 'default'; children?: React.ReactNode; label?: string; - labelInfo?: string; clearAll?: React.ReactNode; onClearAll?: () => void; placeholder?: string; @@ -219,7 +194,6 @@ export function Listbox({ children, value, label, - labelInfo, clearAll, onClearAll, placeholder, @@ -248,24 +222,14 @@ export function Listbox({ ) : null} From 7622c5ee28a217d49230d950e9b0acb0aa0d6ae5 Mon Sep 17 00:00:00 2001 From: milan-deepfence Date: Fri, 5 Jul 2024 12:29:56 +0530 Subject: [PATCH 4/4] corrected typo --- .../components/integration-form/NotificationTypeField.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) 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 626235abaf..0be331d329 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,4 +1,3 @@ -import { merge } from 'lodash-es'; import { useState } from 'react'; import { useParams } from 'react-router-dom'; import { Checkbox, Listbox, ListboxOption, Tooltip } from 'ui-components'; @@ -21,7 +20,7 @@ import { isVulnerabilityNotification, } from './utils'; -const SendScanSumaryCheckbox = ({ sendSummaryOnly }: { sendSummaryOnly: boolean }) => { +const SendScanSummaryCheckbox = ({ sendSummaryOnly }: { sendSummaryOnly: boolean }) => { const [checked, setChecked] = useState(sendSummaryOnly); return (
@@ -102,7 +101,7 @@ export const NotificationTypeField = ({ {canSendScanSummary(notificationType, integrationType) ? ( - + ) : null} {isCloudComplianceNotification(notificationType) &&