The agents dashboard is displayed when using the Add agent button from plugin home

[Desvelao]

Description
The agents dashboard is displayed when using the Add agent button from the Modules directory section for a little period of time.

Preconditions

1. No registered agents

Steps to reproduce

1. Navigate to Modules directory
2. Click on Add agent button

Expected Result
The displayed view should be what we want to navigate to instead of this redirection behavior.

Evidences
https://github.com/wazuh/wazuh-dashboard-plugins/assets/34042064/69c6d5de-37f0-4a54-8dcd-e488bbd1c11c

[lucianogorza]

Current behavior

The component OverviewWelcome (plugins/wazuh/public/components/common/welcome/overview-welcome.js) has a button that is renderer only when there is no registered agents. The button has a href to the page #/agents-preview

The page #/agents-preview is renderer by the template plugins/wazuh/public/templates/agents-prev/agents-prev.html. This template uses the agentsPreviewController controller.

At the end of the template, we can see that the React component RegisterAgent is rendered (ng-if) only if the addingNewAgent controller value is true, and another component, AgentsPreview, is rendered but only displayed (ng-how) if the addingNewAgent value is false. Therefore, the AgentsPreview component is always rendered.

Why is it necessary to always render the AgentsPreview component?

The component is responsible for retrieving and updating general information about the agents through the tableProps.updateSummary function obtained in the props.

The updateSummary function is declared in the controller and it updates the value of addingNewAgent, which determines whether the RegisterAgent component is rendered or not.

Therefore, when the page #/agents-preview is initially loaded, the AgentsPreview component is first rendered and displayed. If there are no registered agents, the AgentsPreview component stops being displayed, and the RegisterAgent component is rendered.

Possible solutions

Solution 1:

• Retrieve general information about the agents in the controller so that the addingNewAgent value is set before rendering the components.
• Pass the retrieved information to the components through props and remove the parts where this information is retrieved in the components.
• Additionally, the ng-show option in the HTML template for the AgentsPreview component should be modified to ng-if.

Solution 2:

• In AgentsPreview component return a loading while summary data is being retrieved.
• In AgentsPreview component add a condition and only return the dashboard and table if agent count > 0.
• In AgentsPreview controller in the RegisterAgent component replace ng-if with ng-show.

One must analyze what impact the changes may have on other use cases.

[lucianogorza]

In a meeting with @asteriscos we decided to go for solution 2