From 4200a77ce656ffcd5fd88fffe426c4782382b75a Mon Sep 17 00:00:00 2001 From: Felipe Torres Date: Wed, 20 Nov 2024 20:15:17 -0800 Subject: [PATCH] update --- app/components/Navbar/index.tsx | 14 +++++++++++++- app/components/useIsSafariMobile.ts | 11 ++++------- 2 files changed, 17 insertions(+), 8 deletions(-) diff --git a/app/components/Navbar/index.tsx b/app/components/Navbar/index.tsx index 224532d..a1bacae 100644 --- a/app/components/Navbar/index.tsx +++ b/app/components/Navbar/index.tsx @@ -1,4 +1,6 @@ import { Link, useNavigate } from "@remix-run/react"; +import Bowser from "bowser"; +import InAppSpy from "inapp-spy"; import { LogOut, Tickets, UserIcon, VenetianMaskIcon } from "lucide-react"; import { useMemo, useState } from "react"; @@ -25,6 +27,14 @@ export const Navbar = () => { const myProfile = useMyProfileQuery({ skip: !isLogged || !isAuthReady, }); + + const [{ isInApp }] = useState(() => InAppSpy()); + const browser = Bowser.getParser(window.navigator.userAgent); + const isMobileSafari = browser.satisfies({ + mobile: { + safari: ">=9", + }, + }); const isSafariMobileWebview = useIsSafariMobileWebview(); const { impersonation, setImpersonation } = useAuthContext(); @@ -97,7 +107,7 @@ export const Navbar = () => { ], }, { - content: "Login", + content: `Login — ${JSON.stringify({ isInApp, isMobileSafari, isSafariMobileWebview })}`, link: urls.login, fullLink: isSafariMobileWebview ? `x-safari-https://tickets.communityos.io/${urls.login}` @@ -111,6 +121,8 @@ export const Navbar = () => { isLogged, impersonation, myProfile?.data?.me?.isSuperAdmin, + isInApp, + isMobileSafari, isSafariMobileWebview, setImpersonation, navigate, diff --git a/app/components/useIsSafariMobile.ts b/app/components/useIsSafariMobile.ts index 9ee48bf..1e8f10f 100644 --- a/app/components/useIsSafariMobile.ts +++ b/app/components/useIsSafariMobile.ts @@ -1,14 +1,11 @@ -import Bowser from "bowser"; import InAppSpy from "inapp-spy"; import { useMemo, useState } from "react"; export const useIsSafariMobileWebview = () => { const [isInApp] = useState(() => InAppSpy()); - const browser = Bowser.getParser(window.navigator.userAgent); - const isMobileSafari = browser.satisfies({ - mobile: { - safari: ">=9", - }, - }); + const ua = window.navigator.userAgent; + const iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i); + const webkit = !!ua.match(/WebKit/i); + const isMobileSafari = iOS && webkit && !ua.match(/CriOS/i); return useMemo(() => isInApp && isMobileSafari, [isInApp, isMobileSafari]); };