From 9642beb0952c35fd5dbdcbc71e5c16d544390cb7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joakim=20S=C3=B8rensen?= <ludeeus@ludeeus.dev>
Date: Sat, 8 Jul 2023 09:21:50 +0200
Subject: [PATCH] Add table scroll restore (#674)

---
 src/dashboards/hacs-dashboard.ts | 45 ++++++++++++++++++++++++++++++--
 src/hacs.ts                      |  3 ---
 2 files changed, 43 insertions(+), 5 deletions(-)

diff --git a/src/dashboards/hacs-dashboard.ts b/src/dashboards/hacs-dashboard.ts
index dd96f596..9daad9af 100644
--- a/src/dashboards/hacs-dashboard.ts
+++ b/src/dashboards/hacs-dashboard.ts
@@ -97,11 +97,14 @@ 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;
 
@@ -109,6 +112,12 @@ export class HacsDashboard extends LitElement {
       ? 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
index 5305b651..adbd16b6 100644
--- 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,