diff --git a/src/app/page.tsx b/src/app/page.tsx index 0079475..262155b 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -11,6 +11,7 @@ import Contact from "@/components/Contact"; import PortfolioCart from "@/components/Projects/PortfolioCart"; import Socials from "@/components/Socials"; import DarkToggle from "@/components/DarkToggle"; +import AddToHomeScreenButton from "@/components/AddHome"; let prevScrollPos: number = typeof window !== "undefined" ? window.scrollY : 0; @@ -36,7 +37,7 @@ export default function Home() { return ( <> {/* */} - + {/* */} {/* */} diff --git a/src/components/AddHome.tsx b/src/components/AddHome.tsx new file mode 100644 index 0000000..3614727 --- /dev/null +++ b/src/components/AddHome.tsx @@ -0,0 +1,30 @@ +"use client"; +import { useEffect, useState } from "react"; + +export default function AddToHomeScreenButton() { + const [installPrompt, setInstallPrompt] = useState(); + + useEffect(() => { + const installHandler = (event: Event) => { + event.preventDefault(); + setInstallPrompt(event); + }; + + window.addEventListener("beforeinstallprompt", installHandler); + + return () => + window.removeEventListener("beforeinstallprompt", installHandler); + }); + + const onClick = async () => { + if (!installPrompt) return; + await installPrompt.prompt(); + setInstallPrompt(false); + }; + + return ( + + ); +}