Updated version checking.

components/common/UpdateNotice.js

@@ -1,27 +1,38 @@
-import React from 'react';
+import { useState, useEffect, useCallback } from 'react';
 import { FormattedMessage } from 'react-intl';
-import useVersion from 'hooks/useVersion';
-import styles from './UpdateNotice.module.css';
-import ButtonLayout from '../layout/ButtonLayout';
+import ButtonLayout from 'components/layout/ButtonLayout';
+import useStore, { checkVersion } from 'store/version';
+import { setItem } from 'lib/web';
+import { VERSION_CHECK, VERSION_URL } from 'lib/constants';
 import Button from './Button';
-import useForceUpdate from '../../hooks/useForceUpdate';
+import styles from './UpdateNotice.module.css';
 
 export default function UpdateNotice() {
-  const forceUpdate = useForceUpdate();
-  const { hasUpdate, checked, latest, updateCheck } = useVersion(true);
+  const { latest, checked, hasUpdate } = useStore();
+  const [dismissed, setDismissed] = useState(false);
+
+  const updateCheck = useCallback(() => {
+    setItem(VERSION_CHECK, { version: latest, time: Date.now() });
+  }, [latest]);
 
   function handleViewClick() {
-    location.href = 'https://github.com/mikecao/umami/releases';
     updateCheck();
-    forceUpdate();
+    setDismissed(true);
+    location.href = VERSION_URL;
   }
 
   function handleDismissClick() {
     updateCheck();
-    forceUpdate();
+    setDismissed(true);
   }
 
-  if (!hasUpdate || checked) {
+  useEffect(() => {
+    if (!checked) {
+      checkVersion();
+    }
+  }, []);
+
+  if (!hasUpdate || dismissed) {
     return null;
   }
 

components/layout/Footer.js

@@ -3,11 +3,11 @@ import classNames from 'classnames';
 import { FormattedMessage } from 'react-intl';
 import Link from 'components/common/Link';
 import styles from './Footer.module.css';
-import useVersion from 'hooks/useVersion';
+import useStore from 'store/version';
 import { HOMEPAGE_URL, VERSION_URL } from 'lib/constants';
 
 export default function Footer() {
-  const { current } = useVersion();
+  const { current } = useStore();
 
   return (
     <footer className={classNames(styles.footer, 'row')}>

components/layout/Header.js

@@ -17,9 +17,11 @@ export default function Header() {
   const { user } = useUser();
   const { pathname } = useRouter();
 
+  console.log('wat', process.env.updatesDisabled);
+
   return (
     <>
-      {user?.is_admin && <UpdateNotice />}
+      {user?.is_admin && !process.env.updatesDisabled && <UpdateNotice />}
       <header className={classNames(styles.header, 'row')}>
         <div className={styles.title}>
           <Icon icon={<Logo />} size="large" className={styles.logo} />

hooks/useVersion.js

@@ -1,21 +0,0 @@
-import { useEffect, useCallback } from 'react';
-import useStore, { checkVersion } from 'store/version';
-import { VERSION_CHECK } from 'lib/constants';
-import { getItem, setItem } from 'lib/web';
-
-export default function useVersion(check) {
-  const versions = useStore();
-  const checked = versions.latest === getItem(VERSION_CHECK)?.version;
-
-  const updateCheck = useCallback(() => {
-    setItem(VERSION_CHECK, { version: versions.latest, time: Date.now() });
-  }, [versions]);
-
-  useEffect(() => {
-    if (check && !versions.latest) {
-      checkVersion();
-    }
-  }, [versions, check]);
-
-  return { ...versions, checked, updateCheck };
-}

next.config.js

@@ -3,8 +3,9 @@ const pkg = require('./package.json');
 
 module.exports = {
   env: {
-    version: pkg.version,
+    currentVersion: pkg.version,
     loginDisabled: process.env.DISABLE_LOGIN,
+    updatesDisabled: process.env.DISABLE_UPDATES,
   },
   basePath: process.env.BASE_PATH,
   experimental: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "umami",
-  "version": "1.32.0",
+  "version": "1.31.0",
   "description": "A simple, fast, privacy-focused alternative to Google Analytics.",
   "author": "Mike Cao <mike@mikecao.com>",
   "license": "MIT",

store/version.js

@@ -4,12 +4,13 @@ import semver from 'semver';
 import { VERSION_CHECK } from 'lib/constants';
 import { getItem } from 'lib/web';
 
-const REPO_URL = 'https://api.umami.is/v1/updates';
+const UPDATES_URL = 'https://api.umami.is/v1/updates';
 
 const initialState = {
-  current: process.env.version,
+  current: process.env.currentVersion,
   latest: null,
   hasUpdate: false,
+  checked: false,
 };
 
 const store = create(() => ({ ...initialState }));
@@ -17,8 +18,8 @@ const store = create(() => ({ ...initialState }));
 export async function checkVersion() {
   const { current } = store.getState();
 
-  const data = await fetch(REPO_URL, {
-    method: 'get',
+  const data = await fetch(`${UPDATES_URL}?v=${current}`, {
+    method: 'GET',
     headers: {
       Accept: 'application/json',
     },
@@ -38,11 +39,13 @@ export async function checkVersion() {
     produce(state => {
       const { latest } = data;
       const lastCheck = getItem(VERSION_CHECK);
-      const hasUpdate = latest && semver.gt(latest, current) && lastCheck?.version !== latest;
+
+      const hasUpdate = !!(latest && lastCheck?.version !== latest && semver.gt(latest, current));
 
       state.current = current;
       state.latest = latest;
       state.hasUpdate = hasUpdate;
+      state.checked = true;
 
       return state;
     }),