From c422c3e5b95172c9da6e792d276de4e2271b344a Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Thu, 10 Apr 2025 10:35:24 +0300 Subject: [PATCH] fix(mobile): detection when authentication is disabled (closes #1660) --- src/express.d.ts | 2 ++ src/public/app/login.ts | 27 --------------------------- src/routes/index.ts | 35 +++++++++++++++++++++++++++++++++-- 3 files changed, 35 insertions(+), 29 deletions(-) diff --git a/src/express.d.ts b/src/express.d.ts index 846c5b9b2..f2cb77c78 100644 --- a/src/express.d.ts +++ b/src/express.d.ts @@ -20,6 +20,8 @@ export declare module "express-serve-static-core" { "trilium-component-id"?: string; "trilium-local-now-datetime"?: string; "trilium-hoisted-note-id"?: string; + + "user-agent"?: string; }; } } diff --git a/src/public/app/login.ts b/src/public/app/login.ts index 5fc7d6293..5db5cfd4e 100644 --- a/src/public/app/login.ts +++ b/src/public/app/login.ts @@ -3,30 +3,3 @@ import "../stylesheets/bootstrap.scss"; // @ts-ignore - module = undefined // Required for correct loading of scripts in Electron if (typeof module === 'object') {window.module = module; module = undefined;} - -const device = getDeviceType(); -console.log("Setting device cookie to:", device); -setCookie("trilium-device", device); - -function setCookie(name: string, value?: string) { - const date = new Date(Date.now() + 10 * 365 * 24 * 60 * 60 * 1000); - const expires = "; expires=" + date.toUTCString(); - - document.cookie = name + "=" + (value || "") + expires + "; path=/"; -} - -function getDeviceType() { - if (window.location.search === "?desktop") return "desktop"; - if (window.location.search === "?mobile") return "mobile"; - return isMobile() ? "mobile" : "desktop"; -} - -// https://stackoverflow.com/a/73731646/944162 -function isMobile() { - const mQ = matchMedia?.("(pointer:coarse)"); - if (mQ?.media === "(pointer:coarse)") return !!mQ.matches; - - if ("orientation" in window) return true; - const userAgentsRegEx = /\b(Android|iPhone|iPad|iPod|Windows Phone|BlackBerry|webOS|IEMobile)\b/i; - return userAgentsRegEx.test(navigator.userAgent); -} diff --git a/src/routes/index.ts b/src/routes/index.ts index e7cd36228..79a40f186 100644 --- a/src/routes/index.ts +++ b/src/routes/index.ts @@ -17,8 +17,7 @@ import type BNote from "../becca/entities/bnote.js"; function index(req: Request, res: Response) { const options = optionService.getOptionMap(); - - const view = !isElectron && req.cookies["trilium-device"] === "mobile" ? "mobile" : "desktop"; + const view = getView(req); //'overwrite' set to false (default) => the existing token will be re-used and validated //'validateOnReuse' set to false => if validation fails, generate a new token instead of throwing an error @@ -61,6 +60,38 @@ function index(req: Request, res: Response) { }); } +function getView(req: Request): "desktop" | "mobile" { + // Electron always uses the desktop view. + if (isElectron) { + return "desktop"; + } + + // Respect user's manual override via URL. + if ("desktop" in req.query) { + return "desktop"; + } else if ("mobile" in req.query) { + return "mobile"; + } + + // Respect user's manual override via cookie. + const cookie = req.cookies?.["trilium-device"]; + if (cookie === "mobile" || cookie === "desktop") { + return cookie; + } + + // Try to detect based on user agent. + const userAgent = req.headers["user-agent"]; + if (userAgent) { + // TODO: Deduplicate regex with client-side login.ts. + const mobileRegex = /\b(Android|iPhone|iPad|iPod|Windows Phone|BlackBerry|webOS|IEMobile)\b/i; + if (mobileRegex.test(userAgent)) { + return "mobile"; + } + } + + return "desktop"; +} + function getThemeCssUrl(theme: string, themeNote: BNote | null) { if (theme === "auto") { return `${assetPath}/stylesheets/theme.css`;