jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-04-24 21:37:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Correct badge warning (and use new styling) (#9926)

Browse Source
This commit is contained in:
Bram Kragten 2021-09-01 16:23:29 +02:00 committed by GitHub
parent ac64d293e7
commit 35a81e7f11
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 54 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/panels/lovelace/editor/view-editor/hui-dialog-edit-view.ts
View File

@ -7,6 +7,7 @@ import { fireEvent, HASSDomEvent } from "../../../../common/dom/fire_event";
import { navigate } from "../../../../common/navigate";
import "../../../../components/ha-circular-progress";
import "../../../../components/ha-dialog";
import "../../../../components/ha-alert";
import "../../../../components/ha-icon-button";
import type {
LovelaceBadgeConfig,
@ -31,6 +32,11 @@ import {
import "./hui-view-editor";
import "./hui-view-visibility-editor";
import { EditViewDialogParams } from "./show-edit-view-dialog";
import {
DEFAULT_VIEW_LAYOUT,
PANEL_VIEW_LAYOUT,
VIEWS_NO_BADGE_SUPPORT,
} from "../../views/const";
@customElement("hui-dialog-edit-view")
export class HuiDialogEditView extends LitElement {
@ -50,6 +56,15 @@ export class HuiDialogEditView extends LitElement {
private _curTabIndex = 0;
get _type(): string {
if (!this._config) {
return DEFAULT_VIEW_LAYOUT;
}
return this._config.panel
? PANEL_VIEW_LAYOUT
: this._config.type || DEFAULT_VIEW_LAYOUT;
}
public showDialog(params: EditViewDialogParams): void {
this._params = params;
@ -107,13 +122,13 @@ export class HuiDialogEditView extends LitElement {
content = html`
${this._badges?.length
? html`
${this._config?.panel
${VIEWS_NO_BADGE_SUPPORT.includes(this._type)
? html`
<p class="warning">
<ha-alert alert-type="warning">
${this.hass!.localize(
"ui.panel.lovelace.editor.edit_badges.panel_mode"
"ui.panel.lovelace.editor.edit_badges.view_no_badges"
)}
</p>
</ha-alert>
`
: ""}
<div class="preview-badges">
@ -408,10 +423,6 @@ export class HuiDialogEditView extends LitElement {
margin: 12px 16px;
flex-wrap: wrap;
}
.warning {
color: var(--warning-color);
text-align: center;
}
@media all and (min-width: 600px) {
ha-dialog {

13
src/panels/lovelace/editor/view-editor/hui-view-editor.ts
View File

@ -9,6 +9,11 @@ import "../../../../components/ha-switch";
import { LovelaceViewConfig } from "../../../../data/lovelace";
import { HomeAssistant } from "../../../../types";
import "../../components/hui-theme-select-editor";
import {
DEFAULT_VIEW_LAYOUT,
PANEL_VIEW_LAYOUT,
SIDEBAR_VIEW_LAYOUT,
} from "../../views/const";
import { configElementStyle } from "../config-elements/config-elements-style";
import { EditorTarget } from "../types";
@ -60,9 +65,11 @@ export class HuiViewEditor extends LitElement {
get _type(): string {
if (!this._config) {
return "masonry";
return DEFAULT_VIEW_LAYOUT;
}
return this._config.panel ? "panel" : this._config.type || "masonry";
return this._config.panel
? PANEL_VIEW_LAYOUT
: this._config.type || DEFAULT_VIEW_LAYOUT;
}
set config(config: LovelaceViewConfig) {
@ -125,7 +132,7 @@ export class HuiViewEditor extends LitElement {
attr-for-selected="type"
@iron-select=${this._typeChanged}
>
${["masonry", "sidebar", "panel"].map(
${[DEFAULT_VIEW_LAYOUT, SIDEBAR_VIEW_LAYOUT, PANEL_VIEW_LAYOUT].map(
(type) => html`<paper-item .type=${type}>
${this.hass.localize(
`ui.panel.lovelace.editor.edit_view.types.${type}`

4
src/panels/lovelace/views/const.ts Normal file
View File

@ -0,0 +1,4 @@
export const DEFAULT_VIEW_LAYOUT = "masonry";
export const PANEL_VIEW_LAYOUT = "panel";
export const SIDEBAR_VIEW_LAYOUT = "sidebar";
export const VIEWS_NO_BADGE_SUPPORT = [PANEL_VIEW_LAYOUT, SIDEBAR_VIEW_LAYOUT];

27
src/panels/lovelace/views/hui-view.ts
View File

@ -20,9 +20,7 @@ import { showEditCardDialog } from "../editor/card-editor/show-edit-card-dialog"
import { confDeleteCard } from "../editor/delete-card";
import { generateLovelaceViewStrategy } from "../strategies/get-strategy";
import type { Lovelace, LovelaceBadge, LovelaceCard } from "../types";
const DEFAULT_VIEW_LAYOUT = "masonry";
const PANEL_VIEW_LAYOUT = "panel";
import { PANEL_VIEW_LAYOUT, DEFAULT_VIEW_LAYOUT } from "./const";
declare global {
// for fire event
@ -131,6 +129,18 @@ export class HUIView extends ReactiveElement {
});
this._layoutElement.hass = this.hass;
const oldHass = changedProperties.get("hass") as
| this["hass"]
| undefined;
if (
!oldHass ||
this.hass.themes !== oldHass.themes ||
this.hass.selectedTheme !== oldHass.selectedTheme
) {
applyThemesOnElement(this, this.hass.themes, this._viewConfigTheme);
}
}
if (changedProperties.has("narrow")) {
this._layoutElement.narrow = this.narrow;
@ -145,17 +155,6 @@ export class HUIView extends ReactiveElement {
this._layoutElement.badges = this._badges;
}
}
const oldHass = changedProperties.get("hass") as this["hass"] | undefined;
if (
changedProperties.has("hass") &&
(!oldHass ||
this.hass.themes !== oldHass.themes ||
this.hass.selectedTheme !== oldHass.selectedTheme)
) {
applyThemesOnElement(this, this.hass.themes, this._viewConfigTheme);
}
}
private async _initializeConfig() {

16
src/translations/en.json
View File

@ -700,7 +700,7 @@
"control": "Control",
"related": "Related",
"dismiss": "Dismiss",
"no_unique_id": "This entity (\"{entity_id}\") does not have a unique ID, therefore its settings cannot be managed from the UI. See the {faq_link} for more detail.",
"no_unique_id": "This entity (''{entity_id}'') does not have a unique ID, therefore its settings cannot be managed from the UI. See the {faq_link} for more detail.",
"faq": "documentation",
"info_customize": "You can overwrite some attributes in the {customize_link} section.",
"customize_link": "entity customizations",
@ -873,12 +873,12 @@
"config": {
"no_type_provided": "No type provided.",
"error_detected": "Configuration errors detected",
"editor_not_available": "No visual editor available for type \"{type}\".",
"editor_not_available": "No visual editor available for type ''{type}''.",
"editor_not_supported": "Visual editor is not supported for this configuration",
"edit_in_yaml_supported": "You can still edit your config in YAML.",
"key_missing": "Required key \"{key}\" is missing.",
"key_not_expected": "Key \"{key}\" is not expected or not supported by the visual editor.",
"key_wrong_type": "The provided value for \"{key}\" is not supported by the visual editor. We support ({type_correct}) but received ({type_wrong}).",
"key_missing": "Required key ''{key}'' is missing.",
"key_not_expected": "Key ''{key}'' is not expected or not supported by the visual editor.",
"key_wrong_type": "The provided value for ''{key}'' is not supported by the visual editor. We support ({type_correct}) but received ({type_wrong}).",
"no_template_editor_support": "Templates not supported in visual editor"
},
"supervisor": {
@ -1765,7 +1765,7 @@
},
"add": {
"header": "Import a blueprint",
"import_header": "Blueprint \"{name}\"",
"import_header": "Blueprint ''{name}''",
"import_introduction_link": "You can import blueprints of other users from Github and the {community_link}. Enter the URL of the blueprint below.",
"community_forums": "community forums",
"url": "URL of the blueprint",
@ -2884,7 +2884,7 @@
"cards": {
"confirm_delete": "Are you sure you want to delete this card?",
"actions": {
"action_confirmation": "Are you sure you want to run action \"{action}\"?",
"action_confirmation": "Are you sure you want to run action ''{action}''?",
"no_entity_more_info": "No entity provided for more info dialog",
"no_entity_toggle": "No entity provided to toggle",
"no_navigation_path": "No navigation path specified",
@ -3016,7 +3016,7 @@
}
},
"edit_badges": {
"panel_mode": "These badges will not be displayed because this view is in \"Panel Mode\"."
"view_no_badges": "Badges are not be supported by the current view type."
},
"edit_card": {
"header": "Card Configuration",