Add table scroll restore (#674)

hacs · Jul 8, 2023 · 9642beb · 9642beb
1 parent 729ea6e
commit 9642beb
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 5 deletions.
diff --git a/src/dashboards/hacs-dashboard.ts b/src/dashboards/hacs-dashboard.ts
@@ -97,18 +97,27 @@ export class HacsDashboard extends LitElement {
   @storage({ key: "hacs-active-search", state: true, subscribe: false })
   private _activeSearch?: string;
 
+  @storage({ key: "hacs-table-scroll", state: true, subscribe: false })
+  private _tableScroll?: number;
+
   @storage({ key: "hacs-table-active-columns", state: true, subscribe: false })
   private _tableColumns: Record<tableColumnDefaultsType, boolean> = tableColumnDefaults;
 
-  protected async firstUpdated(changedProperties: PropertyValues): Promise<void> {
-    super.firstUpdated(changedProperties);
+  public connectedCallback(): void {
+    super.connectedCallback();
     const baseFilters =
       this.activeFilters && this.activeFilters.length === 0 ? ["downloaded"] : this.activeFilters;
 
     const filters = !this._activeSearch?.length
       ? baseFilters
       : baseFilters?.filter((filter) => filter !== "downloaded");
     this.activeFilters = filters?.length ? filters : undefined;
+
+    this.updateComplete.then(() => {
+      this.restoreScroller().catch(() => {
+        // Ignored
+      });
+    });
   }
 
   protected updated(changedProperties: PropertyValues): void {
@@ -476,7 +485,39 @@ export class HacsDashboard extends LitElement {
     })
   );
 
+  get _scrollerTarget() {
+    return (
+      this.shadowRoot
+        ?.querySelector("hass-tabs-subpage-data-table")
+        ?.shadowRoot?.querySelector("hass-tabs-subpage")
+        ?.shadowRoot?.querySelector(".content")
+        ?.querySelectorAll("SLOT")[0]
+        // @ts-ignore
+        ?.assignedNodes()
+        ?.find((node) => node.nodeName === "HA-DATA-TABLE")
+        ?.shadowRoot?.querySelector(".scroller")
+    );
+  }
+
+  private async restoreScroller() {
+    if ((this._tableScroll ?? 0) === 0) {
+      return;
+    }
+    await new Promise<void>((resolve, reject) => {
+      const timeout = setTimeout(reject, 1000);
+      const intervalCheck = setInterval(() => {
+        if (this._scrollerTarget) {
+          this._scrollerTarget.scrollTop = this._tableScroll;
+          clearTimeout(timeout);
+          clearInterval(intervalCheck);
+          resolve();
+        }
+      }, 50);
+    });
+  }
+
   private _handleRowClicked(ev: CustomEvent) {
+    this._tableScroll = this._scrollerTarget?.scrollTop || 0;
     navigate(`/hacs/repository/${ev.detail.id}`);
   }
 

diff --git a/src/hacs.ts b/src/hacs.ts
@@ -82,9 +82,6 @@ export class HacsElement extends ProvideHassLitMixin(LitElement) {
 
   private async _initializeLocalize() {
     const { language, data } = await getTranslation(null, this._language);
-
-    console.log({ language, data });
-
     this._updateHacs({
       localize: await computeLocalize<HacsLocalizeKeys>(this.constructor.prototype, language, {
         [language]: data,