scroll results into view when loaded

rewiringamerica · Oct 1, 2023 · 618c7ce · 618c7ce
1 parent 55a965d
commit 618c7ce
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/src/state-calculator.ts b/src/state-calculator.ts
@@ -220,6 +220,16 @@ export class RewiringAmericaStateCalculator extends LitElement {
     },
   });
 
+  override updated() {
+    if (
+      this._utilitiesTask.status === TaskStatus.COMPLETE &&
+      this._task.status === TaskStatus.COMPLETE
+    ) {
+      const results = this.shadowRoot?.querySelector('#at-a-glance');
+      results?.scrollIntoView({ behavior: 'smooth' });
+    }
+  }
+
   override render() {
     // If we have incentives loaded, use coverage.state from that to determine
     // which state outline to show. Otherwise, look at the "tempState" override,

diff --git a/src/state-incentive-details.ts b/src/state-incentive-details.ts
@@ -334,7 +334,7 @@ const summaryBoxTemplate = (
 
 const atAGlanceTemplate = (response: APIResponse) => {
   return html`
-    <div class="grid-section">
+    <div class="grid-section" id="at-a-glance">
       <h2 class="grid-section__header">Incentives at a glance</h2>
       <div class="grid-4-2-1 grid-4-2-1--align-start">
         ${summaryBoxTemplate(