@feedmepos/mf-connect 0.1.111-prod → 0.1.113-beta.3

package/dist/Settings-Cs46AcxZ.js

@@ -0,0 +1,286 @@
+import { defineComponent as M, useSlots as G, ref as F, watch as z, computed as b, openBlock as t, createElementBlock as s, createElementVNode as a, normalizeClass as N, unref as e, toDisplayString as d, Fragment as w, createBlock as U, createCommentVNode as C, createVNode as E, renderSlot as W, onMounted as q, withCtx as L, renderList as R, createStaticVNode as J } from "vue";
+import { u as K } from "./loading-CUNk5u1d.js";
+import { u as Q } from "./business-BjAmUqNA.js";
+import { components as x, useSnackbar as X } from "@feedmepos/ui-library";
+import { u as O } from "./vue-i18n-Cw6fF11e.js";
+import { h as A } from "./moment-D7p2TMB-.js";
+import { g as Z, f as ee } from "./google-BQK68wbe.js";
+import { R as ne } from "./app-Devzv4gO.js";
+import { useRouter as oe } from "vue-router";
+import { r as $ } from "./index-CmzjBrHR.js";
+const te = { class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white overflow-hidden" }, ce = ["src"], ae = { class: "flex flex-col flex-1 gap-4 min-w-0" }, se = { class: "fm-typo-en-body-md-600 capitalize" }, re = { class: "truncate" }, le = { class: "truncate" }, ie = {
+  key: 1,
+  class: "truncate"
+}, ue = {
+  key: 2,
+  class: "truncate"
+}, de = {
+  key: 1,
+  class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400 truncate"
+}, me = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400" }, H = /* @__PURE__ */ M({
+  __name: "ReviewSource",
+  props: {
+    icon: {},
+    name: {},
+    connected: { type: Boolean },
+    subtitle: {},
+    syncing: { type: Boolean },
+    tokenExpired: { type: Boolean },
+    lastSyncTime: {}
+  },
+  emits: ["connect", "sync"],
+  setup(r, { emit: h }) {
+    const f = r, S = h, { t: l } = O(), c = G(), k = F(null);
+    z(
+      () => f.syncing,
+      (i) => {
+        i && (k.value = /* @__PURE__ */ new Date());
+      },
+      { immediate: !0 }
+    );
+    const p = b(
+      () => f.lastSyncTime ? A(f.lastSyncTime) : null
+    ), T = b(() => {
+      var i;
+      return ((i = p.value) == null ? void 0 : i.fromNow()) ?? "";
+    }), B = b(
+      () => {
+        var i;
+        return ((i = p.value) == null ? void 0 : i.format("D MMM YYYY, HH:mm")) ?? "";
+      }
+    ), I = b(
+      () => A(k.value ?? void 0).format("HH:mm")
+    ), u = b(() => f.syncing ? "syncing" : p.value ? "synced" : "never");
+    return (i, m) => (t(), s("div", te, [
+      a("div", {
+        class: N(["flex items-center gap-12 p-16", e(c).default ? "border-b border-fm-color-neutral-gray-100" : ""])
+      }, [
+        a("img", {
+          src: r.icon,
+          class: "w-10 h-10 shrink-0"
+        }, null, 8, ce),
+        a("div", ae, [
+          a("span", se, d(r.name), 1),
+          r.connected ? (t(), s("div", {
+            key: 0,
+            class: N(["flex items-center gap-8 fm-typo-en-body-sm-400 truncate", {
+              "text-fm-color-typo-secondary": u.value !== "syncing",
+              "text-fm-color-typo-warning": u.value === "syncing"
+            }])
+          }, [
+            a("span", {
+              class: N(["w-8 h-8 rounded-full shrink-0", {
+                "bg-fm-color-system-success-400": u.value === "synced",
+                "bg-fm-color-primary": u.value === "syncing",
+                "bg-fm-color-neutral-gray-300": u.value === "never"
+              }])
+            }, null, 2),
+            u.value === "synced" ? (t(), s(w, { key: 0 }, [
+              a("span", re, d(e(l)("connect.review.lastSynced", { relative: T.value })), 1),
+              m[3] || (m[3] = a("span", { class: "text-fm-color-neutral-gray-300" }, "·", -1)),
+              a("span", le, d(B.value), 1)
+            ], 64)) : u.value === "syncing" ? (t(), s("span", ie, d(e(l)("connect.review.syncingNow", { time: I.value })), 1)) : (t(), s("span", ue, d(e(l)("connect.review.neverSynced")), 1))
+          ], 2)) : (t(), s("span", de, d(r.subtitle || e(l)("connect.review.notConnected")), 1))
+        ]),
+        r.connected ? (t(), s(w, { key: 0 }, [
+          r.tokenExpired ? (t(), U(e(x).FmChip, {
+            key: 0,
+            label: e(l)("connect.review.expired"),
+            variant: "critical"
+          }, null, 8, ["label"])) : C("", !0),
+          E(e(x).FmButton, {
+            variant: "secondary",
+            "prepend-icon": "refresh",
+            label: e(l)("connect.review.reconnect"),
+            onClick: m[0] || (m[0] = (_) => S("connect"))
+          }, null, 8, ["label"]),
+          r.tokenExpired ? C("", !0) : (t(), U(e(x).FmButton, {
+            key: 1,
+            variant: "primary",
+            "prepend-icon": "sync",
+            label: e(l)("connect.review.sync"),
+            loading: r.syncing,
+            onClick: m[1] || (m[1] = (_) => S("sync"))
+          }, null, 8, ["label", "loading"]))
+        ], 64)) : C("", !0)
+      ], 2),
+      r.connected ? C("", !0) : (t(), s("div", {
+        key: 0,
+        class: N(["flex items-center justify-between gap-12 p-16", e(c).default ? "border-b border-fm-color-neutral-gray-100" : ""])
+      }, [
+        a("span", me, d(e(l)("connect.review.connectHint", { name: r.name })), 1),
+        E(e(x).FmButton, {
+          "prepend-icon": "add",
+          label: e(l)("connect.review.connect"),
+          onClick: m[2] || (m[2] = (_) => S("connect"))
+        }, null, 8, ["label"])
+      ], 2)),
+      W(i.$slots, "default")
+    ]));
+  }
+}), ye = { class: "p-24 flex flex-col gap-8" }, fe = { class: "flex flex-col flex-1 min-w-0" }, ge = { class: "fm-typo-en-body-lg-600 truncate" }, pe = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400 truncate" }, ve = ["src"], be = { class: "flex flex-col flex-1 min-w-0" }, ke = { class: "fm-typo-en-body-lg-600 truncate" }, we = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400 truncate" }, Te = /* @__PURE__ */ M({
+  __name: "Settings",
+  setup(r) {
+    const { t: h } = O(), f = X(), S = oe(), l = Q(), c = F(null), k = F(!1), p = F(!1), T = b(
+      () => {
+        var n;
+        return c.value ? ((n = c.value.google) == null ? void 0 : n.accessToken) === null : !1;
+      }
+    ), B = b(
+      () => {
+        var n;
+        return c.value ? ((n = c.value.facebook) == null ? void 0 : n.token) === null : !1;
+      }
+    );
+    function I(n) {
+      const o = window.location.pathname.replace(/\/review(?:\/.*)?$/, "");
+      return `${window.location.origin}${o}${n}`;
+    }
+    async function u() {
+      await K.minor(async () => {
+        c.value = await $.getSource();
+      });
+    }
+    function i(n) {
+      var o;
+      return (o = l.locations.find(
+        (g) => g._id.toString() === n
+      )) == null ? void 0 : o.name;
+    }
+    function m(n) {
+      return n.map((o) => i(o)).filter((o) => o !== void 0).join(", ");
+    }
+    function _() {
+      f.open({
+        message: h("connect.review.syncSuccess"),
+        type: "success"
+      }), S.push({ name: ne["$connect-REVIEW_OVERVIEW"] });
+    }
+    async function P() {
+      var n, o;
+      k.value = !0;
+      try {
+        await $.syncGoogleReviews(), _();
+      } catch (g) {
+        if (await u(), ((o = (n = c.value) == null ? void 0 : n.google) == null ? void 0 : o.accessToken) === null) {
+          f.open({
+            message: h("connect.review.tokenExpired"),
+            type: "error"
+          });
+          return;
+        }
+        throw g;
+      } finally {
+        k.value = !1;
+      }
+    }
+    async function Y() {
+      var n, o;
+      p.value = !0;
+      try {
+        await $.syncFacebookReviews(), _();
+      } catch (g) {
+        if (await u(), ((o = (n = c.value) == null ? void 0 : n.facebook) == null ? void 0 : o.token) === null) {
+          f.open({
+            message: h("connect.review.tokenExpired"),
+            type: "error"
+          });
+          return;
+        }
+        throw g;
+      } finally {
+        p.value = !1;
+      }
+    }
+    async function j() {
+      const n = I("/review/google/callback"), { callbackUrl: o } = await $.getOauthUrl("google", n);
+      window.location.href = o;
+    }
+    async function D() {
+      const n = I("/review/facebook/callback"), { callbackUrl: o } = await $.getOauthUrl("facebook", n);
+      window.location.href = o;
+    }
+    return q(() => {
+      u(), l.readLocations();
+    }), (n, o) => {
+      var g, V;
+      return t(), s("div", ye, [
+        e(c) ? (t(), s(w, { key: 0 }, [
+          E(H, {
+            icon: e(Z),
+            name: "google",
+            connected: !!e(c).google,
+            syncing: e(k),
+            "token-expired": e(T),
+            "last-sync-time": (g = e(c).google) == null ? void 0 : g.lastSyncTime,
+            onConnect: j,
+            onSync: P
+          }, {
+            default: L(() => {
+              var v;
+              return [
+                (t(!0), s(w, null, R((v = e(c).google) == null ? void 0 : v.locations, (y) => (t(), s("div", {
+                  key: y.googleLocationName,
+                  class: "flex items-center gap-12 px-16 py-12 border-b border-fm-color-neutral-gray-100 last:border-b-0"
+                }, [
+                  E(e(x).FmIcon, {
+                    name: "location_on",
+                    class: "text-fm-color-neutral-gray-300 shrink-0"
+                  }),
+                  a("div", fe, [
+                    a("span", ge, d(y.displayName), 1),
+                    a("span", pe, d(i(y.locationId)), 1)
+                  ])
+                ]))), 128))
+              ];
+            }),
+            _: 1
+          }, 8, ["icon", "connected", "syncing", "token-expired", "last-sync-time"]),
+          E(H, {
+            icon: e(ee),
+            name: "facebook",
+            connected: !!e(c).facebook,
+            syncing: e(p),
+            "token-expired": e(B),
+            "last-sync-time": (V = e(c).facebook) == null ? void 0 : V.lastSyncTime,
+            onConnect: D,
+            onSync: Y
+          }, {
+            default: L(() => {
+              var v;
+              return [
+                (t(!0), s(w, null, R((v = e(c).facebook) == null ? void 0 : v.pages, (y) => (t(), s("div", {
+                  key: y.facebookPageId,
+                  class: "flex items-center gap-12 px-16 py-12 border-b border-fm-color-neutral-gray-100 last:border-b-0"
+                }, [
+                  y.pageProfileImageUrl ? (t(), s("img", {
+                    key: 0,
+                    src: y.pageProfileImageUrl,
+                    class: "w-10 h-10 rounded-full shrink-0 object-cover"
+                  }, null, 8, ve)) : (t(), U(e(x).FmIcon, {
+                    key: 1,
+                    name: "person",
+                    class: "text-fm-color-neutral-gray-300 shrink-0"
+                  })),
+                  a("div", be, [
+                    a("span", ke, d(y.pageName), 1),
+                    a("span", we, d(m(y.locationIds)), 1)
+                  ])
+                ]))), 128))
+              ];
+            }),
+            _: 1
+          }, 8, ["icon", "connected", "syncing", "token-expired", "last-sync-time"])
+        ], 64)) : (t(), s(w, { key: 1 }, R(["google", "facebook"], (v) => a("div", {
+          key: v,
+          class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white p-16"
+        }, [...o[0] || (o[0] = [
+          J('<div class="animate-pulse flex items-center gap-12"><div class="w-10 h-10 rounded-full bg-fm-color-neutral-gray-100 shrink-0"></div><div class="flex-1 min-w-0 space-y-8"><div class="h-16 w-20 rounded bg-fm-color-neutral-gray-100"></div><div class="h-12 w-full max-w-[160px] rounded bg-fm-color-neutral-gray-100"></div></div><div class="h-32 w-24 rounded bg-fm-color-neutral-gray-100 shrink-0"></div></div>', 1)
+        ])])), 64))
+      ]);
+    };
+  }
+});
+export {
+  Te as default
+};