Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove agent AngularJS controller #6618

Merged
merged 15 commits into from
Apr 29, 2024
Merged
Show file tree
Hide file tree
Changes from 11 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ All notable changes to the Wazuh app project will be documented in this file.
- Enhance the validation for `enrollment.dns` on App Settings application [#6573](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6573)
- Remove AngularJS controller for manage groups [#6543](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6543)
- Remove some branding references across the application. [#6155](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6155)
- Remove AngularJS controller for the agent view [#6618](https://github.com/wazuh/wazuh-dashboard-plugins/pull/6618)

### Fixed

Expand Down
181 changes: 181 additions & 0 deletions plugins/main/public/components/agents/export-configuration.js
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion: we could have moved the file instead of creating a new one through copying it. Moving follows the tracking of the commits of the old file.

Original file line number Diff line number Diff line change
@@ -0,0 +1,181 @@
/*
* Wazuh app - React component for exporting the configuration of a group.
* Copyright (C) 2015-2022 Wazuh, Inc.
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 2 of the License, or
* (at your option) any later version.
*
* Find more information about this on the LICENSE file.
*/
import React, { Component } from 'react';

import {
EuiPopover,
EuiButton,
EuiCheckboxGroup,
EuiSpacer,
EuiButtonEmpty,
} from '@elastic/eui';

import PropTypes from 'prop-types';
import { UnsupportedComponents } from '../../utils/components-os-support';
import { WAZUH_AGENTS_OS_TYPE } from '../../../common/constants';
import { withErrorBoundary } from '../common/hocs';

export const ExportConfiguration = withErrorBoundary(
class ExportConfiguration extends Component {
constructor(props) {
super(props);

this.state = {
buttonDisabled: false,
isPopoverOpen: false,
};

const agentOptions = [
'Global configuration',
'Communication',
'Anti-flooding settings',
'Labels',
'Policy monitoring',
{ name: 'oscap', desc: 'OpenSCAP' },
'CIS-CAT',
'Osquery',
'Inventory data',
'Active response',
'Commands',
{ name: 'docker', desc: 'Docker listener' },
'Log collection',
'Integrity monitoring',
];
const groupOptions = ['Configurations', 'Agents in group'];

this.options = [];
const list = this.props.type === 'agent' ? agentOptions : groupOptions;
list.forEach((x, idx) => {
if (
typeof x === 'string' ||
(x.name &&
!(
UnsupportedComponents[this.props.agentPlatform] ||
UnsupportedComponents[WAZUH_AGENTS_OS_TYPE.OTHERS]
).includes(x.name))
) {
this.options.push({ id: `${idx}`, label: x.desc || x });
}
});

let initialChecks = {};
this.options.forEach(x => {
initialChecks[x.id] = true;
});
this.state.checkboxIdToSelectedMap = initialChecks;
}

selectAll(flag) {
let newCheckboxIdToSelectedMap = {};
for (let i = 0; i < this.options.length; i++) {
newCheckboxIdToSelectedMap[`${this.options[i].id}`] = flag;
}
this.setState({
checkboxIdToSelectedMap: newCheckboxIdToSelectedMap,
buttonDisabled: !flag,
});
}

exportClick() {
this.setState({
isPopoverOpen: !this.state.isPopoverOpen,
});
}

closePopover() {
this.setState({
isPopoverOpen: false,
});
}

onChange = optionId => {
const newCheckboxIdToSelectedMap = {
...this.state.checkboxIdToSelectedMap,
...{
[optionId]: !this.state.checkboxIdToSelectedMap[optionId],
},
};
let result = false;
for (let i = 0; i < this.options.length; i++) {
if (newCheckboxIdToSelectedMap[`${this.options[i].id}`] === true) {
result = true;
}
}
this.setState({
checkboxIdToSelectedMap: newCheckboxIdToSelectedMap,
buttonDisabled: !result,
});
};

render() {
const button = (
<EuiButtonEmpty
iconType='importAction'
iconSide='left'
size='s'
style={{ marginTop: '4px' }}
onClick={this.exportClick.bind(this)}
>
Export PDF
</EuiButtonEmpty>
);
return (
<EuiPopover
id='trapFocus'
ownFocus
button={button}
isOpen={this.state.isPopoverOpen}
closePopover={this.closePopover.bind(this)}
anchorPosition='downRight'
>
<EuiCheckboxGroup
options={this.options}
idToSelectedMap={this.state.checkboxIdToSelectedMap}
onChange={this.onChange}
compressed
/>
<EuiSpacer size='s' />
{this.options.length > 3 && (
<>
<EuiButtonEmpty size='xs' onClick={() => this.selectAll(true)}>
Select all
</EuiButtonEmpty>
<EuiSpacer size='s' />
<EuiButtonEmpty size='xs' onClick={() => this.selectAll(false)}>
Unselect all
</EuiButtonEmpty>
</>
)}
<EuiSpacer size='m' />
<EuiButton
isDisabled={this.state.buttonDisabled}
onClick={() => {
this.closePopover();
this.props.exportConfiguration(
this.state.checkboxIdToSelectedMap,
);
}}
fill
>
Generate PDF report
</EuiButton>
</EuiPopover>
);
}
},
);

ExportConfiguration.propTypes = {
exportConfiguration: PropTypes.func,
type: PropTypes.string,
agentPlatform: PropTypes.string,
};
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,11 @@ export const VisualizationBasicWidgetSelector = ({

return (
<>
<EuiFlexGroup className='embPanel__header' gutterSize='none'>
<EuiFlexGroup
className='embPanel__header'
gutterSize='none'
alignItems='center'
>
<EuiFlexItem>
{title && (
<h2 className='embPanel__title wz-headline-title'>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -257,7 +257,7 @@ export class PatternDataSourceFilterManager
isCluster
? AppState.getClusterInfo().cluster
: AppState.getClusterInfo().manager,
true,
isCluster,
key,
);
managerFilter.meta = {
Expand Down
70 changes: 13 additions & 57 deletions plugins/main/public/components/common/welcome/agents-welcome.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ import {
EuiButtonEmpty,
EuiPage,
EuiPopover,
EuiLoadingChart,
EuiToolTip,
EuiButtonIcon,
EuiPageBody,
Expand All @@ -39,7 +38,6 @@ import WzReduxProvider from '../../../redux/wz-redux-provider';
import MenuAgent from './components/menu-agent';
import './welcome.scss';
import { WzDatePicker } from '../../../components/wz-date-picker/wz-date-picker';
import KibanaVis from '../../../kibana-integrations/kibana-vis';
import { VisFactoryHandler } from '../../../react-services/vis-factory-handler';
import { AppState } from '../../../react-services/app-state';
import { FilterHandler } from '../../../utils/filter-handler';
Expand All @@ -49,10 +47,10 @@ import {
updateCurrentAgentData,
} from '../../../redux/actions/appStateActions';
import {
getAngularModule,
getChrome,
getCore,
getDataPlugin,
getAngularModule,
} from '../../../kibana-services';
import { hasAgentSupportModule } from '../../../react-services/wz-agents';
import {
Expand Down Expand Up @@ -80,6 +78,7 @@ import {
malwareDetection,
} from '../../../utils/applications';
import { RedirectAppLinks } from '../../../../../../src/plugins/opensearch_dashboards_react/public';
import { EventsCount } from './dashboard/events-count';

const mapStateToProps = state => ({
agent: state.appStateReducers.currentAgentData,
Expand Down Expand Up @@ -150,6 +149,9 @@ export const AgentsWelcome = compose(

this.sidebarSizeDefault = 320;

const $injector = getAngularModule().$injector;
this.location = $injector.get('$location');

this.state = {
lastScans: [],
isLoading: true,
Expand Down Expand Up @@ -200,8 +202,8 @@ export const AgentsWelcome = compose(
of duplicating it. It was duplicated due to the differences of requirements
in the Explore agent button for the modules and agent welcome
*/
async removeAgentsFilter() {
await this.props.setAgent(false);
removeAgentsFilter() {
this.props.setAgent(false);
const currentAppliedFilters = getDataPlugin().query.filterManager.filters;
const agentFilters = currentAppliedFilters.filter(x => {
return x.meta.key !== 'agent.id';
Expand All @@ -227,16 +229,14 @@ export const AgentsWelcome = compose(
welcome: 8,
});
const filterHandler = new FilterHandler(AppState.getCurrentPattern());
const $injector = getAngularModule().$injector;

this.drawerLokedSubscribtion = getChrome()
.getIsNavDrawerLocked$()
.subscribe(isLocked => {
this.setState({ isLocked }, () => {
this.updateWidth();
});
});
this.router = $injector.get('$route');
this.location = $injector.get('$location');
window.addEventListener('resize', this.updateWidth); //eslint-disable-line
await VisFactoryHandler.buildAgentsVisualizations(
lucianogorza marked this conversation as resolved.
Show resolved Hide resolved
filterHandler,
Expand Down Expand Up @@ -354,7 +354,6 @@ export const AgentsWelcome = compose(
closePopover={() => {
this.setState({ switchModule: false });
}}
switchTab={module => this.props.switchTab(module)}
></MenuAgent>
</div>
</WzReduxProvider>
Expand All @@ -366,7 +365,6 @@ export const AgentsWelcome = compose(
}

renderTitle() {
const notNeedStatus = true;
const thereAreAgentSelected = Boolean(this.props.agent?.id);
// Calculate if the header buttons should display the name or only the icon to be responsive

Expand Down Expand Up @@ -411,7 +409,6 @@ export const AgentsWelcome = compose(
closePopover={() => {
this.setState({ switchModule: false });
}}
switchTab={module => this.props.switchTab(module)}
></MenuAgent>
</div>
</WzReduxProvider>
Expand Down Expand Up @@ -460,9 +457,7 @@ export const AgentsWelcome = compose(
<WzButton
buttonType='empty'
iconType='inspect'
onClick={() =>
this.props.switchTab('syscollector', notNeedStatus)
}
onClick={() => this.props.switchTab('syscollector')}
className='wz-it-hygiene-header-button'
tooltip={
this.state.maxModules === null
Expand All @@ -477,7 +472,7 @@ export const AgentsWelcome = compose(
<WzButton
buttonType='empty'
iconType='stats'
onClick={() => this.props.switchTab('stats', notNeedStatus)}
onClick={() => this.props.switchTab('stats')}
className='wz-it-hygiene-header-button'
tooltip={
this.state.maxModules === null
Expand All @@ -492,9 +487,7 @@ export const AgentsWelcome = compose(
<WzButton
buttonType='empty'
iconType='gear'
onClick={() =>
this.props.switchTab('configuration', notNeedStatus)
}
onClick={() => this.props.switchTab('configuration')}
className='wz-it-hygiene-header-button'
tooltip={
this.state.maxModules === null
Expand Down Expand Up @@ -569,50 +562,13 @@ export const AgentsWelcome = compose(
}

renderEventCountVisualization() {
return (
<EuiPanel paddingSize='s'>
<EuiFlexItem>
<EuiFlexGroup>
<EuiFlexItem>
<h2 className='embPanel__title wz-headline-title'>
<EuiText size='xs'>
<h2>Events count evolution</h2>
</EuiText>
</h2>
</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer size='s' />
<div
style={{
height: this.props.resultState !== 'loading' ? '350px' : 0,
}}
>
<WzReduxProvider>
<KibanaVis
visID={'Wazuh-App-Agents-Welcome-Events-Evolution'}
tab={'welcome'}
></KibanaVis>
</WzReduxProvider>
</div>
<div
style={{
display:
this.props.resultState === 'loading' ? 'block' : 'none',
alignSelf: 'center',
paddingTop: 100,
}}
>
<EuiLoadingChart size='xl' />
</div>
</EuiFlexItem>
</EuiPanel>
);
return <EventsCount />;
}

renderSCALastScan() {
return (
<EuiFlexGroup direction='column'>
<ScaScan switchTab={this.props.switchTab} {...this.props} />
<ScaScan {...this.props} />
</EuiFlexGroup>
);
}
Expand Down