diff --git a/CHANGELOG.md b/CHANGELOG.md index 2c90d5ad19..3c323b4871 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -41,6 +41,7 @@ All notable changes to the Wazuh app project will be documented in this file. - Implement new data source feature on MITRE ATT&CK module [#6482](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6482) - Upgraded versions of `follow-redirects` and `es5-ext` [#6626](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6626) - Changed agent log collector socket API response controller component [#6660](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6660) +- Improve margins and paddins in the Events, Inventory and Control tabs [#6708](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6708) ### Fixed diff --git a/plugins/main/public/components/common/wazuh-data-grid/wz-data-grid.tsx b/plugins/main/public/components/common/wazuh-data-grid/wz-data-grid.tsx index f8b1f6d61d..698375aaf8 100644 --- a/plugins/main/public/components/common/wazuh-data-grid/wz-data-grid.tsx +++ b/plugins/main/public/components/common/wazuh-data-grid/wz-data-grid.tsx @@ -27,6 +27,7 @@ import { DiscoverNoResults } from '../no-results/no-results'; import { DocumentViewTableAndJson } from '../wazuh-discover/components/document-view-table-and-json'; import DiscoverDataGridAdditionalControls from '../wazuh-discover/components/data-grid-additional-controls'; import './wazuh-data-grid.scss'; +import { wzDiscoverRenderColumns } from '../wazuh-discover/render-columns'; export const MAX_ENTRIES_PER_QUERY = 10000; @@ -78,6 +79,7 @@ const WazuhDataGrid = (props: tWazuhDataGridProps) => { const dataGridProps = useDataGrid({ ariaLabelledBy: 'Actions data grid', defaultColumns, + renderColumns: wzDiscoverRenderColumns, results, indexPattern: indexPattern as IndexPattern, DocViewInspectButton, diff --git a/plugins/main/public/components/common/wazuh-discover/discover.scss b/plugins/main/public/components/common/wazuh-discover/discover.scss index db82845c2a..46de648c6c 100644 --- a/plugins/main/public/components/common/wazuh-discover/discover.scss +++ b/plugins/main/public/components/common/wazuh-discover/discover.scss @@ -1,28 +1,28 @@ .discoverContainer { - height: calc(100vh - 104px); + height: calc(100vh - 104px); - .euiDataGrid--fullScreen { - height: calc(100vh - 49px); - bottom: 0; - top: auto; - } - - .discoverDataGrid { - height: calc(100vh - 496px); - } + .euiDataGrid--fullScreen { + height: calc(100vh - 49px); + bottom: 0; + top: auto; + } + + .discoverDataGrid { + height: calc(100vh - 464px); + } - .discoverChartContainer { - min-height: 234px; - .dshLayout-isMaximizedPanel { - top: 0; - left: 0; - min-height: calc(100vh - 49px); - position: fixed; - z-index: 9999; - } + .discoverChartContainer { + min-height: 234px; + .dshLayout-isMaximizedPanel { + top: 0; + left: 0; + min-height: calc(100vh - 49px); + position: fixed; + z-index: 9999; } + } } .headerIsExpanded .discoverContainer { - height: calc(100vh - 153px); + height: calc(100vh - 153px); } diff --git a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx index 90f68d923c..7693bf2e6a 100644 --- a/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx +++ b/plugins/main/public/components/common/wazuh-discover/wz-discover.tsx @@ -11,7 +11,6 @@ import { EuiFlyoutBody, EuiFlyoutHeader, EuiTitle, - EuiSpacer, EuiPanel, } from '@elastic/eui'; import { IntlProvider } from 'react-intl'; @@ -191,6 +190,8 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => { restrictWidth='100%' fullHeight={true} grow + paddingSize='none' + pageContentProps={{ color: 'transparent' }} > <> {isDataSourceLoading ? ( @@ -210,47 +211,48 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => { ) : null} {!isDataSourceLoading && dataSource && results?.hits?.total > 0 ? ( - <> - - - - + + + + + + + - - - -
- - - - ), - }} - /> -
- + + + + + + ), + }} + /> + + + ) : null} {inspectedHit && ( setInspectedHit(undefined)} size='m'> diff --git a/plugins/main/public/components/overview/compliance-table/compliance-table.tsx b/plugins/main/public/components/overview/compliance-table/compliance-table.tsx index 4b55490284..0401330b53 100644 --- a/plugins/main/public/components/overview/compliance-table/compliance-table.tsx +++ b/plugins/main/public/components/overview/compliance-table/compliance-table.tsx @@ -271,74 +271,74 @@ export const ComplianceTable = withAgentSupportModule(props => { ]); return ( - <> - - - - {isDataSourceLoading && !dataSource ? ( - - ) : ( -
- -
- )} -
-
- - - - {!!Object.keys(complianceData.complianceObject).length && ( - - - - setComplianceData(state => ({ - ...state, - selectedRequirements, - })) - } - requirementsCount={action.data || []} - loadingAlerts={action.running} - {...complianceData} - /> - - - - props.onSelectedTabChanged(id) - } - requirementsCount={action.data || []} - loadingAlerts={action.running} - fetchFilters={fetchFilters} - getRegulatoryComplianceRequirementFilter={ - getRegulatoryComplianceRequirementFilter - } - {...complianceData} - /> - - - )} - - - -
- + + <> + + {isDataSourceLoading && !dataSource ? ( + + ) : ( +
+ +
+ )} +
+ + + + + {!!Object.keys(complianceData.complianceObject).length && ( + + + + setComplianceData(state => ({ + ...state, + selectedRequirements, + })) + } + requirementsCount={action.data || []} + loadingAlerts={action.running} + {...complianceData} + /> + + + + props.onSelectedTabChanged(id) + } + requirementsCount={action.data || []} + loadingAlerts={action.running} + fetchFilters={fetchFilters} + getRegulatoryComplianceRequirementFilter={ + getRegulatoryComplianceRequirementFilter + } + {...complianceData} + /> + + + )} + + + + + +
); }); diff --git a/plugins/main/public/components/overview/github/panel/config/drilldown-action.tsx b/plugins/main/public/components/overview/github/panel/config/drilldown-action.tsx index 49ed787322..d1f2acfb5e 100644 --- a/plugins/main/public/components/overview/github/panel/config/drilldown-action.tsx +++ b/plugins/main/public/components/overview/github/panel/config/drilldown-action.tsx @@ -174,17 +174,7 @@ export const DrilldownConfigAction = (drilldownProps: ModuleConfigProps) => { { id: 'data.github.repo', displayAsText: 'Repository' }, { id: 'data.github.actor', displayAsText: 'Actor' }, { id: 'rule.level' }, - { - id: 'rule.id', render: value => ( - - - {value} - - - ), - }, + { id: 'rule.id' }, ] return ( diff --git a/plugins/main/public/components/overview/github/panel/config/drilldown-actor.tsx b/plugins/main/public/components/overview/github/panel/config/drilldown-actor.tsx index 2d2f88013d..0ee7c980f2 100644 --- a/plugins/main/public/components/overview/github/panel/config/drilldown-actor.tsx +++ b/plugins/main/public/components/overview/github/panel/config/drilldown-actor.tsx @@ -172,17 +172,7 @@ export const DrilldownConfigActor = (drilldownProps: ModuleConfigProps) => { { id: 'data.github.repo', displayAsText: 'Repository' }, { id: 'data.github.action', displayAsText: 'Action' }, { id: 'rule.level' }, - { - id: 'rule.id', render: value => ( - - - {value} - - - ), - } + { id: 'rule.id' } ] return ( diff --git a/plugins/main/public/components/overview/github/panel/config/drilldown-organization.tsx b/plugins/main/public/components/overview/github/panel/config/drilldown-organization.tsx index 6ef128e736..4bd99db01f 100644 --- a/plugins/main/public/components/overview/github/panel/config/drilldown-organization.tsx +++ b/plugins/main/public/components/overview/github/panel/config/drilldown-organization.tsx @@ -175,17 +175,7 @@ export const DrilldownConfigOrganization = ( { id: 'data.github.actor', displayAsText: 'Actor' }, { id: 'data.github.action', displayAsText: 'Action' }, { id: 'rule.level' }, - { - id: 'rule.id', render: value => ( - - - {value} - - - ), - }, + { id: 'rule.id' }, ] return ( diff --git a/plugins/main/public/components/overview/github/panel/config/drilldown-repository.tsx b/plugins/main/public/components/overview/github/panel/config/drilldown-repository.tsx index 60c707972b..73363053e8 100644 --- a/plugins/main/public/components/overview/github/panel/config/drilldown-repository.tsx +++ b/plugins/main/public/components/overview/github/panel/config/drilldown-repository.tsx @@ -173,15 +173,7 @@ export const DrilldownConfigRepository = ( { id: 'data.github.actor', displayAsText: 'Actor' }, { id: 'data.github.action', displayAsText: 'Action' }, { id: 'rule.level' }, - { - id: 'rule.id', render: value => ( - - {value} - - ), - }, + { id: 'rule.id' }, ] return ( diff --git a/plugins/main/public/components/overview/mitre/framework/mitre.tsx b/plugins/main/public/components/overview/mitre/framework/mitre.tsx index 8581611100..f0262b7989 100644 --- a/plugins/main/public/components/overview/mitre/framework/mitre.tsx +++ b/plugins/main/public/components/overview/mitre/framework/mitre.tsx @@ -34,6 +34,7 @@ import { PatternDataSource, tFilter, } from '../../../common/data-source'; + export interface ITactic { [key: string]: string[]; } @@ -150,70 +151,62 @@ const MitreComponent = props => { setMitreState({ ...mitreState, selectedTactics }); }; - const flexGroupStyle = { - margin: '0 8px', - }; - return ( <> - - - {isDataSourceLoading && !dataSource ? ( - - ) : ( -
- + {isDataSourceLoading && !dataSource ? ( + + ) : ( +
+ +
+ )} + + + + + + + + + onSelectedTabChanged(id)} + tacticsObject={mitreState.tacticsObject} + selectedTactics={mitreState.selectedTactics} + fetchData={fetchData} + isLoading={isLoading} /> -
- )} -
-
- - - - - - - - - onSelectedTabChanged(id)} - tacticsObject={mitreState.tacticsObject} - selectedTactics={mitreState.selectedTactics} - fetchData={fetchData} - isLoading={isLoading} - /> - - - - - + + + +
); }; -export const Mitre = withErrorBoundary(MitreComponent); +export const Mitre = withErrorBoundary(MitreComponent); \ No newline at end of file diff --git a/plugins/main/public/components/overview/mitre/intelligence/__snapshots__/intelligence.test.tsx.snap b/plugins/main/public/components/overview/mitre/intelligence/__snapshots__/intelligence.test.tsx.snap index 84909f720c..7249e54239 100644 --- a/plugins/main/public/components/overview/mitre/intelligence/__snapshots__/intelligence.test.tsx.snap +++ b/plugins/main/public/components/overview/mitre/intelligence/__snapshots__/intelligence.test.tsx.snap @@ -60,181 +60,176 @@ exports[`Module Mitre Att&ck intelligence container should render permissions pr exports[`Module Mitre Att&ck intelligence container should render the component if has permissions 1`] = `
+
- -
- -
+ + +
- - - - -
+ + + + + +
+
-
-

- Groups - - (0) - -

-
+ Groups + + (0) + +
+
+
-
-
+ class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap" + />
-
-
+
+
+
+
-
-
+
+
+ +
+
- -
-
-
- -
+ +
@@ -242,182 +237,182 @@ exports[`Module Mitre Att&ck intelligence container should render the component
-
-
-
+
+
+
+
+
+
-
-
- -
+ +
- - - - + + + + + + + +
-
+ + + + - + - - - - - + + + + + - - -
+
+ - - ID - + ID - + + - - -
- -
- No items found + Description -
-
- + + +
+
+ + No items found + +
+
diff --git a/plugins/main/public/components/overview/mitre/intelligence/intelligence.tsx b/plugins/main/public/components/overview/mitre/intelligence/intelligence.tsx index f408d9c98d..5372e0185e 100644 --- a/plugins/main/public/components/overview/mitre/intelligence/intelligence.tsx +++ b/plugins/main/public/components/overview/mitre/intelligence/intelligence.tsx @@ -12,7 +12,7 @@ */ import React, { useCallback, useState, useRef, useEffect } from 'react'; -import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { EuiPanel } from '@elastic/eui'; import { MitreAttackResources } from './resources'; import { ModuleMitreAttackIntelligenceLeftPanel } from './intelligence_left_panel'; @@ -50,8 +50,8 @@ export const ModuleMitreAttackIntelligence = compose( params: { ...(searchTerm ? { - q: fields.map(key => `${key}~${searchTerm}`).join(','), - } + q: fields.map(key => `${key}~${searchTerm}`).join(','), + } : {}), limit: limitResults, }, @@ -70,13 +70,13 @@ export const ModuleMitreAttackIntelligence = compose( setResourceFilters({ ...(searchTermAllResourcesLastSearch.current ? { - q: fields - .map( - key => - `${key}~${searchTermAllResourcesLastSearch.current}`, - ) - .join(','), - } + q: fields + .map( + key => + `${key}~${searchTermAllResourcesLastSearch.current}`, + ) + .join(','), + } : {}), }); setSelectedResource(resource.id); @@ -105,7 +105,7 @@ export const ModuleMitreAttackIntelligence = compose( setResourceFilters({}); setSelectedResource(prevSelectedResource => prevSelectedResource === resourceID && - searchTermAllResourcesUsed.current + searchTermAllResourcesUsed.current ? null : resourceID, ); @@ -118,37 +118,35 @@ export const ModuleMitreAttackIntelligence = compose( }, []); return ( - - - - } - sideProps={{ - style: { width: '15%', minWidth: 145, overflowX: 'hidden' }, - }} - content={ - - } - contentProps={{ - style: { - maxHeight: 'calc(100vh - 255px)', - overflowY: 'auto', - overflowX: 'hidden', - }, - }} - /> - - + + + } + sideProps={{ + style: { width: '15%', minWidth: 145, overflowX: 'hidden' }, + }} + content={ + + } + contentProps={{ + style: { + maxHeight: 'calc(100vh - 255px)', + overflowY: 'auto', + overflowX: 'hidden', + }, + }} + /> + ); }); diff --git a/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx b/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx index 66c2b6b888..7deee3b54f 100644 --- a/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx +++ b/plugins/main/public/components/overview/threat-hunting/dashboard/dashboard.tsx @@ -275,48 +275,50 @@ const DashboardTH: React.FC = () => { hidePanelTitles: false, }} /> - - { }} - tooltip={ - results?.hits?.total && - results?.hits?.total > MAX_ENTRIES_PER_QUERY - ? { - ariaLabel: 'Warning', - content: `The query results has exceeded the limit of 10,000 hits. To provide a better experience the table only shows the first ${formatNumWithCommas( - MAX_ENTRIES_PER_QUERY, - )} hits.`, - iconType: 'alert', - position: 'top', - } - : undefined - } - /> - - Export Formated - - - ), - }} - /> +
+ + { }} + tooltip={ + results?.hits?.total && + results?.hits?.total > MAX_ENTRIES_PER_QUERY + ? { + ariaLabel: 'Warning', + content: `The query results has exceeded the limit of 10,000 hits. To provide a better experience the table only shows the first ${formatNumWithCommas( + MAX_ENTRIES_PER_QUERY, + )} hits.`, + iconType: 'alert', + position: 'top', + } + : undefined + } + /> + + Export Formated + + + ), + }} + /> +
{inspectedHit && ( setInspectedHit(undefined)} size='m'> diff --git a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss index b09cec0f4f..c33a2e54cc 100644 --- a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss +++ b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.scss @@ -2,8 +2,8 @@ height: calc(100vh - 104px); // This makes the table not generate an unnecessary scroll when filtering data from 1 page and then do another search for more pages. - .euiDataGrid__virtualized { - height: calc(100vh - 345px) !important; + .vulsInventoryDataGrid { + height: calc(100vh - 214px) !important; } .euiDataGrid--fullScreen { diff --git a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.tsx b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.tsx index ae60c2859a..8f79e6b13c 100644 --- a/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.tsx +++ b/plugins/main/public/components/overview/vulnerabilities/dashboards/inventory/inventory.tsx @@ -12,6 +12,7 @@ import { EuiFlyoutHeader, EuiTitle, EuiButtonEmpty, + EuiPanel } from '@elastic/eui'; import { SearchResponse } from '../../../../../../../../src/core/server'; import { HitsCounter } from '../../../../../kibana-integrations/discover/application/components/hits_counter/hits_counter'; @@ -27,7 +28,6 @@ import { MAX_ENTRIES_PER_QUERY, inventoryTableDefaultColumns } from './config'; import { DiscoverNoResults } from '../../common/components/no_results'; import { LoadingSpinner } from '../../common/components/loading_spinner'; // common components/hooks -import DocViewer from '../../../../common/doc-viewer/doc-viewer'; import useSearchBar from '../../../../common/search-bar/use-search-bar'; import { useDataGrid } from '../../../../common/data-grid/use-data-grid'; import { useDocViewer } from '../../../../common/doc-viewer/use-doc-viewer'; @@ -46,6 +46,7 @@ import { import { useDataSource } from '../../../../common/data-source/hooks'; import { IndexPattern } from '../../../../../../../../src/plugins/data/public'; import { DocumentViewTableAndJson } from '../../common/components/document-view-table-and-json'; +import { wzDiscoverRenderColumns } from '../../../../common/wazuh-discover/render-columns'; const InventoryVulsComponent = () => { const { @@ -103,6 +104,7 @@ const InventoryVulsComponent = () => { const dataGridProps = useDataGrid({ ariaLabelledBy: 'Vulnerabilities Inventory Table', defaultColumns: inventoryTableDefaultColumns, + renderColumns: wzDiscoverRenderColumns, results, indexPattern: indexPattern as IndexPattern, DocViewInspectButton, @@ -171,7 +173,10 @@ const InventoryVulsComponent = () => { <> {isDataSourceLoading ? ( @@ -192,47 +197,51 @@ const InventoryVulsComponent = () => { ) : null} {!isDataSourceLoading && results?.hits?.total > 0 ? ( - - MAX_ENTRIES_PER_QUERY - ? { - ariaLabel: 'Warning', - content: `The query results has exceeded the limit of 10,000 hits. To provide a better experience the table only shows the first ${formatNumWithCommas( - MAX_ENTRIES_PER_QUERY, - )} hits.`, - iconType: 'alert', - position: 'top', - } - : undefined - } - /> - - Export Formated - - - ), - }} - /> + +
+ + MAX_ENTRIES_PER_QUERY + ? { + ariaLabel: 'Warning', + content: `The query results has exceeded the limit of 10,000 hits. To provide a better experience the table only shows the first ${formatNumWithCommas( + MAX_ENTRIES_PER_QUERY, + )} hits.`, + iconType: 'alert', + position: 'top', + } + : undefined + } + /> + + Export Formated + + + ), + }} + /> +
+
) : null} {inspectedHit && ( setInspectedHit(undefined)} size='m'>