Add picker for badges #21436
Add picker for badges #21436
Conversation
|
Note Reviews pausedUse the following commands to manage reviews:
WalkthroughWalkthroughThe recent updates enhance the Lovelace UI by introducing new badge management features, refining existing configurations, and improving user interaction. Key changes include the mandatory Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant BadgeManager
participant BadgePicker
participant Dialog
User->>BadgeManager: Request to create badge
BadgeManager->>BadgePicker: Show badge options
BadgePicker-->>User: Display available badges
User->>BadgePicker: Select badge
BadgePicker->>Dialog: Open badge creation dialog
Dialog-->>User: Prompt for badge configuration
User->>Dialog: Submit badge configuration
Dialog->>BadgeManager: Create badge with config
BadgeManager-->>User: Confirmation of badge creation
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 Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Outside diff range, codebase verification and nitpick comments (1)
src/translations/en.json (1)
5589-5592: Ensure translation keys are correctly defined.The keys
ui::panel::lovelace::editor::suggest_card::headerandui::panel::lovelace::editor::suggest_card::addare only referenced within thesuggest_badgesection and do not appear to be defined elsewhere. Please verify if these keys are defined elsewhere in the file or if they need to be defined.
- Verify the existence and definition of the keys
ui::panel::lovelace::editor::suggest_card::headerandui::panel::lovelace::editor::suggest_card::add.Analysis chain
Ensure translation keys are correctly referenced.
The new
suggest_badgesection references keys fromsuggest_card. Verify that these keys exist and are correctly referenced.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify that the referenced translation keys exist. # Test: Search for the referenced keys. Expect: Both keys should be present in the codebase. rg --type json --json 'ui::panel::lovelace::editor::suggest_card::header' rg --type json --json 'ui::panel::lovelace::editor::suggest_card::add'Length of output: 1994
| private _handleBadgePicked(ev) { | ||
| const config = ev.detail.config; | ||
| if (this._params!.entities && this._params!.entities.length) { | ||
| if (Object.keys(config).includes("entities")) { | ||
| config.entities = this._params!.entities; | ||
| } else if (Object.keys(config).includes("entity")) { | ||
| config.entity = this._params!.entities[0]; | ||
| } | ||
| } | ||
|
|
||
| showEditBadgeDialog(this, { | ||
| lovelaceConfig: this._params!.lovelaceConfig, | ||
| saveConfig: this._params!.saveConfig, | ||
| path: this._params!.path, | ||
| badgeConfig: config, | ||
| }); | ||
|
|
||
| this.closeDialog(); | ||
| } |
There was a problem hiding this comment.
_handleBadgePicked method: Use optional chaining.
The method can be simplified by using optional chaining.
- if (this._params!.entities && this._params!.entities.length) {
+ if (this._params?.entities?.length) {Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| private _handleBadgePicked(ev) { | |
| const config = ev.detail.config; | |
| if (this._params!.entities && this._params!.entities.length) { | |
| if (Object.keys(config).includes("entities")) { | |
| config.entities = this._params!.entities; | |
| } else if (Object.keys(config).includes("entity")) { | |
| config.entity = this._params!.entities[0]; | |
| } | |
| } | |
| showEditBadgeDialog(this, { | |
| lovelaceConfig: this._params!.lovelaceConfig, | |
| saveConfig: this._params!.saveConfig, | |
| path: this._params!.path, | |
| badgeConfig: config, | |
| }); | |
| this.closeDialog(); | |
| } | |
| private _handleBadgePicked(ev) { | |
| const config = ev.detail.config; | |
| if (this._params?.entities?.length) { | |
| if (Object.keys(config).includes("entities")) { | |
| config.entities = this._params.entities; | |
| } else if (Object.keys(config).includes("entity")) { | |
| config.entity = this._params.entities[0]; | |
| } | |
| } | |
| showEditBadgeDialog(this, { | |
| lovelaceConfig: this._params!.lovelaceConfig, | |
| saveConfig: this._params!.saveConfig, | |
| path: this._params!.path, | |
| badgeConfig: config, | |
| }); | |
| this.closeDialog(); | |
| } |
Tools
Biome
[error] 217-217: Change to an optional chain.
Unsafe fix: Change to an optional chain.
(lint/complexity/useOptionalChain)
|
@coderabbitai pause |
| @@ -1,7 +1,7 @@ | |||
| import { Condition } from "../../../panels/lovelace/common/validate-condition"; | |||
|
|
|||
| export interface LovelaceBadgeConfig { | |||
| type?: string; | |||
| type: string; | |||
There was a problem hiding this comment.
There will still be a lot of configs around that won't have a type, we should deal with those so changing this type might not be wise?
Proposed change
Add badge picker. It supports same feature as the card one :
For now, there is only one official badge (
entity) as state-label will be removed.Demo
CleanShot.2024-07-19.at.15.42.40.mp4
Type of change
Example configuration
Additional information
Checklist
If user exposed functionality or configuration variables are added/changed:
Summary by CodeRabbit
New Features
HuiBadgePickerfor enhanced badge selection and management within the Lovelace dashboard.Improvements
User Interface
Bug Fixes