feat(web): add file extension validation to file browser modal

[eduardomozart]

Description

This PR adds frontend file extension validation to the shared "Select File" file browser modal in the Sunshine Web UI.
Previously, the file browser would accept any selected file (e.g. .md) without providing any feedback, even when opening the modal to select an application cover image.

This change ensures the file extension is validated directly in the modal right when the user clicks "Select", aligning the frontend behavior with the existing backend enforcement in validate_app_image_path (in process.cpp).

Screenshot

Updated fileBrowserConfirm to validate the selected file against the accepted extensions and display an error message inside the modal if it fails.

Gravacao.de.Tela.2026-08-18.as.16.13.48.mov

Updated the save method to validate manually typed image paths, displaying the new error banner and preventing the API request if the extension is invalid.

Issues Fixed or Closed

• Closes Web UI: File browser does not validate PNG images for Application Covers #5523

Roadmap Issues

Type of Change

• feat: New feature (non-breaking change which adds functionality)
• fix: Bug fix (non-breaking change which fixes an issue)
• docs: Documentation only changes
• style: Changes that do not affect the meaning of the code (white-space, formatting, missing semicolons, etc.)
• refactor: Code change that neither fixes a bug nor adds a feature
• perf: Code change that improves performance
• test: Adding missing tests or correcting existing tests
• build: Changes that affect the build system or external dependencies
• ci: Changes to CI configuration files and scripts
• chore: Other changes that don't modify src or test files
• revert: Reverts a previous commit
• BREAKING CHANGE: Introduces a breaking change (can be combined with any type above)

Checklist

• Code follows the style guidelines of this project
• Code has been self-reviewed
• Code has been commented, particularly in hard-to-understand areas
• Code docstring/documentation-blocks for new or existing methods/components have been added or updated
• Unit tests have been added or updated for any new or modified functionality

AI Usage

See our AI usage policy.

• None: No AI tools were used in creating this PR
• Light: AI provided minor assistance (formatting, simple suggestions)
• Moderate: AI helped with code generation or debugging specific parts
• Heavy: AI generated most or all of the code changes

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[ReenigneArcher]

Is this only for the cover browse button or all? Because all except the cover image one need to accept any extension.

[eduardomozart]

Is this only for the cover browse button or all? Because all except the cover image one need to accept any extension.

The validation is strictly applied only to the cover image button.

Here is how the logic works:

1. We updated the browseFor method to accept a new optional acceptedExtensions parameter, which defaults to null if not provided.
2. We only passed ['.png'] as this parameter for the Image field's browse button.
3. For all other fields (like the Command, Output, or Working Directory), they continue to call browseFor exactly as they did before, leaving acceptedExtensions as null.
4. Inside the fileBrowserConfirm method, the validation check only runs if acceptedExtensions is not null.

So all other fields will continue to accept any extension perfectly fine, exactly as they did before.