@feedmepos/mf-connect 0.1.96-prod → 0.1.98-beta.1

package/dist/Review-fsYAsdHU.js

@@ -0,0 +1,871 @@
+import { defineComponent as M, ref as C, computed as k, resolveComponent as H, openBlock as o, createBlock as x, unref as e, withCtx as j, createVNode as g, normalizeClass as B, createElementVNode as n, toDisplayString as v, createElementBlock as a, Fragment as F, renderList as U, useModel as L, onMounted as D, isRef as R, createCommentVNode as I, Teleport as K, withModifiers as W, onUnmounted as J, normalizeStyle as N, watch as Y, useSlots as Q, renderSlot as X, createStaticVNode as ee, KeepAlive as te } from "vue";
+import { u as z } from "./vue-i18n-bssxjuw_.js";
+import { _ as oe } from "./DateRangeChip.vue_vue_type_script_setup_true_lang-eIoPtgO5.js";
+import { _ as G } from "./FilterChip.vue_vue_type_script_setup_true_lang-DaU-9GzO.js";
+import { u as le } from "./business-caUtvXxX.js";
+import { components as b, useSnackbar as ne } from "@feedmepos/ui-library";
+import { h as P } from "./moment-D7p2TMB-.js";
+import { r as T } from "./index-B4dazSVT.js";
+import { u as se } from "./loading-DtPQnEA5.js";
+const ae = { class: "fm-typo-en-body-md-600 select-none text-ellipsis overflow-hidden whitespace-nowrap" }, re = /* @__PURE__ */ M({
+  __name: "SortChip",
+  props: {
+    modelValue: {
+      type: String,
+      required: !0
+    },
+    items: {
+      type: Array,
+      required: !0
+    },
+    label: {
+      type: String,
+      default: "Sort by: "
+    },
+    placement: {
+      type: String,
+      default: "bottom-end"
+    },
+    class: {
+      type: String,
+      default: "text-fm-color-neutral-gray-400 cursor-pointer"
+    }
+  },
+  emits: ["update:model-value"],
+  setup(t, { emit: l }) {
+    const c = t, s = l, r = C(!1), u = k(
+      () => {
+        var i;
+        return ((i = c.items.find((y) => y.value === c.modelValue)) == null ? void 0 : i.label) ?? "";
+      }
+    );
+    function d(i) {
+      s("update:model-value", i), r.value = !1;
+    }
+    return (i, y) => {
+      const p = H("FmIcon"), V = H("FmChip"), S = H("FmMenuItem"), $ = H("FmMenu");
+      return o(), x($, {
+        placement: t.placement,
+        "model-value": e(r),
+        "close-on-click": !0,
+        onMenuChanged: y[0] || (y[0] = (w) => r.value = w)
+      }, {
+        "menu-button": j(() => [
+          g(V, {
+            label: `${t.label}${e(u)}`,
+            class: B(c.class)
+          }, {
+            default: j(() => [
+              n("div", ae, v(t.label) + v(e(u)), 1),
+              g(p, {
+                name: e(r) ? "keyboard_arrow_up" : "keyboard_arrow_down",
+                class: B(c.class),
+                outline: "",
+                size: "sm"
+              }, null, 8, ["name", "class"])
+            ]),
+            _: 1
+          }, 8, ["label", "class"])
+        ]),
+        default: j(() => [
+          (o(!0), a(F, null, U(t.items, (w) => (o(), x(S, {
+            key: w.value,
+            value: w.value,
+            label: w.label,
+            onClick: (m) => d(w.value)
+          }, null, 8, ["value", "label", "onClick"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["placement", "model-value"]);
+    };
+  }
+}), ce = { class: "flex justify-between gap-8" }, ie = { class: "flex flex-wrap gap-8" }, ue = /* @__PURE__ */ M({
+  __name: "ReviewListingController",
+  props: {
+    source: {
+      required: !0
+    },
+    sourceModifiers: {},
+    dateFrom: { required: !0 },
+    dateFromModifiers: {},
+    dateTo: { required: !0 },
+    dateToModifiers: {},
+    locationId: { required: !0 },
+    locationIdModifiers: {},
+    sort: { required: !0 },
+    sortModifiers: {}
+  },
+  emits: ["update:source", "update:dateFrom", "update:dateTo", "update:locationId", "update:sort"],
+  setup(t) {
+    const { t: l } = z(), c = L(t, "source"), s = L(t, "dateFrom"), r = L(t, "dateTo"), u = L(t, "locationId"), d = L(t, "sort"), i = le(), y = k(() => [
+      { label: "Google", value: "google" },
+      { label: "Facebook", value: "facebook" }
+    ]), p = k(() => [
+      ...i.locationOptions.map((f) => ({
+        label: f.label,
+        value: f.value
+      }))
+    ]), V = k(() => [
+      {
+        label: l("connect.review.filter.sort.createTime_desc"),
+        value: "createTime_desc"
+      },
+      {
+        label: l("connect.review.filter.sort.createTime_asc"),
+        value: "createTime_asc"
+      },
+      { label: l("connect.review.filter.sort.rating_asc"), value: "rating_asc" },
+      { label: l("connect.review.filter.sort.rating_desc"), value: "rating_desc" }
+    ]), S = k({
+      get: () => c.value ? [c.value] : [],
+      set: (f) => {
+        c.value = f.length === 1 && f[0] ? f[0] : null;
+      }
+    }), $ = k({
+      get: () => u.value ? [u.value] : [],
+      set: (f) => {
+        u.value = f.length === 1 && f[0] ? f[0] : "";
+      }
+    }), w = k({
+      get: () => ({
+        startDate: s.value ?? void 0,
+        endDate: r.value ?? void 0
+      }),
+      set: (f) => {
+        s.value = f.startDate ?? null, r.value = f.endDate ?? null;
+      }
+    }), m = k(() => i.locations.length > 0);
+    return D(() => i.readLocations()), (f, h) => (o(), a("div", ce, [
+      n("div", ie, [
+        g(G, {
+          modelValue: e(S),
+          "onUpdate:modelValue": h[0] || (h[0] = (_) => R(S) ? S.value = _ : null),
+          label: `${e(l)("connect.review.filter.source")}: `,
+          "show-item-label": !0,
+          items: e(y),
+          searchable: !1,
+          placement: "bottom-start"
+        }, null, 8, ["modelValue", "label", "items"]),
+        e(m) ? (o(), x(G, {
+          key: 0,
+          modelValue: e($),
+          "onUpdate:modelValue": h[1] || (h[1] = (_) => R($) ? $.value = _ : null),
+          label: `${e(l)("connect.review.filter.location")}: `,
+          "show-item-label": !0,
+          items: e(p),
+          placement: "bottom-start"
+        }, null, 8, ["modelValue", "label", "items"])) : I("", !0),
+        g(oe, {
+          modelValue: e(w),
+          "onUpdate:modelValue": h[2] || (h[2] = (_) => R(w) ? w.value = _ : null)
+        }, null, 8, ["modelValue"])
+      ]),
+      g(re, {
+        modelValue: d.value,
+        "onUpdate:modelValue": h[3] || (h[3] = (_) => d.value = _),
+        label: `${e(l)("connect.review.filter.sort.label")}: `,
+        items: e(V),
+        placement: "bottom-start"
+      }, null, 8, ["modelValue", "label", "items"])
+    ]));
+  }
+}), O = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='%231877F2'%3e%3cpath%20d='M24%2012.073c0-6.627-5.373-12-12-12s-12%205.373-12%2012c0%205.99%204.388%2010.954%2010.125%2011.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007%201.792-4.669%204.533-4.669%201.312%200%202.686.235%202.686.235v2.953H15.83c-1.491%200-1.956.925-1.956%201.874v2.25h3.328l-.532%203.47h-2.796v8.385C19.612%2023.027%2024%2018.062%2024%2012.073z'/%3e%3c/svg%3e", de = { class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white p-16 flex flex-col gap-8" }, me = { class: "flex items-center gap-8" }, ve = ["src"], fe = { class: "flex flex-col flex-1 min-w-0" }, ge = { class: "fm-typo-en-body-md-600 truncate" }, ye = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400" }, we = { class: "flex items-center gap-4 shrink-0" }, pe = ["src"], he = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400"
+}, be = {
+  key: 0,
+  class: "flex items-center gap-4"
+}, xe = {
+  key: 1,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-700 line-clamp-3"
+}, _e = {
+  key: 2,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-400 italic"
+}, ke = /* @__PURE__ */ M({
+  __name: "FacebookReviewCard",
+  props: {
+    review: {}
+  },
+  setup(t) {
+    const { t: l } = z();
+    return (c, s) => {
+      var r, u, d;
+      return o(), a("div", de, [
+        n("div", me, [
+          (r = t.review.reviewer) != null && r.pictureUrl ? (o(), a("img", {
+            key: 0,
+            src: (u = t.review.reviewer) == null ? void 0 : u.pictureUrl,
+            class: "w-32 h-32 rounded-full shrink-0 object-cover"
+          }, null, 8, ve)) : (o(), x(e(b).FmIcon, {
+            key: 1,
+            name: "person",
+            class: "text-fm-color-neutral-gray-300 shrink-0"
+          })),
+          n("div", fe, [
+            n("span", ge, v(((d = t.review.reviewer) == null ? void 0 : d.name) ?? e(l)("connect.review.overview.anonymous")), 1),
+            n("span", ye, v(e(P)(t.review.createTime).format("D MMM YYYY, hh:mmA")), 1)
+          ]),
+          n("div", we, [
+            n("img", {
+              src: e(O),
+              class: "w-16 h-16"
+            }, null, 8, pe),
+            t.review.pageName ? (o(), a("span", he, v(t.review.pageName), 1)) : I("", !0)
+          ])
+        ]),
+        t.review.isPositive != null ? (o(), a("div", be, [
+          g(e(b).FmIcon, {
+            name: t.review.isPositive ? "thumb_up" : "thumb_down",
+            size: "sm",
+            class: B(
+              t.review.isPositive ? "text-fm-color-typo-success" : "text-fm-color-system-error-500"
+            )
+          }, null, 8, ["name", "class"]),
+          n("span", {
+            class: B([
+              "fm-typo-en-body-sm-400",
+              t.review.isPositive ? "text-fm-color-typo-success" : "text-fm-color-system-error-500"
+            ])
+          }, v(t.review.isPositive ? e(l)("connect.review.overview.positive") : e(l)("connect.review.overview.negative")), 3)
+        ])) : I("", !0),
+        t.review.comment ? (o(), a("p", xe, v(t.review.comment), 1)) : (o(), a("p", _e, v(e(l)("connect.review.overview.noComment")), 1))
+      ]);
+    };
+  }
+}), $e = "data:image/svg+xml,%3csvg%20width='388'%20height='388'%20viewBox='0%200%20388%20388'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M239.449%200H148.553C66.5106%200%200.00195312%2066.5086%200.00195312%20148.551V239.447C0.00195312%20321.489%2066.5106%20387.998%20148.553%20387.998H239.449C321.491%20387.998%20388%20321.489%20388%20239.447V148.551C388%2066.5086%20321.491%200%20239.449%200Z'%20fill='url(%23paint0_linear_feedme_logo)'%20/%3e%3cmask%20id='mask0_feedme_logo'%20style='mask-type:luminance'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='388'%20height='388'%3e%3cpath%20d='M239.447%200H148.551C66.5086%200%200%2066.5086%200%20148.551V239.447C0%20321.489%2066.5086%20387.998%20148.551%20387.998H239.447C321.49%20387.998%20387.998%20321.489%20387.998%20239.447V148.551C387.998%2066.5086%20321.49%200%20239.447%200Z'%20fill='white'%20/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_feedme_logo)'%3e%3cpath%20d='M82.587%20258.589V258.76C83.2747%20264.893%2084.1917%20271.598%2085.3953%20278.648L101.271%20392.296H127.462V253.946C127.462%20241.395%20137.033%20231.194%20148.839%20231.194H150.329C162.135%20231.194%20171.706%20241.395%20171.706%20253.946V392.296H216.352V253.946C216.352%20241.395%20225.923%20231.194%20237.729%20231.194H239.219C251.025%20231.194%20260.596%20241.395%20260.596%20253.946V392.296H286.959L302.835%20277.788C303.981%20271.025%20304.841%20264.549%20305.471%20258.589V258.187C307.649%20238.759%20307.649%20225.061%20307.649%20225.061C307.649%20182.938%20290.054%20148.264%20252.286%20119.78C241.97%20112.043%20233.029%20100.466%20232.17%2075.7079C232.17%2075.7079%20229.705%2012.9519%20253.719%20-33.7568H134.339C158.353%2012.9519%20155.888%2075.7079%20155.888%2075.7079C155.029%20100.409%20146.088%20111.986%20135.772%20119.78C97.9465%20148.321%2080.4092%20182.938%2080.4092%20225.061C80.4092%20225.061%2080.4092%20238.873%2082.587%20258.474V258.589Z'%20fill='white'%20/%3e%3c/g%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_feedme_logo'%20x1='43.5013'%20y1='344.556'%20x2='344.501'%20y2='43.5567'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23FF5D53'%20/%3e%3cstop%20offset='1'%20stop-color='%23FCA23E'%20/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e", Ce = {
+  key: 0,
+  class: "flex flex-wrap gap-8"
+}, Fe = ["onClick"], Ie = ["src", "alt"], Me = {
+  key: 0,
+  class: "absolute inset-0 flex items-center justify-center bg-black/30"
+}, Ue = ["src"], Se = ["src", "alt"], Ve = /* @__PURE__ */ M({
+  __name: "FeedmeReviewCardMedia",
+  props: {
+    mediaItems: {}
+  },
+  setup(t) {
+    const l = C(null);
+    return (c, s) => t.mediaItems && t.mediaItems.length > 0 ? (o(), a("div", Ce, [
+      (o(!0), a(F, null, U(t.mediaItems, (r, u) => (o(), a("div", {
+        key: u,
+        class: "relative w-72 h-72 rounded-lg overflow-hidden border border-fm-color-neutral-gray-200 shrink-0 cursor-pointer hover:opacity-90 transition-opacity",
+        onClick: (d) => l.value = r
+      }, [
+        n("img", {
+          src: r.thumbnailUrl,
+          alt: r.thumbnailLabel,
+          class: "w-full h-full object-cover"
+        }, null, 8, Ie),
+        r.videoUrl ? (o(), a("div", Me, [
+          g(e(b).FmIcon, {
+            name: "play_arrow",
+            class: "text-white"
+          })
+        ])) : I("", !0)
+      ], 8, Fe))), 128)),
+      (o(), x(K, { to: "body" }, [
+        l.value ? (o(), a("div", {
+          key: 0,
+          class: "fixed inset-0 z-50 flex items-center justify-center bg-black/80 backdrop-blur-sm",
+          onClick: s[2] || (s[2] = (r) => l.value = null)
+        }, [
+          n("button", {
+            class: "absolute top-16 right-16 z-50 p-8 text-white hover:text-fm-color-neutral-gray-300 transition-colors",
+            onClick: s[0] || (s[0] = (r) => l.value = null)
+          }, [
+            g(e(b).FmIcon, {
+              name: "close",
+              size: "lg"
+            })
+          ]),
+          n("div", {
+            class: "relative max-w-[90vw] max-h-[90vh] flex items-center justify-center",
+            onClick: s[1] || (s[1] = W(() => {
+            }, ["stop"]))
+          }, [
+            l.value.videoUrl ? (o(), a("video", {
+              key: 0,
+              src: l.value.videoUrl,
+              controls: "",
+              autoplay: "",
+              class: "max-w-full max-h-[90vh] rounded-lg shadow-lg"
+            }, null, 8, Ue)) : (o(), a("img", {
+              key: 1,
+              src: l.value.thumbnailUrl,
+              alt: l.value.thumbnailLabel,
+              class: "max-w-full max-h-[90vh] rounded-lg shadow-lg object-contain"
+            }, null, 8, Se))
+          ])
+        ])) : I("", !0)
+      ]))
+    ])) : I("", !0);
+  }
+}), Re = { class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white p-16 flex flex-col gap-8" }, ze = { class: "flex items-center gap-8" }, Te = ["src"], Be = { class: "flex flex-col flex-1 min-w-0" }, He = { class: "fm-typo-en-body-md-600 truncate" }, Le = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400" }, je = { class: "flex items-center gap-4 shrink-0" }, Ae = ["src"], De = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400"
+}, Ee = { class: "flex items-center gap-4" }, Pe = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-700 line-clamp-3"
+}, Ne = {
+  key: 1,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-400 italic"
+}, Ye = /* @__PURE__ */ M({
+  __name: "FeedmeReviewCard",
+  props: {
+    review: {}
+  },
+  setup(t) {
+    const { t: l } = z();
+    return (c, s) => (o(), a("div", Re, [
+      n("div", ze, [
+        t.review.reviewer.photoUrl ? (o(), a("img", {
+          key: 0,
+          src: t.review.reviewer.photoUrl,
+          class: "w-32 h-32 rounded-full shrink-0 object-cover"
+        }, null, 8, Te)) : (o(), x(e(b).FmIcon, {
+          key: 1,
+          name: "person",
+          class: "text-fm-color-neutral-gray-300 shrink-0"
+        })),
+        n("div", Be, [
+          n("span", He, v(t.review.reviewer.name ?? e(l)("connect.review.overview.anonymous")), 1),
+          n("span", Le, v(e(P)(t.review.createTime).format("D MMM YYYY, hh:mmA")), 1)
+        ]),
+        n("div", je, [
+          n("img", {
+            src: e($e),
+            class: "w-16 h-16",
+            alt: "FeedMe"
+          }, null, 8, Ae),
+          t.review.location ? (o(), a("span", De, v(t.review.location.name), 1)) : I("", !0)
+        ])
+      ]),
+      n("div", Ee, [
+        (o(), a(F, null, U(5, (r) => g(e(b).FmIcon, {
+          key: r,
+          name: "star",
+          size: "sm",
+          class: B(
+            r <= t.review.starRating ? "text-yellow-400" : "text-fm-color-neutral-gray-200"
+          )
+        }, null, 8, ["class"])), 64))
+      ]),
+      t.review.comment ? (o(), a("p", Pe, v(t.review.comment), 1)) : (o(), a("p", Ne, v(e(l)("connect.review.overview.noComment")), 1)),
+      g(Ve, {
+        "media-items": t.review.mediaItems
+      }, null, 8, ["media-items"])
+    ]));
+  }
+}), Z = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2048%2048'%3e%3cpath%20fill='%23EA4335'%20d='M24%209.5c3.14%200%205.95%201.08%208.17%202.86l6.08-6.08C34.46%203.1%2029.5%201%2024%201%2014.82%201%206.96%206.48%203.22%2014.44l7.08%205.5C12.08%2013.66%2017.58%209.5%2024%209.5z'/%3e%3cpath%20fill='%234285F4'%20d='M46.52%2024.5c0-1.64-.15-3.22-.42-4.74H24v8.98h12.7c-.55%202.96-2.2%205.46-4.68%207.14l7.18%205.58C43.18%2037.36%2046.52%2031.38%2046.52%2024.5z'/%3e%3cpath%20fill='%23FBBC05'%20d='M10.3%2028.56A14.56%2014.56%200%200%201%209.5%2024c0-1.58.27-3.1.76-4.52l-7.08-5.5A23.94%2023.94%200%200%200%200%2024c0%203.86.92%207.5%202.56%2010.72l7.74-6.16z'/%3e%3cpath%20fill='%2334A853'%20d='M24%2047c5.5%200%2010.12-1.82%2013.48-4.94l-7.18-5.58c-1.82%201.22-4.14%201.94-6.3%201.94-6.42%200-11.92-4.16-13.7-9.86l-7.74%206.16C6.96%2041.52%2014.82%2047%2024%2047z'/%3e%3cpath%20fill='none'%20d='M0%200h48v48H0z'/%3e%3c/svg%3e", Ge = { class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white p-16 flex flex-col gap-8" }, qe = { class: "flex items-center gap-8" }, Oe = ["src"], Ze = { class: "flex flex-col flex-1 min-w-0" }, Ke = { class: "fm-typo-en-body-md-600 truncate" }, We = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400" }, Je = { class: "flex items-center gap-4 shrink-0" }, Qe = ["src"], Xe = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400"
+}, et = { class: "flex items-center gap-4" }, tt = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-700 line-clamp-3"
+}, ot = {
+  key: 1,
+  class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-400 italic"
+}, lt = /* @__PURE__ */ M({
+  __name: "GoogleReviewCard",
+  props: {
+    review: {}
+  },
+  setup(t) {
+    const { t: l } = z();
+    return (c, s) => {
+      var r, u, d;
+      return o(), a("div", Ge, [
+        n("div", qe, [
+          (r = t.review.reviewer) != null && r.pictureUrl ? (o(), a("img", {
+            key: 0,
+            src: (u = t.review.reviewer) == null ? void 0 : u.pictureUrl,
+            class: "w-32 h-32 rounded-full shrink-0 object-cover"
+          }, null, 8, Oe)) : (o(), x(e(b).FmIcon, {
+            key: 1,
+            name: "person",
+            class: "text-fm-color-neutral-gray-300 shrink-0"
+          })),
+          n("div", Ze, [
+            n("span", Ke, v(((d = t.review.reviewer) == null ? void 0 : d.name) ?? e(l)("connect.review.overview.anonymous")), 1),
+            n("span", We, v(e(P)(t.review.createTime).format("D MMM YYYY, hh:mmA")), 1)
+          ]),
+          n("div", Je, [
+            n("img", {
+              src: e(Z),
+              class: "w-16 h-16"
+            }, null, 8, Qe),
+            t.review.locationDisplayName ? (o(), a("span", Xe, v(t.review.locationDisplayName), 1)) : I("", !0)
+          ])
+        ]),
+        n("div", et, [
+          (o(), a(F, null, U(5, (i) => g(e(b).FmIcon, {
+            key: i,
+            name: "star",
+            size: "sm",
+            class: B(
+              i <= t.review.starRating ? "text-yellow-400" : "text-fm-color-neutral-gray-200"
+            )
+          }, null, 8, ["class"])), 64))
+        ]),
+        t.review.comment ? (o(), a("p", tt, v(t.review.comment), 1)) : (o(), a("p", ot, v(e(l)("connect.review.overview.noComment")), 1))
+      ]);
+    };
+  }
+}), nt = /* @__PURE__ */ M({
+  __name: "ReviewCard",
+  props: {
+    review: {}
+  },
+  setup(t) {
+    const l = t, c = k(
+      () => l.review.source === "google" ? l.review : null
+    ), s = k(
+      () => l.review.source === "facebook" ? l.review : null
+    ), r = k(
+      () => l.review.source === "feedme" ? l.review : null
+    );
+    return (u, d) => c.value ? (o(), x(lt, {
+      key: 0,
+      review: c.value
+    }, null, 8, ["review"])) : s.value ? (o(), x(ke, {
+      key: 1,
+      review: s.value
+    }, null, 8, ["review"])) : r.value ? (o(), x(Ye, {
+      key: 2,
+      review: r.value
+    }, null, 8, ["review"])) : I("", !0);
+  }
+}), st = {
+  key: 0,
+  class: "flex justify-center py-32"
+}, at = {
+  key: 1,
+  class: "flex flex-col items-center justify-center py-48 gap-8"
+}, rt = { class: "fm-typo-en-body-md-400 text-fm-color-neutral-gray-400" }, ct = {
+  key: 3,
+  class: "flex justify-center py-16"
+}, it = /* @__PURE__ */ M({
+  __name: "ReviewFeed",
+  props: {
+    reviews: {},
+    loading: { type: Boolean },
+    hasMore: { type: Boolean }
+  },
+  emits: ["loadMore"],
+  setup(t, { emit: l }) {
+    const { t: c } = z(), s = t, r = l, u = C(null);
+    return D(() => {
+      const d = new IntersectionObserver(
+        (i) => {
+          i[0].isIntersecting && s.hasMore && !s.loading && r("loadMore");
+        },
+        { threshold: 0.5 }
+      );
+      u.value && d.observe(u.value), J(() => d.disconnect());
+    }), (d, i) => (o(), a(F, null, [
+      t.loading && t.reviews.length === 0 ? (o(), a("div", st, [
+        g(e(b).FmIcon, {
+          name: "sync",
+          size: "xl",
+          class: "animate-spin text-fm-color-neutral-gray-400"
+        })
+      ])) : t.reviews.length === 0 ? (o(), a("div", at, [
+        g(e(b).FmIcon, {
+          name: "rate_review",
+          size: "xl",
+          class: "text-fm-color-neutral-gray-300"
+        }),
+        n("p", rt, v(e(c)("connect.review.overview.empty")), 1)
+      ])) : (o(!0), a(F, { key: 2 }, U(t.reviews, (y) => (o(), x(nt, {
+        key: y._id,
+        review: y
+      }, null, 8, ["review"]))), 128)),
+      n("div", {
+        ref_key: "sentinel",
+        ref: u,
+        class: "h-1"
+      }, null, 512),
+      t.loading && t.reviews.length > 0 ? (o(), a("div", ct, [
+        g(e(b).FmIcon, {
+          name: "sync",
+          size: "md",
+          class: "animate-spin text-fm-color-neutral-gray-400"
+        })
+      ])) : I("", !0)
+    ], 64));
+  }
+}), ut = { class: "w-1/2 rounded-lg border border-fm-color-neutral-gray-200 bg-white p-5" }, dt = { class: "fm-typo-en-title-md-600 text-fm-color-typo-primary" }, mt = { class: "mt-16 grid grid-cols-[minmax(0,1fr)_minmax(140px,0.5fr)] gap-5" }, vt = { class: "mt-12 flex flex-col gap-8" }, ft = { class: "w-16 fm-typo-en-body-sm-400 text-fm-color-neutral-gray-500" }, gt = { class: "h-8 flex-1 overflow-hidden rounded-full bg-fm-color-neutral-gray-100" }, yt = { class: "w-24 text-right fm-typo-en-body-sm-400 text-fm-color-neutral-gray-500" }, wt = { class: "mt-8 flex flex-col items-center" }, pt = { class: "fm-typo-en-display-lg-800 text-fm-color-typo-primary" }, ht = {
+  class: "mt-8 flex items-center gap-1",
+  "aria-label": "Average rating"
+}, bt = { class: "mt-4 fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400" }, xt = /* @__PURE__ */ M({
+  __name: "ReviewSummary",
+  props: {
+    reviews: {}
+  },
+  setup(t) {
+    const l = t, c = k(
+      () => l.reviews.filter(
+        (i) => "starRating" in i
+      )
+    ), s = k(() => c.value.length ? (c.value.reduce(
+      (y, p) => y + p.starRating,
+      0
+    ) / c.value.length).toFixed(1) : "0.0"), r = k(() => Number(s.value)), u = k(
+      () => [5, 4, 3, 2, 1].map((i) => ({
+        star: i,
+        count: c.value.filter((y) => y.starRating === i).length
+      }))
+    );
+    function d(i) {
+      return `${Math.min(Math.max(r.value - i + 1, 0), 1) * 100}%`;
+    }
+    return (i, y) => (o(), a("div", ut, [
+      n("h2", dt, v(i.$t("connect.review.overview.summary")), 1),
+      n("div", mt, [
+        n("div", vt, [
+          (o(!0), a(F, null, U(e(u), (p) => (o(), a("div", {
+            key: p.star,
+            class: "flex items-center gap-8"
+          }, [
+            n("span", ft, v(p.star), 1),
+            g(e(b).FmIcon, {
+              name: "star",
+              size: "sm",
+              class: "text-amber-400"
+            }),
+            n("div", gt, [
+              n("div", {
+                class: "h-full rounded-full bg-amber-400 transition-[width]",
+                style: N({
+                  width: `${e(c).length ? p.count / e(c).length * 100 : 0}%`
+                })
+              }, null, 4)
+            ]),
+            n("span", yt, v(p.count), 1)
+          ]))), 128))
+        ]),
+        n("div", wt, [
+          n("span", pt, v(e(s)), 1),
+          n("div", ht, [
+            (o(), a(F, null, U(5, (p) => n("span", {
+              key: p,
+              class: "relative"
+            }, [
+              g(e(b).FmIcon, {
+                name: "star",
+                size: "md",
+                class: "text-fm-color-neutral-gray-200"
+              }),
+              n("span", {
+                class: "absolute inset-y-0 left-0 overflow-hidden",
+                style: N({ width: d(p) })
+              }, [
+                g(e(b).FmIcon, {
+                  name: "star",
+                  size: "md",
+                  class: "text-amber-400"
+                })
+              ], 4)
+            ])), 64))
+          ]),
+          n("span", bt, " (" + v(e(c).length) + ") ", 1)
+        ])
+      ])
+    ]));
+  }
+}), _t = { class: "p-24 flex flex-col gap-12" }, E = 20, kt = /* @__PURE__ */ M({
+  __name: "ReviewOverview",
+  setup(t) {
+    const l = C([]), c = C(!1), s = C(!0), r = C(null), u = C(null), d = C(null), i = C(""), y = C("createTime_desc");
+    Y(r, () => {
+      i.value = "";
+    });
+    function p($) {
+      return {
+        source: r.value || void 0,
+        dateFrom: u.value || void 0,
+        dateTo: d.value || void 0,
+        locationId: i.value || void 0,
+        sort: y.value,
+        limit: E,
+        skip: $
+      };
+    }
+    async function V() {
+      c.value = !0, s.value = !0;
+      try {
+        const $ = await T.listReviews(p(0));
+        l.value = $, s.value = $.length === E;
+      } finally {
+        c.value = !1;
+      }
+    }
+    async function S() {
+      if (!(c.value || !s.value)) {
+        c.value = !0;
+        try {
+          const $ = await T.listReviews(p(l.value.length));
+          l.value = [...l.value, ...$], s.value = $.length === E;
+        } finally {
+          c.value = !1;
+        }
+      }
+    }
+    return Y(
+      [r, u, d, i, y],
+      V
+    ), D(V), ($, w) => (o(), a("div", _t, [
+      g(xt, { reviews: e(l) }, null, 8, ["reviews"]),
+      g(ue, {
+        source: e(r),
+        "onUpdate:source": w[0] || (w[0] = (m) => R(r) ? r.value = m : null),
+        "date-from": e(u),
+        "onUpdate:dateFrom": w[1] || (w[1] = (m) => R(u) ? u.value = m : null),
+        "date-to": e(d),
+        "onUpdate:dateTo": w[2] || (w[2] = (m) => R(d) ? d.value = m : null),
+        "location-id": e(i),
+        "onUpdate:locationId": w[3] || (w[3] = (m) => R(i) ? i.value = m : null),
+        sort: e(y),
+        "onUpdate:sort": w[4] || (w[4] = (m) => R(y) ? y.value = m : null)
+      }, null, 8, ["source", "date-from", "date-to", "location-id", "sort"]),
+      g(it, {
+        reviews: e(l),
+        loading: e(c),
+        "has-more": e(s),
+        onLoadMore: S
+      }, null, 8, ["reviews", "loading", "has-more"])
+    ]));
+  }
+}), $t = { class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white overflow-hidden" }, Ct = ["src"], Ft = { class: "flex flex-col flex-1 min-w-0" }, It = { class: "fm-typo-en-body-md-600 capitalize" }, Mt = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400 truncate"
+}, q = /* @__PURE__ */ M({
+  __name: "ReviewSource",
+  props: {
+    icon: {},
+    name: {},
+    connected: { type: Boolean },
+    subtitle: {},
+    syncing: { type: Boolean },
+    tokenExpired: { type: Boolean }
+  },
+  emits: ["connect", "sync"],
+  setup(t, { emit: l }) {
+    const c = l, { t: s } = z(), r = Q();
+    return (u, d) => (o(), a("div", $t, [
+      n("div", {
+        class: B(["flex items-center gap-12 p-16", e(r).default ? "border-b border-fm-color-neutral-gray-100" : ""])
+      }, [
+        n("img", {
+          src: t.icon,
+          class: "w-10 h-10 shrink-0"
+        }, null, 8, Ct),
+        n("div", Ft, [
+          n("span", It, v(t.name), 1),
+          t.subtitle ? (o(), a("span", Mt, v(t.subtitle), 1)) : I("", !0)
+        ]),
+        t.connected ? (o(), a(F, { key: 0 }, [
+          t.tokenExpired ? (o(), x(e(b).FmChip, {
+            key: 0,
+            label: e(s)("connect.review.expired"),
+            variant: "critical"
+          }, null, 8, ["label"])) : I("", !0),
+          g(e(b).FmButton, {
+            variant: "secondary",
+            "prepend-icon": "refresh",
+            label: e(s)("connect.review.reconnect"),
+            onClick: d[0] || (d[0] = (i) => c("connect"))
+          }, null, 8, ["label"]),
+          t.tokenExpired ? I("", !0) : (o(), x(e(b).FmButton, {
+            key: 1,
+            variant: "primary",
+            "prepend-icon": "sync",
+            label: e(s)("connect.review.sync"),
+            loading: t.syncing,
+            onClick: d[1] || (d[1] = (i) => c("sync"))
+          }, null, 8, ["label", "loading"]))
+        ], 64)) : (o(), x(e(b).FmButton, {
+          key: 1,
+          "prepend-icon": "add",
+          label: e(s)("connect.review.connect"),
+          onClick: d[2] || (d[2] = (i) => c("connect"))
+        }, null, 8, ["label"]))
+      ], 2),
+      X(u.$slots, "default")
+    ]));
+  }
+}), Ut = { class: "p-24 flex flex-col gap-8" }, St = { class: "flex flex-col flex-1 min-w-0" }, Vt = { class: "fm-typo-en-body-lg-600 truncate" }, Rt = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400 truncate" }, zt = ["src"], Tt = { class: "flex flex-col flex-1 min-w-0" }, Bt = { class: "fm-typo-en-body-lg-600 truncate" }, Ht = { class: "fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400 truncate" }, Lt = /* @__PURE__ */ M({
+  __name: "ReviewSettings",
+  setup(t) {
+    const { t: l } = z(), c = ne(), s = C(null), r = C(!1), u = C(!1), d = k(
+      () => {
+        var m;
+        return s.value ? ((m = s.value.google) == null ? void 0 : m.token) === null : !1;
+      }
+    ), i = k(
+      () => {
+        var m;
+        return s.value ? ((m = s.value.facebook) == null ? void 0 : m.token) === null : !1;
+      }
+    );
+    function y(m) {
+      const f = window.location.pathname.replace(/\/review(?:\/.*)?$/, "");
+      return `${window.location.origin}${f}${m}`;
+    }
+    async function p() {
+      await se.minor(async () => {
+        s.value = await T.getSource();
+      });
+    }
+    async function V() {
+      var m, f;
+      r.value = !0;
+      try {
+        await T.syncGoogleReviews();
+      } catch (h) {
+        if (await p(), ((f = (m = s.value) == null ? void 0 : m.google) == null ? void 0 : f.token) === null) {
+          c.open({
+            message: l("connect.review.tokenExpired"),
+            type: "error"
+          });
+          return;
+        }
+        throw h;
+      } finally {
+        r.value = !1;
+      }
+    }
+    async function S() {
+      var m, f;
+      u.value = !0;
+      try {
+        await T.syncFacebookReviews();
+      } catch (h) {
+        if (await p(), ((f = (m = s.value) == null ? void 0 : m.facebook) == null ? void 0 : f.token) === null) {
+          c.open({
+            message: l("connect.review.tokenExpired"),
+            type: "error"
+          });
+          return;
+        }
+        throw h;
+      } finally {
+        u.value = !1;
+      }
+    }
+    async function $() {
+      const m = y("/review/google/callback"), { callbackUrl: f } = await T.getOauthUrl("google", m);
+      window.location.href = f;
+    }
+    async function w() {
+      const m = y("/review/facebook/callback"), { callbackUrl: f } = await T.getOauthUrl("facebook", m);
+      window.location.href = f;
+    }
+    return D(p), (m, f) => (o(), a("div", Ut, [
+      e(s) ? (o(), a(F, { key: 0 }, [
+        g(q, {
+          icon: e(Z),
+          name: "google",
+          connected: !!e(s).google,
+          syncing: e(r),
+          "token-expired": e(d),
+          onConnect: $,
+          onSync: V
+        }, {
+          default: j(() => {
+            var h;
+            return [
+              (o(!0), a(F, null, U((h = e(s).google) == null ? void 0 : h.locations, (_) => {
+                var A;
+                return o(), a("div", {
+                  key: _.googleLocationName,
+                  class: "flex items-center gap-12 px-16 py-12 border-b border-fm-color-neutral-gray-100 last:border-b-0"
+                }, [
+                  g(e(b).FmIcon, {
+                    name: "location_on",
+                    class: "text-fm-color-neutral-gray-300 shrink-0"
+                  }),
+                  n("div", St, [
+                    n("span", Vt, v(_.displayName), 1),
+                    n("span", Rt, v(((A = _.location) == null ? void 0 : A.name) ?? e(l)("connect.review.google.noLocations")), 1)
+                  ])
+                ]);
+              }), 128))
+            ];
+          }),
+          _: 1
+        }, 8, ["icon", "connected", "syncing", "token-expired"]),
+        g(q, {
+          icon: e(O),
+          name: "facebook",
+          connected: !!e(s).facebook,
+          syncing: e(u),
+          "token-expired": e(i),
+          onConnect: w,
+          onSync: S
+        }, {
+          default: j(() => {
+            var h;
+            return [
+              (o(!0), a(F, null, U((h = e(s).facebook) == null ? void 0 : h.pages, (_) => (o(), a("div", {
+                key: _.facebookPageId,
+                class: "flex items-center gap-12 px-16 py-12 border-b border-fm-color-neutral-gray-100 last:border-b-0"
+              }, [
+                _.pageProfileImageUrl ? (o(), a("img", {
+                  key: 0,
+                  src: _.pageProfileImageUrl,
+                  class: "w-10 h-10 rounded-full shrink-0 object-cover"
+                }, null, 8, zt)) : (o(), x(e(b).FmIcon, {
+                  key: 1,
+                  name: "person",
+                  class: "text-fm-color-neutral-gray-300 shrink-0"
+                })),
+                n("div", Tt, [
+                  n("span", Bt, v(_.pageName), 1),
+                  n("span", Ht, v(_.locations.map((A) => A.name).join(", ")), 1)
+                ])
+              ]))), 128))
+            ];
+          }),
+          _: 1
+        }, 8, ["icon", "connected", "syncing", "token-expired"])
+      ], 64)) : (o(), a(F, { key: 1 }, U(["google", "facebook"], (h) => n("div", {
+        key: h,
+        class: "rounded-lg border border-fm-color-neutral-gray-200 bg-white p-16"
+      }, [...f[0] || (f[0] = [
+        ee('<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))
+    ]));
+  }
+}), jt = { class: "flex flex-col" }, At = { class: "px-24" }, Kt = /* @__PURE__ */ M({
+  __name: "Review",
+  setup(t) {
+    const { t: l } = z(), c = [
+      { label: l("connect.review.tabs.overview"), value: "overview" },
+      { label: l("connect.review.tabs.settings"), value: "settings" }
+    ], s = C(c[0]);
+    return (r, u) => {
+      const d = H("FmPageHead"), i = H("FmTabs");
+      return o(), a(F, null, [
+        g(d, {
+          title: e(l)("connect.navigation.review")
+        }, null, 8, ["title"]),
+        n("div", jt, [
+          n("div", At, [
+            g(i, {
+              "model-value": e(s).value,
+              items: c,
+              "onUpdate:modelValue": u[0] || (u[0] = (y) => s.value = c.find((p) => p.value === y))
+            }, null, 8, ["model-value"])
+          ]),
+          (o(), x(te, null, [
+            e(s).value === "overview" ? (o(), x(kt, { key: 0 })) : e(s).value === "settings" ? (o(), x(Lt, { key: 1 })) : I("", !0)
+          ], 1024))
+        ])
+      ], 64);
+    };
+  }
+});
+export {
+  Kt as default
+};