import React, {FC} from "react";
import {PopupWindow} from "../PopupWindow";
import {useAtom} from "jotai";
import {getDefaultClosedProUpgradePopupWindowState, ProUpgradePopupWindowIsOpen} from "./atoms";
import {getProUpgradeLabel, NonImplementedMessage, openProUpgradePage} from "./actions/NonImplementedMessage";
import {__} from "../globals";

export type ProUpgradePopupWindowProps = {}

export const ProUpgradePopupWindow: FC<ProUpgradePopupWindowProps> = ({}) => {
    const [popupWindowState, setPopupWindowState] = useAtom(ProUpgradePopupWindowIsOpen)
    const content = popupWindowState.content ?? (() => <NonImplementedMessage />)
    const title = popupWindowState.title ?? __('Do more with Pro')
    const hasCustomContent = !!popupWindowState.content

    return <PopupWindow id="pro-upgrade-popup"
                        isOpen={popupWindowState.isOpen}
                        screens={[
                            {
                                id: 1,
                                title,
                                icon: popupWindowState.icon,
                                description: undefined,
                                content,
                                showBottomNavigation: hasCustomContent,
                                primaryBottom: () => ({
                                    label: getProUpgradeLabel(),
                                    onClick: openProUpgradePage,
                                }),
                            }
                        ]}
                        screenId={1}
                        defaultScreenId={1}
                        setCurrentScreenId={() => {}}
                        onClose={() => setPopupWindowState(getDefaultClosedProUpgradePopupWindowState())}
    />
}