Update strategies and registering dashboard strategies blog post#3023
Open
Update strategies and registering dashboard strategies blog post#3023
Conversation
timmo001
changed the title
timmo001
changed the title
13 tasks
Contributor
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughAdds documentation and examples for registering community dashboard and view strategies via Changes
Sequence Diagram(s)sequenceDiagram
participant Dev as Dev page / resource
participant Browser as Browser (window)
participant HA as Home Assistant UI
participant Resource as Hosted resource (JS)
rect rgba(135,206,250,0.5)
Dev->>Browser: load resource script
Browser->>Browser: execute script\nwindow.customStrategies = window.customStrategies || []\nwindow.customStrategies.push({...})
end
rect rgba(144,238,144,0.5)
HA->>Browser: open "New dashboard" dialog\nquery window.customStrategies
Browser-->>HA: return registered strategies list
HA->>Resource: request strategy resource (if not loaded)
Resource-->>HA: load custom element / code
HA->>HA: render community strategies in dialog
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes 🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (3)
blog/2026-04-29-registering-custom-dashboard-strategies.md (2)
38-38: Rephrase for clarity.The phrase "users still need the resource loaded" is awkward. Consider active voice or clearer phrasing.
✍️ Suggested revision
-This metadata is separate from the custom element itself. Your strategy still needs to be registered with a tag like `ll-strategy-dashboard-my-demo`, and users still need the resource loaded before Home Assistant can discover it. You can use HACS for this as other resource can be added, like custom cards. +This metadata is separate from the custom element itself. Your strategy still needs to be registered with a tag like `ll-strategy-dashboard-my-demo`, and users still need to load the resource before Home Assistant can discover it. You can use HACS for this as other resources can be added, like custom cards.Note: Also fixes "resource can be" → "resources can be" (subject-verb agreement).
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@blog/2026-04-29-registering-custom-dashboard-strategies.md` at line 38, The sentence "users still need the resource loaded" is awkward and passive—reword it in active voice and fix subject-verb agreement earlier in the paragraph; for example, explicitly state that users must load the resource (or install it via HACS) before Home Assistant can discover the strategy and change "resource can be added" to "resources can be added"; keep the example tag ll-strategy-dashboard-my-demo and mention HACS as the installation mechanism so readers know they must load the resource before discovery.
9-9: Clarify the opening sentence.The phrase "Before you could do this, but had to send users to" is unclear. Consider revising to explain what users had to do before this feature was introduced.
✍️ Suggested revision
-Before you could do this, but had to send users to create a blank dashboard, edit in YAML mode, and paste in your custom strategy. Now you can register a friendly name, description, documentation, and preview image. +Previously, users had to create a blank dashboard, edit in YAML mode, and paste in your custom strategy. Now you can register a friendly name, description, documentation, and preview image.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@blog/2026-04-29-registering-custom-dashboard-strategies.md` at line 9, The opening sentence "Before you could do this, but had to send users to" is unclear—locate that exact sentence in the post and replace it with a clear, active description of the previous workflow; for example: "Previously, to use a custom strategy you had to direct users to create a blank dashboard, switch to YAML mode, and paste in your strategy." Ensure the new sentence names the action (create a blank dashboard), the mode (YAML), and the required paste step, and keep the rest of the paragraph flow unchanged.docs/frontend/custom-ui/registering-resources.md (1)
31-31: Bold the UI string "new dashboard dialog".UI strings should be bolded for consistency. As per coding guidelines, use bold to mark UI strings.
📝 Proposed fix
-If you are building a community dashboard, the resource must be loaded before Home Assistant can show it in the new dashboard dialog. After adding or updating the resource, refresh Home Assistant and reopen the dialog. +If you are building a community dashboard, the resource must be loaded before Home Assistant can show it in the **new dashboard** dialog. After adding or updating the resource, refresh Home Assistant and reopen the dialog.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/frontend/custom-ui/registering-resources.md` at line 31, The sentence should bold the UI string "new dashboard dialog" for consistency; locate the sentence containing that exact phrase and wrap it with Markdown bold markers (replace new dashboard dialog with **new dashboard dialog**) so the docs reflect the UI-string formatting convention.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@blog/2026-04-29-registering-custom-dashboard-strategies.md`:
- Line 17: The doc string for the `documentationURL` field uses British English
("may in future"); update that sentence in
blog/2026-04-29-registering-custom-dashboard-strategies.md so it reads "may in
the future" or "may be shown in the future" (replace the phrase "may in future"
with "may in the future") to conform to American English per the Microsoft Style
Guide.
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 17: Update the sentence to hyphenate the adjective and replace the
non-descriptive link text: change "Built in dashboards are built with dashboard
strategies." to "Built-in dashboards are built with dashboard strategies." and
replace the link text "here" with a descriptive phrase such as "built-in
dashboard strategies source code" (keeping the existing URL) so the link is
meaningful and the adjective is correctly hyphenated.
---
Nitpick comments:
In `@blog/2026-04-29-registering-custom-dashboard-strategies.md`:
- Line 38: The sentence "users still need the resource loaded" is awkward and
passive—reword it in active voice and fix subject-verb agreement earlier in the
paragraph; for example, explicitly state that users must load the resource (or
install it via HACS) before Home Assistant can discover the strategy and change
"resource can be added" to "resources can be added"; keep the example tag
ll-strategy-dashboard-my-demo and mention HACS as the installation mechanism so
readers know they must load the resource before discovery.
- Line 9: The opening sentence "Before you could do this, but had to send users
to" is unclear—locate that exact sentence in the post and replace it with a
clear, active description of the previous workflow; for example: "Previously, to
use a custom strategy you had to direct users to create a blank dashboard,
switch to YAML mode, and paste in your strategy." Ensure the new sentence names
the action (create a blank dashboard), the mode (YAML), and the required paste
step, and keep the rest of the paragraph flow unchanged.
In `@docs/frontend/custom-ui/registering-resources.md`:
- Line 31: The sentence should bold the UI string "new dashboard dialog" for
consistency; locate the sentence containing that exact phrase and wrap it with
Markdown bold markers (replace new dashboard dialog with **new dashboard
dialog**) so the docs reflect the UI-string formatting convention.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 7245b61e-2048-4d35-a04c-c08243ff1d64
📒 Files selected for processing (5)
blog/2026-04-29-registering-custom-dashboard-strategies.mddocs/frontend/custom-ui/custom-strategy.mddocs/frontend/custom-ui/custom-view.mddocs/frontend/custom-ui/registering-resources.mdstatic/_redirects
| ## Dashboards | ||
|
|
||
| A dashboard strategy is responsible for generating a full dashboard configuration. This can either be from scratch, or based on an existing dashboard configuration that is passed in. | ||
| A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built in dashboards are built with dashboard strategies. You can read the source code for the built in dashboards [here](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies). |
Contributor
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Fix hyphenation and link text.
Two issues in this sentence:
- "Built in dashboards" should be hyphenated as "built-in dashboards" when used as an adjective before a noun.
- The link text "here" is non-descriptive. As per coding guidelines, apply the Microsoft Style Guide which recommends descriptive link text.
📝 Proposed fix
-A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built in dashboards are built with dashboard strategies. You can read the source code for the built in dashboards [here](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies).
+A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built-in dashboards are built with dashboard strategies. You can read the [source code for the built-in dashboards](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies).📝 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.
Suggested change
| A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built in dashboards are built with dashboard strategies. You can read the source code for the built in dashboards [here](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies). | |
| A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built-in dashboards are built with dashboard strategies. You can read the [source code for the built-in dashboards](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies). |
🧰 Tools
🪛 LanguageTool
[grammar] ~17-~17: Use a hyphen to join words.
Context: ...is then rendered into a dashboard. Built in dashboards are built with dashboard s...
(QB_NEW_EN_HYPHEN)
[grammar] ~17-~17: Use a hyphen to join words.
Context: ...u can read the source code for the built in dashboards [here](https://github.com/...
(QB_NEW_EN_HYPHEN)
🪛 markdownlint-cli2 (0.22.0)
[warning] 17-17: Link text should be descriptive
(MD059, descriptive-link-text)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@docs/frontend/custom-ui/custom-strategy.md` at line 17, Update the sentence
to hyphenate the adjective and replace the non-descriptive link text: change
"Built in dashboards are built with dashboard strategies." to "Built-in
dashboards are built with dashboard strategies." and replace the link text
"here" with a descriptive phrase such as "built-in dashboard strategies source
code" (keeping the existing URL) so the link is meaningful and the adjective is
correctly hyphenated.
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
blog/2026-04-29-registering-custom-dashboard-strategies.md (1)
25-35: Use a duplicate-safe registration pattern in the example.At Line 25, the sample unconditionally pushes metadata. If this script is evaluated more than once, it can add duplicate picker entries. Please show the guarded pattern in the blog example to match current docs.
💡 Proposed doc snippet update
window.customStrategies = window.customStrategies || []; - -window.customStrategies.push({ - type: "my-demo", - strategyType: "dashboard", - name: "My demo dashboard", - description: "A starter dashboard generated from JavaScript.", - documentationURL: "https://example.com/my-demo-dashboard", - images: { - light: "/local/my-demo/preview-light.svg", - dark: "/local/my-demo/preview-dark.svg", - }, -}); +if (!window.customStrategies.some((strategy) => strategy.type === "my-demo" && strategy.strategyType === "dashboard")) { + window.customStrategies.push({ + type: "my-demo", + strategyType: "dashboard", + name: "My demo dashboard", + description: "A starter dashboard generated from JavaScript.", + documentationURL: "https://example.com/my-demo-dashboard", + images: { + light: "/local/my-demo/preview-light.svg", + dark: "/local/my-demo/preview-dark.svg", + }, + }); +}As per coding guidelines, “Include an explicit
window.customStrategies = window.customStrategies || [];init and use a duplicate-safe pattern if listing can be added multiple times.”🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@blog/2026-04-29-registering-custom-dashboard-strategies.md` around lines 25 - 35, Initialize window.customStrategies if missing and avoid duplicate registrations by checking existing entries before pushing; specifically ensure you call something like initializing window.customStrategies = window.customStrategies || [] and then only add the object with type "my-demo" (or matching name/strategyType) if no existing entry with that type/name/strategyType exists, updating the example that pushes the object so it first searches window.customStrategies for an existing match and only pushes when none is found.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@blog/2026-04-29-registering-custom-dashboard-strategies.md`:
- Line 38: Change the ungrammatical phrase "other resource can be added" to
plural agreement—e.g., "other resources can be added"—in the sentence describing
HACS usage so that line referencing adding custom resources reads correctly
("You can use HACS for this as other resources can be added, like custom
cards.").
---
Nitpick comments:
In `@blog/2026-04-29-registering-custom-dashboard-strategies.md`:
- Around line 25-35: Initialize window.customStrategies if missing and avoid
duplicate registrations by checking existing entries before pushing;
specifically ensure you call something like initializing window.customStrategies
= window.customStrategies || [] and then only add the object with type "my-demo"
(or matching name/strategyType) if no existing entry with that
type/name/strategyType exists, updating the example that pushes the object so it
first searches window.customStrategies for an existing match and only pushes
when none is found.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 767559c3-4b72-4eb8-beae-62ac09a162cc
📒 Files selected for processing (1)
blog/2026-04-29-registering-custom-dashboard-strategies.md
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (1)
docs/frontend/custom-ui/custom-strategy.md (1)
17-17:⚠️ Potential issue | 🟡 MinorFix hyphenation and use descriptive link text.
This issue was flagged in a previous review but not addressed. Two problems remain:
- "Built in dashboards" should be hyphenated as "built-in dashboards" when used as a compound adjective.
- The link text "here" is non-descriptive. The Microsoft Style Guide recommends descriptive link text. As per coding guidelines, apply the Microsoft Style Guide.
📝 Proposed fix
-A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built in dashboards are built with dashboard strategies. You can read the source code for the built in dashboards [here](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies). +A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built-in dashboards are built with dashboard strategies. You can read the [source code for built-in dashboards](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies).🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/frontend/custom-ui/custom-strategy.md` at line 17, Change the phrase "Built in dashboards" to the hyphenated compound adjective "built-in dashboards" and replace the non-descriptive link text "here" with a descriptive phrase such as "built-in dashboard strategies source code" (keeping the same URL). Update the sentence that references the repo to read something like: "...Built-in dashboards are built with dashboard strategies; you can read the built-in dashboard strategies source code." Ensure you edit the sentence containing the link and the phrase "Built in dashboards" in the custom-strategy.md content.
🧹 Nitpick comments (3)
blog/2026-04-29-registering-custom-dashboard-strategies.md (2)
40-40: Use more direct phrasing for instructional content.The phrase "Take a look at" is informal. For documentation, use more direct language such as "Refer to" or "See." As per coding guidelines, use a direct and authoritative tone for instructional content.
📝 Suggested refinement
-Take a look at the updated [custom strategies](/docs/frontend/custom-ui/custom-strategy) documentation with example code and further details. +Refer to the updated [custom strategies](/docs/frontend/custom-ui/custom-strategy) documentation for example code and further details.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@blog/2026-04-29-registering-custom-dashboard-strategies.md` at line 40, Replace the informal phrase "Take a look at the updated [custom strategies](/docs/frontend/custom-ui/custom-strategy) documentation..." with a direct instructional phrasing such as "Refer to the updated [custom strategies](/docs/frontend/custom-ui/custom-strategy) documentation..." or "See the updated [custom strategies](/docs/frontend/custom-ui/custom-strategy) documentation..." so the sentence uses an authoritative, instructional tone; update the sentence containing the "[custom strategies]" link accordingly.
16-16: Consider using "brief" instead of "short".The Microsoft Style Guide recommends "brief" over "short" for describing concise descriptions. As per coding guidelines, apply the Microsoft Style Guide.
📝 Suggested refinement
-- `description` (`optional`): A short description of the strategy. +- `description` (`optional`): A brief description of the strategy.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@blog/2026-04-29-registering-custom-dashboard-strategies.md` at line 16, Update the field documentation for the `description` property to use Microsoft Style Guide wording: replace "A short description of the strategy." with "A brief description of the strategy." so the `description` (`optional`) entry uses "brief" instead of "short".docs/frontend/custom-ui/custom-strategy.md (1)
134-134: Simplify awkward word order.The phrase "as can custom cards be used" has inverted word order that makes the sentence harder to read. Use standard word order for clarity.
📝 Suggested refinement
-A view strategy generates the configuration of a specific dashboard view. These can be reused in dashboard strategies if needed, as can custom cards be used in view strategies. +A view strategy generates the configuration of a specific dashboard view. These can be reused in dashboard strategies if needed, as custom cards can be used in view strategies.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/frontend/custom-ui/custom-strategy.md` at line 134, The sentence "These can be reused in dashboard strategies if needed, as can custom cards be used in view strategies." uses inverted word order; change it to standard order for clarity by rewriting the clause to "and custom cards can be used in view strategies" (so the full sentence reads: "These can be reused in dashboard strategies if needed, and custom cards can be used in view strategies."). Locate this text in the custom-strategy.md content and replace the inverted clause accordingly.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 7: Update the sentence in custom-strategy.md that currently reads "You
can create new strategies in the frontend repository, or create custom
strategies. Both of which have access to the Home Assistant API similar to
[custom cards](./custom-card.md)." to use simpler phrasing: replace "Both of
which have access" with "Both have access" so the sentence reads "...or create
custom strategies. Both have access to the Home Assistant API similar to [custom
cards](./custom-card.md)." This change is in the paragraph that defines
"Strategies" in the custom-strategy.md document.
- Line 61: Update the sentence referencing the "map dashboard strategy" example:
change "for less complex example" to "for a less complex example" and change
"This in term uses" to "This in turn uses" so the sentence reads correctly and
fixes the article and typo in the phrase describing the map view strategy and
panel view type.
---
Duplicate comments:
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 17: Change the phrase "Built in dashboards" to the hyphenated compound
adjective "built-in dashboards" and replace the non-descriptive link text "here"
with a descriptive phrase such as "built-in dashboard strategies source code"
(keeping the same URL). Update the sentence that references the repo to read
something like: "...Built-in dashboards are built with dashboard strategies; you
can read the built-in dashboard strategies source code." Ensure you edit the
sentence containing the link and the phrase "Built in dashboards" in the
custom-strategy.md content.
---
Nitpick comments:
In `@blog/2026-04-29-registering-custom-dashboard-strategies.md`:
- Line 40: Replace the informal phrase "Take a look at the updated [custom
strategies](/docs/frontend/custom-ui/custom-strategy) documentation..." with a
direct instructional phrasing such as "Refer to the updated [custom
strategies](/docs/frontend/custom-ui/custom-strategy) documentation..." or "See
the updated [custom strategies](/docs/frontend/custom-ui/custom-strategy)
documentation..." so the sentence uses an authoritative, instructional tone;
update the sentence containing the "[custom strategies]" link accordingly.
- Line 16: Update the field documentation for the `description` property to use
Microsoft Style Guide wording: replace "A short description of the strategy."
with "A brief description of the strategy." so the `description` (`optional`)
entry uses "brief" instead of "short".
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 134: The sentence "These can be reused in dashboard strategies if needed,
as can custom cards be used in view strategies." uses inverted word order;
change it to standard order for clarity by rewriting the clause to "and custom
cards can be used in view strategies" (so the full sentence reads: "These can be
reused in dashboard strategies if needed, and custom cards can be used in view
strategies."). Locate this text in the custom-strategy.md content and replace
the inverted clause accordingly.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: e168275c-ef07-4138-a192-7530df276828
📒 Files selected for processing (2)
blog/2026-04-29-registering-custom-dashboard-strategies.mddocs/frontend/custom-ui/custom-strategy.md
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
docs/frontend/custom-ui/custom-strategy.md (1)
21-25: Consider consistent bold formatting.Line 21 uses
__text__(underscores) for bold, while line 25 uses**text**(asterisks). While both are valid Markdown, consistent styling improves maintainability.📝 Proposed fix for consistency
-Once the resource is loaded, Home Assistant can show your dashboard in the **new dashboard** dialog under the **Community dashboards** section. +Once the resource is loaded, Home Assistant can show your dashboard in the __new dashboard__ dialog under the __Community dashboards__ section.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/frontend/custom-ui/custom-strategy.md` around lines 21 - 25, The markdown uses mixed bold syntax: "__Introduced in Home Assistant 2026.4.__" (underscores) and "**new dashboard**" (asterisks); pick one style and make them consistent across the file (e.g., convert "__Introduced in Home Assistant 2026.4.__" to "**Introduced in Home Assistant 2026.4.**" or vice versa) and apply the same change to any other bold occurrences such as "**Community dashboards**" and "`window.customStrategies`" surrounding text to keep uniform formatting.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 99: The example registers the element unguarded which throws if loaded
twice; update the registration for the custom element
"ll-strategy-dashboard-my-demo" to first check
customElements.get("ll-strategy-dashboard-my-demo") and only call
customElements.define("ll-strategy-dashboard-my-demo", MyDemoDashboardStrategy)
when the check returns undefined, using the MyDemoDashboardStrategy class name
to locate the definition.
- Line 35: The description for the documentationURL field is ambiguous; update
the docs to state its present behavior and intent by editing the
documentationURL entry: either remove "yet" and say "This is not displayed in
the strategy UI" if there is no plan to display it, or replace the sentence with
a clear note where/when it will be used (e.g., "Displayed in X view" or "Used by
Y backend") if an implementation is planned; ensure the change references the
documentationURL field so readers know which property the note applies to.
---
Nitpick comments:
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Around line 21-25: The markdown uses mixed bold syntax: "__Introduced in Home
Assistant 2026.4.__" (underscores) and "**new dashboard**" (asterisks); pick one
style and make them consistent across the file (e.g., convert "__Introduced in
Home Assistant 2026.4.__" to "**Introduced in Home Assistant 2026.4.**" or vice
versa) and apply the same change to any other bold occurrences such as
"**Community dashboards**" and "`window.customStrategies`" surrounding text to
keep uniform formatting.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: f7d2fecf-7bfe-4dc9-bd58-2ed3c76954fa
📒 Files selected for processing (1)
docs/frontend/custom-ui/custom-strategy.md
This was referenced Apr 16, 2026
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (2)
docs/frontend/custom-ui/custom-strategy.md (2)
17-17:⚠️ Potential issue | 🟡 MinorFix hyphenation and replace non-descriptive link text.
Line 17 still uses “Built in” and link text “here”. Update to “Built-in” and use descriptive link text.
Proposed edit
-A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built in dashboards are built with dashboard strategies. You can read the source code for the built in dashboards [here](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies). +A dashboard strategy generates a full dashboard configuration. In most cases, it starts from a small strategy config and returns the full dashboard structure. Think of this like a json/yaml config which is then rendered into a dashboard. Built-in dashboards are built with dashboard strategies. You can read the [source code for built-in dashboards](https://github.com/home-assistant/frontend/tree/dev/src/panels/lovelace/strategies).As per coding guidelines, "Apply the Microsoft Style Guide to ensure documentation maintains clarity and conciseness."
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/frontend/custom-ui/custom-strategy.md` at line 17, Update the phrasing on the sentence that reads "Built in dashboards are built with dashboard strategies. You can read the source code for the built in dashboards here" by changing "Built in" to the hyphenated "Built-in" in both occurrences and replacing the non-descriptive link text "here" with a descriptive label such as "built-in dashboard strategies source" (so the sentence reads e.g. "Built-in dashboards are built with dashboard strategies; view the built-in dashboard strategies source" with the existing URL preserved).
93-93:⚠️ Potential issue | 🟠 MajorGuard custom element registration in the basic example.
Line 93 calls
customElements.define(...)unguarded. If the resource is loaded twice, this throws an error and breaks the example flow. Later examples (lines 205 and 212) correctly guard registration withif (!customElements.get(...)).Proposed edit
-customElements.define("ll-strategy-dashboard-my-demo", MyDemoDashboardStrategy); +if (!customElements.get("ll-strategy-dashboard-my-demo")) { + customElements.define("ll-strategy-dashboard-my-demo", MyDemoDashboardStrategy); +}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/frontend/custom-ui/custom-strategy.md` at line 93, Guard the unprotected customElements.define call for the MyDemoDashboardStrategy example by first checking customElements.get('ll-strategy-dashboard-my-demo'); if it returns falsy, call customElements.define('ll-strategy-dashboard-my-demo', MyDemoDashboardStrategy) to avoid duplicate registration errors (mirror the pattern used later in the file).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 61: Update the sentence recommending types so it reads "use types either
with TypeScript or JSDoc" (replace the awkward phrase "use types whether with
TypeScript or JSDoc") and keep the recommendation to prefer Lit's
ReactiveElement over HTMLElement; ensure the sentence is concise and follows
Microsoft Style Guide principles for clarity and accessibility.
---
Duplicate comments:
In `@docs/frontend/custom-ui/custom-strategy.md`:
- Line 17: Update the phrasing on the sentence that reads "Built in dashboards
are built with dashboard strategies. You can read the source code for the built
in dashboards here" by changing "Built in" to the hyphenated "Built-in" in both
occurrences and replacing the non-descriptive link text "here" with a
descriptive label such as "built-in dashboard strategies source" (so the
sentence reads e.g. "Built-in dashboards are built with dashboard strategies;
view the built-in dashboard strategies source" with the existing URL preserved).
- Line 93: Guard the unprotected customElements.define call for the
MyDemoDashboardStrategy example by first checking
customElements.get('ll-strategy-dashboard-my-demo'); if it returns falsy, call
customElements.define('ll-strategy-dashboard-my-demo', MyDemoDashboardStrategy)
to avoid duplicate registration errors (mirror the pattern used later in the
file).
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 898a80c2-8ed4-49e6-a422-c7d89cf59b95
📒 Files selected for processing (2)
blog/2026-04-29-registering-custom-dashboard-strategies.mddocs/frontend/custom-ui/custom-strategy.md
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
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.
Proposed change
Related PR: home-assistant/frontend#51310
Includes a blog post, which we could release at time of beta and/or note in release notes
Type of change
Checklist
Additional information
Summary by CodeRabbit