import { __awaiter } from "tslib";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
import { Box, Button, Flex, HStack, Modal, ModalBody, ModalContent, ModalHeader, ModalOverlay, Text, VStack, Image, useDisclosure, } from "@chakra-ui/react";
import { useRouter } from "next/router";
import React from "react";
import qoreStorageClient from "../../hooks/qoreStorageClient";
import EditorContext from "@qorebase/app-runtime/src/EditorContext";
const DangerZone = () => {
    const router = useRouter();
    const { isOpen, onOpen, onClose } = useDisclosure();
    const revisionID = EditorContext.useSelectState((state) => state.revisionID);
    const deleteApp = qoreStorageClient.table("applications").useDeleteRow();
    const deleteRevision = qoreStorageClient.table("revisions").useDeleteRow();
    const deleteDomain = qoreStorageClient.table("domains").useDeleteRow();
    const appDomains = qoreStorageClient.table("domains").useListRow({
        condition: {
            $and: [
                {
                    appdomain: {
                        $eq: router.query.projectID,
                    },
                },
            ],
        },
    });
    const handleDeleteApp = React.useCallback(() => {
        return Promise.all([
            deleteApp.deleteRow(router.query.appID),
            deleteRevision.deleteRow(revisionID),
            ...appDomains.data.map((domain) => deleteDomain.deleteRow(domain.id)),
        ]);
    }, [
        deleteApp,
        deleteRevision,
        deleteDomain,
        revisionID,
        router.query.appID,
        appDomains,
    ]);
    return (_jsxs(_Fragment, { children: [_jsxs(Box, { children: [_jsx(Text, Object.assign({ color: "red.500", fontSize: "lg", mb: "2" }, { children: "Danger Zone" })), _jsx(Box, Object.assign({ border: "2px solid", borderColor: "red.500", p: "4", rounded: "lg" }, { children: _jsxs(Flex, Object.assign({ justifyContent: "space-between", alignItems: "center" }, { children: [_jsxs(Box, Object.assign({ fontWeight: "normal" }, { children: [_jsx(Text, Object.assign({ fontWeight: "bold" }, { children: "Delete this app" })), _jsx(Text, Object.assign({ color: "gray.600" }, { children: "Once deleted, it will be gone forever. Please be certain." }))] })), _jsx(Button, Object.assign({ variant: "solid", colorScheme: "red", onClick: onOpen, size: "sm" }, { children: "Delete this app" }))] })) }))] }), _jsxs(Modal, Object.assign({ isOpen: isOpen, onClose: onClose, isCentered: true }, { children: [_jsx(ModalOverlay, {}), _jsxs(ModalContent, { children: [_jsx(ModalHeader, Object.assign({ mt: "16px" }, { children: _jsxs(VStack, Object.assign({ gap: "2" }, { children: [_jsx(Image, { src: "/assets/ilustration/delete.svg", alt: "Delete" }), _jsx(Text, Object.assign({ fontSize: "lg" }, { children: "Delete this app?" }))] })) })), _jsxs(ModalBody, { children: [_jsx(Text, Object.assign({ align: "center" }, { children: "This action delete cannot be undone. Please, make sure once again. Do you really need delete this app?" })), _jsxs(HStack, Object.assign({ mt: "32px", mb: "10px" }, { children: [_jsx(Button, Object.assign({ w: "full", variant: "outline", onClick: onClose, size: "sm" }, { children: "Cancel" })), _jsx(Button, Object.assign({ size: "sm", w: "full", bgColor: "#DE220B", color: "white", onClick: () => __awaiter(void 0, void 0, void 0, function* () {
                                                    yield handleDeleteApp();
                                                    router.push("/apps/project/[projectID]", `/apps/project/${router.query.projectID}`);
                                                }) }, { children: "Delete, anyway" }))] }))] })] })] }))] }));
};
export default DangerZone;
//# sourceMappingURL=DangerZone.js.map