fix(#93): delay throttle until chart is really drawn

MindFreeze · Feb 20, 2023 · da4c89a · da4c89a
1 parent a7fd9cd
commit da4c89a
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 25 deletions.
diff --git a/src/chart.ts b/src/chart.ts
@@ -27,12 +27,25 @@ export class Chart extends LitElement {
   @state() private statePerPixelY = 0;
   @state() private entityStates: Map<EntityConfigInternal, NormalizedState> = new Map();
   @state() private highlightedEntities: EntityConfigInternal[] = [];
+  @state() private lastUpdate = 0;
 
   // https://lit.dev/docs/components/lifecycle/#reactive-update-cycle-performing
   protected shouldUpdate(changedProps: PropertyValues): boolean {
     if (!this.config) {
       return false;
     }
+    const now = Date.now();
+    if (this.config.throttle && now - this.lastUpdate < this.config.throttle) {
+      // woah there
+      const ts = this.lastUpdate;
+      setTimeout(() => {
+        if (ts === this.lastUpdate) {
+          // trigger manual update if no changes since last rejected update
+          this.requestUpdate();
+        }
+      }, now - this.lastUpdate);
+      return false;
+    }
     if (changedProps.has('highlightedEntities')) {
       return true;
     }
@@ -572,6 +585,8 @@ export class Chart extends LitElement {
       this._calcConnections();
       this._calcBoxes();
 
+      this.lastUpdate = Date.now();
+
       // @action=${this._handleAction}
       // .actionHandler=${actionHandler({
       //   hasHold: hasAction(this.config.hold_action),

diff --git a/src/ha-sankey-chart.ts b/src/ha-sankey-chart.ts
@@ -59,7 +59,6 @@ export class SankeyChart extends SubscribeMixin(LitElement) {
   @state() private config!: Config;
   @state() private states: HassEntities = {};
   @state() private entityIds: string[] = [];
-  @state() private lastUpdate = 0;
   @state() private error?: Error | unknown;
 
   public hassSubscribe() {
@@ -296,30 +295,6 @@ export class SankeyChart extends SubscribeMixin(LitElement) {
     return 4;
   }
 
-  // https://lit.dev/docs/components/lifecycle/#reactive-update-cycle-performing
-  protected shouldUpdate(): boolean {
-    if (!this.config) {
-      return false;
-    }
-    const now = Date.now();
-    if (this.config.throttle && now - this.lastUpdate < this.config.throttle) {
-      // woah there
-      const ts = this.lastUpdate;
-      setTimeout(() => {
-        if (ts === this.lastUpdate) {
-          // trigger manual update if no changes since last rejected update
-          this.requestUpdate();
-        }
-      }, now - this.lastUpdate);
-      return false;
-    }
-    return true;
-  }
-
-  public willUpdate(): void {
-    this.lastUpdate = Date.now();
-  }
-
   // https://lit.dev/docs/components/rendering/
   protected render(): TemplateResult | void {
     if (this.error) {