@feedmepos/mf-connect 0.1.113-prod → 0.1.114-dev

package/dist/WhatsappBot-o5b_0CnB.js

@@ -0,0 +1,629 @@
+import { defineComponent as Q, ref as b, computed as j, watch as Z, onBeforeUnmount as Y, resolveComponent as B, openBlock as n, createElementBlock as u, createElementVNode as o, normalizeClass as O, unref as t, toDisplayString as s, createBlock as k, withCtx as C, createTextVNode as z, createVNode as T, createCommentVNode as D, Fragment as J, renderList as q, useModel as ee } from "vue";
+import { u as K } from "./vue-i18n-C6c2jsH3.js";
+import { useRouter as te } from "vue-router";
+import { useCoreStore as oe } from "@feedmepos/mf-common";
+import { S as N, a as ne } from "./index-03WIXl-H.js";
+import { w as G } from "./index-ZRE89TKq.js";
+import { u as ae, _ as se, w as le } from "./WhatsappNotificationGroupDialog.vue_vue_type_script_setup_true_lang-Cytrffdh.js";
+import { R as M } from "./app-DV3e2LkD.js";
+import { _ as re } from "./WhatsappAccountStatusLabel.vue_vue_type_script_setup_true_lang-BrZEDi6O.js";
+import { b as ce } from "./browser-BSAOEeIM.js";
+const ie = { class: "min-w-0" }, ue = { class: "flex items-center gap-[12px]" }, pe = ["src"], de = { key: 1 }, me = { class: "min-w-0 flex-1" }, fe = ["title"], xe = { key: 1 }, ve = { class: "text-[14px] leading-[20px] text-fm-color-typo-secondary break-all" }, he = { class: "relative z-10 shrink-0" }, _e = ["aria-label", "title", "aria-expanded", "disabled", "aria-busy"], ge = { class: "text-[14px] text-fm-color-typo-error" }, ye = { class: "flex items-center justify-between flex-wrap gap-[8px] border-t border-fm-color-neutral-gray-100 pt-[12px]" }, be = {
+  key: 0,
+  class: "text-[12px] text-fm-color-typo-tertiary"
+}, we = {
+  key: 0,
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, ke = /* @__PURE__ */ Q({
+  __name: "WhatsappAccountCard",
+  props: {
+    account: {}
+  },
+  emits: ["removed"],
+  setup(E, { emit: i }) {
+    const l = E, w = i, { t: _, locale: d } = K(), r = b(!1), x = b(""), y = b(!1), A = b(!1);
+    let g;
+    const {
+      name: $,
+      phoneNumber: V,
+      initials: P,
+      state: v,
+      avatarColor: p,
+      profilePictureUrl: h,
+      profilePictureFailed: c
+    } = ae(() => l.account), I = j(() => v.value === "connected"), R = j(() => ({
+      name: M["$connect-WHATSAPP_ACCOUNT"],
+      params: { clientId: l.account.clientId }
+    }));
+    function S(a) {
+      return new Intl.DateTimeFormat(d.value, {
+        year: "numeric",
+        month: "short",
+        day: "numeric"
+      }).format(new Date(a));
+    }
+    async function W() {
+      if (r.value) return;
+      const a = N.getBusinessId();
+      if (!a) {
+        x.value = _("connect.whatsappBot.errors.selectBusiness");
+        return;
+      }
+      const e = l.account.clientId, m = new AbortController();
+      g = m, r.value = !0, x.value = "";
+      try {
+        await G.deleteClient(a, e, m.signal), m.signal.aborted || w("removed", e);
+      } catch {
+        m.signal.aborted || (x.value = _("connect.whatsappBot.errors.removeAccount"));
+      } finally {
+        g === m && (g = void 0, r.value = !1);
+      }
+    }
+    function F() {
+      g == null || g.abort(), g = void 0, r.value = !1, x.value = "";
+    }
+    return Z(
+      () => N.getBusinessId(),
+      () => {
+        F(), A.value = !1;
+      }
+    ), Y(F), (a, e) => {
+      const m = B("RouterLink"), L = B("FmCircularProgress"), U = B("FmIcon"), H = B("FmMenuItem"), X = B("FmMenu");
+      return n(), u("li", ie, [
+        o("div", {
+          class: O(["relative h-full border border-fm-color-neutral-gray-100 rounded-[16px] p-[20px] flex flex-col gap-[16px] bg-fm-color-neutral-white text-fm-color-typo-primary", {
+            "cursor-pointer transition-shadow hover:border-fm-color-neutral-gray-200 hover:fm-shadow-light-100": I.value
+          }])
+        }, [
+          o("div", ue, [
+            o("div", {
+              "aria-hidden": "true",
+              class: O(["w-[48px] h-[48px] rounded-full overflow-hidden shrink-0 flex items-center justify-center text-[16px] font-semibold text-fm-color-typo-white", t(p)])
+            }, [
+              t(h) && !t(c) ? (n(), u("img", {
+                key: 0,
+                src: t(h),
+                alt: "",
+                class: "w-full h-full object-cover",
+                referrerpolicy: "no-referrer",
+                onError: e[0] || (e[0] = (f) => c.value = !0)
+              }, null, 40, pe)) : (n(), u("span", de, s(t(P)), 1))
+            ], 2),
+            o("div", me, [
+              o("h2", {
+                class: "text-[16px] leading-[24px] font-semibold truncate",
+                title: t($)
+              }, [
+                I.value ? (n(), k(m, {
+                  key: 0,
+                  to: R.value,
+                  class: "text-inherit no-underline after:absolute after:inset-0 after:rounded-[16px] focus-visible:outline-none focus-visible:after:ring-[2px] focus-visible:after:ring-fm-color-primary focus-visible:after:ring-offset-[2px]"
+                }, {
+                  default: C(() => [
+                    z(s(t($)), 1)
+                  ]),
+                  _: 1
+                }, 8, ["to"])) : (n(), u("span", xe, s(t($)), 1))
+              ], 8, fe),
+              o("p", ve, s(t(V)), 1)
+            ]),
+            o("div", he, [
+              T(X, {
+                placement: "bottom-end",
+                width: 220,
+                disabled: r.value,
+                "stop-click-propagation": "",
+                onMenuChanged: e[3] || (e[3] = (f) => y.value = f)
+              }, {
+                "menu-button": C(() => [
+                  o("button", {
+                    type: "button",
+                    "aria-label": t(_)("connect.whatsappBot.moreActions"),
+                    title: t(_)("connect.whatsappBot.moreActions"),
+                    "aria-haspopup": "menu",
+                    "aria-expanded": y.value,
+                    disabled: r.value,
+                    "aria-busy": r.value,
+                    class: O(["w-[32px] h-[32px] flex items-center justify-center rounded-[8px] text-fm-color-typo-tertiary transition-colors hover:bg-fm-color-neutral-gray-100 hover:text-fm-color-typo-primary focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-fm-color-primary disabled:cursor-wait disabled:opacity-50", { "bg-fm-color-neutral-gray-100": y.value }])
+                  }, [
+                    r.value ? (n(), k(L, {
+                      key: 0,
+                      size: "md",
+                      "aria-hidden": "true"
+                    })) : (n(), k(U, {
+                      key: 1,
+                      name: "more_vert",
+                      size: "sm",
+                      "aria-hidden": "true"
+                    }))
+                  ], 10, _e)
+                ]),
+                default: C(() => [
+                  I.value ? (n(), k(H, {
+                    key: 0,
+                    label: t(_)("connect.whatsappBot.notificationGroup.title"),
+                    disabled: r.value,
+                    "onUpdate:modelValue": e[1] || (e[1] = (f) => A.value = !0)
+                  }, {
+                    prepend: C(() => [
+                      T(U, {
+                        name: "notifications",
+                        size: "sm",
+                        outline: "",
+                        "aria-hidden": "true"
+                      })
+                    ]),
+                    _: 1
+                  }, 8, ["label", "disabled"])) : D("", !0),
+                  T(H, {
+                    disabled: r.value,
+                    "onUpdate:modelValue": e[2] || (e[2] = (f) => W())
+                  }, {
+                    prepend: C(() => [
+                      T(U, {
+                        name: "delete",
+                        size: "sm",
+                        outline: "",
+                        class: "text-fm-color-typo-error",
+                        "aria-hidden": "true"
+                      })
+                    ]),
+                    label: C(() => [
+                      o("span", ge, s(t(_)("connect.common.delete")), 1)
+                    ]),
+                    _: 1
+                  }, 8, ["disabled"])
+                ]),
+                _: 1
+              }, 8, ["disabled"])
+            ])
+          ]),
+          o("div", ye, [
+            T(re, { state: t(v) }, null, 8, ["state"]),
+            I.value && E.account.connectedAt ? (n(), u("span", be, s(t(_)("connect.whatsappBot.connectedSince", {
+              date: S(E.account.connectedAt)
+            })), 1)) : D("", !0)
+          ]),
+          x.value ? (n(), u("p", we, s(x.value), 1)) : D("", !0)
+        ], 2),
+        A.value ? (n(), k(se, {
+          key: 0,
+          modelValue: A.value,
+          "onUpdate:modelValue": e[4] || (e[4] = (f) => A.value = f),
+          account: E.account
+        }, null, 8, ["modelValue", "account"])) : D("", !0)
+      ]);
+    };
+  }
+}), Be = { class: "mt-[24px] grid grid-cols-[repeat(auto-fill,minmax(min(300px,100%),1fr))] gap-[16px]" }, $e = /* @__PURE__ */ Q({
+  __name: "WhatsappAccountList",
+  props: {
+    accounts: {}
+  },
+  emits: ["removed"],
+  setup(E, { emit: i }) {
+    const l = i;
+    return (w, _) => (n(), u("ul", Be, [
+      (n(!0), u(J, null, q(E.accounts, (d) => (n(), k(ke, {
+        key: d.clientId,
+        account: d,
+        onRemoved: _[0] || (_[0] = (r) => l("removed", r))
+      }, null, 8, ["account"]))), 128))
+    ]));
+  }
+}), Ae = { class: "text-[18px] font-semibold" }, Ce = {
+  key: 0,
+  role: "status",
+  class: "flex flex-col items-center text-center gap-[8px] px-[8px] py-[40px]"
+}, Te = { class: "text-[18px] font-semibold" }, Pe = { class: "text-[14px] text-fm-color-typo-secondary break-all" }, Se = {
+  key: 1,
+  class: "grid grid-cols-[minmax(0,1fr)_232px] xs:grid-cols-1 gap-[32px] p-[8px] xs:p-[0px]"
+}, Fe = { class: "flex flex-col gap-[20px] text-[14px] leading-[20px]" }, Ie = { class: "text-fm-color-typo-secondary" }, Ee = { class: "flex flex-col gap-[14px]" }, Ve = { class: "w-[22px] h-[22px] shrink-0 rounded-full bg-fm-color-neutral-gray-100 flex items-center justify-center text-[12px] font-semibold" }, De = { key: 0 }, Le = { class: "font-semibold" }, Me = { class: "font-semibold" }, We = { class: "font-semibold" }, je = { class: "font-semibold" }, Oe = { key: 3 }, Ne = { class: "text-[12px] leading-[16px] text-fm-color-typo-tertiary" }, Re = { class: "relative w-[232px] h-[232px] xs:justify-self-center border border-fm-color-neutral-gray-100 rounded-[12px] flex items-center justify-center overflow-hidden" }, Ue = {
+  key: 0,
+  role: "status",
+  class: "flex flex-col items-center gap-[12px] text-[13px]"
+}, He = {
+  key: 1,
+  class: "flex flex-col items-center text-center gap-[12px] p-[12px]"
+}, ze = {
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, Ge = ["src", "alt"], Qe = {
+  key: 3,
+  role: "status",
+  "aria-live": "polite",
+  class: "absolute inset-0 bg-fm-color-neutral-white/90 flex flex-col items-center justify-center gap-[10px] text-[13px] font-medium"
+}, Ze = /* @__PURE__ */ Q({
+  __name: "WhatsappConnectDialog",
+  props: {
+    modelValue: { type: Boolean, required: !0 },
+    modelModifiers: {}
+  },
+  emits: ["update:modelValue"],
+  setup(E) {
+    const i = ee(E, "modelValue"), { t: l } = K(), w = b(""), _ = b(!1), d = b(""), r = b(!1), x = b();
+    let y, A, g;
+    function $() {
+      y == null || y.abort(), clearTimeout(A), A = void 0, clearTimeout(g), g = void 0;
+    }
+    async function V(v, p, h) {
+      if (!h.aborted) {
+        try {
+          const c = await G.getClient(v, p, h);
+          if (h.aborted) return;
+          if (r.value = c.status === "connected" || c.status === "connecting" && c.connectedAt !== null, c.status === "connected" && c.connectedAt !== null && c.profileStatus === "ready") {
+            $(), r.value = !1, x.value = c, g = setTimeout(() => {
+              i.value = !1;
+            }, 1800);
+            return;
+          }
+          if (c.status === "disconnected") {
+            $(), r.value = !1, w.value = "", d.value = l("connect.whatsappBot.errors.qrExpired");
+            return;
+          }
+        } catch (c) {
+          if (h.aborted) return;
+          if (c instanceof ne && c.status === 409) {
+            $(), r.value = !1, w.value = "", d.value = l("connect.whatsappBot.errors.accountAlreadyLinked");
+            return;
+          }
+        }
+        h.aborted || (A = setTimeout(() => {
+          V(v, p, h);
+        }, 2e3));
+      }
+    }
+    async function P() {
+      $();
+      const v = new AbortController();
+      y = v, w.value = "", d.value = "", r.value = !1, x.value = void 0, _.value = !0;
+      try {
+        const p = N.getBusinessId();
+        if (!p)
+          throw new Error(l("connect.whatsappBot.errors.selectBusiness"));
+        const h = await G.createClient(
+          p,
+          v.signal
+        ), c = await ce.toDataURL(h.qr, {
+          width: 224,
+          margin: 2,
+          errorCorrectionLevel: "M"
+        });
+        v.signal.aborted || (w.value = c, V(p, h.clientId, v.signal));
+      } catch (p) {
+        v.signal.aborted || (d.value = p instanceof Error ? p.message : l("connect.whatsappBot.errors.loadQr"));
+      } finally {
+        v.signal.aborted || (_.value = !1);
+      }
+    }
+    return Z(
+      i,
+      (v) => {
+        v ? P() : $();
+      },
+      { immediate: !0 }
+    ), Y($), (v, p) => {
+      const h = B("i18n-t"), c = B("FmCircularProgress"), I = B("FmButton"), R = B("FmDialog");
+      return n(), k(R, {
+        modelValue: i.value,
+        "onUpdate:modelValue": p[0] || (p[0] = (S) => i.value = S),
+        "min-width": "min(720px, calc(100% - 32px))",
+        "max-width": "720px",
+        "max-height": "90vh",
+        "dismiss-away": ""
+      }, {
+        "dialog-header": C(() => [
+          o("h2", Ae, s(t(l)("connect.whatsappBot.connectAccount")), 1)
+        ]),
+        default: C(() => {
+          var S, W, F;
+          return [
+            x.value ? (n(), u("div", Ce, [
+              p[1] || (p[1] = o("div", {
+                "aria-hidden": "true",
+                class: "w-[64px] h-[64px] rounded-full bg-fm-color-system-success-100 text-fm-color-typo-success flex items-center justify-center mb-[8px]"
+              }, [
+                o("svg", {
+                  width: "32",
+                  height: "32",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  "stroke-width": "2.2",
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round"
+                }, [
+                  o("path", { d: "M20 6 9 17l-5-5" })
+                ])
+              ], -1)),
+              o("h3", Te, s(t(l)("connect.whatsappBot.accountConnected")), 1),
+              o("p", Pe, s(((S = x.value.account) == null ? void 0 : S.businessName) || ((W = x.value.account) == null ? void 0 : W.name) || t(l)("connect.whatsappBot.unnamedAccount")) + " · " + s(((F = x.value.account) == null ? void 0 : F.phoneNumber) || t(l)("connect.whatsappBot.phoneUnavailable")), 1)
+            ])) : (n(), u("div", Se, [
+              o("div", Fe, [
+                o("p", Ie, s(t(l)("connect.whatsappBot.scanDescription")), 1),
+                o("ol", Ee, [
+                  (n(), u(J, null, q(4, (a) => o("li", {
+                    key: a,
+                    class: "flex gap-[12px]"
+                  }, [
+                    o("span", Ve, s(a), 1),
+                    a === 1 ? (n(), u("span", De, s(t(l)("connect.whatsappBot.steps.openApp")), 1)) : a === 2 ? (n(), k(h, {
+                      key: 1,
+                      keypath: "connect.whatsappBot.steps.openSettings",
+                      tag: "span",
+                      scope: "global"
+                    }, {
+                      menu: C(() => [
+                        o("b", Le, s(t(l)("connect.whatsappBot.menu")), 1)
+                      ]),
+                      settings: C(() => [
+                        o("b", Me, s(t(l)("connect.whatsappBot.settings")), 1)
+                      ]),
+                      _: 1
+                    })) : a === 3 ? (n(), k(h, {
+                      key: 2,
+                      keypath: "connect.whatsappBot.steps.linkDevice",
+                      tag: "span",
+                      scope: "global"
+                    }, {
+                      linkedDevices: C(() => [
+                        o("b", We, s(t(l)("connect.whatsappBot.linkedDevices")), 1)
+                      ]),
+                      linkDevice: C(() => [
+                        o("b", je, s(t(l)("connect.whatsappBot.linkDevice")), 1)
+                      ]),
+                      _: 1
+                    })) : (n(), u("span", Oe, s(t(l)("connect.whatsappBot.steps.scanQr")), 1))
+                  ])), 64))
+                ]),
+                o("p", Ne, s(t(l)("connect.whatsappBot.connectionNote")), 1)
+              ]),
+              o("div", Re, [
+                _.value ? (n(), u("div", Ue, [
+                  T(c),
+                  z(s(t(l)("connect.whatsappBot.generatingQr")), 1)
+                ])) : d.value ? (n(), u("div", He, [
+                  o("p", ze, s(d.value), 1),
+                  T(I, {
+                    label: t(l)("connect.whatsappBot.tryAgain"),
+                    "prepend-icon": "refresh",
+                    class: "!rounded-full [&_.label]:text-[14px]",
+                    onClick: P
+                  }, null, 8, ["label"])
+                ])) : w.value ? (n(), u("img", {
+                  key: 2,
+                  src: w.value,
+                  alt: t(l)("connect.whatsappBot.qrAlt"),
+                  width: "224",
+                  height: "224",
+                  class: O({ "opacity-20": r.value })
+                }, null, 10, Ge)) : D("", !0),
+                r.value ? (n(), u("div", Qe, [
+                  T(c),
+                  z(" " + s(t(l)("connect.whatsappBot.connecting")), 1)
+                ])) : D("", !0)
+              ])
+            ]))
+          ];
+        }),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), Je = { class: "mt-[24px] border border-fm-color-neutral-gray-200 rounded-[16px] px-[24px] py-[56px] flex flex-col items-center text-center gap-[8px]" }, Ke = { class: "text-[20px] leading-[28px] font-bold" }, Xe = { class: "text-[14px] leading-[20px] text-fm-color-typo-secondary max-w-[420px] [text-wrap:pretty]" }, Ye = /* @__PURE__ */ Q({
+  __name: "WhatsappEmptyState",
+  emits: ["connect"],
+  setup(E, { emit: i }) {
+    const l = i, { t: w } = K();
+    return (_, d) => {
+      const r = B("FmButton");
+      return n(), u("div", Je, [
+        d[1] || (d[1] = o("div", { class: "w-[72px] h-[72px] rounded-full bg-fm-color-primary-oats text-fm-color-primary flex items-center justify-center mb-[12px]" }, [
+          o("svg", {
+            width: "34",
+            height: "34",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            "stroke-width": "1.6",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            "aria-hidden": "true"
+          }, [
+            o("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }),
+            o("path", { d: "M9 10h.01M12 10h.01M15 10h.01" })
+          ])
+        ], -1)),
+        o("h2", Ke, s(t(w)("connect.whatsappBot.emptyTitle")), 1),
+        o("p", Xe, s(t(w)("connect.whatsappBot.emptyDescription")), 1),
+        T(r, {
+          class: "mt-[16px] !rounded-full !px-[20px] [&_.label]:text-[14px]",
+          label: t(w)("connect.whatsappBot.connectAccount"),
+          "prepend-icon": "add",
+          onClick: d[0] || (d[0] = (x) => l("connect"))
+        }, null, 8, ["label"])
+      ]);
+    };
+  }
+}), qe = { class: "px-[24px] xs:px-[12px] pt-[20px] pb-[40px] text-fm-color-typo-primary" }, et = { class: "flex items-center justify-between gap-[16px] flex-wrap min-h-[40px]" }, tt = { class: "flex items-center gap-8" }, ot = { class: "text-[24px] leading-[32px] font-semibold tracking-[-0.01em]" }, nt = {
+  key: 0,
+  class: "mt-[8px] w-full text-[14px] leading-[20px] text-fm-color-typo-secondary [text-wrap:pretty]"
+}, at = ["aria-label"], st = {
+  key: 3,
+  role: "status",
+  class: "mt-[24px] py-[56px] flex flex-col items-center gap-[12px] text-[14px] text-fm-color-typo-secondary"
+}, lt = {
+  key: 4,
+  class: "mt-[24px] border border-fm-color-neutral-gray-200 rounded-[16px] px-[24px] py-[56px] flex flex-col items-center text-center gap-[16px]"
+}, rt = {
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, _t = /* @__PURE__ */ Q({
+  __name: "WhatsappBot",
+  setup(E) {
+    const { t: i } = K(), l = te(), w = oe(), _ = j(() => {
+      var a, e;
+      return !!((e = (a = w.sessionUser.value) == null ? void 0 : a.role) != null && e.isAdmin);
+    }), d = b([]), r = b(!0), x = b("");
+    let y, A;
+    const g = b([]), $ = b(!0), V = b("");
+    let P, v;
+    const p = j(
+      () => d.value.filter((a) => le(a) !== void 0)
+    ), h = j(() => [
+      {
+        label: i("connect.whatsappBot.accounts"),
+        value: M["$connect-WHATSAPP_BOT"],
+        badge: p.value.length
+      },
+      {
+        label: i("connect.whatsappBot.settings"),
+        value: M["$connect-WHATSAPP_BOT_SETTINGS"]
+      },
+      ..._.value ? [
+        {
+          label: i("connect.whatsappBot.logs.title"),
+          value: M["$connect-WHATSAPP_BOT_LOGS"]
+        }
+      ] : []
+    ]), c = j(() => {
+      const a = l.currentRoute.value.name;
+      return h.value.some((e) => e.value === a) ? a : M["$connect-WHATSAPP_BOT"];
+    });
+    async function I(a = !1) {
+      clearTimeout(v), P == null || P.abort();
+      const e = new AbortController();
+      P = e, a || ($.value = !0, V.value = "");
+      try {
+        const m = N.getBusinessId();
+        if (!m)
+          throw new Error(i("connect.whatsappBot.errors.selectBusiness"));
+        const L = await G.listTickets(m, e.signal);
+        e.signal.aborted || (g.value = L, V.value = "");
+      } catch (m) {
+        e.signal.aborted || (V.value = m instanceof Error ? m.message : i("connect.whatsappBot.excludedAccounts.loadError"));
+      } finally {
+        e.signal.aborted || ($.value = !1, v = setTimeout(() => void I(!0), 1e4));
+      }
+    }
+    function R(a) {
+      g.value = g.value.filter((e) => e.id !== a), I(!0);
+    }
+    async function S(a = !1) {
+      clearTimeout(A), y == null || y.abort();
+      const e = new AbortController();
+      y = e, a || (r.value = !0, x.value = "");
+      try {
+        const m = N.getBusinessId();
+        if (!m)
+          throw new Error(i("connect.whatsappBot.errors.selectBusiness"));
+        const L = await G.listClients(m, e.signal);
+        e.signal.aborted || (d.value = L, x.value = "");
+      } catch (m) {
+        !e.signal.aborted && !a && (x.value = m instanceof Error ? m.message : i("connect.whatsappBot.errors.loadSessions"));
+      } finally {
+        e.signal.aborted || (r.value = !1, A = setTimeout(() => void S(!0), 1e4));
+      }
+    }
+    function W(a) {
+      d.value = d.value.filter(
+        (e) => e.clientId !== a
+      ), S(!0);
+    }
+    const F = b(!1);
+    return Z(F, (a) => {
+      a || S();
+    }), Z(
+      () => N.getBusinessId(),
+      () => {
+        F.value = !1, d.value = [], g.value = [], S(), I();
+      },
+      { immediate: !0 }
+    ), Y(() => {
+      y == null || y.abort(), clearTimeout(A), P == null || P.abort(), clearTimeout(v);
+    }), (a, e) => {
+      const m = B("FmPill"), L = B("FmButton"), U = B("RouterLink"), H = B("RouterView"), X = B("FmCircularProgress");
+      return n(), u(J, null, [
+        o("div", qe, [
+          o("div", et, [
+            o("div", tt, [
+              o("h1", ot, s(t(i)("connect.navigation.whatsappBot")), 1),
+              T(m, { variant: "beta" })
+            ]),
+            c.value === t(M)["$connect-WHATSAPP_BOT"] && p.value.length ? (n(), k(L, {
+              key: 0,
+              label: t(i)("connect.whatsappBot.connectAccountCta"),
+              "prepend-icon": "add",
+              class: "!h-[36px] !rounded-full !px-[16px] [&_.label]:text-[14px]",
+              onClick: e[0] || (e[0] = (f) => F.value = !0)
+            }, null, 8, ["label"])) : D("", !0)
+          ]),
+          p.value.length ? (n(), u("p", nt, s(t(i)("connect.whatsappBot.description")), 1)) : D("", !0),
+          o("nav", {
+            "aria-label": t(i)("connect.navigation.whatsappBot"),
+            class: "mt-[16px] flex gap-[24px] overflow-x-auto border-b border-fm-color-neutral-gray-100"
+          }, [
+            (n(!0), u(J, null, q(h.value, (f) => (n(), k(U, {
+              key: f.value,
+              to: { name: f.value },
+              "aria-current": c.value === f.value ? "page" : void 0,
+              class: O([
+                "flex h-[40px] shrink-0 items-center gap-[6px] whitespace-nowrap border-b-[2px] px-[2px] text-[14px] leading-[20px] font-medium no-underline transition-colors hover:text-fm-color-primary focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-inset focus-visible:ring-fm-color-primary",
+                c.value === f.value ? "border-fm-color-primary text-fm-color-primary" : "border-transparent text-fm-color-typo-secondary"
+              ])
+            }, {
+              default: C(() => [
+                z(s(f.label) + " ", 1),
+                f.badge ? (n(), u("span", {
+                  key: 0,
+                  class: O([
+                    "min-w-[20px] rounded-full px-[6px] text-center text-[12px] leading-[20px] font-semibold tabular-nums",
+                    c.value === f.value ? "bg-fm-color-primary-oats text-fm-color-primary" : "bg-fm-color-neutral-gray-100 text-fm-color-typo-secondary"
+                  ])
+                }, s(f.badge), 3)) : D("", !0)
+              ]),
+              _: 2
+            }, 1032, ["to", "aria-current", "class"]))), 128))
+          ], 8, at),
+          c.value === t(M)["$connect-WHATSAPP_BOT_SETTINGS"] ? (n(), k(H, {
+            key: 1,
+            tickets: g.value,
+            "tickets-loading": $.value,
+            "tickets-error": V.value,
+            onRetryExclusions: e[1] || (e[1] = (f) => I()),
+            onExcludedAccountRemoved: R
+          }, null, 8, ["tickets", "tickets-loading", "tickets-error"])) : c.value === t(M)["$connect-WHATSAPP_BOT_LOGS"] ? (n(), k(H, {
+            key: 2,
+            accounts: p.value
+          }, null, 8, ["accounts"])) : r.value ? (n(), u("div", st, [
+            T(X),
+            z(" " + s(t(i)("connect.whatsappBot.loadingSessions")), 1)
+          ])) : x.value ? (n(), u("div", lt, [
+            o("p", rt, s(x.value), 1),
+            T(L, {
+              label: t(i)("connect.whatsappBot.tryAgain"),
+              "prepend-icon": "refresh",
+              class: "!rounded-full [&_.label]:text-[14px]",
+              onClick: e[2] || (e[2] = (f) => S())
+            }, null, 8, ["label"])
+          ])) : p.value.length ? (n(), k($e, {
+            key: 5,
+            accounts: p.value,
+            onRemoved: W
+          }, null, 8, ["accounts"])) : (n(), k(Ye, {
+            key: 6,
+            onConnect: e[3] || (e[3] = (f) => F.value = !0)
+          }))
+        ]),
+        T(Ze, {
+          modelValue: F.value,
+          "onUpdate:modelValue": e[4] || (e[4] = (f) => F.value = f)
+        }, null, 8, ["modelValue"])
+      ], 64);
+    };
+  }
+});
+export {
+  _t as default
+};