@feedmepos/mf-connect 0.1.98-beta.8 → 0.1.98-beta.80

package/dist/WhatsappAccount-CxSGqm7H.js

@@ -0,0 +1,325 @@
+import { defineComponent as j, mergeModels as J, useModel as K, computed as R, ref as u, watch as M, onBeforeUnmount as S, resolveComponent as g, openBlock as p, createBlock as U, withCtx as E, createElementVNode as e, toDisplayString as n, unref as t, createElementBlock as x, createVNode as f, createTextVNode as T, Fragment as D, renderList as Q, createCommentVNode as A, normalizeClass as X } from "vue";
+import { u as W } from "./vue-i18n-Dpic36zz.js";
+import { useRoute as Y } from "vue-router";
+import { S as z, a as P } from "./index-BUP4aHq8.js";
+import { w as O } from "./index-D7-Q86HI.js";
+import { u as q, _ as Z } from "./WhatsappAccountStatusLabel.vue_vue_type_script_setup_true_lang-D8L6izf0.js";
+import { b as ee } from "./browser-BSAOEeIM.js";
+import { R as te } from "./app-BEYzXWZO.js";
+const oe = { class: "min-w-0 flex flex-col" }, ne = { class: "text-[18px] leading-[24px] font-semibold" }, ae = { class: "text-[13px] leading-[18px] text-fm-color-typo-secondary break-words" }, se = {
+  key: 0,
+  role: "status",
+  class: "py-[56px] flex flex-col items-center gap-[12px] text-[14px] text-fm-color-typo-secondary"
+}, le = {
+  key: 1,
+  class: "py-[40px] flex flex-col items-center text-center gap-[16px]"
+}, re = {
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, ie = {
+  key: 2,
+  class: "grid grid-cols-[minmax(0,1fr)_226px] xs:grid-cols-1 gap-[32px] p-[8px] xs:p-[0px]"
+}, ce = { class: "min-w-0 flex flex-col gap-[20px] text-[14px] leading-[20px]" }, pe = { class: "text-fm-color-typo-secondary" }, ue = { class: "flex flex-col gap-[10px]" }, de = { class: "text-[12px] leading-[16px] font-semibold uppercase tracking-[0.06em] text-fm-color-typo-secondary" }, fe = { class: "flex flex-col gap-[10px]" }, xe = { class: "flex flex-col gap-[6px]" }, me = {
+  id: "whatsapp-group-invite-link-label",
+  class: "font-medium text-fm-color-typo-secondary"
+}, ve = { class: "flex items-center gap-[8px] border border-fm-color-neutral-gray-200 rounded-[8px] pl-[12px] pr-[4px] py-[4px]" }, he = {
+  id: "whatsapp-group-invite-link",
+  role: "textbox",
+  "aria-readonly": "true",
+  "aria-labelledby": "whatsapp-group-invite-link-label",
+  tabindex: "0",
+  class: "flex-1 min-w-0 h-[32px] overflow-x-auto overflow-y-hidden whitespace-nowrap text-[13px] leading-[32px] font-mono bg-fm-color-neutral-white rounded-[4px] focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-fm-color-primary"
+}, ge = ["disabled"], _e = {
+  key: 0,
+  role: "status",
+  class: "sr-only"
+}, ye = {
+  key: 1,
+  role: "alert",
+  class: "text-[12px] leading-[16px] text-fm-color-typo-error"
+}, be = { class: "text-[12px] leading-[16px] text-fm-color-typo-secondary" }, we = { class: "flex flex-col items-center gap-[12px] w-[226px] xs:justify-self-center" }, Be = { class: "border border-fm-color-neutral-gray-100 rounded-[12px] overflow-hidden" }, ke = ["src", "alt"], $e = ["href"], Ge = /* @__PURE__ */ j({
+  __name: "WhatsappNotificationGroupDialog",
+  props: /* @__PURE__ */ J({
+    account: {}
+  }, {
+    modelValue: { type: Boolean, required: !0 },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(N) {
+    const s = N, k = K(N, "modelValue"), { t: o } = W(), _ = R(() => z.getBusinessId() ?? ""), { name: d, phoneNumber: G } = q(() => s.account), l = u(), m = u(""), C = u(!1), v = u(""), h = u(!1), y = u(!1), b = u("");
+    let r, w;
+    function B() {
+      r == null || r.abort(), clearTimeout(w), h.value = !1, y.value = !1;
+    }
+    async function $() {
+      B();
+      const a = new AbortController();
+      r = a, C.value = !0, v.value = "", b.value = "", l.value = void 0, m.value = "";
+      try {
+        if (!_.value)
+          throw new Error(o("connect.whatsappBot.errors.selectBusiness"));
+        const c = await O.getNotificationGroup(
+          _.value,
+          s.account.clientId,
+          a.signal
+        );
+        if (a.signal.aborted) return;
+        const F = await ee.toDataURL(c.inviteLink, {
+          width: 224,
+          margin: 2,
+          errorCorrectionLevel: "M"
+        });
+        if (a.signal.aborted) return;
+        l.value = c, m.value = F;
+      } catch (c) {
+        if (a.signal.aborted) return;
+        c instanceof P && c.status === 409 ? v.value = o("connect.whatsappBot.notificationGroup.notReady") : c instanceof P && c.status === 404 ? v.value = o("connect.whatsappBot.errors.accountNotFound") : v.value = _.value ? o("connect.whatsappBot.errors.loadGroup") : o("connect.whatsappBot.errors.selectBusiness");
+      } finally {
+        a.signal.aborted || (C.value = !1);
+      }
+    }
+    async function i() {
+      if (!l.value || !r || y.value) return;
+      const a = r;
+      y.value = !0, h.value = !1, b.value = "", clearTimeout(w);
+      try {
+        if (await navigator.clipboard.writeText(l.value.inviteLink), a.signal.aborted) return;
+        h.value = !0, w = setTimeout(() => {
+          h.value = !1;
+        }, 2e3);
+      } catch {
+        a.signal.aborted || (b.value = o("connect.whatsappBot.errors.copyGroupLink"));
+      } finally {
+        a.signal.aborted || (y.value = !1);
+      }
+    }
+    return M(
+      [k, _, () => s.account.clientId],
+      ([a]) => {
+        a ? $() : B();
+      },
+      { immediate: !0 }
+    ), S(B), (a, c) => {
+      const F = g("FmCircularProgress"), V = g("FmButton"), I = g("FmIcon"), H = g("FmDialog");
+      return p(), U(H, {
+        modelValue: k.value,
+        "onUpdate:modelValue": c[0] || (c[0] = (L) => k.value = L),
+        "min-width": "min(720px, calc(100% - 32px))",
+        "max-width": "720px",
+        "max-height": "90vh",
+        "dismiss-away": ""
+      }, {
+        "dialog-header": E(() => [
+          e("div", oe, [
+            e("h2", ne, n(t(o)("connect.whatsappBot.notificationGroup.dialogTitle")), 1),
+            e("p", ae, n(t(d)) + " · " + n(t(G)), 1)
+          ])
+        ]),
+        default: E(() => [
+          C.value ? (p(), x("div", se, [
+            f(F),
+            T(" " + n(t(o)("connect.whatsappBot.notificationGroup.loading")), 1)
+          ])) : v.value ? (p(), x("div", le, [
+            e("p", re, n(v.value), 1),
+            f(V, {
+              label: t(o)("connect.whatsappBot.tryAgain"),
+              "prepend-icon": "refresh",
+              onClick: $
+            }, null, 8, ["label"])
+          ])) : l.value ? (p(), x("div", ie, [
+            e("div", ce, [
+              e("p", pe, n(t(o)("connect.whatsappBot.notificationGroup.scanDescription")), 1),
+              e("div", ue, [
+                e("h3", de, n(t(o)("connect.whatsappBot.notificationGroup.postsTitle")), 1),
+                e("ul", fe, [
+                  (p(), x(D, null, Q(["unanswered", "staffRequests", "humanRequests"], (L) => e("li", {
+                    key: L,
+                    class: "flex gap-[10px]"
+                  }, [
+                    c[1] || (c[1] = e("span", {
+                      "aria-hidden": "true",
+                      class: "w-[6px] h-[6px] rounded-full bg-fm-color-primary shrink-0 mt-[7px]"
+                    }, null, -1)),
+                    T(" " + n(t(o)(`connect.whatsappBot.notificationGroup.posts.${L}`)), 1)
+                  ])), 64))
+                ])
+              ]),
+              e("div", xe, [
+                e("span", me, n(t(o)("connect.whatsappBot.notificationGroup.inviteLink")), 1),
+                e("div", ve, [
+                  e("div", he, n(l.value.inviteLink), 1),
+                  e("button", {
+                    type: "button",
+                    disabled: y.value,
+                    class: "shrink-0 h-[32px] px-[12px] rounded-[6px] bg-fm-color-neutral-gray-100 text-[13px] font-semibold hover:bg-fm-color-neutral-gray-200 disabled:opacity-50 focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-fm-color-primary",
+                    onClick: i
+                  }, n(t(o)(
+                    `connect.whatsappBot.notificationGroup.${h.value ? "copied" : "copy"}`
+                  )), 9, ge)
+                ]),
+                h.value ? (p(), x("span", _e, n(t(o)("connect.whatsappBot.notificationGroup.copied")), 1)) : A("", !0),
+                b.value ? (p(), x("p", ye, n(b.value), 1)) : A("", !0),
+                e("p", be, n(t(o)("connect.whatsappBot.notificationGroup.shareNote")), 1)
+              ])
+            ]),
+            e("div", we, [
+              e("div", Be, [
+                e("img", {
+                  src: m.value,
+                  alt: t(o)("connect.whatsappBot.notificationGroup.qrAlt"),
+                  width: "224",
+                  height: "224"
+                }, null, 8, ke)
+              ]),
+              e("a", {
+                href: l.value.inviteLink,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "w-full h-[40px] flex items-center justify-center gap-[6px] rounded-full bg-fm-color-primary text-fm-color-typo-white text-[14px] font-semibold no-underline hover:opacity-90 focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-fm-color-primary focus-visible:ring-offset-[2px]"
+              }, [
+                T(n(t(o)("connect.whatsappBot.notificationGroup.openWhatsapp")) + " ", 1),
+                f(I, {
+                  name: "open_in_new",
+                  size: "sm"
+                })
+              ], 8, $e)
+            ])
+          ])) : A("", !0)
+        ]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), Ce = { class: "px-[24px] xs:px-[12px] pt-[20px] pb-[40px] text-fm-color-typo-primary" }, Fe = { class: "w-full flex flex-col gap-[24px]" }, Ie = {
+  key: 0,
+  role: "status",
+  class: "py-[56px] flex flex-col items-center gap-[12px] text-[14px] text-fm-color-typo-secondary"
+}, Te = {
+  key: 1,
+  class: "border border-fm-color-neutral-gray-200 rounded-[16px] px-[24px] py-[56px] flex flex-col items-center text-center gap-[16px]"
+}, Ae = {
+  role: "alert",
+  class: "text-[14px] text-fm-color-typo-error"
+}, Ve = { class: "flex items-center gap-[16px]" }, Le = { class: "min-w-0 flex-1 flex flex-col gap-[2px]" }, Ne = { class: "text-[24px] leading-[32px] font-semibold tracking-[-0.01em] break-words" }, Re = { class: "flex items-center gap-[10px] flex-wrap text-[14px] text-fm-color-typo-secondary" }, Ee = { class: "break-all" }, De = {
+  "aria-labelledby": "notification-group-title",
+  class: "border border-fm-color-neutral-gray-100 rounded-[16px] p-[24px] xs:p-[20px] flex items-center gap-[16px] flex-wrap"
+}, Pe = {
+  "aria-hidden": "true",
+  class: "w-[40px] h-[40px] rounded-[8px] shrink-0 self-start bg-fm-color-primary-oats text-fm-color-primary flex items-center justify-center"
+}, je = { class: "min-w-[240px] xs:min-w-0 flex-1 flex flex-col gap-[4px]" }, Me = {
+  id: "notification-group-title",
+  class: "text-[16px] leading-[24px] font-semibold"
+}, Se = { class: "text-[14px] leading-[20px] text-fm-color-typo-secondary" }, Qe = /* @__PURE__ */ j({
+  __name: "WhatsappAccount",
+  setup(N) {
+    const { t: s } = W(), k = Y(), o = R(() => z.getBusinessId() ?? ""), _ = R(
+      () => typeof k.params.clientId == "string" ? k.params.clientId : ""
+    ), d = u(), G = u(!0), l = u(""), m = u(!1), { name: C, phoneNumber: v, initials: h, state: y, avatarColor: b } = q(d);
+    let r, w;
+    async function B($ = !1) {
+      clearTimeout(w), r == null || r.abort();
+      const i = new AbortController();
+      r = i, $ || (G.value = !0, l.value = "");
+      try {
+        if (!o.value)
+          throw new Error(s("connect.whatsappBot.errors.selectBusiness"));
+        const a = await O.getClient(
+          o.value,
+          _.value,
+          i.signal
+        );
+        if (i.signal.aborted) return;
+        d.value = a, l.value = "";
+      } catch (a) {
+        if (i.signal.aborted) return;
+        a instanceof P && a.status === 404 ? (m.value = !1, d.value = void 0, l.value = s("connect.whatsappBot.errors.accountNotFound")) : $ || (l.value = o.value ? s("connect.whatsappBot.errors.loadAccount") : s("connect.whatsappBot.errors.selectBusiness"));
+      } finally {
+        i.signal.aborted || (G.value = !1, d.value && (w = setTimeout(() => void B(!0), 1e4)));
+      }
+    }
+    return M(
+      [o, _],
+      () => {
+        m.value = !1, d.value = void 0, B();
+      },
+      { immediate: !0 }
+    ), S(() => {
+      r == null || r.abort(), clearTimeout(w);
+    }), ($, i) => {
+      const a = g("FmIcon"), c = g("RouterLink"), F = g("FmCircularProgress"), V = g("FmButton");
+      return p(), x(D, null, [
+        e("div", Ce, [
+          e("div", Fe, [
+            f(c, {
+              to: { name: t(te)["$connect-WHATSAPP_BOT"] },
+              class: "self-start flex items-center gap-[4px] h-[32px] pl-[6px] pr-[10px] -ml-[6px] rounded-[8px] text-[14px] font-medium text-fm-color-typo-secondary no-underline 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"
+            }, {
+              default: E(() => [
+                f(a, {
+                  name: "chevron_left",
+                  size: "sm"
+                }),
+                T(" " + n(t(s)("connect.navigation.whatsappBot")), 1)
+              ]),
+              _: 1
+            }, 8, ["to"]),
+            G.value ? (p(), x("div", Ie, [
+              f(F),
+              T(" " + n(t(s)("connect.whatsappBot.loadingAccount")), 1)
+            ])) : l.value ? (p(), x("div", Te, [
+              e("p", Ae, n(l.value), 1),
+              f(V, {
+                label: t(s)("connect.whatsappBot.tryAgain"),
+                "prepend-icon": "refresh",
+                onClick: i[0] || (i[0] = (I) => B())
+              }, null, 8, ["label"])
+            ])) : d.value ? (p(), x(D, { key: 2 }, [
+              e("div", Ve, [
+                e("div", {
+                  "aria-hidden": "true",
+                  class: X(["w-[56px] h-[56px] rounded-full shrink-0 flex items-center justify-center text-[18px] font-semibold text-fm-color-typo-white", t(b)])
+                }, n(t(h)), 3),
+                e("div", Le, [
+                  e("h1", Ne, n(t(C)), 1),
+                  e("div", Re, [
+                    e("span", Ee, n(t(v)), 1),
+                    f(Z, { state: t(y) }, null, 8, ["state"])
+                  ])
+                ])
+              ]),
+              e("section", De, [
+                e("div", Pe, [
+                  f(a, {
+                    name: "notifications",
+                    size: "md"
+                  })
+                ]),
+                e("div", je, [
+                  e("h2", Me, n(t(s)("connect.whatsappBot.notificationGroup.title")), 1),
+                  e("p", Se, n(t(s)("connect.whatsappBot.notificationGroup.description")), 1)
+                ]),
+                f(V, {
+                  variant: "secondary",
+                  label: t(s)("connect.whatsappBot.notificationGroup.join"),
+                  "prepend-icon": "group",
+                  class: "shrink-0",
+                  onClick: i[1] || (i[1] = (I) => m.value = !0)
+                }, null, 8, ["label"])
+              ])
+            ], 64)) : A("", !0)
+          ])
+        ]),
+        d.value ? (p(), U(Ge, {
+          key: 0,
+          modelValue: m.value,
+          "onUpdate:modelValue": i[2] || (i[2] = (I) => m.value = I),
+          account: d.value
+        }, null, 8, ["modelValue", "account"])) : A("", !0)
+      ], 64);
+    };
+  }
+});
+export {
+  Qe as default
+};

package/dist/WhatsappAccountStatusLabel.vue_vue_type_script_setup_true_lang-D8L6izf0.js

@@ -0,0 +1,96 @@
+import { computed as n, toValue as h, defineComponent as x, openBlock as w, createElementBlock as A, normalizeClass as b, createElementVNode as B, createTextVNode as _, toDisplayString as C, unref as N } from "vue";
+import { u as f } from "./vue-i18n-Dpic36zz.js";
+function O(a) {
+  const o = a.connectedAt !== null;
+  switch (a.status) {
+    case "connected":
+      return "connected";
+    case "disconnected":
+      return "disconnected";
+    case "connecting":
+      return o ? "connecting" : void 0;
+    case "not_found":
+      return o ? "loggedOut" : void 0;
+    case "unavailable":
+      return o ? "unavailable" : void 0;
+    case "pairing":
+      return;
+  }
+}
+const g = [
+  "bg-fm-color-primary",
+  "bg-fm-color-secondary-plum",
+  "bg-fm-color-system-success-400"
+];
+function I(a) {
+  const { t: o, locale: l } = f(), t = n(() => h(a)), c = n(
+    () => {
+      var e, s, p, i, m, d;
+      return ((s = (e = t.value) == null ? void 0 : e.account) == null ? void 0 : s.businessName) || ((i = (p = t.value) == null ? void 0 : p.account) == null ? void 0 : i.name) || ((d = (m = t.value) == null ? void 0 : m.account) == null ? void 0 : d.phoneNumber) || o("connect.whatsappBot.unnamedAccount");
+    }
+  ), r = n(
+    () => {
+      var e, s;
+      return ((s = (e = t.value) == null ? void 0 : e.account) == null ? void 0 : s.phoneNumber) || o("connect.whatsappBot.phoneUnavailable");
+    }
+  ), u = n(
+    () => c.value.trim().split(/\s+/).slice(0, 2).map((e) => Array.from(e)[0]).join("").toLocaleUpperCase(l.value)
+  ), v = n(
+    () => t.value ? O(t.value) ?? "unavailable" : "unavailable"
+  ), y = n(
+    () => {
+      var e;
+      return g[parseInt(((e = t.value) == null ? void 0 : e.clientId.slice(-6)) ?? "0", 16) % g.length];
+    }
+  );
+  return { name: c, phoneNumber: r, initials: u, state: v, avatarColor: y };
+}
+const L = /* @__PURE__ */ x({
+  __name: "WhatsappAccountStatusLabel",
+  props: {
+    state: {}
+  },
+  setup(a) {
+    const o = a, { t: l } = f(), t = {
+      connected: {
+        label: "connect.whatsappBot.connected",
+        pill: "text-fm-color-typo-success bg-fm-color-system-success-100",
+        dot: "bg-fm-color-system-success-400"
+      },
+      connecting: {
+        label: "connect.whatsappBot.statusConnecting",
+        pill: "text-fm-color-typo-warning bg-fm-color-system-warning-100",
+        dot: "bg-fm-color-system-warning-400"
+      },
+      disconnected: {
+        label: "connect.whatsappBot.disconnected",
+        pill: "text-fm-color-typo-error bg-fm-color-system-error-100",
+        dot: "bg-fm-color-system-error-400"
+      },
+      loggedOut: {
+        label: "connect.whatsappBot.loggedOut",
+        pill: "text-fm-color-typo-error bg-fm-color-system-error-100",
+        dot: "bg-fm-color-system-error-400"
+      },
+      unavailable: {
+        label: "connect.whatsappBot.statusUnavailable",
+        pill: "text-fm-color-typo-secondary bg-fm-color-neutral-gray-100",
+        dot: "bg-fm-color-neutral-gray-400"
+      }
+    }, c = n(() => t[o.state]);
+    return (r, u) => (w(), A("span", {
+      class: b(["flex items-center gap-[6px] text-[12px] font-semibold px-[8px] py-[3px] rounded-[6px]", c.value.pill])
+    }, [
+      B("span", {
+        "aria-hidden": "true",
+        class: b(["w-[6px] h-[6px] rounded-full", c.value.dot])
+      }, null, 2),
+      _(" " + C(N(l)(c.value.label)), 1)
+    ], 2));
+  }
+});
+export {
+  L as _,
+  I as u,
+  O as w
+};