feat: desktop background context menu #55
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add a new context menu option that allows users to set any image file as their desktop background directly from the file explorer. Changes: - Add isImageFile() helper function to detect image files by extension - Add set_as_desktop_background i18n translation string - Add context menu item that appears only for image files (not folders, non-images, or trashed items) - Implement background change with image preloading to prevent gray flash - Add smooth fade transition (0.4s) for polished UX - Persist background preference to server via /set-desktop-bg endpoint - Update window.user object with new background settings The implementation follows the same pattern as UIWindowDesktopBGSettings and uses signed URLs from the /sign endpoint to ensure proper authentication for CSS background-image requests. Files modified: - src/gui/src/UI/UIItem.js - src/gui/src/i18n/translations/en.js
Add the set_as_desktop_background translation key to all 37 translation files to support the new 'Set as Desktop Background' context menu feature.
PrayagCodes
changed the title
israx
reviewed
Nov 26, 2025
| const read_url = sign_res.signatures[0].read_url; | ||
|
|
||
| // Preload image before setting as background to avoid gray flash | ||
| await new Promise((resolve, reject) => { |
There was a problem hiding this comment.
Is this really necessary? why do we need to wrap the logic below into a promise? — img operation seem to be sync
Author
There was a problem hiding this comment.
The promise wrapper is necessary because we need to wait for the asynchronous image download to complete before setting the background. Here's why:
- new Image() and img.src = read_url are synchronous operations (they just create the object and set the property)
- The actual image download happens asynchronously in the browser
- The onload callback fires when that async download completes
- The Promise wrapper lets us await that async event
Without this, we'd set the background before the image finishes downloading, causing a gray flash while the browser loads it. By preloading, the image is cached and ready, so the background change is instant.
israx
approved these changes
Dec 1, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Add 'Set as Desktop Background' Context Menu Item for Images
Summary
This PR adds a "Set as Desktop Background" option to the context menu when right-clicking on image files in the file system. This feature allows users to quickly personalize their desktop by setting any image as their background directly from the file explorer, without navigating through settings menus.
Motivation
Users currently have no quick way to set an image as their desktop background directly from the file system. They must navigate through settings or other indirect methods to change their wallpaper. Adding a context menu option when right-clicking on image files provides a convenient, intuitive way for users to personalize their desktop environment.
This feature enhances the user experience by reducing friction in a common personalization task. It follows familiar desktop environment patterns where users expect to be able to right-click images and set them as backgrounds, making the interface more intuitive and user-friendly.
Changes Made
Core Implementation
Added
isImageFile()helper function (src/gui/src/UI/UIItem.js)Added context menu item (
src/gui/src/UI/UIItem.js)/signendpoint for proper authenticationImplemented background change with UX improvements
/set-desktop-bgendpointwindow.userobject with new background settingsInternationalization
set_as_desktop_backgroundtranslation key to all 37 language filesTechnical Details
Implementation Approach
UIWindowDesktopBGSettingsfor consistency/signendpoint to generate authenticated URLs that work in CSSbackground-image/set-desktop-bgAPI endpoint)window.set_desktop_background()function)Files Modified
src/gui/src/UI/UIItem.js- Main implementation (helper function + context menu item)src/gui/src/i18n/translations/*.js- Translation strings (37 files)Files NOT Modified
Testing
Manual Testing Performed
✅ Context Menu Visibility
✅ Functionality
✅ Internationalization
Test Cases Covered
Acceptance Criteria
UX Improvements
Related Issues
Link to related GitHub issues or feature requests here
Checklist
Notes
/signendpoint to ensure proper authentication for CSSbackground-imagerequests