Fix model check

cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "9router",
-  "version": "0.4.46",
+  "version": "0.4.49",
   "description": "9Router CLI - Start and manage 9Router server",
   "bin": {
     "9router": "./cli.js"

src/app/(dashboard)/dashboard/endpoint/EndpointPageClient.js

@@ -14,9 +14,11 @@ const TUNNEL_BENEFITS = [
 
 const TUNNEL_PING_INTERVAL_MS = 2000;
 const TUNNEL_PING_MAX_MS = 300000;
-const STATUS_POLL_INTERVAL_MS = 5000;
+const STATUS_POLL_FAST_MS = 5000;
+const STATUS_POLL_SLOW_MS = 30000;
 const REACHABLE_MISS_THRESHOLD = 5;
-const CLIENT_PING_INTERVAL_MS = 10000;
+const CLIENT_PING_FAST_MS = 10000;
+const CLIENT_PING_SLOW_MS = 60000;
 const CLIENT_PING_TIMEOUT_MS = 5000;
 
 // Browser-side health probe: bypasses backend DNS issues (1.1.1.1 vs OS resolver).
@@ -111,20 +113,33 @@ export default function APIPageClient({ machineId }) {
   useEffect(() => {
     fetchData();
     loadSettings();
-    // Poll status periodically + on tab visible to sync after watchdog restarts
-    const interval = setInterval(() => { syncTunnelStatus(); }, STATUS_POLL_INTERVAL_MS);
+  }, []);
+
+  // Adaptive status poll: slow when healthy, fast when degraded; pause when tab hidden.
+  useEffect(() => {
+    const anyEnabled = tunnelEnabled || tsEnabled;
+    if (!anyEnabled) return;
+    const tunnelHealthy = !tunnelEnabled || tunnelReachable;
+    const tsHealthy = !tsEnabled || tsReachable;
+    const allHealthy = tunnelHealthy && tsHealthy;
+    const delay = allHealthy ? STATUS_POLL_SLOW_MS : STATUS_POLL_FAST_MS;
+    let timer = null;
+    const tick = () => { if (!document.hidden) syncTunnelStatus(); };
+    timer = setInterval(tick, delay);
     const onVisible = () => { if (!document.hidden) syncTunnelStatus(); };
     document.addEventListener("visibilitychange", onVisible);
     return () => {
-      clearInterval(interval);
+      if (timer) clearInterval(timer);
       document.removeEventListener("visibilitychange", onVisible);
     };
-  }, []);
+  }, [tunnelEnabled, tsEnabled, tunnelReachable, tsReachable]);
 
   // Browser-side periodic ping: probes tunnel/tailscale URLs directly so UI stays
   // "reachable" even when backend DNS (1.1.1.1) hiccups on *.ts.net or *.trycloudflare.com.
+  // Adaptive: slow when healthy, fast when degraded; pause when tab hidden.
   useEffect(() => {
     const probeBoth = async () => {
+      if (document.hidden) return;
       if (tunnelEnabled && tunnelUrl) {
         const ok = await clientPingUrl(tunnelUrl);
         tunnelClientReachableRef.current = ok;
@@ -140,10 +155,16 @@ export default function APIPageClient({ machineId }) {
         tsClientReachableRef.current = false;
       }
     };
+    const anyEnabled = (tunnelEnabled && tunnelUrl) || (tsEnabled && tsUrl);
+    if (!anyEnabled) return;
     probeBoth();
-    const id = setInterval(probeBoth, CLIENT_PING_INTERVAL_MS);
+    const tunnelHealthy = !tunnelEnabled || tunnelReachable;
+    const tsHealthy = !tsEnabled || tsReachable;
+    const allHealthy = tunnelHealthy && tsHealthy;
+    const delay = allHealthy ? CLIENT_PING_SLOW_MS : CLIENT_PING_FAST_MS;
+    const id = setInterval(probeBoth, delay);
     return () => clearInterval(id);
-  }, [tunnelEnabled, tunnelUrl, tsEnabled, tsUrl]);
+  }, [tunnelEnabled, tunnelUrl, tsEnabled, tsUrl, tunnelReachable, tsReachable]);
 
   // Effective reachable = serverReachable OR clientReachable (1 of 2 is enough).
   // Miss-debounce: only flip to false after N consecutive misses on BOTH sides.

src/shared/components/DonateModal.js

@@ -0,0 +1,136 @@
+"use client";
+
+import { useEffect, useState, useRef } from "react";
+import { createPortal } from "react-dom";
+import PropTypes from "prop-types";
+import { GITHUB_CONFIG } from "@/shared/constants/config";
+
+export default function DonateModal({ isOpen, onClose }) {
+  const [data, setData] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState("");
+  const modalRef = useRef(null);
+
+  useEffect(() => {
+    if (!isOpen || data) return;
+    setLoading(true);
+    setError("");
+    fetch(GITHUB_CONFIG.donateUrl, { cache: "no-store" })
+      .then((res) => {
+        if (!res.ok) throw new Error(`HTTP ${res.status}`);
+        return res.json();
+      })
+      .then((json) => setData(json))
+      .catch((err) => setError(err.message || "Failed to load"))
+      .finally(() => setLoading(false));
+  }, [isOpen, data]);
+
+  useEffect(() => {
+    const handleClickOutside = (e) => {
+      if (modalRef.current && !modalRef.current.contains(e.target)) onClose();
+    };
+    if (isOpen) {
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }
+  }, [isOpen, onClose]);
+
+  if (!isOpen || typeof document === "undefined") return null;
+
+  return createPortal(
+    <div className="fixed inset-0 z-50 flex items-center justify-center p-4">
+      <div className="absolute inset-0 bg-black/30 backdrop-blur-sm" onClick={onClose} />
+      <div
+        ref={modalRef}
+        className="relative w-full bg-surface border border-black/10 dark:border-white/10 rounded-xl shadow-2xl animate-in fade-in zoom-in-95 duration-200 max-w-3xl flex flex-col max-h-[85vh]"
+      >
+        <div className="flex items-center justify-between p-3 border-b border-black/5 dark:border-white/5">
+          <h2 className="text-lg font-semibold text-text-main flex items-center gap-2">
+            <span className="material-symbols-outlined text-pink-500">volunteer_activism</span>
+            {data?.title || "Support 9Router"}
+          </h2>
+          <button
+            onClick={onClose}
+            className="p-1.5 rounded-lg text-text-muted hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
+            aria-label="Close"
+          >
+            <span className="material-symbols-outlined text-[20px]">close</span>
+          </button>
+        </div>
+
+        <div className="p-6 overflow-y-auto flex-1">
+          {loading && (
+            <div className="flex items-center justify-center py-10 text-text-muted">
+              <span className="material-symbols-outlined animate-spin mr-2">progress_activity</span>
+              Loading...
+            </div>
+          )}
+          {error && (
+            <div className="text-red-500 py-4">Failed to load donate info: {error}</div>
+          )}
+          {!loading && !error && data && (
+            <>
+              {data.message && (
+                <p className="text-text-muted text-sm mb-6 text-center">{data.message}</p>
+              )}
+              <div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
+                {data.channels?.map((ch) => (
+                  <DonateChannelCard key={ch.id} channel={ch} />
+                ))}
+              </div>
+            </>
+          )}
+        </div>
+      </div>
+    </div>,
+    document.body
+  );
+}
+
+function DonateChannelCard({ channel }) {
+  const { label, description, icon, color, url, qr } = channel;
+  const content = (
+    <>
+      <div
+        className="w-12 h-12 rounded-full flex items-center justify-center mb-3"
+        style={{ backgroundColor: `${color}20`, color }}
+      >
+        <span className="material-symbols-outlined text-[26px]">{icon}</span>
+      </div>
+      <div className="font-semibold text-text-main mb-1">{label}</div>
+      {description && (
+        <div className="text-xs text-text-muted mb-3 text-center">{description}</div>
+      )}
+      {qr && (
+        <img
+          src={qr}
+          alt={`${label} QR`}
+          className="w-full max-w-[180px] aspect-square object-contain rounded-lg bg-white p-1"
+        />
+      )}
+    </>
+  );
+
+  return (
+    <div className="flex flex-col items-center p-4 rounded-xl border border-black/10 dark:border-white/10 bg-surface/50 hover:border-pink-500/40 transition-colors">
+      {content}
+      {url && (
+        <a
+          href={url}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="mt-3 inline-flex items-center gap-1 px-3 py-1.5 rounded-lg text-sm font-medium text-white hover:opacity-90 transition-opacity"
+          style={{ backgroundColor: color }}
+        >
+          Open
+          <span className="material-symbols-outlined text-[16px]">open_in_new</span>
+        </a>
+      )}
+    </div>
+  );
+}
+
+DonateModal.propTypes = {
+  isOpen: PropTypes.bool.isRequired,
+  onClose: PropTypes.func.isRequired,
+};

src/shared/components/Header.js

@@ -7,6 +7,7 @@ import PropTypes from "prop-types";
 import ProviderIcon from "@/shared/components/ProviderIcon";
 import HeaderMenu from "@/shared/components/HeaderMenu";
 import ThemeToggle from "@/shared/components/ThemeToggle";
+import DonateModal from "@/shared/components/DonateModal";
 import { useHeaderSearchStore } from "@/store/headerSearchStore";
 import { OAUTH_PROVIDERS, APIKEY_PROVIDERS } from "@/shared/constants/config";
 import { MEDIA_PROVIDER_KINDS, AI_PROVIDERS } from "@/shared/constants/providers";
@@ -174,6 +175,7 @@ export default function Header({ onMenuClick, showMenuButton = true }) {
   const router = useRouter();
   const [displayName, setDisplayName] = useState("");
   const [loginMethod, setLoginMethod] = useState("");
+  const [donateOpen, setDonateOpen] = useState(false);
 
   // Memoize page info to prevent unnecessary recalculations
   const pageInfo = useMemo(() => getPageInfo(pathname), [pathname]);
@@ -304,9 +306,18 @@ export default function Header({ onMenuClick, showMenuButton = true }) {
           </div>
         )}
         <HeaderSearch />
+        <button
+          onClick={() => setDonateOpen(true)}
+          className="flex items-center gap-1.5 px-3 h-8 rounded-lg border border-pink-500/30 bg-pink-500/10 text-pink-600 dark:text-pink-400 hover:bg-pink-500/20 transition-colors text-sm font-medium"
+          aria-label="Donate"
+        >
+          <span className="material-symbols-outlined text-[18px]">volunteer_activism</span>
+          <span className="hidden sm:inline">Donate</span>
+        </button>
         <ThemeToggle />
         <HeaderMenu onLogout={handleLogout} />
       </div>
+      <DonateModal isOpen={donateOpen} onClose={() => setDonateOpen(false)} />
     </header>
   );
 }

src/shared/constants/config.js

@@ -10,6 +10,7 @@ export const APP_CONFIG = {
 // GitHub configuration
 export const GITHUB_CONFIG = {
   changelogUrl: "https://raw.githubusercontent.com/decolua/9router/refs/heads/master/CHANGELOG.md",
+  donateUrl: "https://9router.com/api/donate",
 };
 
 // Updater configuration