import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
import React from "react";
import { Flex, Button, Text, Stack, Image, HStack } from "@chakra-ui/react";
import { CloseIcon } from "@chakra-ui/icons";
import { RuntimeContext } from "@qorebase/app-component";
function getWindowDimensions() {
    if (typeof window === "undefined")
        return { width: 0, height: 0 };
    const { innerWidth: width, innerHeight: height } = window;
    return {
        width,
        height,
    };
}
function useWindowDimensions() {
    const [windowDimensions, setWindowDimensions] = React.useState(getWindowDimensions());
    React.useEffect(() => {
        function handleResize() {
            setWindowDimensions(getWindowDimensions());
        }
        window.addEventListener("resize", handleResize);
        return () => window.removeEventListener("resize", handleResize);
    }, []);
    return windowDimensions;
}
export default function InAppInstalPromotion() {
    var _a, _b;
    const [deferredPrompt, setDeferredPrompt] = React.useState(null);
    const { width } = useWindowDimensions();
    const projectData = RuntimeContext.useSelectState((state) => state);
    const projectTheme = (_b = (_a = projectData.theme) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.primaryColor;
    const [isOpenInstalPromotion, setIsOpenInstallPromotion] = React.useState(false);
    React.useEffect(() => {
        window.addEventListener("beforeinstallprompt", (e) => {
            setIsOpenInstallPromotion(true);
            e.preventDefault();
            setDeferredPrompt(e);
        });
        window.addEventListener("appinstalled", () => {
            console.log("INSTALL: Success");
        });
    }, []);
    const handleInstallClick = () => {
        setIsOpenInstallPromotion(false);
        if (deferredPrompt) {
            deferredPrompt.prompt();
            deferredPrompt.userChoice.then((choiceResult) => {
                if (choiceResult.outcome === "accepted") {
                    console.log("User accepted the install prompt");
                }
                else {
                    console.log("User dismissed the install prompt");
                }
            });
        }
    };
    return (_jsx(_Fragment, { children: isOpenInstalPromotion && (_jsx(Flex, Object.assign({ minW: width < 768 ? "full" : "inherit", h: "auto", m: width < 768 ? "0" : "5", position: "fixed", bottom: 0, left: width < 768 ? "0" : "45%", rounded: width < 768 ? "sm" : "md", overflow: "hidden", flexDir: "column", bg: "brand.900", opacity: "98%", color: projectTheme === "#ffffff" ? "black" : "white", p: "5" }, { children: _jsxs(HStack, Object.assign({ alignItems: "flex-start", w: "100%", justifyContent: "space-between" }, { children: [_jsx(Image, { borderRadius: "full", boxSize: "65px", src: projectData.icon, alt: "App Icon", fallbackSrc: "https://via.placeholder.com/150" }), _jsxs(Stack, Object.assign({ textAlign: "left", w: "62%", px: "4" }, { children: [_jsx(Text, Object.assign({ fontSize: "md", fontWeight: "bold", color: projectTheme === "#ffffff" ? "black" : "white", p: "0", mt: "-2" }, { children: projectData === null || projectData === void 0 ? void 0 : projectData.name })), _jsx(Text, Object.assign({ fontSize: "xs", color: projectTheme === "#ffffff" ? "black" : "white", noOfLines: 2 }, { children: window.location.origin })), _jsx(Flex, Object.assign({ w: "100%", display: "flex", justifyContent: "flex-start" }, { children: _jsx(Button, Object.assign({ variant: "outline", className: "install-button", rounded: "sm", size: "xs", height: "30px", onClick: () => handleInstallClick(), color: projectTheme === "#ffffff" ? "black" : "white", mt: "2" }, { children: "ADD TO HOMESCREEN" })) }))] })), _jsx(Stack, Object.assign({ w: "10%", alignItems: "flex-end" }, { children: _jsx(CloseIcon, { w: 3, h: 3, color: "gray.200", onClick: () => setIsOpenInstallPromotion(false) }) }))] })) }))) }));
}
//# sourceMappingURL=InAppInstalPromotion.js.map