-
Notifications
You must be signed in to change notification settings - Fork 2.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add UI for setting view background #20708
Conversation
bfa24e7
to
7c31e69
Compare
I spent way too much time trying to figure out why eslint errors out in the CI but not locally. As it turns out this was just broken by |
src/data/image_upload.ts
Outdated
`/api/image/serve/${mediaId}/${size}x${size}`; | ||
export const generateImageThumbnailUrl = ( | ||
mediaId: string, | ||
size: number, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
size should be optional now that original can be set, if original is false size should be set.
size?: number, | ||
original: boolean = false | ||
) => { | ||
if (!original && !size) { | ||
throw new Error("Size must be provided if original is false"); | ||
} | ||
|
||
return original | ||
? `/api/image/serve/${mediaId}/original` | ||
: `/api/image/serve/${mediaId}/${size}x${size}`; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
or maybe don't use an original
parameter, so if size
is not set, provide the original
size?: number, | |
original: boolean = false | |
) => { | |
if (!original && !size) { | |
throw new Error("Size must be provided if original is false"); | |
} | |
return original | |
? `/api/image/serve/${mediaId}/original` | |
: `/api/image/serve/${mediaId}/${size}x${size}`; | |
size?: number | |
) => { | |
return size && size > 0 | |
? `/api/image/serve/${mediaId}/${size}x${size}` | |
: `/api/image/serve/${mediaId}/original`; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was thinking about that approach, but in ha-picture-upload
we use the same structure (original defaulting to false, size defaulting to 512) and I thought it'd be cleaner to keep it unified. Alternatively the original property could be removed in ha-picture-upload
and the default of size could be changed to 0, but I'm not a fan of changing the default size to an "invalid" one.
WalkthroughWalkthroughThe recent updates introduce enhancements to the image upload and view editing functionalities in the Home Assistant frontend. A significant addition is the ability to manage original images and their thumbnails, alongside a new user interface for editing view backgrounds. These changes improve the flexibility and user experience of customizing Lovelace views, providing more control over background settings and image handling. Changes
Tip New Features and ImprovementsReview SettingsIntroduced new personality profiles for code reviews. Users can now select between "Chill" and "Assertive" review tones to tailor feedback styles according to their preferences. The "Assertive" profile posts more comments and nitpicks the code more aggressively, while the "Chill" profile is more relaxed and posts fewer comments. AST-based InstructionsCodeRabbit offers customizing reviews based on the Abstract Syntax Tree (AST) pattern matching. Read more about AST-based instructions in the documentation. Community-driven AST-based RulesWe are kicking off a community-driven initiative to create and share AST-based rules. Users can now contribute their AST-based rules to detect security vulnerabilities, code smells, and anti-patterns. Please see the ast-grep-essentials repository for more information. New Static Analysis ToolsWe are continually expanding our support for static analysis tools. We have added support for Tone SettingsUsers can now customize CodeRabbit to review code in the style of their favorite characters or personalities. Here are some of our favorite examples:
Revamped Settings PageWe have redesigned the settings page for a more intuitive layout, enabling users to find and adjust settings quickly. This change was long overdue; it not only improves the user experience but also allows our development team to add more settings in the future with ease. Going forward, the changes to Miscellaneous
Recent Review DetailsConfiguration used: CodeRabbit UI Files selected for processing (5)
Additional Context UsedBiome (32)
Additional comments not posted (1)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 2
Outside diff range and nitpick comments (3)
src/data/image_upload.ts (1)
Line range hint
44-46
: Consider simplifying the error handling by removing the unnecessary else clause.if (resp.status === 413) { throw new Error(`Uploaded image is too large (${file.name})`); - } else if (resp.status !== 200) { + } if (resp.status !== 200) { throw new Error("Unknown error"); }src/components/ha-picture-upload.ts (1)
Line range hint
34-131
: The addition of theoriginal
property and its usage in the_uploadFile
method are well-implemented. Consider specifying a more accurate type thanany
for error handling.- } catch (err: any) { + } catch (err: Error) { showAlertDialog(this, { text: err.toString(), }); }src/panels/lovelace/editor/view-editor/hui-dialog-edit-view.ts (1)
Line range hint
52-167
: The integration of the new "Background" tab and theHuiViewBackgroundEditor
component is well-executed. Consider using more descriptive variable names for better code readability.- const isCompatibleViewType = + const isViewTypeCompatible =
backend has been merged |
Proposed change
Add UI for setting view background. As it turns out most people don't know that this feature even exists because it needs to be configured by manually uploading a file somewhere then configuring the URL through YAML.
Depends on home-assistant/core#116652 to enable serving images larger than 512px.
Type of change
Example configuration
No more YAML needed 🎉
Additional information
Checklist
If user exposed functionality or configuration variables are added/changed:
Summary by CodeRabbit
New Features
Improvements