@licklist/design 0.66.12-dev.1 → 0.66.12-dev.2

package/dist/events/edit-event-modal/component/SelectEventProductSet/SelectEventProductSet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectEventProductSet.d.ts","sourceRoot":"","sources":["../../../../../src/events/edit-event-modal/component/SelectEventProductSet/SelectEventProductSet.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAE,UAAU,EAAE,MAAM,6DAA6D,CAAC;AAEzF,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAGrE,UAAU,0BAA2B,SAAQ,iBAAiB;IAC5D,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,qBAAqB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,gBAAgB,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,qBAAqB,8HAO/B,0BAA0B,4CAkM5B,CAAC"}
+{"version":3,"file":"SelectEventProductSet.d.ts","sourceRoot":"","sources":["../../../../../src/events/edit-event-modal/component/SelectEventProductSet/SelectEventProductSet.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAE,UAAU,EAAE,MAAM,6DAA6D,CAAC;AAEzF,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAGrE,UAAU,0BAA2B,SAAQ,iBAAiB;IAC5D,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,qBAAqB,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,gBAAgB,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,qBAAqB,8HAO/B,0BAA0B,4CAsM5B,CAAC"}

package/dist/events/edit-event-modal/component/SelectEventProductSet/SelectEventProductSet.js

@@ -133,7 +133,7 @@ function _ts_generator(thisArg, body) {
 }
 var SelectEventProductSet = function(param) {
     var productSets = param.productSets, createProductSet = param.createProductSet, setEditProductSetId = param.setEditProductSetId, showEditProductSet = param.showEditProductSet, setShowEditProductSet = param.setShowEditProductSet, occurrenceStartAtDate = param.occurrenceStartAtDate;
-    var _productSets_find;
+    var _productSets_find, _productSets_find1;
     var t = useTranslation([
         "Design"
     ]).t;
@@ -142,7 +142,7 @@ var SelectEventProductSet = function(param) {
     var productSetsId = useId();
     var productSetId = watch("productSetId");
     var editedProductSet = watch("editedProductSet");
-    var selectedProductSet = (_productSets_find = productSets.find(function(productSet) {
+    (_productSets_find = productSets.find(function(productSet) {
         return productSet.id === productSetId;
     })) === null || _productSets_find === void 0 ? void 0 : _productSets_find.parentMenuId;
     var onEditProductSet = useCallback(function() {
@@ -206,7 +206,10 @@ var SelectEventProductSet = function(param) {
         }
         setValue("productSetId", value);
     };
-    var showOverrideProductSet = !showEditProductSet && productSetId && !selectedProductSet;
+    var showOverrideProductSet = !showEditProductSet && productSetId;
+    var isOverrideProductSet = (_productSets_find1 = productSets.find(function(productSet) {
+        return productSet.id === productSetId;
+    })) === null || _productSets_find1 === void 0 ? void 0 : _productSets_find1.isOverride;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var onSubmit = function(value) {
         setShowEditProductSet(false);
@@ -270,11 +273,11 @@ var SelectEventProductSet = function(param) {
                                                             onClick: handleCreateProductSet,
                                                             children: t("addNewProductSet")
                                                         }),
-                                                        /*#__PURE__*/ jsx(Button, {
+                                                        showOverrideProductSet && /*#__PURE__*/ jsx(Button, {
                                                             variant: "",
                                                             className: "btn product-set-button ",
                                                             onClick: onEditProductSet,
-                                                            children: showOverrideProductSet ? t("editProductSet") : t("editOverrides")
+                                                            children: isOverrideProductSet ? t("editOverrides") : t("editProductSet")
                                                         }),
                                                         showEditProductSet && /*#__PURE__*/ jsx(Button, {
                                                             variant: "",

package/dist/product-set/form/ProductCategoriesControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductCategoriesControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/ProductCategoriesControl.tsx"],"names":[],"mappings":"AAYA,OAAO,EAKL,YAAY,EACb,MAAM,kEAAkE,CAAC;AAQ1E,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAC;AASvE,UAAU,6BAA8B,SAAQ,aAAa;IAC3D,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AA0BD,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,SAAS,EACT,WAAW,EACX,qBAAqB,EACrB,oBAAoB,GACrB,EAAE,6BAA6B,2CAoT/B;AAED,eAAO,MAAM,cAAc,iBACX,YAAY,SACnB,MAAM,KACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,GAAG,IAczC,CAAC"}
+{"version":3,"file":"ProductCategoriesControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/ProductCategoriesControl.tsx"],"names":[],"mappings":"AAaA,OAAO,EAKL,YAAY,EACb,MAAM,kEAAkE,CAAC;AAQ1E,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAoCvE,UAAU,6BAA8B,SAAQ,aAAa;IAC3D,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AA0BD,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,SAAS,EACT,WAAW,EACX,qBAAqB,EACrB,oBAAoB,GACrB,EAAE,6BAA6B,2CA4T/B;AAED,eAAO,MAAM,cAAc,iBACX,YAAY,SACnB,MAAM,KACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,GAAG,IAczC,CAAC"}

package/dist/product-set/form/ProductCategoriesControl.js

@@ -1,9 +1,10 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useContext, useState, useEffect } from 'react';
 import HookFormService from '@licklist/plugins/dist/services/Form/HookFormService';
 import { uniqueId } from 'lodash';
 import { Badge } from 'react-bootstrap';
 import { useFormContext, useFieldArray, useWatch, Controller } from 'react-hook-form';
+import { FaTicketAlt, FaCalendar, FaBars, FaBowlingBall } from 'react-icons/fa';
 import { useTranslation } from 'react-i18next';
 import { useSensor, MouseSensor } from '@dnd-kit/core';
 import { CATEGORY_TYPE_GAME, CATEGORY_TYPE_FIXED_DURATION, QUANTITY_TYPE_STANDARD, CATEGORY_TYPE_TICKETS } from '@licklist/core/dist/DataMapper/Product/ProductCategoryDataMapper';
@@ -13,7 +14,7 @@ import { ProductSetModalClasses } from '../../sortable-tree/SortableTreeItem.js'
 import { CreateProductSetItem } from '../item/CreateProductSetItem.js';
 import { ProductCategoryControl } from '../product-category/ProductCategoryControl.js';
 import { ProductsControl } from './ProductsControl.js';
-import { SelectCategoryModal } from './SelectCategoryModal.js';
+import { CATEGORY_TYPES_NAMES, SelectCategoryModal } from './SelectCategoryModal.js';
 import { ProductSetLoadingContext } from './context.js';
 import { VenueMapSetModal } from './VenueMapSetModal.js';
 import { sortArrayByIndex, moveArrayElements } from '../utils/index.js';
@@ -117,6 +118,40 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
+var _obj;
+// @TODO not for first release
+// import Popover from "./ProductSetFormPopover";
+var CATEGORIES_TYPE = (_obj = {}, _define_property(_obj, CATEGORY_TYPES_NAMES.tickets, {
+    label: "tickets",
+    icon: /*#__PURE__*/ jsx(FaTicketAlt, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.bookings, {
+    label: "bookings",
+    icon: /*#__PURE__*/ jsx(FaCalendar, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.menuItems, {
+    label: "menuItems",
+    icon: /*#__PURE__*/ jsx(FaBars, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.game, {
+    label: "game",
+    icon: /*#__PURE__*/ jsx(FaBowlingBall, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _define_property(_obj, CATEGORY_TYPES_NAMES.fixedDuration, {
+    label: "fixedDuration",
+    icon: /*#__PURE__*/ jsx(FaCalendar, {
+        color: "#0e8ce2",
+        size: 10
+    })
+}), _obj);
 var getCategoryDefaultValue = function(categoryType, sort) {
     return {
         id: null,
@@ -250,6 +285,7 @@ function ProductCategoriesControl(param) {
                     var onSetIsExpanded = function() {
                         setIsExpanded(productCategoryId);
                     };
+                    var categoryType = CATEGORIES_TYPE[productCategory.type];
                     return /*#__PURE__*/ jsx(Controller, {
                         name: "".concat(productCategoriesFieldName, ".").concat(index, ".name"),
                         control: control,
@@ -299,6 +335,16 @@ function ProductCategoriesControl(param) {
                                 secondaryBadge: getBadgeConfig(productCategory.type, t(productCategory.type)),
                                 modalClass: ProductSetModalClasses.category,
                                 isNewAdded: showCategoryModal,
+                                itemButton: /*#__PURE__*/ jsxs("div", {
+                                    className: "btn-outline-primary item-icon sm border border-primary rounded-sm",
+                                    children: [
+                                        categoryType.icon,
+                                        /*#__PURE__*/ jsx("span", {
+                                            className: "ml-2",
+                                            children: t(categoryType.label)
+                                        })
+                                    ]
+                                }),
                                 body: /*#__PURE__*/ jsx(ProductCategoryControl, {
                                     isLoading: isLoading,
                                     onCategoryNameChange: onChange,

package/dist/product-set/form/SelectCategoryModal.d.ts

@@ -1,4 +1,16 @@
+import { ReactElement } from "react";
 import { CategoryType } from "@licklist/core/dist/DataMapper/Product/ProductCategoryDataMapper";
+export declare const CATEGORY_TYPES_NAMES: {
+    readonly menuItems: "menuItems";
+    readonly tickets: "tickets";
+    readonly bookings: "bookings";
+    readonly game: "game";
+    readonly fixedDuration: "fixedDuration";
+};
+export type CategoryConfig = {
+    label: string;
+    icon: ReactElement;
+};
 export interface SelectCategoryModalProps {
     isVisible: boolean;
     onHide: () => void;

package/dist/product-set/form/SelectCategoryModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCategoryModal.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/SelectCategoryModal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAML,YAAY,EACb,MAAM,kEAAkE,CAAC;AAoD1E,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;CACpD;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,MAAM,EACN,gBAAgB,GACjB,EAAE,wBAAwB,2CAyH1B"}
+{"version":3,"file":"SelectCategoryModal.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/SelectCategoryModal.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAwB,MAAM,OAAO,CAAC;AAG3D,OAAO,EAML,YAAY,EACb,MAAM,kEAAkE,CAAC;AAgB1E,eAAO,MAAM,oBAAoB;;;;;;CAMvB,CAAC;AAEX,MAAM,MAAM,cAAc,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,YAAY,CAAA;CAAE,CAAC;AA4BnE,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;CACpD;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,MAAM,EACN,gBAAgB,GACjB,EAAE,wBAAwB,2CAyH1B"}

package/dist/product-set/form/SelectCategoryModal.js

@@ -242,4 +242,4 @@ function SelectCategoryModal(param) {
     });
 }
 
-export { SelectCategoryModal };
+export { CATEGORY_TYPES_NAMES, SelectCategoryModal };

package/dist/sortable-tree/SortableTreeItem.d.ts

@@ -14,6 +14,7 @@ export interface SortableTreeItemProps {
     body: ReactNode;
     children?: ReactNode;
     preItem?: ReactNode;
+    itemButton?: ReactNode;
     postItem?: ReactNode;
     sortableItems?: string[];
     isExpanded?: boolean;
@@ -36,5 +37,5 @@ export interface SortableTreeItemProps {
     setIsExpanded?: () => void;
     isOverride?: boolean;
 }
-export declare function SortableTreeItem({ id, title, badge, subTitle, body, children, preItem, postItem, sortableItems, isExpanded, shouldExpand, isInvalid, isIconInHeader, treeLineIconColor, modalLabel, modalClass, isNewAdded, onDelete, validate, cancelChanges, saveValidField, edit, secondaryBadge, setIsExpanded, isOverride, }: SortableTreeItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function SortableTreeItem({ id, title, badge, subTitle, body, children, preItem, postItem, sortableItems, isExpanded, shouldExpand, isInvalid, isIconInHeader, treeLineIconColor, modalLabel, modalClass, isNewAdded, onDelete, validate, cancelChanges, saveValidField, edit, secondaryBadge, setIsExpanded, isOverride, itemButton, }: SortableTreeItemProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SortableTreeItem.d.ts.map

package/dist/sortable-tree/SortableTreeItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SortableTreeItem.d.ts","sourceRoot":"","sources":["../../src/sortable-tree/SortableTreeItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AAiBpE,eAAO,MAAM,sBAAsB;;;;;CAKzB,CAAC;AAEX,MAAM,MAAM,0BAA0B,GACpC,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,OAAO,sBAAsB,CAAC,CAAC;AAEvE,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,UAAU,CAAC,EAAE,0BAA0B,CAAC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;IAClC,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,aAAa,EACb,UAAkB,EAClB,YAAmB,EACnB,SAAiB,EACjB,cAAqB,EACrB,iBAAsB,EACtB,UAAe,EACf,UAAU,EACV,UAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,cAAc,EACd,IAAI,EACJ,cAAc,EACd,aAAa,EACb,UAAU,GACX,EAAE,qBAAqB,2CA2TvB"}
+{"version":3,"file":"SortableTreeItem.d.ts","sourceRoot":"","sources":["../../src/sortable-tree/SortableTreeItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EAIV,MAAM,OAAO,CAAC;AAiBf,eAAO,MAAM,sBAAsB;;;;;CAKzB,CAAC;AAEX,MAAM,MAAM,0BAA0B,GACpC,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,OAAO,sBAAsB,CAAC,CAAC;AAEvE,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,UAAU,CAAC,EAAE,0BAA0B,CAAC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;IAClC,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,aAAa,EACb,UAAkB,EAClB,YAAmB,EACnB,SAAiB,EACjB,cAAqB,EACrB,iBAAsB,EACtB,UAAe,EACf,UAAU,EACV,UAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,cAAc,EACd,IAAI,EACJ,cAAc,EACd,aAAa,EACb,UAAU,EACV,UAAU,GACX,EAAE,qBAAqB,2CA+TvB"}

package/dist/sortable-tree/SortableTreeItem.js

@@ -240,7 +240,7 @@ var ProductSetModalClasses = {
     productZones: "edit-product-zone"
 };
 function SortableTreeItem(param) {
-    var id = param.id, title = param.title, badge = param.badge, subTitle = param.subTitle, body = param.body, children = param.children, preItem = param.preItem, postItem = param.postItem, sortableItems = param.sortableItems, _param_isExpanded = param.isExpanded, isExpanded = _param_isExpanded === void 0 ? false : _param_isExpanded, _param_shouldExpand = param.shouldExpand, shouldExpand = _param_shouldExpand === void 0 ? true : _param_shouldExpand, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isIconInHeader = param.isIconInHeader, isIconInHeader = _param_isIconInHeader === void 0 ? true : _param_isIconInHeader, _param_treeLineIconColor = param.treeLineIconColor, treeLineIconColor = _param_treeLineIconColor === void 0 ? "" : _param_treeLineIconColor, _param_modalLabel = param.modalLabel, modalLabel = _param_modalLabel === void 0 ? "" : _param_modalLabel, modalClass = param.modalClass, _param_isNewAdded = param.isNewAdded, isNewAdded = _param_isNewAdded === void 0 ? false : _param_isNewAdded, onDelete = param.onDelete, validate = param.validate, cancelChanges = param.cancelChanges, saveValidField = param.saveValidField, edit = param.edit, secondaryBadge = param.secondaryBadge, setIsExpanded = param.setIsExpanded, isOverride = param.isOverride;
+    var id = param.id, title = param.title, badge = param.badge, subTitle = param.subTitle, body = param.body, children = param.children, preItem = param.preItem, postItem = param.postItem, sortableItems = param.sortableItems, _param_isExpanded = param.isExpanded, isExpanded = _param_isExpanded === void 0 ? false : _param_isExpanded, _param_shouldExpand = param.shouldExpand, shouldExpand = _param_shouldExpand === void 0 ? true : _param_shouldExpand, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isIconInHeader = param.isIconInHeader, isIconInHeader = _param_isIconInHeader === void 0 ? true : _param_isIconInHeader, _param_treeLineIconColor = param.treeLineIconColor, treeLineIconColor = _param_treeLineIconColor === void 0 ? "" : _param_treeLineIconColor, _param_modalLabel = param.modalLabel, modalLabel = _param_modalLabel === void 0 ? "" : _param_modalLabel, modalClass = param.modalClass, _param_isNewAdded = param.isNewAdded, isNewAdded = _param_isNewAdded === void 0 ? false : _param_isNewAdded, onDelete = param.onDelete, validate = param.validate, cancelChanges = param.cancelChanges, saveValidField = param.saveValidField, edit = param.edit, secondaryBadge = param.secondaryBadge, setIsExpanded = param.setIsExpanded, isOverride = param.isOverride, itemButton = param.itemButton;
     var _useState = _sliced_to_array(useState(isExpanded), 2), expanded = _useState[0], setExpanded = _useState[1];
     var _useState1 = _sliced_to_array(useState(isNewAdded), 2), isModalVisible = _useState1[0], setIsModalVisible = _useState1[1];
     var t = useTranslation("Design").t;
@@ -433,9 +433,15 @@ function SortableTreeItem(param) {
                                                 /*#__PURE__*/ jsxs("div", {
                                                     className: clsx(modalLabel ? "sortable-tree-product-set-title-container" : "sortable-tree-title-container"),
                                                     children: [
-                                                        /*#__PURE__*/ jsx("span", {
-                                                            className: clsx("sortable-tree-item-title", modalLabel && "sortable-tree-product-set-element-title"),
-                                                            children: title
+                                                        /*#__PURE__*/ jsxs("span", {
+                                                            className: clsx("sortable-tree-item-title", modalLabel && "sortable-tree-product-set-element-title", "d-flex justify-content-between"),
+                                                            children: [
+                                                                title,
+                                                                /*#__PURE__*/ jsx("div", {
+                                                                    className: "sortable-tree-item-subtitle",
+                                                                    children: itemButton
+                                                                })
+                                                            ]
                                                         }),
                                                         !expanded && /*#__PURE__*/ jsx("span", {
                                                             className: "sortable-tree-item-subtitle",

package/dist/styles/product-set/ProductSetForm.scss

@@ -1,4 +1,5 @@
 .product-set-form {
+
   input,
   textarea,
   select,
@@ -15,10 +16,12 @@
     height: 2.5rem;
     border-width: 2px;
     padding: 2px;
+
     label,
     .btn-switch-indicator {
       border-radius: 0.375rem !important;
     }
+
     label {
       height: 2rem;
     }
@@ -34,6 +37,7 @@
       margin-top: 1.5rem;
       margin-bottom: 1.5rem;
     }
+
     @include media-breakpoint-down(sm) {
       padding: 1.5rem 1rem;
       margin-top: 0.5rem;
@@ -50,7 +54,7 @@
 
   .step-badge,
   .category-badge,
-  .product-badge  {
+  .product-badge {
     font-size: 0.875rem;
     font-weight: 600;
   }
@@ -59,10 +63,21 @@
     background-color: #ffdbdb;
     color: #d52902;
   }
+
   .category-badge {
     background-color: #e8f4f6;
     color: #1a93aa;
   }
+
+  .item-icon {
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    font-size: 0.65rem;
+    padding: 0.2rem;
+    margin-right: 1rem;
+  }
+
   .product-badge {
     background-color: #e9f5ea;
     color: #269b36;
@@ -77,10 +92,12 @@
 
 .product-set-mobile-modal {
   margin: 0;
+
   .modal-content {
     border-radius: 1rem 1rem 0 0;
     border-width: 0;
     margin: 0;
+
     .modal-body {
       padding: 1rem 0;
     }
@@ -102,18 +119,22 @@
     font-weight: 600;
     font-size: 0.625rem;
   }
+
   .product-set-subtitle-dot {
     margin-right: 0.375rem;
     width: 0.375rem;
     height: 0.375rem;
     border-radius: 3px;
   }
+
   .product-set-subtitle-category-dot {
     background-color: #269b36;
   }
+
   .product-set-subtitle-step-dot {
     background-color: #1a93aa;
   }
+
   .product-set-subtitle-product-dot {
     background-color: #269b36;
   }
@@ -158,6 +179,7 @@
     justify-self: flex-end;
     align-items: flex-end;
   }
+
   .small-badge {
     font-size: 0.5rem;
     height: 1rem;
@@ -165,6 +187,7 @@
     padding: 0 0.2rem;
     margin-bottom: 0.2rem;
   }
+
   .product-set-save-btn-wrapper {
     padding-left: 0 !important;
     display: flex;
@@ -182,7 +205,7 @@
 
   .product-zone-badge {
     background-color: #EFE9F5;
-    color:#84269B;
+    color: #84269B;
     font-size: 0.875rem;
     font-weight: 600;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.66.12-dev.1",
+  "version": "0.66.12-dev.2",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"

package/src/events/edit-event-modal/component/SelectEventProductSet/SelectEventProductSet.tsx

@@ -90,8 +90,11 @@ export const SelectEventProductSet = ({
     setValue("productSetId", value);
   };
 
-  const showOverrideProductSet =
-    !showEditProductSet && productSetId && !selectedProductSet;
+  const showOverrideProductSet = !showEditProductSet && productSetId;
+
+  const isOverrideProductSet = productSets.find(
+    (productSet) => productSet.id === productSetId,
+  )?.isOverride;
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const onSubmit = (value: EditEventFormValues["editedProductSet"]) => {
@@ -168,16 +171,17 @@ export const SelectEventProductSet = ({
                           {t("addNewProductSet")}
                         </Button>
                       )}
-                      <Button
-                        variant=""
-                        className="btn product-set-button "
-                        onClick={onEditProductSet}
-                      >
-                        {showOverrideProductSet
-                          ? t("editProductSet")
-                          : t("editOverrides")}
-                      </Button>
-
+                      {showOverrideProductSet && (
+                        <Button
+                          variant=""
+                          className="btn product-set-button "
+                          onClick={onEditProductSet}
+                        >
+                          {isOverrideProductSet
+                            ? t("editOverrides")
+                            : t("editProductSet")}
+                        </Button>
+                      )}
                       {showEditProductSet && (
                         <Button
                           variant=""

package/src/product-set/form/ProductCategoriesControl.tsx

@@ -1,13 +1,14 @@
 import { useEffect, useState, useContext } from "react";
 import HookFormService from "@licklist/plugins/dist/services/Form/HookFormService";
 import { uniqueId } from "lodash";
-import { Badge } from "react-bootstrap";
+import { Badge, Button } from "react-bootstrap";
 import {
   Controller,
   useFieldArray,
   useFormContext,
   useWatch,
 } from "react-hook-form";
+import { FaBars, FaBowlingBall, FaCalendar, FaTicketAlt } from "react-icons/fa";
 import { useTranslation } from "react-i18next";
 import { useSensor, MouseSensor } from "@dnd-kit/core";
 import {
@@ -25,7 +26,11 @@ import { ProductCategoryControl } from "../product-category";
 import { ProductCategory } from "../types";
 import { ProductsControl } from "./ProductsControl";
 import { ProductSetFormValues, WithIsLoading } from "./ProductSetForm";
-import { SelectCategoryModal } from "./SelectCategoryModal";
+import {
+  SelectCategoryModal,
+  CATEGORY_TYPES_NAMES,
+  CategoryConfig,
+} from "./SelectCategoryModal";
 import { ProductSetLoadingContext } from "./context";
 import { VenueMapSetModal } from "./VenueMapSetModal";
 import { moveArrayElements, sortArrayByIndex } from "../utils";
@@ -33,6 +38,29 @@ import { useSortableTreeFunctions } from "../hooks/useSortableTreeFunctions";
 // @TODO not for first release
 // import Popover from "./ProductSetFormPopover";
 
+const CATEGORIES_TYPE: Partial<Record<CategoryType, CategoryConfig>> = {
+  [CATEGORY_TYPES_NAMES.tickets]: {
+    label: "tickets",
+    icon: <FaTicketAlt color="#0e8ce2" size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.bookings]: {
+    label: "bookings",
+    icon: <FaCalendar color="#0e8ce2" size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.menuItems]: {
+    label: "menuItems",
+    icon: <FaBars color="#0e8ce2" size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.game]: {
+    label: "game",
+    icon: <FaBowlingBall color="#0e8ce2" size={10} />,
+  },
+  [CATEGORY_TYPES_NAMES.fixedDuration]: {
+    label: "fixedDuration",
+    icon: <FaCalendar color="#0e8ce2" size={10} />,
+  },
+};
+
 interface ProductCategoriesControlProps extends WithIsLoading {
   stepIndex: number;
   isOverrides?: boolean;
@@ -228,6 +256,8 @@ export function ProductCategoriesControl({
             setIsExpanded(productCategoryId);
           };
 
+          const categoryType = CATEGORIES_TYPE[productCategory.type];
+
           return (
             <Controller
               key={`product-category-${productCategory._id}`}
@@ -272,6 +302,12 @@ export function ProductCategoriesControl({
                   )}
                   modalClass={ProductSetModalClasses.category}
                   isNewAdded={showCategoryModal}
+                  itemButton={
+                    <div className="btn-outline-primary item-icon sm border border-primary rounded-sm">
+                      {categoryType.icon}
+                      <span className="ml-2">{t(categoryType.label)}</span>
+                    </div>
+                  }
                   body={
                     <ProductCategoryControl
                       isLoading={isLoading}

package/src/product-set/form/SelectCategoryModal.tsx

@@ -25,7 +25,7 @@ import {
 } from "react-icons/fa";
 import { ProductSetLoadingContext } from "./context";
 
-const CATEGORY_TYPES_NAMES = {
+export const CATEGORY_TYPES_NAMES = {
   menuItems: CATEGORY_TYPE_MENU_ITEMS,
   tickets: CATEGORY_TYPE_TICKETS,
   bookings: CATEGORY_TYPE_BOOKINGS,
@@ -33,7 +33,7 @@ const CATEGORY_TYPES_NAMES = {
   fixedDuration: CATEGORY_TYPE_FIXED_DURATION,
 } as const;
 
-type CategoryConfig = { label: string; icon: ReactElement };
+export type CategoryConfig = { label: string; icon: ReactElement };
 
 const MAIN_CATEGORIES: Partial<Record<CategoryType, CategoryConfig>> = {
   [CATEGORY_TYPES_NAMES.tickets]: {

package/src/sortable-tree/SortableTreeItem.tsx

@@ -1,4 +1,10 @@
-import { ReactNode, useCallback, useEffect, useState } from "react";
+import {
+  ReactElement,
+  ReactNode,
+  useCallback,
+  useEffect,
+  useState,
+} from "react";
 import { DndContext, useDraggable } from "@dnd-kit/core";
 import {
   SortableContext,
@@ -33,6 +39,7 @@ export interface SortableTreeItemProps {
   body: ReactNode;
   children?: ReactNode;
   preItem?: ReactNode;
+  itemButton?: ReactNode;
   postItem?: ReactNode;
   sortableItems?: string[];
   isExpanded?: boolean;
@@ -82,6 +89,7 @@ export function SortableTreeItem({
   secondaryBadge,
   setIsExpanded,
   isOverride,
+  itemButton,
 }: SortableTreeItemProps) {
   const [expanded, setExpanded] = useState(isExpanded);
   const [isModalVisible, setIsModalVisible] = useState(isNewAdded);
@@ -287,9 +295,13 @@ export function SortableTreeItem({
                     className={clsx(
                       "sortable-tree-item-title",
                       modalLabel && "sortable-tree-product-set-element-title",
+                      "d-flex justify-content-between",
                     )}
                   >
                     {title}
+                    <div className="sortable-tree-item-subtitle">
+                      {itemButton}
+                    </div>
                   </span>
                   {!expanded && (
                     <span className="sortable-tree-item-subtitle">

package/src/styles/product-set/ProductSetForm.scss

@@ -1,4 +1,5 @@
 .product-set-form {
+
   input,
   textarea,
   select,
@@ -15,10 +16,12 @@
     height: 2.5rem;
     border-width: 2px;
     padding: 2px;
+
     label,
     .btn-switch-indicator {
       border-radius: 0.375rem !important;
     }
+
     label {
       height: 2rem;
     }
@@ -34,6 +37,7 @@
       margin-top: 1.5rem;
       margin-bottom: 1.5rem;
     }
+
     @include media-breakpoint-down(sm) {
       padding: 1.5rem 1rem;
       margin-top: 0.5rem;
@@ -50,7 +54,7 @@
 
   .step-badge,
   .category-badge,
-  .product-badge  {
+  .product-badge {
     font-size: 0.875rem;
     font-weight: 600;
   }
@@ -59,10 +63,21 @@
     background-color: #ffdbdb;
     color: #d52902;
   }
+
   .category-badge {
     background-color: #e8f4f6;
     color: #1a93aa;
   }
+
+  .item-icon {
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    font-size: 0.65rem;
+    padding: 0.2rem;
+    margin-right: 1rem;
+  }
+
   .product-badge {
     background-color: #e9f5ea;
     color: #269b36;
@@ -77,10 +92,12 @@
 
 .product-set-mobile-modal {
   margin: 0;
+
   .modal-content {
     border-radius: 1rem 1rem 0 0;
     border-width: 0;
     margin: 0;
+
     .modal-body {
       padding: 1rem 0;
     }
@@ -102,18 +119,22 @@
     font-weight: 600;
     font-size: 0.625rem;
   }
+
   .product-set-subtitle-dot {
     margin-right: 0.375rem;
     width: 0.375rem;
     height: 0.375rem;
     border-radius: 3px;
   }
+
   .product-set-subtitle-category-dot {
     background-color: #269b36;
   }
+
   .product-set-subtitle-step-dot {
     background-color: #1a93aa;
   }
+
   .product-set-subtitle-product-dot {
     background-color: #269b36;
   }
@@ -158,6 +179,7 @@
     justify-self: flex-end;
     align-items: flex-end;
   }
+
   .small-badge {
     font-size: 0.5rem;
     height: 1rem;
@@ -165,6 +187,7 @@
     padding: 0 0.2rem;
     margin-bottom: 0.2rem;
   }
+
   .product-set-save-btn-wrapper {
     padding-left: 0 !important;
     display: flex;
@@ -182,7 +205,7 @@
 
   .product-zone-badge {
     background-color: #EFE9F5;
-    color:#84269B;
+    color: #84269B;
     font-size: 0.875rem;
     font-weight: 600;
   }

package/yarn.lock

@@ -5077,14 +5077,14 @@ __metadata:
   linkType: hard
 
 "@tiptap/extension-bubble-menu@npm:^2.0.0-beta.56":
-  version: 2.6.6
-  resolution: "@tiptap/extension-bubble-menu@npm:2.6.6"
+  version: 2.7.0
+  resolution: "@tiptap/extension-bubble-menu@npm:2.7.0"
   dependencies:
     tippy.js: "npm:^6.3.7"
   peerDependencies:
-    "@tiptap/core": ^2.6.6
-    "@tiptap/pm": ^2.6.6
-  checksum: 10c0/4a00b73d133a90bc9baf977da352ced971eeba3930a3e34ddc14bfbb0f7742d07f7087a8ec35b700ff64b2a21bf601a55bd96dcee28c9bdf9d2dd79d545d2a64
+    "@tiptap/core": ^2.7.0-pre.0
+    "@tiptap/pm": ^2.7.0-pre.0
+  checksum: 10c0/817de16ccb9837dc01080e6d1f7c77ae3ee69ae7e5d4b804dcc5f090e53e4a3e95a33aee978c65db7917742038cc5894f96a44696d00f409f9cf45c92672a2b9
   languageName: node
   linkType: hard
 
@@ -5107,14 +5107,14 @@ __metadata:
   linkType: hard
 
 "@tiptap/extension-floating-menu@npm:^2.0.0-beta.51":
-  version: 2.6.6
-  resolution: "@tiptap/extension-floating-menu@npm:2.6.6"
+  version: 2.7.0
+  resolution: "@tiptap/extension-floating-menu@npm:2.7.0"
   dependencies:
     tippy.js: "npm:^6.3.7"
   peerDependencies:
-    "@tiptap/core": ^2.6.6
-    "@tiptap/pm": ^2.6.6
-  checksum: 10c0/0184135d57f195e34f968645bb4c445bc089e8ac88886b3fed08500767b4f4cf2a5ac6d0d43735ddf13ed7c0eb44f4f179469f3b784edd63cca748ce46c7a55d
+    "@tiptap/core": ^2.7.0-pre.0
+    "@tiptap/pm": ^2.7.0-pre.0
+  checksum: 10c0/41e74d119bf2a006f7251e5a8703dfd57edb58766aa2a431443ef8463e9f4da699d970f50ea5bfd4ca7c0322a76ff170c0418d72bbdb5a61d54756253fdacb1e
   languageName: node
   linkType: hard
 
@@ -5646,9 +5646,9 @@ __metadata:
   linkType: hard
 
 "@types/prop-types@npm:*, @types/prop-types@npm:^15.7.3":
-  version: 15.7.12
-  resolution: "@types/prop-types@npm:15.7.12"
-  checksum: 10c0/1babcc7db6a1177779f8fde0ccc78d64d459906e6ef69a4ed4dd6339c920c2e05b074ee5a92120fe4e9d9f1a01c952f843ebd550bee2332fc2ef81d1706878f8
+  version: 15.7.13
+  resolution: "@types/prop-types@npm:15.7.13"
+  checksum: 10c0/1b20fc67281902c6743379960247bc161f3f0406ffc0df8e7058745a85ea1538612109db0406290512947f9632fe9e10e7337bf0ce6338a91d6c948df16a7c61
   languageName: node
   linkType: hard
 
@@ -5842,16 +5842,16 @@ __metadata:
   linkType: hard
 
 "@types/react@npm:*, @types/react@npm:16 || 17 || 18, @types/react@npm:>=16.14.8, @types/react@npm:>=16.9.11":
-  version: 18.3.5
-  resolution: "@types/react@npm:18.3.5"
+  version: 18.3.7
+  resolution: "@types/react@npm:18.3.7"
   dependencies:
     "@types/prop-types": "npm:*"
     csstype: "npm:^3.0.2"
-  checksum: 10c0/548b1d3d7c2f0242fbfdbbd658731b4ce69a134be072fa83e6ab516f2840402a3f20e3e7f72e95133b23d4880ef24a6d864050dc8e1f7c68f39fa87ca8445917
+  checksum: 10c0/460f40eadf1fd035344b2ff9061d5c2314db9403f76d05fff7724c78543737c95829e1628567c63d27b542647867eca5b6f284dfd38f1d3b70754f32c4cbecb7
   languageName: node
   linkType: hard
 
-"@types/react@npm:17.0.80, @types/react@npm:^17":
+"@types/react@npm:17.0.80":
   version: 17.0.80
   resolution: "@types/react@npm:17.0.80"
   dependencies:
@@ -5862,6 +5862,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/react@npm:^17":
+  version: 17.0.82
+  resolution: "@types/react@npm:17.0.82"
+  dependencies:
+    "@types/prop-types": "npm:*"
+    "@types/scheduler": "npm:^0.16"
+    csstype: "npm:^3.0.2"
+  checksum: 10c0/86a6797988cea1b63083eb1742be7bccce77bd0e240bce490b89f3e420c1fa24cd45454d8c0bb6f1b4465ca8e9f35a7bbe60beada8b5bd05a2cf62d3f0c2460e
+  languageName: node
+  linkType: hard
+
 "@types/resize-observer-browser@npm:0.1.7":
   version: 0.1.7
   resolution: "@types/resize-observer-browser@npm:0.1.7"
@@ -7135,17 +7146,17 @@ __metadata:
   linkType: hard
 
 "babel-loader@npm:^8.2.2":
-  version: 8.3.0
-  resolution: "babel-loader@npm:8.3.0"
+  version: 8.4.1
+  resolution: "babel-loader@npm:8.4.1"
   dependencies:
     find-cache-dir: "npm:^3.3.1"
-    loader-utils: "npm:^2.0.0"
+    loader-utils: "npm:^2.0.4"
     make-dir: "npm:^3.1.0"
     schema-utils: "npm:^2.6.5"
   peerDependencies:
     "@babel/core": ^7.0.0
     webpack: ">=2"
-  checksum: 10c0/7b83bae35a12fbc5cdf250e2d36a288305fe5b6d20ab044ab7c09bbf456c8895b80af7a4f1e8b64b5c07a4fd48d4b5144dab40b4bc72a4fed532dc000362f38f
+  checksum: 10c0/efdca9c3ef502af58b923a32123d660c54fd0be125b7b64562c8a43bda0a3a55dac0db32331674104e7e5184061b75c3a0e395b2c5ccdc7cb2125dd9ec7108d2
   languageName: node
   linkType: hard
 
@@ -9548,9 +9559,9 @@ __metadata:
   linkType: hard
 
 "electron-to-chromium@npm:^1.3.564, electron-to-chromium@npm:^1.5.4":
-  version: 1.5.23
-  resolution: "electron-to-chromium@npm:1.5.23"
-  checksum: 10c0/a2f76d3ffae24635ff13597a7e4ddd73bd7ee2124e021d34a60faafc5a1afda567e6d26c0c84abc5c2d7622d9daf9bb25ed7dd2970019dcf4b9a28c02c13cab4
+  version: 1.5.24
+  resolution: "electron-to-chromium@npm:1.5.24"
+  checksum: 10c0/c20a6fc69145c0b470778ee0a952226d3480d611949bea00c9f8ed3bac0a205e5cd8ba76cfa99034d9ee717482741cf1c7e41eb151ccffc933e1eefe501d3bc7
   languageName: node
   linkType: hard
 
@@ -13548,7 +13559,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"loader-utils@npm:^2.0.0":
+"loader-utils@npm:^2.0.0, loader-utils@npm:^2.0.4":
   version: 2.0.4
   resolution: "loader-utils@npm:2.0.4"
   dependencies: