Skip to content

Commit

Permalink
Fix minor styles (#6708)
Browse files Browse the repository at this point in the history 
* Fix bottom table margins in Threat Hunting Dashboard

* Fix searchbar padding on Events tab

* Fix searchbar padding on Discover

* Fix searchbar padding on Vulnerability Inventory tab

* Fix searchbar padding on Mitre Framework tab

* Fix compliante table Searchbar margins

* Fix wazuh discover spaces

* Fix Mitre Framework and Intelligence spaces

* Implement renderColumns in all datagrids

* Fix several styles

* Update snapshot

* Update CHANGELOG
  • Loading branch information
@lucianogorza
lucianogorza authored May 29, 2024
1 parent c921f7e commit 0f3f56d
Show file tree
Hide file tree
Showing 15 changed files with 585 additions and 621 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down
2 changes: 2 additions & 0 deletions plugins/main/public/components/common/wazuh-data-grid/wz-data-grid.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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;

Expand Down Expand Up @@ -78,6 +79,7 @@ const WazuhDataGrid = (props: tWazuhDataGridProps) => {
const dataGridProps = useDataGrid({
ariaLabelledBy: 'Actions data grid',
defaultColumns,
renderColumns: wzDiscoverRenderColumns,
results,
indexPattern: indexPattern as IndexPattern,
DocViewInspectButton,
Expand Down
40 changes: 20 additions & 20 deletions plugins/main/public/components/common/wazuh-discover/discover.scss
View file
Original file line number Diff line number Diff line change
@@ -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);
}
84 changes: 43 additions & 41 deletions plugins/main/public/components/common/wazuh-discover/wz-discover.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import {
EuiFlyoutBody,
EuiFlyoutHeader,
EuiTitle,
EuiSpacer,
EuiPanel,
} from '@elastic/eui';
import { IntlProvider } from 'react-intl';
Expand Down Expand Up @@ -191,6 +190,8 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => {
restrictWidth='100%'
fullHeight={true}
grow
paddingSize='none'
pageContentProps={{ color: 'transparent' }}
>
<>
{isDataSourceLoading ? (
Expand All @@ -210,47 +211,48 @@ const WazuhDiscoverComponent = (props: WazuhDiscoverProps) => {
<DiscoverNoResults timeFieldName={timeField} queryLanguage={''} />
) : null}
{!isDataSourceLoading && dataSource && results?.hits?.total > 0 ? (
<>
<EuiFlexItem grow={false} className='discoverChartContainer'>
<EuiPanel
hasBorder={false}
hasShadow={false}
color='transparent'
paddingSize='none'
>
<EuiPanel>
<DashboardByRenderer
input={histogramChartInput(
dataSource?.title,
fetchFilters,
query,
dateRangeFrom,
dateRangeTo,
)}
/>
<EuiPanel paddingSize='s' hasShadow={false} hasBorder={false} color="transparent">
<EuiFlexGroup gutterSize='s' direction='column'>
<EuiFlexItem grow={false} className='discoverChartContainer'>
<EuiPanel
hasBorder={false}
hasShadow={false}
color='transparent'
paddingSize='none'
>
<EuiPanel>
<DashboardByRenderer
input={histogramChartInput(
dataSource?.title,
fetchFilters,
query,
dateRangeFrom,
dateRangeTo,
)}
/>
</EuiPanel>
</EuiPanel>
</EuiPanel>
</EuiFlexItem>
<EuiSpacer size='m' />
<div className='discoverDataGrid'>
<EuiDataGrid
{...dataGridProps}
className={sideNavDocked ? 'dataGridDockedNav' : ''}
toolbarVisibility={{
additionalControls: (
<>
<DiscoverDataGridAdditionalControls
totalHits={results.hits.total}
isExporting={isExporting}
onClickExportResults={onClickExportResults}
maxEntriesPerQuery={MAX_ENTRIES_PER_QUERY}
/>
</>
),
}}
/>
</div>
</>
</EuiFlexItem>
<EuiFlexItem grow={false} className='discoverDataGrid'>
<EuiDataGrid
{...dataGridProps}
className={sideNavDocked ? 'dataGridDockedNav' : ''}
toolbarVisibility={{
additionalControls: (
<>
<DiscoverDataGridAdditionalControls
totalHits={results.hits.total}
isExporting={isExporting}
onClickExportResults={onClickExportResults}
maxEntriesPerQuery={MAX_ENTRIES_PER_QUERY}
/>
</>
),
}}
/>
</EuiFlexItem>
</EuiFlexGroup>
</EuiPanel>
) : null}
{inspectedHit && (
<EuiFlyout onClose={() => setInspectedHit(undefined)} size='m'>
Expand Down
138 changes: 69 additions & 69 deletions plugins/main/public/components/overview/compliance-table/compliance-table.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -271,74 +271,74 @@ export const ComplianceTable = withAgentSupportModule(props => {
]);

return (
<>
<I18nProvider>
<EuiFlexGroup>
<EuiFlexItem>
{isDataSourceLoading && !dataSource ? (
<LoadingSpinner />
) : (
<div className='wz-search-bar hide-filter-control'>
<SearchBar
appName='compliance-controls'
{...searchBarProps}
showDatePicker={true}
showQueryInput={true}
showQueryBar={true}
showSaveQuery={true}
/>
</div>
)}
</EuiFlexItem>
</EuiFlexGroup>
<EuiFlexGroup style={{ margin: '0 8px' }}>
<EuiFlexItem style={{ width: 'calc(100% - 24px)' }}>
<EuiPanel paddingSize='none'>
{!!Object.keys(complianceData.complianceObject).length && (
<EuiFlexGroup>
<EuiFlexItem
grow={false}
style={{
width: '15%',
minWidth: 145,
maxHeight: 'calc(100vh - 320px)',
overflowX: 'hidden',
}}
>
<ComplianceRequirements
section={props.section}
onChangeSelectedRequirements={selectedRequirements =>
setComplianceData(state => ({
...state,
selectedRequirements,
}))
}
requirementsCount={action.data || []}
loadingAlerts={action.running}
{...complianceData}
/>
</EuiFlexItem>
<EuiFlexItem style={{ width: '15%' }}>
<ComplianceSubrequirements
section={props.section}
onSelectedTabChanged={id =>
props.onSelectedTabChanged(id)
}
requirementsCount={action.data || []}
loadingAlerts={action.running}
fetchFilters={fetchFilters}
getRegulatoryComplianceRequirementFilter={
getRegulatoryComplianceRequirementFilter
}
{...complianceData}
/>
</EuiFlexItem>
</EuiFlexGroup>
)}
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>
</I18nProvider>
</>
<I18nProvider>
<>
<EuiPanel paddingSize='none' hasShadow={false} hasBorder={false} color="transparent">
{isDataSourceLoading && !dataSource ? (
<LoadingSpinner />
) : (
<div className='wz-search-bar hide-filter-control'>
<SearchBar
appName='compliance-controls'
{...searchBarProps}
showDatePicker={true}
showQueryInput={true}
showQueryBar={true}
showSaveQuery={true}
/>
</div>
)}
</EuiPanel>
<EuiPanel paddingSize='s' hasShadow={false} hasBorder={false} color="transparent">
<EuiPanel paddingSize='none'>
<EuiFlexGroup paddingSize='none'>
<EuiFlexItem style={{ width: 'calc(100% - 24px)' }}>
{!!Object.keys(complianceData.complianceObject).length && (
<EuiFlexGroup>
<EuiFlexItem
grow={false}
style={{
width: '15%',
minWidth: 145,
maxHeight: 'calc(100vh - 320px)',
overflowX: 'hidden',
}}
>
<ComplianceRequirements
section={props.section}
onChangeSelectedRequirements={selectedRequirements =>
setComplianceData(state => ({
...state,
selectedRequirements,
}))
}
requirementsCount={action.data || []}
loadingAlerts={action.running}
{...complianceData}
/>
</EuiFlexItem>
<EuiFlexItem style={{ width: '15%' }}>
<ComplianceSubrequirements
section={props.section}
onSelectedTabChanged={id =>
props.onSelectedTabChanged(id)
}
requirementsCount={action.data || []}
loadingAlerts={action.running}
fetchFilters={fetchFilters}
getRegulatoryComplianceRequirementFilter={
getRegulatoryComplianceRequirementFilter
}
{...complianceData}
/>
</EuiFlexItem>
</EuiFlexGroup>
)}
</EuiFlexItem>
</EuiFlexGroup>
</EuiPanel>
</EuiPanel>
</>
</I18nProvider>
);
});
12 changes: 1 addition & 11 deletions plugins/main/public/components/overview/github/panel/config/drilldown-action.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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 => (
<RedirectAppLinks application={getCore().application}>
<EuiLink
href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}
>
{value}
</EuiLink >
</RedirectAppLinks>
),
},
{ id: 'rule.id' },
]

return (
Expand Down
12 changes: 1 addition & 11 deletions plugins/main/public/components/overview/github/panel/config/drilldown-actor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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 => (
<RedirectAppLinks application={getCore().application}>
<EuiLink
href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}
>
{value}
</EuiLink >
</RedirectAppLinks>
),
}
{ id: 'rule.id' }
]

return (
Expand Down
12 changes: 1 addition & 11 deletions plugins/main/public/components/overview/github/panel/config/drilldown-organization.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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 => (
<RedirectAppLinks application={getCore().application}>
<EuiLink
href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}
>
{value}
</EuiLink >
</RedirectAppLinks>
),
},
{ id: 'rule.id' },
]

return (
Expand Down
10 changes: 1 addition & 9 deletions plugins/main/public/components/overview/github/panel/config/drilldown-repository.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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 => (
<EuiLink
href={`${rules.id}#/manager/?tab=rules&redirectRule=${value}`}
>
{value}
</EuiLink >
),
},
{ id: 'rule.id' },
]

return (
Expand Down
Loading

0 comments on commit 0f3f56d

Please sign in to comment.