import { o as e, P as r, F as i, s as t, D as o, t as a, p as d, v as s } from "./antd-04a23d13.js";
import { b as n, H as l, P as p, A as c, a as f, c as h } from "./materialUtils-79f50233.js";
import { cr as g, fk as m, dW as u, fr as x, fs as b, ft as y, fu as v, dV as k, fv as j, fw as w, fx as C, fy as A, av as S, fz as $, fA as I, fB as T, fC as M, fD as _, eN as E, fE as B, fF as R, fG as z, fH as D, fI as H, fJ as P, fK as L, fL as N, fM as O, fN as U, e2 as V, fO as F, fP as W, fQ as Y, fR as q, fS as G, fT as J, fU as K, fV as Q, fW as X, fX as Z, fY as ee } from "./index-f50c05c4.js";
import { useContext as re, useState as ie, useRef as te, useEffect as oe, useMemo as ae } from "react";
import { lR as de, lS as se, lA as ne, nf as le, ng as pe, nh as ce, ni as fe, nj as he } from "./ant-design-icons-b1480d8d.js";
import { d as ge } from "./dayjs-844325ae.js";
import { d as me, l as ue } from "./styled-components-1e696d6b.js";
import { g as xe } from "./enterpriseSelectors-1897ddd8.js";
import "react-dom";
import "./alasql-0ff6dabf.js";
import "./lodash-f1e42446.js";
import "./crypto-js-d5eac8ba.js";
import "./customerService-f3231f11.js";
import "./redux-saga-5514e228.js";
import "./folderSelector-82f1bcf3.js";
import "./loglevel-6fb66d22.js";
import "./axios-84bb1c75.js";
import "./redux-devtools-d38e5b33.js";
import "./react-router-a1807b5b.js";
import "./fontawesome-2445f580.js";
import "./dnd-kit-56a2f36f.js";
import "./numbro-c1edb412.js";
import "./papaparse-1bac8e5f.js";
import "./uuid-82f303b2.js";
import "./supabase-c27c62e3.js";
import "./fetch-a3c8ad94.js";
import "./react-draggable-60f59f09.js";
import "./remark-gfm-f2973785.js";
import "./buffer-d3713d77.js";
import "./rehype-raw-41b6145f.js";
import "./parse5-6476676e.js";
import "./rehype-sanitize-deb53e9a.js";
import "./simplebar-react-e1b123a3.js";
import "./react-best-gradient-color-picker-4dd60dac.js";
import "./ua-parser-js-094f59ba.js";
import "./clsx-469c2c43.js";
import "./codemirror-73d8c217.js";
import "./really-relaxed-json-49b6a70d.js";
import "./immer-c0428a8d.js";
import "./hotkeys-js-0dddb21a.js";
import "./cnchar-5678e6bc.js";
import "./react-documents-eb6de859.js";
import "./sql-formatter-69e8df59.js";
import "./rc-trigger-5125aafe.js";
import "./react-json-view-9403d8a1.js";
import "./qrcode-react-cb73d2b6.js";
import "./katex-a34f0265.js";
import "./ecogis-maps-bb0d63f9.js";
import "./devextreme-2fa5bb9a.js";
const { Countdown: be } = s, { Text: ye } = a, ve = me.a`
  display: flex;
  align-items: center;
  margin-right: 12px;
`, ke = me(G)`
  min-width: 24px;
  max-width: 24px;
`, je = ue`
  &:hover {
    background-color: #8b8fa34c;
  }

  & g g {
    stroke: ${(e2) => e2.$show ? "#dddddd" : "#dddddd65"};
  }

  &:hover g g {
    stroke: #ffffff;
  }

  cursor: pointer;
`;
me(J)`
  ${je}
`;
const we = me(K)`
  ${je}
`, Ce = me(Q)`
  ${je}
  & g line {
    stroke: ${(e2) => e2.$show ? "#dddddd" : "#dddddd65"};
  }

  &:hover g line {
    stroke: #ffffff;
  }

  & g rect {
    stroke: ${(e2) => e2.$show ? "#dddddd" : "#dddddd65"};
  }

  &:hover g rect {
    stroke: #ffffff;
  }
`, Ae = me(X)`
  ${je}
`, Se = me.div`
  width: 28px;
  height: 28px;
  border-radius: 4px;
  overflow: hidden;

  ${(e2) => e2.disabled && "\n    svg {\n       pointer-events: none;\n       g g {\n         stroke: #dddddd30;\n       }\n    }\n    cursor: not-allowed;  \n  "}
`, $e = me(H)`
  padding: 4px 12px;
  height: 28px;
  background: #4965f2;
  border-radius: 4px 0 0 4px;
`, Ie = me.div`
  margin-left: 14px;
  display: flex;
  gap: 8px;
`, Te = me(H)`
  padding: 4px 7px;
  height: 28px;

  &:disabled,
  &:disabled:hover {
    background: #4965f2;
    border: 1px solid #4965f2;
    color: #ffffff;
    opacity: 0.35;
  }
`, Me = me(H)`
  padding: 4px 7px;
  height: 28px;
  margin-right: 4px;
`, _e = me(H)`
  &&& {
    color: #ffffff;
    background: #8b8fa34c;
    border: none;
    height: 28px;
    padding: 4px 13px;
    margin-right: 8px;
    cursor: pointer;
    --antd-wave-shadow-color: #8b8fa34c;

    &:hover {
      background: #666666;
      color: #ffffff;
      border: none;
    }

    &:focus {
      background: #666666;
      color: #ffffff;
      border: none;
    }

    &[disabled] {
      cursor: not-allowed;
    }
  }
`, Ee = me.span`
  font-size: 12px;
  color: #b8b9bf;
  line-height: 12px;
  margin-left: -22px;
`;
me(V)`
  transform: rotate(180deg);
  margin-left: 4px;
  min-width: 18px;

  path {
    fill: #ffffff;
  }
`;
const Be = me(H)`
  padding: 0;
  width: 28px;
  height: 28px;
  border-radius: 0 4px 4px 0;
  margin-right: 24px;
  margin-left: 1px;

  svg {
    transform: rotate(180deg);
    width: 18px;

    path {
      fill: #ffffff;
    }
  }

  &.ant-dropdown-open {
    background-color: #3a51c2;
    border-color: #3a51c2;
  }
`;
me(o)`
  &.ant-dropdown-open {
    background-color: #8b8fa34c;
  }
`;
const Re = me.div`
  .taco-edit-text-wrapper {
    width: fit-content;
    max-width: 288px;
  }

  input {
    width: 288px;
    border-radius: 4px;
  }
`;
me.div`
  display: inline-flex;
  align-items: center;
  margin-right: 4px;

  &.module svg {
    visibility: visible;
  }
`;
const ze = me.div`
  display: flex;
  align-items: center;
  background-color: #ffe6e6; /* Light red background for warning */
  padding: 2px 8px;
  border-radius: 5px;
  margin-right: 8px;
`, De = me.span`
  margin-left: 8px;
  font-size: 12px;
  color: #ff4d4f; /* Red color to indicate warning */
`, He = me(he)`
  margin-left: 8px;
  font-size: 16px;
  color: #ff4d4f; /* Red color for the icon */
`, Pe = me(be)`
  .ant-statistic-content {
    color: #ff4d4f;
    margin-top: 2px;
    text-align: center;
  }
`, Le = me(Z)`
  width: 16px !important;
  height: 16px !important;
  margin-right: -3px !important;

  > g > g {
    stroke: white;
  }
`, Ne = me.h3`
  display: inline-flex;
  align-items: center;
  margin: 5px;
  color: white;
`, Oe = me(ee)`
  .ant-dropdown-menu-item:hover {
    background: ${(e2) => e2.disabled ? "inherit" : "#edf4fa"};
    cursor: ${(e2) => e2.disabled ? "not-allowed" : "pointer"};
  }
`, Ue = me.img`
  height: 28px;
`;
function Ve(e2) {
  const { user: r2 } = e2;
  return u(F) ? ne(d.Avatar, { shape: "circle", size: 28 }) : ne("div", { children: r2.isAnonymous ? ne(Me, { buttonType: "primary", onClick: () => $.push(W), children: S("userAuth.login") }) : ne(h, { user: r2, profileSide: 28, fontSize: 12 }) });
}
const Fe = () => ge().add(3, "minutes").toISOString();
function We(a2) {
  var _a, _b, _c, _d;
  const d2 = re(g), { blockEditing: s2, fetchApplication: h2 } = re(m), { togglePanel: F2 } = a2, { left: W2, bottom: G2, right: J2 } = a2.panelStatus, K2 = u(x), Q2 = u(b), X2 = u(y), Z2 = v(), [ee2, he2] = ie(""), me2 = k(), ue2 = u(j), { selectedSnapshot: be2, isArchivedSnapshot: ke2 } = u(w), je2 = u(xe), { appType: Me2 } = re(m), [Ne2, We2] = ie(false), [Ye2, qe] = ie(false), [Ge, Je] = ie(false), [Ke, Qe] = ie(), [Xe, Ze] = ie(false), er = te(Fe()), rr = Me2 === Y.Module;
  oe(() => {
    s2 && Q2 && Boolean(Q2 == null ? void 0 : Q2.editingUserId) && C.getUserDetail(Q2.editingUserId).then((e2) => {
      A(e2) && Qe(e2.data.data);
    });
  }, [s2]), S("header.editorMode_layout"), S("header.editorMode_layout_tooltip"), S("header.editorMode_logic"), S("header.editorMode_logic_tooltip"), S("header.editorMode_both");
  oe(() => {
    (async (e2) => {
      const r2 = await q.getAppSlug(e2);
      200 === r2.status ? r2.data.data.applicationInfoView.slug && he2(r2.data.data.applicationInfoView.slug) : he2("");
    })(Z2);
  }, [Z2]);
  const ir = de(se, { children: [ne(ve, { onClick: () => $.push(I), children: ((_a = je2 == null ? void 0 : je2.config_set) == null ? void 0 : _a.logo) ? Boolean(je2 == null ? void 0 : je2.orgId) ? ne(Ue, { src: n((_b = je2 == null ? void 0 : je2.config_set) == null ? void 0 : _b.logo) }) : ne(Ue, { src: (_c = je2 == null ? void 0 : je2.config_set) == null ? void 0 : _c.logo }) : ne(T, {}) }), Ne2 ? ne(Re, { children: ne(M, { prefixIcon: rr && ne(_, {}), disabled: ue2, style: ue2 ? { maxWidth: "fit-content" } : {}, text: (Q2 == null ? void 0 : Q2.name) ?? "", editing: Ye2, onFinish: (e2) => {
    e2.trim() ? (me2(B({ applicationId: Z2, name: e2 })), We2(false)) : E.warning(S("header.nameCheckMessage"));
  } }) }) : ne(l, { setEdit: () => {
    We2(true), qe(true);
  } }), ue2 && ne(Ee, { children: S("header.viewOnly") })] }), tr = ae(() => X2 ? null : de(se, { children: [ne(e, { options: [{ value: "mobile", icon: ne(le, {}) }, { value: "tablet", icon: ne(pe, {}) }, { value: "desktop", icon: ne(ce, {}) }], value: d2.deviceType, onChange: (e2) => {
    d2.setDeviceType(e2);
  } }), "desktop" !== d2.deviceType && ne(e, { options: [{ value: "portrait", label: "Portrait" }, { value: "landscape", label: "Landscape" }], value: d2.deviceOrientation, onChange: (e2) => {
    d2.setDeviceOrientation(e2);
  } }), ne(_e, { onClick: () => {
    var _a2;
    (_a2 = d2.saveCurrentLayout) == null ? void 0 : _a2.call(d2);
  }, disabled: s2, children: S("saveLayout") })] }), [X2, d2.deviceType, d2.deviceOrientation]), or = de(se, { children: [tr, ne(Se, { children: ne(we, { onClick: () => F2("left"), $show: W2 }) }), ne(Se, { children: ne(Ce, { onClick: () => F2("bottom"), $show: G2 }) }), ne(Se, { disabled: ue2, children: ne(Ae, { onClick: () => F2("right"), $show: J2 }) }), ue2 && de(Ie, { children: [ne(Te, { disabled: !be2, buttonType: "primary", onClick: () => {
    Q2 && be2 && R.confirm({ title: S("header.recoverAppSnapshotTitle"), content: S("header.recoverAppSnapshotContent", { time: ge(be2.createTime).format("YYYY-MM-DD HH:mm") }), onConfirm: () => {
      me2(z(Q2.applicationId, be2.snapshotId, be2.createTime, ke2));
    } });
  }, children: S("header.recoverAppSnapshotMessage") }), ne(_e, { onClick: () => me2(D(false)), children: S("header.returnEdit") })] })] }), ar = ae(() => ue2 ? ne(Ve, { user: K2 }) : de(se, { children: [s2 && Boolean(Z2) && ne(se, { children: ne(r, { style: { width: 200 }, content: () => de(i, { vertical: true, gap: 10, align: "center", style: { maxWidth: "250px" }, children: [ne(ye, { style: { textAlign: "center" }, children: S("header.AppEditingBlockedHint") }), ne(Pe, { title: S("header.AppEditingBlocked"), value: er.current, onFinish: () => {
    Ze(true);
  } }), ne(t, { title: S("header.AppEditingBlockedMessage"), placement: "bottom", children: de(H, { style: { width: "100%" }, buttonType: "primary", disabled: s2 && !Xe, onClick: () => {
    h2 == null ? void 0 : h2(), Ze(false), er.current = Fe();
  }, children: [ne(Le, {}), ne("span", { children: S("header.AppEditingBlockedCheckStatus") })] }) })] }), trigger: "hover", children: de(ze, { children: [ne(p, { source: K2.avatarUrl, userName: K2.username, side: 24 }), ne(De, { children: `${(Ke == null ? void 0 : Ke.email) || S("header.AppEditingBlockedSomeone")} ` + S("header.AppEditingBlockedMessageSnipped") }), ne(He, {})] }) }) }), Boolean(Z2) && ne(c, { applicationId: Z2, visible: Ge, onVisibleChange: (e2) => !e2 && Je(false) }), P(K2, Q2) && ne(_e, { onClick: () => Je(true), disabled: s2, children: L }), ne($e, { buttonType: "primary", onClick: () => N(Z2), children: S("header.preview") }), ne(o, { className: "cypress-header-dropdown", placement: "bottomRight", trigger: ["click"], popupRender: () => ne(Oe, { style: { minWidth: "110px", borderRadius: "4px" }, onClick: (e2) => {
    s2 || ("deploy" === e2.key ? me2(O({ applicationId: Z2, slug: ee2 })) : "snapshot" === e2.key && me2(D(true)));
  }, items: [{ key: "deploy", label: de("div", { style: { display: "flex", alignItems: "center" }, children: [s2 && ne(fe, { style: { marginRight: "8px" } }), ne(U, { style: { color: s2 ? "#ccc" : "#222" }, children: S("header.deploy") })] }), disabled: s2 }, { key: "snapshot", label: de("div", { style: { display: "flex", alignItems: "center" }, children: [s2 && ne(fe, { style: { marginRight: "8px" } }), ne(U, { style: { color: s2 ? "#ccc" : "#222" }, children: S("header.snapshot") })] }), disabled: s2 }] }), children: ne(Be, { buttonType: "primary", disabled: s2, children: ne(V, {}) }) }), ne(Ve, { user: K2 })] }), [K2, ue2, Z2, Ge, s2, Xe, Ke == null ? void 0 : Ke.name, ee2]);
  return ne(f, { headerStart: ir, headerMiddle: or, headerEnd: ar, style: { backgroundColor: (_d = je2 == null ? void 0 : je2.config_set) == null ? void 0 : _d.appHeaderColor } });
}
function Ye() {
  var _a, _b, _c;
  const e2 = u(x), r2 = u(xe), i2 = ne(ve, { onClick: () => $.push(I), children: ((_a = r2 == null ? void 0 : r2.config_set) == null ? void 0 : _a.logo) ? ne(Ue, { src: n((_b = r2 == null ? void 0 : r2.config_set) == null ? void 0 : _b.logo) }) : de(se, { children: [ne(ke, { branding: true }), ne(Ne, { children: "VNPT Composable Platform" })] }) });
  return ne(f, { headerStart: i2, headerEnd: ne(Ve, { user: e2 }), style: { backgroundColor: ((_c = r2 == null ? void 0 : r2.config_set) == null ? void 0 : _c.appHeaderColor) || "#0066b3" } });
}
export {
  Ye as AppHeader,
  We as default
};
