import { useSiteStore } from "@/Stores"; import { observer } from "mobx-react-lite"; import { useTranslations } from "next-intl"; import { Button, Col, Modal, Row } from "reactstrap"; export default observer(() => { const { isConfigureOpened, setConfigureOpened, saveTraffic, setSaveTraffic, autoEnterNotify, setAutoEnterNotify, autoEnterDefault, setAutoEnterDefault, autoEnterPlatform, setAutoEnterPlatform, } = useSiteStore(); const t = useTranslations(); return ( <Modal isOpen={isConfigureOpened} toggle={() => { window.localStorage.setItem("saveTraffic", saveTraffic.toString()); window.localStorage.setItem( "autoEnterNotify", autoEnterNotify.toString(), ); window.localStorage.setItem( "autoEnterDefault", autoEnterDefault.toString(), ); window.localStorage.setItem( "autoEnterPlatform", autoEnterPlatform.toString(), ); setConfigureOpened(false); }} centered > <Row className="justify-content-center g-0"> <Col className="m-1" xs="auto"> <Button color={saveTraffic ? "success" : "danger"} onClick={() => { setSaveTraffic(!saveTraffic); }} > {t("siteSaveTraffic")} </Button> </Col> </Row> <Row className="justify-content-center g-0"> <Col className="m-1" xs="auto"> <Button color={autoEnterNotify ? "success" : "danger"} onClick={() => { setAutoEnterNotify(!autoEnterNotify); }} > {t("siteAutoEnterNotify")} </Button> </Col> <Col className="m-1" xs="auto"> <Button color={autoEnterDefault ? "success" : "danger"} onClick={() => { setAutoEnterDefault(!autoEnterDefault); }} > {t("siteAutoEnterDefault")} </Button> </Col> <Col className="m-1" xs="auto"> <Button color={autoEnterPlatform ? "success" : "danger"} onClick={() => { setAutoEnterPlatform(!autoEnterPlatform); }} > {t("siteAutoEnterPlatform")} </Button> </Col> </Row> </Modal> ); });