(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol.
Something went wrong. Try again.
1.5 kB · 52 lines
JSX
at ui-refactor
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253import { useState } from "react";import { X } from "lucide-react";import { SiApple } from "react-icons/si";
function shouldShowBanner() { if (typeof window === "undefined") return false; const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent); if (!isIOS) return false;
const dismissedAt = localStorage.getItem("ios-shortcut-dismissed"); const daysSinceDismissed = dismissedAt ? (Date.now() - parseInt(dismissedAt, 10)) / (1000 * 60 * 60 * 24) : Infinity; return daysSinceDismissed > 7;}
export default function IOSInstallBanner() { const [show, setShow] = useState(shouldShowBanner);
const handleDismiss = () => { setShow(false); localStorage.setItem("ios-shortcut-dismissed", Date.now().toString()); };
if (!show) return null;
return ( <div className="ios-shortcut-banner"> <button className="ios-shortcut-banner-close" onClick={handleDismiss} aria-label="Dismiss" > <X size={14} /> </button> <div className="ios-shortcut-banner-content"> <div className="ios-shortcut-banner-text"> <p>Save pages directly from Safari</p> </div> <a href="https://www.icloud.com/shortcuts/21c87edf29b046db892c9e57dac6d1fd" target="_blank" rel="noopener noreferrer" className="ios-shortcut-banner-btn" > <SiApple size={14} /> Get iOS Shortcut </a> </div> </div> );}