@basictech/react 0.8.0-beta.1 → 0.8.0-beta.3

package/src/sync/syncProtocol.js

@@ -137,9 +137,37 @@ export const syncProtocol = function () {
         }
       };
 
+      // When the page becomes visible again (e.g. PWA/mobile browser resuming
+      // from background), the scheduled setTimeout for token refresh may have
+      // been frozen by the browser. Force-refresh the token and re-send it to
+      // the server so the WebSocket connection stays authenticated.
+      function handleVisibilityResume() {
+        if (document.visibilityState === 'visible' && ws.readyState === WebSocket.OPEN) {
+          log("Page became visible - refreshing token for WebSocket");
+          resolveGetToken()({ forceRefresh: true }).then(function(newToken) {
+            if (ws.readyState === WebSocket.OPEN) {
+              ws.send(JSON.stringify({ type: "tokenUpdate", authToken: newToken }));
+              scheduleTokenRefresh(newToken);
+            }
+          }).catch(function(err) {
+            log("Token refresh on visibility resume failed:", err);
+          });
+        }
+      }
+      if (typeof document !== 'undefined') {
+        document.addEventListener('visibilitychange', handleVisibilityResume);
+      }
+
+      function cleanupVisibilityListener() {
+        if (typeof document !== 'undefined') {
+          document.removeEventListener('visibilitychange', handleVisibilityResume);
+        }
+      }
+
       // If network down or other error, tell the framework to reconnect again in some time:
       ws.onerror = function (event) {
         clearRefreshTimer();
+        cleanupVisibilityListener();
         ws.close();
         log("ws.onerror", event);
         onError(event?.message, RECONNECT_DELAY);
@@ -148,6 +176,7 @@ export const syncProtocol = function () {
       // If socket is closed (network disconnected), inform framework and make it reconnect
       ws.onclose = function (event) {
         clearRefreshTimer();
+        cleanupVisibilityListener();
         onError("Socket closed: " + event.reason, RECONNECT_DELAY);
       };
 
@@ -211,6 +240,7 @@ export const syncProtocol = function () {
                 },
                 disconnect: function () {
                   clearRefreshTimer();
+                  cleanupVisibilityListener();
                   ws.close();
                 },
               });

package/src/utils/network.ts

@@ -1,44 +1,97 @@
 // Network utilities for Basic React package
+import semver from 'semver'
 import { log } from '../config'
-import { version as currentVersion } from '../../package.json'
+import { version as pkgVersion } from '../../package.json'
 
 export function isDevelopment(debug?: boolean): boolean {
+    if (debug === true) return true
+    if (typeof process !== 'undefined' && process.env.NODE_ENV === 'development') return true
+    if (typeof window === 'undefined' || !window.location) return false
+    const host = window.location.hostname
     return (
-        window.location.hostname === 'localhost' ||
-        window.location.hostname === '127.0.0.1' ||
-        window.location.hostname.includes('localhost') ||
-        window.location.hostname.includes('127.0.0.1') ||
-        window.location.hostname.includes('.local') ||
-        process.env.NODE_ENV === 'development' ||
-        debug === true
+        host === 'localhost' ||
+        host === '127.0.0.1' ||
+        host.includes('localhost') ||
+        host.includes('127.0.0.1') ||
+        host.includes('.local')
     )
 }
 
+function normalizeVersion(v: string | null | undefined): string | null {
+    if (v == null) return null
+    const t = String(v).trim()
+    return t.length ? t : null
+}
+
+function versionsMatch(a: string, b: string): boolean {
+    const na = a.trim()
+    const nb = b.trim()
+    if (na === nb) return true
+    const va = semver.valid(na)
+    const vb = semver.valid(nb)
+    if (va && vb) return semver.eq(va, vb)
+    return false
+}
+
+/** Use npm `beta` dist-tag when the installed version is a semver prerelease whose first id is `beta`. */
+function usesBetaDistTag(version: string): boolean {
+    const pre = semver.prerelease(version)
+    const id = pre?.[0]
+    return typeof id === 'string' && id.toLowerCase() === 'beta'
+}
+
+type NpmInstallMeta = {
+    'dist-tags'?: { latest?: string; beta?: string }
+}
+
 export async function checkForNewVersion(): Promise<{ 
     hasNewVersion: boolean, 
     latestVersion: string | null, 
     currentVersion: string | null 
 }> {
     try {
-        const isBeta = currentVersion.includes('beta')
+        const currentVersion = normalizeVersion(pkgVersion)
+        if (!currentVersion) {
+            return { hasNewVersion: false, latestVersion: null, currentVersion: null }
+        }
 
-        const response = await fetch(`https://registry.npmjs.org/@basictech/react/${isBeta ? 'beta' : 'latest'}`);
+        const response = await fetch('https://registry.npmjs.org/@basictech/react', {
+            headers: { Accept: 'application/vnd.npm.install-v1+json' },
+        })
         if (!response.ok) {
             throw new Error('Failed to fetch version from npm');
         }
 
-        const data = await response.json();
-        const latestVersion = data.version;
+        const data = (await response.json()) as NpmInstallMeta
+        const distTags = data['dist-tags'] ?? {}
+        const rawRegistry =
+            usesBetaDistTag(currentVersion)
+                ? distTags.beta ?? distTags.latest
+                : distTags.latest
+        const latestVersion = normalizeVersion(rawRegistry ?? null)
+        if (!latestVersion) {
+            throw new Error('Missing dist-tags from npm registry')
+        }
+
+        const same = versionsMatch(currentVersion, latestVersion)
+
+        if (!same && isDevelopment()) {
+            log('[basic] version check mismatch:', {
+                currentVersion,
+                registryVersion: latestVersion,
+                channel: usesBetaDistTag(currentVersion) ? 'beta' : 'latest',
+            })
+        }
 
-        if (latestVersion !== currentVersion) {
+        if (!same) {
             console.warn('[basic] New version available:', latestVersion, `\nrun "npm install @basictech/react@${latestVersion}" to update`);
         }
-        if (isBeta) {
+        if (usesBetaDistTag(currentVersion)) {
             log('thank you for being on basictech/react beta :)')
         }
      
         return {
-            hasNewVersion: currentVersion !== latestVersion,
+            hasNewVersion: !same,
             latestVersion,
             currentVersion
         };
@@ -57,7 +110,7 @@ export function cleanOAuthParamsFromUrl(): void {
         const url = new URL(window.location.href)
         url.searchParams.delete('code')
         url.searchParams.delete('state')
-        window.history.pushState({}, document.title, url.pathname + url.search)
+        window.history.replaceState({}, document.title, url.pathname + url.search)
         log('Cleaned OAuth parameters from URL')
     }
 }