wazuh-dashboard-plugins icon indicating copy to clipboard operation
wazuh-dashboard-plugins copied to clipboard

Add header and footer report customization

Open asteriscos opened this issue 2 years ago • 4 comments

Description

This PR is part of White-Labeling Epic https://github.com/wazuh/wazuh-kibana-app/issues/4392. It adds custom text to PDF report header and footer.

Closes https://github.com/wazuh/wazuh-kibana-app/issues/4426 Base: feat/settings-validation

Screenshots

image

image

Tests

Manual tests

Scenario: The customization.reports.* settings should appear in the default configuration file When the user starts the plugin platform and there is no plugin configuration file Then the configuration file should be generated and include the customization.reports.* settings

Scenario: The customization.reports.* settings should appear in the Settings/Configuration section When the user navigates to Settings/Configuration Then the customization.reports.* settings should be there

Scenario: Set the customization.reports.header with a valid value through Settings/Configuration. When the user sets the customization.reports.header with a valid value. Maximum 4 lines. Then the user can save the configuration successfully. And the configuration file is updated with the configuration.

Scenario: Set the customization.reports.footer with a valid value through Settings/Configuration. When the user sets the customization.reports.header with a valid value. Maximum 2 lines. Then the user can save the configuration successfully. And the configuration file is updated with the configuration.

Scenario: Set the customization.reports.header with a invalid value through Settings/Configuration. When the user sets the customization.reports.header with an invalid value. Maximum 4 lines. Then a validation error is displayed.

Scenario: Set the customization.reports.footer with a invalid value through Settings/Configuration. When the user sets the customization.reports.header with an invalid value. Maximum 2 lines. Then a validation error is displayed.

Scenario: Set the customization.reports.header with a valid value through API request. When the user does an API request to update the customization.reports.header setting with a valid value. Maximum 4 lines. Then the endpoint replies with a successful response.

Scenario: Set the customization.reports.footer with a valid value through an API request. When the user does an API request to update the customization.reports.footer setting with a valid value. Maximum 2 lines. Then the endpoint replies with a successful response.

Scenario: Set the customization.reports.header with an invalid value through an API request. When the user does an API request to update the customization.reports.header setting with an invalid value. Maximum 4 lines. Then the endpoint replies with a bad request response.

Scenario: Set the customization.reports.footer with an invalid value through an API request. When the user does an API request to update the customization.reports.header setting with an invalid value. Maximum 2 lines. Then the endpoint replies with a bad request response.

Scenario: Generate a PDF with a custom header. Given the customization.reports.header setting has a custom value. When generates a PDF module report. Then the custom text should appear in the header.

Scenario: Generate a PDF with a custom footer. Given the customization.reports.footer setting has a custom value. When generates a PDF module report. Then the custom text should appear in the footer.

asteriscos avatar Sep 13 '22 10:09 asteriscos

Examples of different logos ratios

Before Screenshot from 2022-09-14 17-21-41

After More width than height: Screenshot from 2022-09-14 18-49-40

Equal width and height: Screenshot from 2022-09-14 18-48-14


Wazuh Logo for reference image

asteriscos avatar Sep 14 '22 16:09 asteriscos

I added some manual tests to the initial comment.

Desvelao avatar Sep 15 '22 09:09 Desvelao

Changes

  • Updated the development branch with the last changes of the base branch.

Desvelao avatar Sep 19 '22 15:09 Desvelao

Update

  • Update the development branch with the last changes of the base branch.

Desvelao avatar Sep 23 '22 08:09 Desvelao

Update

  • Add tests

Desvelao avatar Sep 27 '22 06:09 Desvelao

Update

  • Update development branch with the base branch
  • Add test related to the validation of the customization.reports.footer and customization.reports.header settings in the form inputs

Desvelao avatar Oct 05 '22 10:10 Desvelao

Update

  • Add test for the GET /reports endpoint

Desvelao avatar Oct 05 '22 11:10 Desvelao

Update

  • Update the development branch with the base branch

Desvelao avatar Oct 06 '22 09:10 Desvelao

  • Code review: heavy_check_mark
  • Test: red_circle

The customization of the logo, header and footer for the PDFs work quite well:

image

However, I found a few errors:

  • The header allows 4 lines of text, however only 3 are actually rendered.
  • The inputs limit the number of text lines, but not their length. It's quite easy to break this feature by adding a single, extra long line.

image image

Texts used:

Powered by Wazuh
- This is a custom footer for PDF reports -
Powered by Wazuh
________________________
- This is a custom header for PDF reports -
- Provided by the @wazuh/frontend-team -

Yes, the settings only limit the number of lines and not the length of the lines, we could limit if we consider it.

When I developed it, I considered the length of the lines is under the responsibility of the user, so the plugin has no limit that could affect some use cases. Anyways, we could set some value and check the input is valid.

Desvelao avatar Oct 28 '22 15:10 Desvelao

Added max length per line validation.

Peek 2022-10-28 18-56

asteriscos avatar Oct 28 '22 17:10 asteriscos

Code coverage (Jest) % values
Statements 8.29% ( 3037 / 36640 )
Branches 3.83% ( 1080 / 28200 )
Functions 7.26% ( 659 / 9080 )
Lines 8.34% ( 2926 / 35070 )

github-actions[bot] avatar Oct 31 '22 09:10 github-actions[bot]

The backport to 4.4-7.16 failed:

The process '/usr/bin/git' failed with exit code 1

To backport manually, run these commands in your terminal:

# Fetch latest updates from GitHub
git fetch
# Create a new working tree
git worktree add .worktrees/backport-4.4-7.16 4.4-7.16
# Navigate to the new working tree
cd .worktrees/backport-4.4-7.16
# Create a new branch
git switch --create backport-4505-to-4.4-7.16
# Cherry-pick the merged commit of this pull request and resolve the conflicts
git cherry-pick -x --mainline 1 ce29034e17045a808b43390f314b44fbf2c7c8e2
# Push it to GitHub
git push --set-upstream origin backport-4505-to-4.4-7.16
# Go back to the original working tree
cd ../..
# Delete the working tree
git worktree remove .worktrees/backport-4.4-7.16

Then, create a pull request where the base branch is 4.4-7.16 and the compare/head branch is backport-4505-to-4.4-7.16.

github-actions[bot] avatar Oct 31 '22 09:10 github-actions[bot]