import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Dialog, DialogBody, DialogContent, DialogHeader, DialogTitle } from "../../../dialog";
import { useMemo } from "react";
import { format } from "date-fns";
import { UTCDateMini } from "@date-fns/utc";
function getTimeString(timestamp) {
    const date = format(new UTCDateMini(timestamp), "MMM dd");
    const time = format(new UTCDateMini(timestamp), "h:mm aa");
    return `${time} (UTC) on ${date}`;
}
export function MaintenanceDialog({ brokerName, endTime, open, onOpenChange }) {
    const endDate = useMemo(()=>{
        return getTimeString(endTime);
    }, [
        endTime
    ]);
    return /*#__PURE__*/ _jsx(Dialog, {
        open: open,
        children: /*#__PURE__*/ _jsxs(DialogContent, {
            closable: false,
            children: [
                /*#__PURE__*/ _jsx(DialogHeader, {
                    children: /*#__PURE__*/ _jsx(DialogTitle, {
                        className: "orderly-text-xs  orderly-font-semibold desktop:!orderly-text-base",
                        children: "System upgrade in progress"
                    })
                }),
                /*#__PURE__*/ _jsx(DialogBody, {
                    children: /*#__PURE__*/ _jsxs("div", {
                        className: "orderly-flex orderly-gap-1 orderly-font-semibold orderly-text-base-contrast-54 orderly-pt-5 orderly-text-2xs desktop:!orderly-text-xs",
                        children: [
                            "Sorry, ",
                            brokerName,
                            " is temporarily unavailable due to a scheduled upgrade. The service is expected to be back by ",
                            endDate,
                            "."
                        ]
                    })
                })
            ]
        })
    });
}

//# sourceMappingURL=maintenanceDialog.js.map