feat: add version checker

Nounspace · Jul 7, 2024 · 883b2cb · 883b2cb
1 parent c18d047
commit 883b2cb
Show file tree

Hide file tree

Showing 4 changed files with 84 additions and 17 deletions.
diff --git a/next.config.mjs b/next.config.mjs
@@ -1,4 +1,5 @@
 import bundlerAnalyzer from "@next/bundle-analyzer";
+import packageInfo from './package.json' with { type: "json" };
 
 const withBundleAnalyzer = bundlerAnalyzer({
   enabled: process.env.ANALYZE === 'true',
@@ -28,6 +29,9 @@ const nextConfig = {
   typescript: {
     ignoreBuildErrors: false,
   },
+  env: {
+    NEXT_PUBLIC_VERSION: packageInfo.version,
+  },
   images: {
     remotePatterns: [
       {

diff --git a/src/common/providers/VersionCheckProvider.tsx b/src/common/providers/VersionCheckProvider.tsx
@@ -0,0 +1,53 @@
+import React, { useEffect, useRef, useState } from "react";
+import axiosBackend from "../data/api/backend";
+import { Button } from "../components/atoms/button";
+
+export default function VersionCheckProivder({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  const pollTimeOut = useRef<NodeJS.Timeout | undefined>();
+  const [needsRecheck, setNeedsRecheck] = useState(false);
+  const [versionsMisaligned, setVersionMisaligned] = useState(false);
+
+  async function checkVersion() {
+    setNeedsRecheck(false);
+    clearTimeout(pollTimeOut.current);
+    try {
+      const { data } = await axiosBackend.get<{ buildId: string }>(
+        "/api/buildId",
+      );
+      if (data.buildId !== process.env.NEXT_PUBLIC_VERSION) {
+        setVersionMisaligned(true);
+      }
+    } catch {
+      console.error("Failed to check for new versio");
+    } finally {
+      if (!versionsMisaligned) {
+        pollTimeOut.current = setTimeout(() => setNeedsRecheck(true), 100000);
+      }
+    }
+  }
+
+  useEffect(() => {
+    if (needsRecheck) checkVersion();
+  }, [needsRecheck]);
+
+  useEffect(() => {
+    checkVersion();
+  });
+
+  return (
+    <>
+      {versionsMisaligned && (
+        <div className="flex justify-center items-center align-center z-infinity ">
+          <Button onClick={() => window.location.reload()}>
+            A new version is available! Click to refresh
+          </Button>
+        </div>
+      )}
+      {children}
+    </>
+  );
+}
diff --git a/src/common/providers/index.tsx b/src/common/providers/index.tsx
@@ -9,25 +9,28 @@ import { AppStoreProvider } from "@/common/data/stores/app";
 import UserThemeProvider from "@/common/lib/theme/UserThemeProvider";
 import LoggedInStateProvider from "./LoggedInStateProvider";
 import AnalyticsProvider from "./AnalyticsProvider";
+import VersionCheckProivder from "./VersionCheckProvider";
 
 export default function Providers({ children }: { children: React.ReactNode }) {
   return (
-    <Privy>
-      <Query>
-        <Wagmi>
-          <Theme>
-            <AppStoreProvider>
-              <UserThemeProvider>
-                <AuthenticatorProvider>
-                  <LoggedInStateProvider>
-                    <AnalyticsProvider>{children}</AnalyticsProvider>
-                  </LoggedInStateProvider>
-                </AuthenticatorProvider>
-              </UserThemeProvider>
-            </AppStoreProvider>
-          </Theme>
-        </Wagmi>
-      </Query>
-    </Privy>
+    <VersionCheckProivder>
+      <Privy>
+        <Query>
+          <Wagmi>
+            <Theme>
+              <AppStoreProvider>
+                <UserThemeProvider>
+                  <AuthenticatorProvider>
+                    <LoggedInStateProvider>
+                      <AnalyticsProvider>{children}</AnalyticsProvider>
+                    </LoggedInStateProvider>
+                  </AuthenticatorProvider>
+                </UserThemeProvider>
+              </AppStoreProvider>
+            </Theme>
+          </Wagmi>
+        </Query>
+      </Privy>
+    </VersionCheckProivder>
   );
 }
diff --git a/src/pages/api/buildId.ts b/src/pages/api/buildId.ts
@@ -0,0 +1,7 @@
+import { NextApiResponse } from "next";
+
+export default function buildId(_, res: NextApiResponse) {
+  res.status(200).json({
+    buildId: process.env.NEXT_PUBLIC_VERSION,
+  });
+}