diff --git a/surfsense_web/components/homepage/hero-section.tsx b/surfsense_web/components/homepage/hero-section.tsx index 0641d4e4e..09cf316d8 100644 --- a/surfsense_web/components/homepage/hero-section.tsx +++ b/surfsense_web/components/homepage/hero-section.tsx @@ -351,9 +351,24 @@ function GetStartedButton() { } function DownloadButton() { - const { os, primary, alternatives } = usePrimaryDownload(); + const { os, primary, alternatives, isMobileOS } = usePrimaryDownload(); const fallbackUrl = GITHUB_RELEASES_URL; + const mobileDisabledLabel = "Desktop app unavailable on mobile"; + + if (isMobileOS) { + return ( + + ); + } if (!primary) { return ( diff --git a/surfsense_web/components/layout/ui/sidebar/SidebarUserProfile.tsx b/surfsense_web/components/layout/ui/sidebar/SidebarUserProfile.tsx index 3cecb5504..ea93ce4d0 100644 --- a/surfsense_web/components/layout/ui/sidebar/SidebarUserProfile.tsx +++ b/surfsense_web/components/layout/ui/sidebar/SidebarUserProfile.tsx @@ -139,14 +139,14 @@ export function SidebarUserProfile({ const { locale, setLocale } = useLocaleContext(); const { isDesktop } = usePlatform(); const isDesktopViewport = useMediaQuery("(min-width: 768px)"); - const { os, primary } = usePrimaryDownload(); + const { os, primary, isMobileOS } = usePrimaryDownload(); const [isLoggingOut, setIsLoggingOut] = useState(false); const bgColor = getUserAvatarColor(user.email); const initials = getUserInitials(user.email); const displayName = user.name || user.email.split("@")[0]; const downloadUrl = primary?.url ?? GITHUB_RELEASES_URL; const downloadLabel = t("download_for_os", { os }); - const showDownloadCta = !isDesktop && isDesktopViewport; + const showDownloadCta = !isDesktop && !isMobileOS && isDesktopViewport; const handleLanguageChange = (newLocale: "en" | "es" | "pt" | "hi" | "zh") => { setLocale(newLocale); @@ -331,7 +331,7 @@ export function SidebarUserProfile({ - {!isDesktop && ( + {!isDesktop && !isMobileOS && ( diff --git a/surfsense_web/lib/desktop-download-utils.ts b/surfsense_web/lib/desktop-download-utils.ts index d4e2d4e68..5b861d7d9 100644 --- a/surfsense_web/lib/desktop-download-utils.ts +++ b/surfsense_web/lib/desktop-download-utils.ts @@ -1,7 +1,7 @@ import { useEffect, useMemo, useState } from "react"; export type OSInfo = { - os: "macOS" | "Windows" | "Linux"; + os: "macOS" | "Windows" | "Linux" | "Android" | "iOS"; arch: "arm64" | "x64"; }; @@ -12,7 +12,13 @@ export function useUserOS(): OSInfo { let os: OSInfo["os"] = "macOS"; let arch: OSInfo["arch"] = "x64"; - if (/Windows/i.test(ua)) { + if (/Android/i.test(ua)) { + os = "Android"; + arch = "arm64"; + } else if (/iPhone|iPad|iPod/i.test(ua)) { + os = "iOS"; + arch = "arm64"; + } else if (/Windows/i.test(ua)) { os = "Windows"; arch = "x64"; } else if (/Linux/i.test(ua)) { @@ -88,9 +94,11 @@ export const GITHUB_RELEASES_URL = "https://github.com/MODSetter/SurfSense/relea export function usePrimaryDownload() { const { os, arch } = useUserOS(); const assets = useLatestRelease(); + const isMobileOS = os === "Android" || os === "iOS"; const { primary, alternatives } = useMemo(() => { if (assets.length === 0) return { primary: null, alternatives: [] }; + if (isMobileOS) return { primary: null, alternatives: assets }; const matchers: Record boolean> = { Windows: (n) => n.endsWith(".exe"), @@ -102,7 +110,7 @@ export function usePrimaryDownload() { const primary = assets.find((a) => match(a.name)) ?? null; const alternatives = assets.filter((a) => a !== primary); return { primary, alternatives }; - }, [assets, os, arch]); + }, [assets, os, arch, isMobileOS]); - return { os, arch, assets, primary, alternatives }; + return { os, arch, assets, primary, alternatives, isMobileOS }; }