Skip to content

Commit

Permalink
5814 adapt the breadcrum to the new menu (#5817)
Browse files Browse the repository at this point in the history 
* Change Agents for Endpoints summary

* Remove unnecessary styles

* Remove deprecated code

* Remove deprecated code

* Revert changes in wz-menu.js

* Remove deprecated code

* Change some breadcrumbs

* Remove wazuh menu

* Change Management breadcrumbs

* Change setGlobalBreadcrumbs for withGlobalBreadcrumbs hoc

* Fix test

* Change href to agent

* Fix redirection breadcrumbs: inventory data, stats and configuration
  • Loading branch information
@yenienserrano
yenienserrano authored Sep 7, 2023
1 parent 722e435 commit d8da98f
Show file tree
Hide file tree
Showing 32 changed files with 1,267 additions and 1,767 deletions.
43 changes: 18 additions & 25 deletions plugins/main/public/components/add-modules-data/add-modules-data-main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,31 +9,24 @@
*
* Find more information about this on the LICENSE file.
*/
import React, { Fragment, Component } from 'react';
import React, { Component } from 'react';

import {
EuiButtonIcon,
EuiCard,
EuiFlexGrid,
EuiFlexGroup,
EuiFlexItem,
EuiIcon,
EuiPage,
EuiPageBody,
EuiSpacer,
EuiTabbedContent,
EuiText,
EuiTitle,
EuiToolTip
} from '@elastic/eui';

import WzModuleGuide from './module-guide';
import WzSampleData from './sample-data';
import modeGuides from './guides';

import { WAZUH_MODULES } from '../../../common/wazuh-modules';
import { updateGlobalBreadcrumb } from '../../redux/actions/globalBreadcrumbActions';
import store from '../../redux/store';
import { compose } from 'redux';

import { withGlobalBreadcrumb } from '../common/hocs';

const guides = Object.keys(modeGuides).map(key => modeGuides[key]).sort((a,b) => {
if (a.name < b.name) { return -1 }
Expand All @@ -50,7 +43,7 @@ interface IStateWzAddModulesData {
selectedGuideCategory: any
};

export default class WzAddModulesData extends Component<IPropsWzAddModulesData, IStateWzAddModulesData>{
class WzAddModulesData extends Component<IPropsWzAddModulesData, IStateWzAddModulesData>{
tabs: any
constructor(props){
super(props);
Expand Down Expand Up @@ -96,17 +89,7 @@ export default class WzAddModulesData extends Component<IPropsWzAddModulesData,
// }
// "redirect=sample_data" is injected into the href of the "here" button in the callout notifying of installed sample alerts
}
setGlobalBreadcrumb() {
const breadcrumb = [
{ text: '' },
{ text: 'Management', href: '#/manager' },
{ text: 'Sample data' }
];
store.dispatch(updateGlobalBreadcrumb(breadcrumb));
}
componentDidMount() {
this.setGlobalBreadcrumb();
}

changeGuide = (guide: string = '') => {
this.setState({ guide });
}
Expand All @@ -117,7 +100,7 @@ export default class WzAddModulesData extends Component<IPropsWzAddModulesData,
return category !== '' ? guides.filter(guide => guide.category === category) : guides;
}
render(){
// const { guide, selectedGuideCategory } = this.state; // DON'T DELETE. IT'S FOR MODULE GUIDES.
// const { guide, selectedGuideCategory } = this.state; // DON'T DELETE. IT'S FOR MODULE GUIDES.
return (
<EuiPage restrictWidth='1200px'>
<EuiPageBody>
Expand Down Expand Up @@ -177,4 +160,14 @@ export default class WzAddModulesData extends Component<IPropsWzAddModulesData,
</EuiPage>
)
}
}
}


export default compose(
withGlobalBreadcrumb(props => {
return [
{ text: '' },
{ text: 'Server data' }
];
}),
)(WzAddModulesData);
181 changes: 117 additions & 64 deletions plugins/main/public/components/agents/stats/agent-stats.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,21 +18,33 @@ import {
EuiPage,
EuiPageBody,
EuiSpacer,
EuiText
EuiText,
} from '@elastic/eui';

import { withGlobalBreadcrumb, withReduxProvider, withGuard, withUserAuthorizationPrompt, withErrorBoundary } from '../../common/hocs';
import {
withGlobalBreadcrumb,
withReduxProvider,
withGuard,
withUserAuthorizationPrompt,
withErrorBoundary,
} from '../../common/hocs';
import { compose } from 'redux';
import { WzRequest, formatUIDate } from '../../../react-services';
import { AgentStatTable } from './table';
import { PromptNoActiveAgentWithoutSelect, PromptAgentFeatureVersion } from '../prompts';
import {
PromptNoActiveAgentWithoutSelect,
PromptAgentFeatureVersion,
} from '../prompts';
import {
UIErrorLog,
UI_ERROR_SEVERITIES,
UILogLevel,
UIErrorSeverity,
} from '../../../react-services/error-orchestrator/types';
import { API_NAME_AGENT_STATUS, UI_LOGGER_LEVELS } from '../../../../common/constants';
import {
API_NAME_AGENT_STATUS,
UI_LOGGER_LEVELS,
} from '../../../../common/constants';
import { getErrorOrchestrator } from '../../../react-services/common-services';

const tableColumns = [
Expand All @@ -50,83 +62,111 @@ const tableColumns = [
field: 'bytes',
name: 'Bytes',
sortable: true,
}
];

const statsAgents: {title: string, field: string, render?: (value) => any}[] = [
{
title: 'Status',
field: 'status',
},
{
title: 'Buffer',
field: 'buffer_enabled',
render: (value) => value ? 'enabled' : 'disabled'
},
{
title: 'Message buffer',
field: 'msg_buffer'
},
{
title: 'Messages count',
field: 'msg_count'
},
{
title: 'Messages sent',
field: 'msg_sent'
},
{
title: 'Last ack',
field: 'last_ack',
render: formatUIDate
},
{
title: 'Last keep alive',
field: 'last_keepalive',
render: formatUIDate
}
];

const statsAgents: { title: string; field: string; render?: (value) => any }[] =
[
{
title: 'Status',
field: 'status',
},
{
title: 'Buffer',
field: 'buffer_enabled',
render: value => (value ? 'enabled' : 'disabled'),
},
{
title: 'Message buffer',
field: 'msg_buffer',
},
{
title: 'Messages count',
field: 'msg_count',
},
{
title: 'Messages sent',
field: 'msg_sent',
},
{
title: 'Last ack',
field: 'last_ack',
render: formatUIDate,
},
{
title: 'Last keep alive',
field: 'last_keepalive',
render: formatUIDate,
},
];

export const MainAgentStats = compose(
withErrorBoundary,
withReduxProvider,
withGlobalBreadcrumb(({agent}) => [
withGlobalBreadcrumb(({ agent }) => [
{
text: ''
text: '',
},
{
text: 'Agents',
href: "#/agents-preview"
text: 'IT Hygiene',
},
{ agent },
{
text: 'Stats'
text: 'Stats',
},
]),
withUserAuthorizationPrompt(({agent}) => [[
{action: 'agent:read', resource: `agent:id:${agent.id}`},
...(agent.group || []).map(group => ({ action: 'agent:read', resource: `agent:group:${group}` }))
]]),
withGuard(({agent}) => agent.status !== API_NAME_AGENT_STATUS.ACTIVE, PromptNoActiveAgentWithoutSelect),
withGuard(({agent}) => {
const [major, minor, patch] = agent.version.replace('Wazuh v','').split('.').map(value => parseInt(value));
return !(major >= 4 && minor >= 2 && patch >= 0)
}, () => <PromptAgentFeatureVersion version='equal or higher version than 4.2.0'/>)
withUserAuthorizationPrompt(({ agent }) => [
[
{ action: 'agent:read', resource: `agent:id:${agent.id}` },
...(agent.group || []).map(group => ({
action: 'agent:read',
resource: `agent:group:${group}`,
})),
],
]),
withGuard(
({ agent }) => agent.status !== API_NAME_AGENT_STATUS.ACTIVE,
PromptNoActiveAgentWithoutSelect,
),
withGuard(
({ agent }) => {
const [major, minor, patch] = agent.version
.replace('Wazuh v', '')
.split('.')
.map(value => parseInt(value));
return !(major >= 4 && minor >= 2 && patch >= 0);
},
() => (
<PromptAgentFeatureVersion version='equal or higher version than 4.2.0' />
),
),
)(AgentStats);

function AgentStats({agent}){
function AgentStats({ agent }) {
const [loading, setLoading] = useState();
const [dataStatLogcollector, setDataStatLogcollector] = useState({});
const [dataStatAgent, setDataStatAgent] = useState();
useEffect(() => {
(async function(){
(async function () {
setLoading(true);
try{
const responseDataStatLogcollector = await WzRequest.apiReq('GET', `/agents/${agent.id}/stats/logcollector`, {});
const responseDataStatAgent = await WzRequest.apiReq('GET', `/agents/${agent.id}/stats/agent`, {});
setDataStatLogcollector(responseDataStatLogcollector?.data?.data?.affected_items?.[0] || {});
setDataStatAgent(responseDataStatAgent?.data?.data?.affected_items?.[0] || undefined);
} catch(error) {
try {
const responseDataStatLogcollector = await WzRequest.apiReq(
'GET',
`/agents/${agent.id}/stats/logcollector`,
{},
);
const responseDataStatAgent = await WzRequest.apiReq(
'GET',
`/agents/${agent.id}/stats/agent`,
{},
);
setDataStatLogcollector(
responseDataStatLogcollector?.data?.data?.affected_items?.[0] || {},
);
setDataStatAgent(
responseDataStatAgent?.data?.data?.affected_items?.[0] || undefined,
);
} catch (error) {
const options: UIErrorLog = {
context: `${AgentStats.name}.useEffect`,
level: UI_LOGGER_LEVELS.ERROR as UILogLevel,
Expand All @@ -141,18 +181,31 @@ function AgentStats({agent}){
} finally {
setLoading(false);
}
})()
})();
}, []);
return (
<EuiPage>
<EuiPageBody>
<EuiFlexGroup>
<EuiFlexItem>
<EuiPanel paddingSize="m">
<EuiPanel paddingSize='m'>
<EuiFlexGroup>
{statsAgents.map(stat => (
<EuiFlexItem key={`agent-stat-${stat.field}`} grow={false}>
<EuiText>{stat.title}: {loading ? <EuiLoadingSpinner size="s" /> : <strong>{dataStatAgent !== undefined ? (stat.render ? stat.render(dataStatAgent[stat.field]) : dataStatAgent?.[stat.field]) : '-'}</strong>}</EuiText>
<EuiText>
{stat.title}:{' '}
{loading ? (
<EuiLoadingSpinner size='s' />
) : (
<strong>
{dataStatAgent !== undefined
? stat.render
? stat.render(dataStatAgent[stat.field])
: dataStatAgent?.[stat.field]
: '-'}
</strong>
)}
</EuiText>
</EuiFlexItem>
))}
</EuiFlexGroup>
Expand Down Expand Up @@ -186,5 +239,5 @@ function AgentStats({agent}){
</EuiFlexGroup>
</EuiPageBody>
</EuiPage>
)
);
}
26 changes: 24 additions & 2 deletions plugins/main/public/components/agents/syscollector/main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,29 @@
*/

import React from 'react';
import { withErrorBoundary } from '../../common/hocs';
import {
withErrorBoundary,
withGlobalBreadcrumb,
withReduxProvider,
} from '../../common/hocs';
import { SyscollectorInventory } from './inventory';
import { compose } from 'redux';

export const MainSyscollector = withErrorBoundary(SyscollectorInventory);
export const MainSyscollector = compose(
withReduxProvider,
withErrorBoundary,
withGlobalBreadcrumb(({ agent }) => {
return [
{
text: '',
},
{
text: 'IT Hygiene',
},
{ agent },
{
text: 'Inventory Data',
},
];
}),
)(SyscollectorInventory);
Loading

0 comments on commit d8da98f

Please sign in to comment.