refactor(gui): Seperate background refresh logic (#193)

src-gui/src/renderer/components/App.tsx

@@ -11,14 +11,8 @@ import GlobalSnackbarProvider from "./snackbar/GlobalSnackbarProvider";
 import UpdaterDialog from "./modal/updater/UpdaterDialog";
 import { useSettings } from "store/hooks";
 import { themes } from "./theme";
-import { initEventListeners, updateAllNodeStatuses } from "renderer/rpc";
-import { fetchAlertsViaHttp, fetchProvidersViaHttp, updateRates } from "renderer/api";
-import { store } from "renderer/store/storeRenderer";
-import logger from "utils/logger";
-import { setAlerts } from "store/features/alertsSlice";
-import { setRegistryProviders } from "store/features/providersSlice";
-import { registryConnectionFailed } from "store/features/providersSlice";
 import { useEffect } from "react";
+import { setupBackgroundTasks } from "renderer/background";
 
 const useStyles = makeStyles((theme) => ({
   innerContent: {
@@ -31,8 +25,7 @@ const useStyles = makeStyles((theme) => ({
 
 export default function App() {
   useEffect(() => {
-    fetchInitialData();
-    initEventListeners();
+    setupBackgroundTasks();
   }, []);
 
   const theme = useSettings((s) => s.theme);
@@ -65,48 +58,4 @@ function InnerContent() {
       </Routes>
     </Box>
   );
-}
-
-async function fetchInitialData() {
-  try {
-    const providerList = await fetchProvidersViaHttp();
-    store.dispatch(setRegistryProviders(providerList));
-
-    logger.info(
-      { providerList },
-      "Fetched providers via UnstoppableSwap HTTP API",
-    );
-  } catch (e) {
-    store.dispatch(registryConnectionFailed());
-    logger.error(e, "Failed to fetch providers via UnstoppableSwap HTTP API");
-  }
-
-  try {
-    await updateAllNodeStatuses()
-  } catch (e) {
-    logger.error(e, "Failed to update node statuses")
-  }
-
-  // Update node statuses every 2 minutes
-  const STATUS_UPDATE_INTERVAL = 2 * 60 * 1_000;
-  setInterval(updateAllNodeStatuses, STATUS_UPDATE_INTERVAL);
-
-  try {
-    const alerts = await fetchAlertsViaHttp();
-    store.dispatch(setAlerts(alerts));
-    logger.info({ alerts }, "Fetched alerts via UnstoppableSwap HTTP API");
-  } catch (e) {
-    logger.error(e, "Failed to fetch alerts via UnstoppableSwap HTTP API");
-  }
-
-  try {
-    await updateRates();
-    logger.info("Fetched XMR/BTC rate");
-  } catch (e) {
-    logger.error(e, "Error retrieving XMR/BTC rate");
-  }
-  
-  // Update the rates every 5 minutes (to respect the coingecko rate limit)
-  const RATE_UPDATE_INTERVAL = 5 * 60 * 1_000;
-  setInterval(updateRates, RATE_UPDATE_INTERVAL);
-}
+}

src-gui/src/renderer/components/modal/feedback/FeedbackDialog.tsx

@@ -24,13 +24,14 @@ import { submitFeedbackViaHttp } from "../../../api";
 import LoadingButton from "../../other/LoadingButton";
 import { PiconeroAmount } from "../../other/Units";
 import { getLogsOfSwap } from "renderer/rpc";
+import logger from "utils/logger";
 
 async function submitFeedback(body: string, swapId: string | number, submitDaemonLogs: boolean) {
   let attachedBody = "";
 
   if (swapId !== 0 && typeof swapId === "string") {
     const swapInfo = store.getState().rpc.state.swapInfos[swapId];
-    
+
     if (swapInfo === undefined) {
       throw new Error(`Swap with id ${swapId} not found`);
     }
@@ -179,7 +180,7 @@ export default function FeedbackDialog({
                 variant: "success",
               });
             } catch (e) {
-              console.error(`Failed to submit feedback: ${e}`);
+              logger.error(`Failed to submit feedback: ${e}`);
               enqueueSnackbar(`Failed to submit feedback (${e})`, {
                 variant: "error",
               });

src-gui/src/renderer/components/modal/provider/ProviderInfo.tsx

@@ -74,7 +74,7 @@ export default function ProviderInfo({
         Maximum swap amount: <SatsAmount amount={provider.maxSwapAmount} />
       </Typography>
       <Box className={classes.chipsOuter}>
-        <Chip label={provider.testnet ? "Testnet" : "Mainnet"} />
+        {provider.testnet && <Chip label="Testnet" />}
         {provider.uptime && (
           <Tooltip title="A high uptime (>90%) indicates reliability. Providers with very low uptime may be unreliable and cause swaps to take longer to complete or fail entirely.">
             <Chip label={`${Math.round(provider.uptime * 100)}% uptime`} />

src-gui/src/renderer/components/modal/swap/SwapStateStepper.tsx

@@ -1,6 +1,7 @@
 import { Step, StepLabel, Stepper, Typography } from "@material-ui/core";
 import { SwapState } from "models/storeModel";
 import { useAppSelector } from "store/hooks";
+import logger from "utils/logger";
 
 export enum PathType {
   HAPPY_PATH = "happy path",
@@ -18,7 +19,7 @@ type PathStep = [type: PathType, step: number, isError: boolean];
 function getActiveStep(state: SwapState | null): PathStep | null {
   // In case we cannot infer a correct step from the state
   function fallbackStep(reason: string) {
-    console.error(
+    logger.error(
       `Unable to choose correct stepper type (reason: ${reason}, state: ${JSON.stringify(state)}`,
     );
     return null;