From cfadf4d7005a36d253c00aa35d0ea6c010e9b889 Mon Sep 17 00:00:00 2001 From: Zack Barett Date: Wed, 4 May 2022 05:04:24 -0500 Subject: [PATCH] Fixes issue where the grid cards wouldnt be sized correctly (#12571) --- .../media-player/ha-media-player-browse.ts | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/components/media-player/ha-media-player-browse.ts b/src/components/media-player/ha-media-player-browse.ts index 2fbe792218..285ebcea54 100644 --- a/src/components/media-player/ha-media-player-browse.ts +++ b/src/components/media-player/ha-media-player-browse.ts @@ -1,4 +1,5 @@ import "@lit-labs/virtualizer"; +import type { LitVirtualizer } from "@lit-labs/virtualizer"; import { grid } from "@lit-labs/virtualizer/layouts/grid"; import "@material/mwc-button/mwc-button"; import "@material/mwc-list/mwc-list"; @@ -101,6 +102,10 @@ export class HaMediaPlayerBrowse extends LitElement { @query(".content") private _content?: HTMLDivElement; + @query("lit-virtualizer") private _virtualizer?: LitVirtualizer; + + private _observed = false; + private _headerOffsetHeight = 0; private _resizeObserver?: ResizeObserver; @@ -281,6 +286,19 @@ export class HaMediaPlayerBrowse extends LitElement { this._animateHeaderHeight(); } else if (changedProps.has("_currentItem")) { this._setHeaderHeight(); + + // This fixes a race condition for resizing of the cards using the grid layout + if (this._observed) { + return; + } + + // @ts-ignore + const virtualizer = this._virtualizer?._virtualizer; + + if (virtualizer) { + this._observed = true; + setTimeout(() => virtualizer._observeMutations(), 0); + } } }