import { defineComponent as V, computed as k, ref as C, resolveComponent as w, createElementBlock as g, openBlock as u, createElementVNode as i, createVNode as _, unref as a, withCtx as z, Fragment as K, renderList as P, toDisplayString as E, createBlock as S } from "vue";
import { useI18n as M } from "@feedmepos/mf-common";
import { useSnackbar as L, useBreakpoints as U, useDialog as A } from "@feedmepos/ui-library";
import { G as F, u as I, $ as Y, Q as T, M as j, A as q, a5 as G } from "./index.vue_vue_type_script_setup_true_lang-BMVa5UfU.js";
import { _ as Q } from "./app-D-J2cjak.js";
import { u as B } from "./menu-DNLXOwiM.js";
import { u as R } from "./category-g1gJyB0q.js";
const H = {
  key: 0
}, J = {
  class: "flex justify-end items-center"
}, W = {
  class: "w-[320px]"
}, X = {
  key: 1,
  class: "flex-1 flex flex-col min-h-0"
}, Z = {
  class: "p-8"
}, ee = {
  class: "flex flex-1 flex-col min-h-0 overflow-scroll divide-y divide-fm-color-neutral-gray-100 pb-64"
}, oe = {
  class: "flex-1 space-y-4"
}, te = {
  class: "fm-typo-en-body-lg-600"
}, ae = {
  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
}, ne = /* @__PURE__ */ V({
  __name: "CategoryTable",
  setup(D) {
    const f = L(), y = F(f), h = T(y), d = I(), {
      categories: v
    } = B(), b = k(() => {
      var r, t;
      const l = ((t = (r = d.currentCatalog) == null ? void 0 : r.override) == null ? void 0 : t.category) ?? {}, o = v.value.map((e, c) => {
        var p;
        return {
          ...e,
          // Addon should be at the end of the list
          position: e.id ? ((p = l[e.id]) == null ? void 0 : p.position) ?? c + 1 : null
        };
      });
      return Y(o, (e) => e.name);
    }), n = C(""), m = k(() => b.value.filter((l) => l.name.toLowerCase().includes(n.value.toLowerCase()))), {
      t: s
    } = M(), x = C([{
      accessorKey: "name",
      header: () => s("menu.category.columns.title"),
      enableSorting: !1,
      meta: {
        width: "auto"
      }
    }, {
      accessorKey: "items",
      header: () => s("menu.category.columns.products"),
      enableSorting: !1,
      size: 200,
      cell: (l) => {
        const o = l.row.original;
        return s(o.items.length > 1 ? "menu.common.labels.product_linked_plural" : "menu.common.labels.product_linked_singular", {
          count: o.items.length
        });
      }
    }]);
    async function N(l) {
      var e;
      const o = d.currentCatalog;
      if (!o)
        return;
      const {
        updateMenu: r
      } = h, t = ((e = o.override) == null ? void 0 : e.category) ?? {};
      l.forEach((c, p) => {
        c.id && (t != null && t[c.id] ? t[c.id].position = p + 1 : t[c.id] = {
          position: p + 1,
          _id: c.id
        });
      }), await r({
        module: q.F_MENU_MODULE_V4_KEY.enum.catalog,
        operation: j.F_OPERATION_TYPE.update,
        data: {
          ...o,
          override: {
            ...o.override,
            category: t
          }
        }
      }, "Category");
    }
    const O = U(), $ = k(() => O.breakpoints.value.xs);
    return (l, o) => {
      const r = w("FmSearch"), t = w("FmTable");
      return $.value ? (u(), g("div", X, [i("div", Z, [_(r, {
        autofocus: "",
        modelValue: n.value,
        "onUpdate:modelValue": o[1] || (o[1] = (e) => n.value = e),
        class: "w-full",
        placeholder: a(s)("menu.common.labels.search_placeholder", {
          type: a(s)("menu.category.title")
        })
      }, null, 8, ["modelValue", "placeholder"])]), i("div", ee, [(u(!0), g(K, null, P(m.value, (e) => (u(), g("div", {
        key: e.id || "",
        class: "flex flex-row py-12 px-16"
      }, [i("div", oe, [i("p", te, E(e.name), 1), i("p", ae, E(a(s)(e.items.length > 1 ? "menu.common.labels.product_linked_plural" : "menu.common.labels.product_linked_singular", {
        count: e.items.length
      })), 1)])]))), 128))])])) : (u(), g("div", H, [i("div", J, [i("div", W, [_(r, {
        modelValue: n.value,
        "onUpdate:modelValue": o[0] || (o[0] = (e) => n.value = e),
        autofocus: "",
        class: "mb-8",
        placeholder: a(s)("menu.common.labels.search_placeholder", {
          type: a(s)("menu.category.title")
        })
      }, null, 8, ["modelValue", "placeholder"])])]), _(Q, null, {
        default: z(() => [_(t, {
          "column-defs": x.value,
          draggable: a(d).rules.category.overrideSequence,
          "page-size": m.value.length,
          "row-data": m.value,
          "search-value": n.value,
          "shrink-at": !1,
          "hide-footer": "",
          "pin-header-row": "",
          onDndChanged: N
        }, null, 8, ["column-defs", "draggable", "page-size", "row-data", "search-value"])]),
        _: 1
      })]));
    };
  }
}), me = /* @__PURE__ */ V({
  __name: "Category",
  setup(D) {
    const f = A(), y = L(), h = F(y), d = T(h), v = R({ dialog: f, menuLoader: d }), { categories: b } = B(), { t: n } = M();
    function m() {
      v.create();
    }
    return (s, x) => a(b).length > 0 ? (u(), S(ne, {
      key: 0,
      class: "pt-16"
    })) : (u(), S(a(G), {
      key: 1,
      class: "pt-16",
      action: {
        text: a(n)("menu.category.add"),
        callback: m
      },
      subtitle: a(n)("menu.category.empty.subtitle"),
      title: a(n)("menu.category.empty.title")
    }, null, 8, ["action", "subtitle", "title"]));
  }
});
export {
  me as default
};
