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

Fix Wrong Index for Filtered Tabs (#5221)

Browse Source 
* Fix wrong index for filtered tabs

* Set active tab to actual tab and use path

* Update src/layouts/hass-tabs-subpage.ts

Co-Authored-By: Paulus Schoutsen <paulus@home-assistant.io>

* Update src/layouts/hass-tabs-subpage.ts

Co-Authored-By: Paulus Schoutsen <paulus@home-assistant.io>

Co-authored-by: Paulus Schoutsen <paulus@home-assistant.io>
Co-authored-by: Bram Kragten <mail@bramkragten.nl>
This commit is contained in:
Aidan Timson 2020-03-17 19:44:07 +00:00 committed by GitHub
parent cd6dcec644
commit 9ee647329b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 29 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/layouts/hass-tabs-subpage.ts
View File

@ -37,12 +37,12 @@ class HassTabsSubpage extends LitElement {
@property() public route!: Route; @property() public route!: Route;
@property() public tabs!: PageNavigation[]; @property() public tabs!: PageNavigation[];
@property({ type: Boolean, reflect: true }) public narrow = false; @property({ type: Boolean, reflect: true }) public narrow = false;
@property() private _activeTab: number = -1; @property() private _activeTab?: PageNavigation;
private _getTabs = memoizeOne( private _getTabs = memoizeOne(
( (
tabs: PageNavigation[], tabs: PageNavigation[],
activeTab: number, activeTab: PageNavigation | undefined,
showAdvanced: boolean | undefined, showAdvanced: boolean | undefined,
_components, _components,
_language _language
@ -56,10 +56,11 @@ class HassTabsSubpage extends LitElement {
); );
return shownTabs.map( return shownTabs.map(
(page, index) => html` (page) =>
html`
<div <div
class="tab ${classMap({ class="tab ${classMap({
active: index === activeTab, active: page === activeTab,
})}" })}"
@click=${this._tabTapped} @click=${this._tabTapped}
.path=${page.path} .path=${page.path}
@ -69,7 +70,7 @@ class HassTabsSubpage extends LitElement {
<ha-icon .icon=${page.icon}></ha-icon> <ha-icon .icon=${page.icon}></ha-icon>
` `
: ""} : ""}
${!this.narrow || index === activeTab ${!this.narrow || page === activeTab
? html` ? html`
<span class="name" <span class="name"
>${page.translationKey >${page.translationKey
@ -88,7 +89,7 @@ class HassTabsSubpage extends LitElement {
protected updated(changedProperties: PropertyValues) { protected updated(changedProperties: PropertyValues) {
super.updated(changedProperties); super.updated(changedProperties);
if (changedProperties.has("route")) { if (changedProperties.has("route")) {
this._activeTab = this.tabs.findIndex((tab) => this._activeTab = this.tabs.find((tab) =>
this.route.prefix.includes(tab.path) this.route.prefix.includes(tab.path)
); );
} }