@jrapps/my_tickets_dashboard_ui 0.0.8 → 0.0.10

package/dist/cjs/index.js

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,312 +15,25 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  ManageTicketModal: () => ManageTicketModal,
   Sidebar: () => Sidebar
 });
 module.exports = __toCommonJS(src_exports);
 
-// src/components/ManageTicketModal/ManageTicketModal.tsx
-var import_react2 = __toESM(require("react"));
-
-// src/components/ManageTicketModal/useManageTicketModal.ts
-var import_react = require("react");
-var import_essentials = require("@wix/essentials");
-var BASE_URL = new URL("").origin;
-var STATE_CONFIG = {
-  STATUS_CHANGE: {
-    title: "Change Status",
-    getUrl: (id, value) => `${BASE_URL}/api/tickets/update-ticket-status?id=${id}&status=${value}`,
-    getPayload: (value) => ({ newStatus: value })
-  },
-  PRIORITY_CHANGE: {
-    title: "Change Priority",
-    getUrl: (id, value) => `${BASE_URL}/api/tickets/update-ticket-priority?id=${id}&priority=${value}`,
-    getPayload: (value) => ({ newPriority: value })
-  },
-  TRANSFER_TICKET: {
-    title: "Transfer Ticket",
-    getUrl: (id, value) => `${BASE_URL}/api/tickets/transfer-ticket?id=${id}&teamId=${value}`,
-    getPayload: (value) => ({ newTeamId: value })
-  }
-};
-function useManageTicketModal({ id, state, onClose }) {
-  const [isSaving, setIsSaving] = (0, import_react.useState)(false);
-  const [newStatus, setNewStatus] = (0, import_react.useState)("");
-  const [newPriority, setNewPriority] = (0, import_react.useState)("");
-  const [selectedTeam, setSelectedTeam] = (0, import_react.useState)("");
-  const [teams, setTeams] = (0, import_react.useState)([]);
-  const [isLoading, setIsLoading] = (0, import_react.useState)(false);
-  const [isError, setIsError] = (0, import_react.useState)(false);
-  const modalTitle = STATE_CONFIG[state]?.title ?? "Manage Ticket";
-  (0, import_react.useEffect)(() => {
-    if (state !== "TRANSFER_TICKET") {
-      setIsLoading(false);
-      setIsError(false);
-      return;
-    }
-    setIsLoading(true);
-    setIsError(false);
-    const fetchTeams = async () => {
-      try {
-        const response = await import_essentials.httpClient.fetchWithAuth(`${BASE_URL}/api/teams/teams`);
-        const data = await response.json();
-        setTeams(data.teams);
-      } catch (error) {
-        console.error("Error fetching teams:", error);
-        setIsError(true);
-      } finally {
-        setIsLoading(false);
-      }
-    };
-    fetchTeams();
-  }, [id, state]);
-  const handleSave = async () => {
-    const config = STATE_CONFIG[state];
-    if (!config) return;
-    const valueMap = {
-      STATUS_CHANGE: newStatus,
-      PRIORITY_CHANGE: newPriority,
-      TRANSFER_TICKET: selectedTeam
-    };
-    const value = valueMap[state];
-    if (!value) return;
-    setIsSaving(true);
-    try {
-      await import_essentials.httpClient.fetchWithAuth(config.getUrl(id, value), { method: "PUT" });
-      onClose(config.getPayload(value));
-    } catch (error) {
-      console.error("Error saving:", error);
-    } finally {
-      setIsSaving(false);
-    }
-  };
-  const handleCancel = () => onClose({ cancelled: true });
-  return {
-    // State
-    isSaving,
-    isLoading,
-    isError,
-    teams,
-    newStatus,
-    newPriority,
-    selectedTeam,
-    modalTitle,
-    // Setters
-    setNewStatus,
-    setNewPriority,
-    setSelectedTeam,
-    // Handlers
-    handleSave,
-    handleCancel
-  };
-}
-
-// src/components/ManageTicketModal/ManageTicketModal.tsx
-var import_design_system4 = require("@wix/design-system");
-var import_styles_studio_global = require("@wix/design-system/styles-studio.global.css");
-
-// src/components/ManageTicketModal/status-change-content.tsx
-var import_design_system = require("@wix/design-system");
-var import_jsx_runtime = require("react/jsx-runtime");
-var STATUS_LABELS = {
-  closed: "Closed",
-  in_progress: "In Progress",
-  open: "Open"
-};
-var StatusChangeContent = ({ currentStatus, newStatus, onStatusChange }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_design_system.Box, { direction: "vertical", width: "stretch", gap: "10px", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.FormField, { label: "Current Status", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Input, { value: STATUS_LABELS[currentStatus] ?? currentStatus, disabled: true }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.FormField, { label: "New Status", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_design_system.Dropdown,
-      {
-        options: [
-          { id: "open", value: "Open" },
-          { id: "in_progress", value: "In Progress" },
-          { id: "closed", value: "Closed" }
-        ],
-        placeholder: "Select new status",
-        selectedId: newStatus || "",
-        popoverProps: { appendTo: "window", zIndex: 9999 },
-        onSelect: (option) => onStatusChange(option?.id ?? "")
-      }
-    ) })
-  ] });
-};
-var status_change_content_default = StatusChangeContent;
-
-// src/components/ManageTicketModal/priority-change-content.tsx
-var import_design_system2 = require("@wix/design-system");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var PRIORITY_LABELS = {
-  high: "High",
-  medium: "Medium",
-  low: "Low"
-};
-var PriorityChangeContent = ({ currentPriority, newPriority, onPriorityChange }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_design_system2.Box, { direction: "vertical", width: "stretch", gap: "10px", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_design_system2.FormField, { label: "Current Priority", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_design_system2.Input, { value: PRIORITY_LABELS[currentPriority] ?? currentPriority, disabled: true }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_design_system2.FormField, { label: "New Priority", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      import_design_system2.Dropdown,
-      {
-        options: [
-          { id: "high", value: "High" },
-          { id: "medium", value: "Medium" },
-          { id: "low", value: "Low" }
-        ],
-        placeholder: "Select new priority",
-        selectedId: newPriority || "",
-        popoverProps: { appendTo: "window", zIndex: 9999 },
-        onSelect: (option) => onPriorityChange(option?.id ?? "")
-      }
-    ) })
-  ] });
-};
-var priority_change_content_default = PriorityChangeContent;
-
-// src/components/ManageTicketModal/transfer-ticket-content.tsx
-var import_design_system3 = require("@wix/design-system");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var TransferTicketContent = ({ currentTeam, teams, selectedTeam, onTeamChange }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_design_system3.Box, { direction: "vertical", width: "stretch", gap: "10px", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system3.FormField, { label: "Current Team", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system3.Input, { value: currentTeam, disabled: true }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system3.FormField, { label: "New Team", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      import_design_system3.Dropdown,
-      {
-        options: teams.map((team) => ({ id: team._id, value: team.name })),
-        placeholder: "Select new team",
-        selectedId: selectedTeam || "",
-        popoverProps: { appendTo: "window", zIndex: 9999 },
-        onSelect: (option) => onTeamChange(option?.id ?? "")
-      }
-    ) })
-  ] });
-};
-var transfer_ticket_content_default = TransferTicketContent;
-
-// src/components/ManageTicketModal/ManageTicketModal.css
-if (typeof document !== "undefined" && !document.getElementById("jrapps-style-94103778")) {
-  const s = document.createElement("style");
-  s.id = "jrapps-style-94103778";
-  s.textContent = ".manage-ticket-modal {\n  /* ManageTicketModal base styles */\n}\n";
-  document.head.appendChild(s);
-}
-
-// src/components/ManageTicketModal/ManageTicketModal.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var ManageTicketModal = import_react2.default.forwardRef(
-  ({
-    className,
-    isOpen,
-    id,
-    state,
-    onClose,
-    currentStatus,
-    currentPriority,
-    ticketNumber,
-    currentTeamName
-  }, ref) => {
-    const {
-      isSaving,
-      isLoading,
-      isError,
-      teams,
-      newStatus,
-      newPriority,
-      selectedTeam,
-      modalTitle,
-      setNewStatus,
-      setNewPriority,
-      setSelectedTeam,
-      handleSave,
-      handleCancel
-    } = useManageTicketModal({ id, state, onClose });
-    const renderContent = () => {
-      if (isLoading) {
-        return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Box, { direction: "vertical", width: "stretch", gap: "10px", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Loader, { size: "medium", status: "loading", text: "Loading..." }) });
-      }
-      if (isError) {
-        return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Box, { direction: "vertical", width: "stretch", gap: "10px", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Loader, { size: "medium", status: "error", text: "Error loading data" }) });
-      }
-      if (state === "STATUS_CHANGE") {
-        return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          status_change_content_default,
-          {
-            currentStatus: currentStatus ?? "",
-            newStatus,
-            onStatusChange: setNewStatus
-          }
-        );
-      }
-      if (state === "PRIORITY_CHANGE") {
-        return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          priority_change_content_default,
-          {
-            currentPriority: currentPriority ?? "",
-            newPriority,
-            onPriorityChange: setNewPriority
-          }
-        );
-      }
-      if (state === "TRANSFER_TICKET") {
-        return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          transfer_ticket_content_default,
-          {
-            currentTeam: currentTeamName,
-            teams,
-            selectedTeam,
-            onTeamChange: setSelectedTeam
-          }
-        );
-      }
-      return null;
-    };
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Modal, { isOpen, ref, className, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      import_design_system4.CustomModalLayout,
-      {
-        width: "500px",
-        primaryButtonText: isSaving ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Loader, { size: "tiny" }) : "Save",
-        secondaryButtonText: "Cancel",
-        primaryButtonOnClick: handleSave,
-        secondaryButtonOnClick: handleCancel,
-        showHeaderDivider: true,
-        showFooterDivider: true,
-        title: modalTitle,
-        subtitle: !isLoading ? ticketNumber : "",
-        footnote: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Box, { alignContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system4.Text, { size: "small", children: [
-          "Powered by ",
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system4.Text, { size: "small", weight: "bold", children: "My Tickets" })
-        ] }) }),
-        content: renderContent()
-      }
-    ) });
-  }
-);
-ManageTicketModal.displayName = "ManageTicketModal";
-
 // src/components/Sidebar/Sidebar.tsx
-var import_react5 = require("react");
-var import_design_system7 = require("@wix/design-system");
+var import_react3 = require("react");
+var import_design_system3 = require("@wix/design-system");
 var import_wix_ui_icons_common2 = require("@wix/wix-ui-icons-common");
 
 // src/components/Sidebar/sidebar-menu-item.tsx
-var import_react3 = require("react");
-var import_design_system5 = require("@wix/design-system");
+var import_react = require("react");
+var import_design_system = require("@wix/design-system");
 var import_dashboard = require("@wix/dashboard");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime = require("react/jsx-runtime");
 var SidebarMenuItem = ({
   item,
   items,
@@ -337,11 +48,11 @@ var SidebarMenuItem = ({
   onModalClosed,
   onCreateTicketClicked
 }) => {
-  const [itemTotalCount, setItemTotalCount] = (0, import_react3.useState)(totalCount);
+  const [itemTotalCount, setItemTotalCount] = (0, import_react.useState)(totalCount);
   const hasChildren = items.some((i) => i.parent === item.stateId);
   const isExpanded = expandedSections.has(item.stateId);
   const isSelected = selectedId === item.stateId;
-  (0, import_react3.useEffect)(() => {
+  (0, import_react.useEffect)(() => {
     setItemTotalCount(totalCount);
   }, [totalCount]);
   const handleAction = async (actionItem) => {
@@ -363,34 +74,34 @@ var SidebarMenuItem = ({
   };
   if (hasChildren) {
     const children = items.filter((i) => i.parent === item.stateId);
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "sidebar-section", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "sidebar-section", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
         "div",
         {
           className: `sidebar-item sidebar-parent-item ${isSelected ? "sidebar-item-selected" : ""}`,
           onClick: () => onToggleSection(item.stateId),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Box, { className: "sidebar-item-icon", children: item.prefixIcon }),
-            expanded && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_design_system5.Box, { className: "sidebar-item-content", direction: "vertical", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Text, { size: "small", className: "sidebar-item-title", children: item.label }),
-                item.subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Text, { size: "small", className: "sidebar-item-subtitle", children: item.subtitle })
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { className: "sidebar-item-icon", children: item.prefixIcon }),
+            expanded && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_design_system.Box, { className: "sidebar-item-content", direction: "vertical", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Text, { size: "small", className: "sidebar-item-title", children: item.label }),
+                item.subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Text, { size: "small", className: "sidebar-item-subtitle", children: item.subtitle })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Box, { className: `sidebar-item-chevron ${isExpanded ? "expanded" : ""}`, children: "\u25BC" })
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { className: `sidebar-item-chevron ${isExpanded ? "expanded" : ""}`, children: "\u25BC" })
             ] })
           ]
         }
       ),
-      isExpanded && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Box, { className: "sidebar-submenu-container", direction: "vertical", children: children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+      isExpanded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { className: "sidebar-submenu-container", direction: "vertical", children: children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
         "div",
         {
           className: `sidebar-item sidebar-child-item ${expandedClassName} ${selectedId === child.stateId ? "sidebar-item-selected" : ""}`,
           onClick: () => handleAction(child),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Box, { className: "sidebar-item-icon", children: child.prefixIcon }),
-            expanded && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_design_system5.Box, { className: "sidebar-item-content", direction: "vertical", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Text, { size: "small", className: "sidebar-item-title-submenu", children: child.label }),
-              child.subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Text, { size: "small", className: "sidebar-item-subtitle", children: child.subtitle })
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { className: "sidebar-item-icon", children: child.prefixIcon }),
+            expanded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_design_system.Box, { className: "sidebar-item-content", direction: "vertical", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Text, { size: "small", className: "sidebar-item-title-submenu", children: child.label }),
+              child.subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Text, { size: "small", className: "sidebar-item-subtitle", children: child.subtitle })
             ] }) })
           ]
         },
@@ -398,19 +109,19 @@ var SidebarMenuItem = ({
       )) })
     ] }, item.stateId);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "div",
     {
       className: `sidebar-item ${expandedClassName} ${isSelected ? "sidebar-item-selected" : ""}`,
       onClick: () => handleAction(item),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Box, { className: "sidebar-item-icon", children: item.prefixIcon }),
-        expanded && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Box, { className: "sidebar-item-content", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_design_system5.Box, { verticalAlign: "middle", gap: 2, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_design_system5.Box, { direction: "vertical", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Text, { size: "small", className: "sidebar-item-title", children: item.label }),
-            item.subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.Text, { size: "small", className: "sidebar-item-subtitle", children: item.subtitle })
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { className: "sidebar-item-icon", children: item.prefixIcon }),
+        expanded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Box, { className: "sidebar-item-content", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_design_system.Box, { verticalAlign: "middle", gap: 2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_design_system.Box, { direction: "vertical", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Text, { size: "small", className: "sidebar-item-title", children: item.label }),
+            item.subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.Text, { size: "small", className: "sidebar-item-subtitle", children: item.subtitle })
           ] }),
-          item?.showTotalCount && item?.showTotalCount === true && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system5.CounterBadge, { size: "medium", skin: "warning", children: String(itemTotalCount) })
+          item?.showTotalCount && item?.showTotalCount === true && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_design_system.CounterBadge, { size: "medium", skin: "warning", children: String(itemTotalCount) })
         ] }) }) })
       ]
     },
@@ -420,22 +131,22 @@ var SidebarMenuItem = ({
 var sidebar_menu_item_default = SidebarMenuItem;
 
 // src/components/Sidebar/footer/avatar-dropdown.wrapper.tsx
-var import_react4 = require("react");
-var import_design_system6 = require("@wix/design-system");
+var import_react2 = require("react");
+var import_design_system2 = require("@wix/design-system");
 
 // src/components/Sidebar/footer/status-dots.wrapper.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var Online = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { width: "8px", height: "8px", borderRadius: "50%", background: "#22c55e", boxShadow: "0 0 0 2px #fff" } });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { width: "8px", height: "8px", borderRadius: "50%", background: "#22c55e", boxShadow: "0 0 0 2px #fff" } });
 };
 var Away = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { width: "8px", height: "8px", borderRadius: "50%", background: "#f59e0b", boxShadow: "0 0 0 2px #fff" } });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { width: "8px", height: "8px", borderRadius: "50%", background: "#f59e0b", boxShadow: "0 0 0 2px #fff" } });
 };
 var DoNotDisturb = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { position: "relative", width: "8px", height: "8px", borderRadius: "50%", background: "#ef4444", boxShadow: "0 0 0 2px #fff" }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { position: "absolute", top: "50%", left: "10%", right: "10%", height: "2px", background: "#fff", transform: "translateY(-50%)", borderRadius: "1px" } }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { position: "relative", width: "8px", height: "8px", borderRadius: "50%", background: "#ef4444", boxShadow: "0 0 0 2px #fff" }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { position: "absolute", top: "50%", left: "10%", right: "10%", height: "2px", background: "#fff", transform: "translateY(-50%)", borderRadius: "1px" } }) });
 };
 var Offline = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { width: "8px", height: "8px", borderRadius: "50%", border: "2px solid #71717a", boxShadow: "0 0 0 2px #fff" } });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { width: "8px", height: "8px", borderRadius: "50%", border: "2px solid #71717a", boxShadow: "0 0 0 2px #fff" } });
 };
 var StatusDots = {
   Online,
@@ -447,9 +158,9 @@ var status_dots_wrapper_default = StatusDots;
 
 // src/components/Sidebar/footer/avatar-dropdown.wrapper.tsx
 var import_wix_ui_icons_common = require("@wix/wix-ui-icons-common");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var AvatarDropdown = ({ status = "online", onStatusChange, onLogout, permissions, agentProfilePictureUrl, agentName, agentRole }) => {
-  const [selectedStatus, setSelectedStatus] = (0, import_react4.useState)(status);
+  const [selectedStatus, setSelectedStatus] = (0, import_react2.useState)(status);
   const handleStatusChange = (newStatus) => {
     setSelectedStatus(newStatus);
     if (onStatusChange) {
@@ -462,45 +173,45 @@ var AvatarDropdown = ({ status = "online", onStatusChange, onLogout, permissions
     }
   };
   const options = [
-    (0, import_design_system6.listItemSectionBuilder)({
+    (0, import_design_system2.listItemSectionBuilder)({
       id: "status-section",
       title: "Online Status"
     }),
-    (0, import_design_system6.listItemSelectBuilder)({
+    (0, import_design_system2.listItemSelectBuilder)({
       id: "online",
       checkbox: true,
-      prefix: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(status_dots_wrapper_default.Online, {}),
+      prefix: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(status_dots_wrapper_default.Online, {}),
       title: "Online",
       disabled: permissions?.["my-tickets-change-agent-online-status"] === true ? false : true
     }),
-    (0, import_design_system6.listItemSelectBuilder)({
+    (0, import_design_system2.listItemSelectBuilder)({
       id: "busy",
       checkbox: true,
-      prefix: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(status_dots_wrapper_default.Away, {}),
+      prefix: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(status_dots_wrapper_default.Away, {}),
       title: "Away",
       disabled: permissions?.["my-tickets-change-agent-online-status"] === true ? false : true
     }),
-    (0, import_design_system6.listItemSelectBuilder)({
+    (0, import_design_system2.listItemSelectBuilder)({
       id: "offline",
       checkbox: true,
-      prefix: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(status_dots_wrapper_default.DoNotDisturb, {}),
+      prefix: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(status_dots_wrapper_default.DoNotDisturb, {}),
       title: "Offline",
       disabled: permissions?.["my-tickets-change-agent-online-status"] === true ? false : true
     }),
     { id: "divider-1", value: "-" },
-    (0, import_design_system6.listItemActionBuilder)({
+    (0, import_design_system2.listItemActionBuilder)({
       id: 0,
       title: "Logout",
       onClick: handleLogout
     })
   ];
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.DropdownBase, { options, selectedId: selectedStatus, onSelect: (option) => typeof option.id === "string" && handleStatusChange(option.id), className: "sidebar-avatar-dropdown", minWidth: 0, children: ({ toggle }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.TextButton, { className: "header-account-button", onClick: toggle, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_design_system6.Box, { verticalAlign: "middle", gap: 2, textAlign: "start", maxWidth: "100%", minWidth: 0, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.Avatar, { presence: selectedStatus, name: agentName && !agentProfilePictureUrl ? agentName : void 0, size: "size30", imgProps: !agentName && agentProfilePictureUrl || agentName && agentProfilePictureUrl ? { src: agentProfilePictureUrl } : void 0 }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_design_system6.Box, { direction: "vertical", gap: 0, verticalAlign: "middle", maxWidth: "100%", minWidth: 0, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.Text, { weight: "bold", size: "small", ellipsis: true, maxWidth: "100%", children: agentName ? agentName : "Error getting name" }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system6.Text, { size: "tiny", secondary: true, ellipsis: true, maxWidth: "100%", children: agentRole ? agentRole : "Error getting role" })
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.DropdownBase, { options, selectedId: selectedStatus, onSelect: (option) => typeof option.id === "string" && handleStatusChange(option.id), className: "sidebar-avatar-dropdown", minWidth: 0, children: ({ toggle }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.TextButton, { className: "header-account-button", onClick: toggle, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_design_system2.Box, { verticalAlign: "middle", gap: 2, textAlign: "start", maxWidth: "100%", minWidth: 0, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.Avatar, { presence: selectedStatus, name: agentName && !agentProfilePictureUrl ? agentName : void 0, size: "size30", imgProps: !agentName && agentProfilePictureUrl || agentName && agentProfilePictureUrl ? { src: agentProfilePictureUrl } : void 0 }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_design_system2.Box, { direction: "vertical", gap: 0, verticalAlign: "middle", maxWidth: "100%", minWidth: 0, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.Text, { weight: "bold", size: "small", ellipsis: true, maxWidth: "100%", children: agentName ? agentName : "Error getting name" }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.Text, { size: "tiny", secondary: true, ellipsis: true, maxWidth: "100%", children: agentRole ? agentRole : "Error getting role" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_wix_ui_icons_common.ChevronDown, {})
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_wix_ui_icons_common.ChevronDown, {})
   ] }) }) });
 };
 var avatar_dropdown_wrapper_default = AvatarDropdown;
@@ -514,8 +225,8 @@ if (typeof document !== "undefined" && !document.getElementById("jrapps-style-ee
 }
 
 // src/components/Sidebar/Sidebar.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var Sidebar = (0, import_react5.forwardRef)(
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Sidebar = (0, import_react3.forwardRef)(
   ({
     className,
     children,
@@ -534,10 +245,10 @@ var Sidebar = (0, import_react5.forwardRef)(
     onLogout,
     permissions
   }, ref) => {
-    const [expandedSections, setExpandedSections] = (0, import_react5.useState)(/* @__PURE__ */ new Set());
-    const [expanded, setExpanded] = (0, import_react5.useState)(true);
-    const [shouldShowExpandButton, setShouldShowExpandButton] = (0, import_react5.useState)(false);
-    const sidebarRef = (0, import_react5.useRef)(null);
+    const [expandedSections, setExpandedSections] = (0, import_react3.useState)(/* @__PURE__ */ new Set());
+    const [expanded, setExpanded] = (0, import_react3.useState)(true);
+    const [shouldShowExpandButton, setShouldShowExpandButton] = (0, import_react3.useState)(false);
+    const sidebarRef = (0, import_react3.useRef)(null);
     const SIDEBAR_EXPANDED_WIDTH = "210px";
     const toggleSection = (sectionId) => {
       const newExpanded = new Set(expandedSections);
@@ -581,14 +292,14 @@ var Sidebar = (0, import_react5.forwardRef)(
     const rootItems = items.filter((item) => !item.parent || item.parent === "default");
     const currentUrl = new URL("");
     const expandedClassName = expanded ? "expanded" : "closed";
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "sidebar-outer-wrapper", ref, children: [
-      shouldShowExpandButton && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { onMouseEnter: () => setShouldShowExpandButton(true), onMouseLeave: () => setShouldShowExpandButton(false), className: "sidebar-expand-button-container", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { onClick: toggleSidebar, children: expanded ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_wix_ui_icons_common2.ChevronLeft, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_wix_ui_icons_common2.ChevronRight, {}) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: sidebarRef, className: `sidebar-container ${expanded ? "expanded" : "closed"}`, children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { onMouseEnter: () => setShouldShowExpandButton(true), onMouseLeave: () => setShouldShowExpandButton(false), children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_design_system7.Box, { className: "sidebar-header-box", direction: "horizontal", gap: "13px", WebkitAlignItems: "center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { width: "37px", height: "37px", src: currentUrl.origin + "/logo.png", alt: "My Tickets Logo", className: "sidebar-logo" }),
-          expanded && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system7.Text, { className: "header-title", children: "My Tickets" })
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "sidebar-outer-wrapper", ref, children: [
+      shouldShowExpandButton && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { onMouseEnter: () => setShouldShowExpandButton(true), onMouseLeave: () => setShouldShowExpandButton(false), className: "sidebar-expand-button-container", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { onClick: toggleSidebar, children: expanded ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_wix_ui_icons_common2.ChevronLeft, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_wix_ui_icons_common2.ChevronRight, {}) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { ref: sidebarRef, className: `sidebar-container ${expanded ? "expanded" : "closed"}`, children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { onMouseEnter: () => setShouldShowExpandButton(true), onMouseLeave: () => setShouldShowExpandButton(false), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system3.Box, { className: "sidebar-header-box", direction: "horizontal", gap: "13px", WebkitAlignItems: "center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("img", { width: "37px", height: "37px", src: currentUrl.origin + "/logo.png", alt: "My Tickets Logo", className: "sidebar-logo" }),
+          expanded && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.Text, { className: "header-title", children: "My Tickets" })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system7.Box, { className: `sidebar-items-container ${expandedClassName}`, direction: "vertical", children: rootItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.Box, { className: `sidebar-items-container ${expandedClassName}`, direction: "vertical", children: rootItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
           sidebar_menu_item_default,
           {
             item,
@@ -606,9 +317,9 @@ var Sidebar = (0, import_react5.forwardRef)(
           },
           item.stateId
         )) }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system7.Box, { direction: "horizontal", className: `sidebar-footer ${expandedClassName}`, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_design_system7.Box, { marginTop: "2px", maxWidth: "100%", minWidth: 0, children: [
-          expanded && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(avatar_dropdown_wrapper_default, { status, onStatusChange, onLogout, permissions, agentProfilePictureUrl, agentName, agentRole }),
-          !expanded && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system7.Avatar, { name: agentName && !agentProfilePictureUrl ? agentName : void 0, size: "size30", imgProps: !agentName && agentProfilePictureUrl || agentName && agentProfilePictureUrl ? { src: agentProfilePictureUrl } : void 0 })
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.Box, { direction: "horizontal", className: `sidebar-footer ${expandedClassName}`, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system3.Box, { marginTop: "2px", maxWidth: "100%", minWidth: 0, children: [
+          expanded && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(avatar_dropdown_wrapper_default, { status, onStatusChange, onLogout, permissions, agentProfilePictureUrl, agentName, agentRole }),
+          !expanded && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.Avatar, { name: agentName && !agentProfilePictureUrl ? agentName : void 0, size: "size30", imgProps: !agentName && agentProfilePictureUrl || agentName && agentProfilePictureUrl ? { src: agentProfilePictureUrl } : void 0 })
         ] }) })
       ] }) })
     ] });