feat(ui): Add option to define custom css and js

[kiblik]

Custom styles (in CSS) are beneficial if you are running DD in the company and you would like to add some corporate colors.

[dryrunsecurity]

DryRun Security Summary

The pull request adds functionality to load custom CSS and JavaScript files in DefectDojo through new environment variables, while also highlighting potential security risks that require careful input validation and sanitization.

Expand for full summary

Summary:

The code changes in this pull request introduce the ability to load custom CSS and JavaScript files in the DefectDojo application. This functionality is implemented through the addition of two new environment variables, DD_CUSTOM_CSS and DD_CUSTOM_JS, which allow the application to load custom CSS and JavaScript files, respectively.

From an application security perspective, these changes introduce potential security risks if the custom CSS or JavaScript code is not properly sanitized or validated. Malicious code, such as cross-site scripting (XSS) vulnerabilities, could be executed in the context of the user's browser, potentially leading to a security breach. Additionally, the ability to load custom files could be used to bypass certain security controls, such as content security policy (CSP) restrictions, if the application does not properly validate and sanitize the input.

To mitigate these risks, it is crucial to ensure that the custom CSS and JavaScript files are thoroughly reviewed and tested for security vulnerabilities before being deployed to the production environment. Additionally, the application should implement robust input validation and sanitization mechanisms to prevent the injection of malicious code. It is also recommended to follow best practices for managing and updating these custom files to ensure they remain secure over time.

Files Changed:

1. dojo/context_processors.py: This file has been updated to add two new context variables, CUSTOM_CSS and CUSTOM_JS, to the globalize_vars function. These variables will be used to load the custom CSS and JavaScript files in the application.

2. dojo/templates/base.html: This file has been modified to include new blocks of code that check if the CUSTOM_JS and CUSTOM_CSS variables are defined. If they are, the code iterates through the lists of custom JavaScript and CSS files and includes them in the HTML using <script> and <link> tags, respectively.

3. dojo/settings/settings.dist.py: This file has been updated to add two new environment variables, DD_CUSTOM_CSS and DD_CUSTOM_JS, which will be used to specify the paths to the custom CSS and JavaScript files that should be loaded in the application.

Code Analysis

We ran 9 analyzers against 3 files and 0 analyzers had findings. 9 analyzers had no findings.

View PR in the DryRun Dashboard.

[dryrunsecurity]

DryRun Security Summary

The pull request adds the ability to include custom JavaScript and CSS files in DefectDojo through new settings, enabling application customization while emphasizing the importance of carefully vetting these files for potential security risks.

Expand for full summary

Summary:

The code changes in this pull request focus on adding the ability to include custom JavaScript and CSS files in the DefectDojo application. This is achieved by introducing two new settings, DD_CUSTOM_CSS and DD_CUSTOM_JS, which allow administrators to specify the paths to custom CSS and JavaScript files, respectively. These files are then included in the base HTML template of the application.

From an application security perspective, these changes provide a way for developers and administrators to extend the functionality and styling of the DefectDojo application. However, it is crucial to ensure that the custom CSS and JavaScript files are properly vetted and do not introduce any security vulnerabilities, such as cross-site scripting (XSS) or code injection issues. Developers should review the content of these files and ensure that they are properly sanitized and validated before including them in the application.

Additionally, it is recommended to implement a secure process for managing and updating these custom files, such as using a version control system and implementing appropriate access controls and review processes. This will help to mitigate the potential risks associated with the introduction of custom code into the application.

Files Changed:

1. dojo/templates/base.html: This file has been updated to include new sections for loading custom JavaScript and CSS files, if the CUSTOM_JS and CUSTOM_CSS variables are set, respectively. This provides a way for developers to easily extend the functionality and styling of the DefectDojo application.

2. dojo/settings/settings.dist.py: Two new settings, DD_CUSTOM_CSS and DD_CUSTOM_JS, have been added to the Django application's configuration. These settings allow administrators to specify the paths to custom CSS and JavaScript files, which will be included in the application's user interface.

3. dojo/context_processors.py: The globalize_vars function has been updated to include two new context variables, CUSTOM_CSS and CUSTOM_JS, which are likely used to provide the custom CSS and JavaScript file paths to the application's templates.

Code Analysis

We ran 9 analyzers against 3 files and 0 analyzers had findings. 9 analyzers had no findings.

View PR in the DryRun Dashboard.

[kiblik]

@mtesauro or @Maffooch any feedback regarding this proposal?