refactor(explorer): always fetch data once even if paused

Now data will be updated even if the auto refresh is paused if:
- at first loading
- when the selected aggregator is changed

Author: Alenar

mithril-explorer/src/components/Artifacts/CardanoDbSnapshotsList/index.js

@@ -18,10 +18,6 @@ export default function CardanoDbSnapshotsList(props) {
   const updateInterval = useSelector((state) => state.settings.updateInterval);
 
   useEffect(() => {
-    if (!autoUpdate) {
-      return;
-    }
-
     let fetchSnapshots = () => {
       fetch(artifactsEndpoint)
         .then((response) => response.json())
@@ -35,8 +31,10 @@ export default function CardanoDbSnapshotsList(props) {
     // Fetch them once without waiting
     fetchSnapshots();
 
-    const interval = setInterval(fetchSnapshots, updateInterval);
-    return () => clearInterval(interval);
+    if (autoUpdate) {
+      const interval = setInterval(fetchSnapshots, updateInterval);
+      return () => clearInterval(interval);
+    }
   }, [artifactsEndpoint, updateInterval, autoUpdate]);
 
   function handleCertificateHashChange(hash) {

mithril-explorer/src/components/Artifacts/CardanoStakeDistributionsList/index.js

@@ -17,10 +17,6 @@ export default function CardanoStakeDistributionsList(props) {
   const updateInterval = useSelector((state) => state.settings.updateInterval);
 
   useEffect(() => {
-    if (!autoUpdate) {
-      return;
-    }
-
     let fetchCardanoStakeDistribution = () => {
       fetch(artifactsEndpoint)
         .then((response) => response.json())
@@ -34,8 +30,10 @@ export default function CardanoStakeDistributionsList(props) {
     // Fetch them once without waiting
     fetchCardanoStakeDistribution();
 
-    const interval = setInterval(fetchCardanoStakeDistribution, updateInterval);
-    return () => clearInterval(interval);
+    if (autoUpdate) {
+      const interval = setInterval(fetchCardanoStakeDistribution, updateInterval);
+      return () => clearInterval(interval);
+    }
   }, [artifactsEndpoint, updateInterval, autoUpdate]);
 
   function handleCertificateHashChange(hash) {

mithril-explorer/src/components/Artifacts/CardanoTransactionsSnapshotsList/index.js

@@ -25,10 +25,6 @@ export default function CardanoTransactionsSnapshotsList(props) {
   );
 
   useEffect(() => {
-    if (!autoUpdate) {
-      return;
-    }
-
     let fetchSnapshots = () => {
       fetch(artifactsEndpoint)
         .then((response) => response.json())
@@ -42,8 +38,10 @@ export default function CardanoTransactionsSnapshotsList(props) {
     // Fetch them once without waiting
     fetchSnapshots();
 
-    const interval = setInterval(fetchSnapshots, updateInterval);
-    return () => clearInterval(interval);
+    if (autoUpdate) {
+      const interval = setInterval(fetchSnapshots, updateInterval);
+      return () => clearInterval(interval);
+    }
   }, [artifactsEndpoint, updateInterval, autoUpdate]);
 
   function handleCertificateHashChange(hash) {

mithril-explorer/src/components/Artifacts/CertificatesList/index.js

@@ -16,10 +16,6 @@ export default function CertificatesList(props) {
   const updateInterval = useSelector((state) => state.settings.updateInterval);
 
   useEffect(() => {
-    if (!autoUpdate) {
-      return;
-    }
-
     let fetchCertificates = () => {
       fetch(certificatesEndpoint)
         .then((response) => response.json())
@@ -33,8 +29,10 @@ export default function CertificatesList(props) {
     // Fetch them once without waiting
     fetchCertificates();
 
-    const interval = setInterval(fetchCertificates, updateInterval);
-    return () => clearInterval(interval);
+    if (autoUpdate) {
+      const interval = setInterval(fetchCertificates, updateInterval);
+      return () => clearInterval(interval);
+    }
   }, [certificatesEndpoint, updateInterval, autoUpdate]);
 
   function handleCertificateHashChange(hash) {

mithril-explorer/src/components/Artifacts/MithrilStakeDistributionsList/index.js

@@ -17,10 +17,6 @@ export default function MithrilStakeDistributionsList(props) {
   const updateInterval = useSelector((state) => state.settings.updateInterval);
 
   useEffect(() => {
-    if (!autoUpdate) {
-      return;
-    }
-
     let fetchMithrilStakeDistribution = () => {
       fetch(artifactsEndpoint)
         .then((response) => response.json())
@@ -34,8 +30,10 @@ export default function MithrilStakeDistributionsList(props) {
     // Fetch them once without waiting
     fetchMithrilStakeDistribution();
 
-    const interval = setInterval(fetchMithrilStakeDistribution, updateInterval);
-    return () => clearInterval(interval);
+    if (autoUpdate) {
+      const interval = setInterval(fetchMithrilStakeDistribution, updateInterval);
+      return () => clearInterval(interval);
+    }
   }, [artifactsEndpoint, updateInterval, autoUpdate]);
 
   function handleCertificateHashChange(hash) {

mithril-explorer/src/components/EpochSettings/index.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import {Card, Row, Col, Stack, Container} from "react-bootstrap";
+import { Card, Row, Col, Stack, Container } from "react-bootstrap";
 import { useSelector } from "react-redux";
 import LinkButton from "#/LinkButton";
 import RawJsonButton from "#/RawJsonButton";
@@ -19,10 +19,6 @@ export default function EpochSettings() {
   const [inOutRegistrationsPageUrl, setInOutRegistrationsPageUrl] = useState(undefined);
 
   useEffect(() => {
-    if (!autoUpdate) {
-      return;
-    }
-
     let fetchEpochSettings = () => {
       fetch(epochSettingsEndpoint)
         .then((response) => (response.status === 200 ? response.json() : {}))
@@ -36,8 +32,10 @@ export default function EpochSettings() {
     // Fetch it once without waiting
     fetchEpochSettings();
 
-    const interval = setInterval(fetchEpochSettings, updateInterval);
-    return () => clearInterval(interval);
+    if (autoUpdate) {
+      const interval = setInterval(fetchEpochSettings, updateInterval);
+      return () => clearInterval(interval);
+    }
   }, [epochSettingsEndpoint, updateInterval, autoUpdate]);
 
   useEffect(() => {
@@ -74,14 +72,21 @@ export default function EpochSettings() {
               </Col>
               <Col xs={12} md="auto">
                 <h5>Registration Protocol Parameters</h5>
-                <ProtocolParameters protocolParameters={epochSettings.signer_registration_protocol ?? epochSettings.next_protocol}/>
+                <ProtocolParameters
+                  protocolParameters={
+                    epochSettings.signer_registration_protocol ?? epochSettings.next_protocol
+                  }
+                />
               </Col>
             </Row>
           </Container>
         </Card.Body>
         {registrationPageUrl && inOutRegistrationsPageUrl && (
           <Card.Footer>
-            <Stack direction="horizontal" gap={1} className="justify-content-md-end align-items-stretch justify-content-sm-center">
+            <Stack
+              direction="horizontal"
+              gap={1}
+              className="justify-content-md-end align-items-stretch justify-content-sm-center">
               <LinkButton href={registrationPageUrl}>
                 <i className="bi bi-pen"></i> Registered Signers
               </LinkButton>