@djangocfg/ext-support 1.0.24 → 1.0.26

package/dist/hooks.cjs

@@ -4,7 +4,7 @@ var api = require('@djangocfg/ext-base/api');
 var consola = require('consola');
 var pRetry = require('p-retry');
 var zod = require('zod');
-var React4 = require('react');
+var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var useSWRInfinite = require('swr/infinite');
 var auth = require('@djangocfg/api/auth');
@@ -13,7 +13,7 @@ var lucideReact = require('lucide-react');
 var nextIntl = require('next-intl');
 var uiCore = require('@djangocfg/ui-core');
 var lib = require('@djangocfg/ui-core/lib');
-var moment2 = require('moment');
+var moment = require('moment');
 var reactHookForm = require('react-hook-form');
 var zod$1 = require('@hookform/resolvers/zod');
 var extBase = require('@djangocfg/ext-base');
@@ -21,10 +21,9 @@ var extBase = require('@djangocfg/ext-base');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var pRetry__default = /*#__PURE__*/_interopDefault(pRetry);
-var React4__default = /*#__PURE__*/_interopDefault(React4);
 var useSWRInfinite__default = /*#__PURE__*/_interopDefault(useSWRInfinite);
 var useSWR__default = /*#__PURE__*/_interopDefault(useSWR);
-var moment2__default = /*#__PURE__*/_interopDefault(moment2);
+var moment__default = /*#__PURE__*/_interopDefault(moment);
 
 // src/api/generated/ext_support/ext_support__support/client.ts
 var ExtSupportSupport = class {
@@ -43,7 +42,7 @@ var ExtSupportSupport = class {
     if (isParamsObject) {
       params = args[0];
     } else {
-      params = { page: args[0], page_size: args[1] };
+      params = { ordering: args[0], page: args[1], page_size: args[2], search: args[3] };
     }
     const response = await this.client.request("GET", "/cfg/support/tickets/", { params });
     return response;
@@ -68,7 +67,7 @@ var ExtSupportSupport = class {
     if (isParamsObject) {
       params = args[1];
     } else {
-      params = { page: args[1], page_size: args[2] };
+      params = { ordering: args[1], page: args[2], page_size: args[3], search: args[4] };
     }
     const response = await this.client.request("GET", `/cfg/support/tickets/${ticket_uuid}/messages/`, { params });
     return response;
@@ -759,22 +758,6 @@ var PatchedTicketRequestStatus = /* @__PURE__ */ ((PatchedTicketRequestStatus2)
   PatchedTicketRequestStatus2["CLOSED"] = "closed";
   return PatchedTicketRequestStatus2;
 })(PatchedTicketRequestStatus || {});
-var TicketStatus = /* @__PURE__ */ ((TicketStatus2) => {
-  TicketStatus2["OPEN"] = "open";
-  TicketStatus2["WAITING_FOR_USER"] = "waiting_for_user";
-  TicketStatus2["WAITING_FOR_ADMIN"] = "waiting_for_admin";
-  TicketStatus2["RESOLVED"] = "resolved";
-  TicketStatus2["CLOSED"] = "closed";
-  return TicketStatus2;
-})(TicketStatus || {});
-var TicketRequestStatus = /* @__PURE__ */ ((TicketRequestStatus2) => {
-  TicketRequestStatus2["OPEN"] = "open";
-  TicketRequestStatus2["WAITING_FOR_USER"] = "waiting_for_user";
-  TicketRequestStatus2["WAITING_FOR_ADMIN"] = "waiting_for_admin";
-  TicketRequestStatus2["RESOLVED"] = "resolved";
-  TicketRequestStatus2["CLOSED"] = "closed";
-  return TicketRequestStatus2;
-})(TicketRequestStatus || {});
 var SenderSchema = zod.z.object({
   id: zod.z.int(),
   display_username: zod.z.string(),
@@ -818,7 +801,7 @@ var TicketSchema = zod.z.object({
   uuid: zod.z.string().regex(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i),
   user: zod.z.int(),
   subject: zod.z.string().max(255),
-  status: zod.z.nativeEnum(TicketStatus).optional(),
+  status: zod.z.nativeEnum(PatchedTicketRequestStatus).optional(),
   created_at: zod.z.string().datetime({ offset: true }),
   unanswered_messages_count: zod.z.int()
 });
@@ -846,7 +829,7 @@ zod.z.object({
 zod.z.object({
   user: zod.z.int(),
   subject: zod.z.string().min(1).max(255),
-  status: zod.z.nativeEnum(TicketRequestStatus).optional()
+  status: zod.z.nativeEnum(PatchedTicketRequestStatus).optional()
 });
 
 // src/api/generated/ext_support/api-instance.ts
@@ -882,7 +865,7 @@ function configureAPI(config) {
 // src/api/generated/ext_support/_utils/fetchers/ext_support__support.ts
 async function getSupportTicketsList(params, client) {
   const api = client || getAPIInstance();
-  const response = await api.ext_support_support.ticketsList(params?.page, params?.page_size);
+  const response = await api.ext_support_support.ticketsList(params?.ordering, params?.page, params?.page_size, params?.search);
   try {
     return PaginatedTicketListSchema.parse(response);
   } catch (error) {
@@ -966,7 +949,7 @@ Method: POST`);
 }
 async function getSupportTicketsMessagesList(ticket_uuid, params, client) {
   const api = client || getAPIInstance();
-  const response = await api.ext_support_support.ticketsMessagesList(ticket_uuid, params?.page, params?.page_size);
+  const response = await api.ext_support_support.ticketsMessagesList(ticket_uuid, params?.ordering, params?.page, params?.page_size, params?.search);
   try {
     return PaginatedMessageListSchema.parse(response);
   } catch (error) {
@@ -1440,13 +1423,13 @@ var API = class {
 // src/api/index.ts
 api.initializeExtensionAPI(configureAPI);
 var apiSupport = api.createExtensionAPI(API);
-var SupportContext = React4.createContext(void 0);
+var SupportContext = react.createContext(void 0);
 function SupportProvider({ children, adapter }) {
-  const value = React4.useMemo(() => ({ adapter }), [adapter]);
+  const value = react.useMemo(() => ({ adapter }), [adapter]);
   return /* @__PURE__ */ jsxRuntime.jsx(SupportContext.Provider, { value, children });
 }
 function useAdapter() {
-  const context = React4.useContext(SupportContext);
+  const context = react.useContext(SupportContext);
   if (!context) {
     throw new Error("useSupport hooks must be used within SupportProvider");
   }
@@ -1606,18 +1589,18 @@ function useApiTickets() {
     revalidateFirstPage: false,
     parallel: false
   });
-  const tickets = React4.useMemo(() => {
+  const tickets = react.useMemo(() => {
     return ticketsData ? ticketsData.flatMap((page) => page.results) : [];
   }, [ticketsData]);
   const hasMore = ticketsData && ticketsData[ticketsData.length - 1]?.has_next || false;
   const totalCount = ticketsData && ticketsData[ticketsData.length - 1]?.count || 0;
   const isLoadingMore = isValidating && ticketsData && typeof ticketsData[size - 1] !== "undefined";
-  const loadMore = React4.useCallback(() => {
+  const loadMore = react.useCallback(() => {
     if (hasMore && !isLoadingMore) {
       setSize(size + 1);
     }
   }, [hasMore, isLoadingMore, size, setSize]);
-  const refresh = React4.useCallback(async () => {
+  const refresh = react.useCallback(async () => {
     await mutate();
   }, [mutate]);
   return {
@@ -1651,21 +1634,21 @@ function useApiMessages(ticketUuid) {
     revalidateFirstPage: false,
     parallel: false
   });
-  const messages = React4.useMemo(() => {
+  const messages = react.useMemo(() => {
     return data ? data.flatMap((page) => page.results) : [];
   }, [data]);
   const hasMore = data && data[data.length - 1]?.has_next || false;
   const totalCount = data && data[data.length - 1]?.count || 0;
   const isLoadingMore = isValidating && data && typeof data[size - 1] !== "undefined";
-  const loadMore = React4.useCallback(() => {
+  const loadMore = react.useCallback(() => {
     if (hasMore && !isLoadingMore) {
       setSize(size + 1);
     }
   }, [hasMore, isLoadingMore, size, setSize]);
-  const refresh = React4.useCallback(async () => {
+  const refresh = react.useCallback(async () => {
     await mutate();
   }, [mutate]);
-  const addOptimistic = React4.useCallback((message) => {
+  const addOptimistic = react.useCallback((message) => {
     if (!data || !data[0]) return;
     const newData = [...data];
     const firstPage = newData[0];
@@ -1695,7 +1678,7 @@ function useApiOperations() {
   const { user } = auth.useAuth();
   const createTicketMutation = useCreateSupportTicketsCreate();
   const createMessageMutation = useCreateSupportTicketsMessagesCreate();
-  const createTicket = React4.useCallback(async (input) => {
+  const createTicket = react.useCallback(async (input) => {
     if (!user?.id) {
       throw new Error("User must be authenticated to create tickets");
     }
@@ -1710,7 +1693,7 @@ function useApiOperations() {
     }
     return ticket;
   }, [user, createTicketMutation, createMessageMutation]);
-  const sendMessage = React4.useCallback(async (input) => {
+  const sendMessage = react.useCallback(async (input) => {
     const message = await createMessageMutation(input.ticketUuid, {
       text: input.text
     });
@@ -1738,7 +1721,7 @@ function createApiAdapter() {
 }
 function useApiAdapter() {
   const { createTicket, sendMessage } = useApiOperations();
-  return React4.useMemo(() => ({
+  return react.useMemo(() => ({
     useTickets: useApiTickets,
     useMessages: useApiMessages,
     createTicket,
@@ -1887,8 +1870,8 @@ function addMessage(ticketUuid, message) {
   notifySubscribers();
 }
 function useDemoTickets() {
-  const [, forceUpdate] = React4.useState({});
-  React4.useMemo(() => {
+  const [, forceUpdate] = react.useState({});
+  react.useMemo(() => {
     const update = () => forceUpdate({});
     subscribers.add(update);
     return () => {
@@ -1908,15 +1891,15 @@ function useDemoTickets() {
   };
 }
 function useDemoMessages(ticketUuid) {
-  const [, forceUpdate] = React4.useState({});
-  React4.useMemo(() => {
+  const [, forceUpdate] = react.useState({});
+  react.useMemo(() => {
     const update = () => forceUpdate({});
     subscribers.add(update);
     return () => {
       subscribers.delete(update);
     };
   }, []);
-  const messages = React4.useMemo(() => {
+  const messages = react.useMemo(() => {
     if (!ticketUuid) return [];
     return demoMessages[ticketUuid] || [];
   }, [ticketUuid]);
@@ -2059,78 +2042,6 @@ var en = {
   }
 };
 
-// src/i18n/locales/ru.ts
-var ru = {
-  layout: {
-    title: "\u0426\u0435\u043D\u0442\u0440 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0438",
-    titleShort: "\u041F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0430",
-    subtitle: "\u041F\u043E\u043B\u0443\u0447\u0438\u0442\u0435 \u043F\u043E\u043C\u043E\u0449\u044C \u043E\u0442 \u043D\u0430\u0448\u0435\u0439 \u043A\u043E\u043C\u0430\u043D\u0434\u044B \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0438",
-    newTicket: "\u041D\u043E\u0432\u043E\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435"
-  },
-  hero: {
-    openTickets: "\u041E\u0442\u043A\u0440\u044B\u0442\u044B\u0445 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439",
-    unreadMessages: "\u041D\u0435\u043F\u0440\u043E\u0447\u0438\u0442\u0430\u043D\u043D\u044B\u0445"
-  },
-  status: {
-    open: "\u041E\u0442\u043A\u0440\u044B\u0442",
-    waitingForUser: "\u041E\u0436\u0438\u0434\u0430\u0435\u0442 \u0432\u0430\u0441",
-    waitingForAdmin: "\u041E\u0436\u0438\u0434\u0430\u0435\u0442 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0443",
-    resolved: "\u0420\u0435\u0448\u0451\u043D",
-    closed: "\u0417\u0430\u043A\u0440\u044B\u0442"
-  },
-  ticketList: {
-    noTickets: "\u041D\u0435\u0442 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439",
-    noTicketsDescription: "\u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 \u043F\u0435\u0440\u0432\u043E\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435, \u0447\u0442\u043E\u0431\u044B \u043F\u043E\u043B\u0443\u0447\u0438\u0442\u044C \u043F\u043E\u043C\u043E\u0449\u044C",
-    loadingMore: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430...",
-    loadMore: "\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0435\u0449\u0451",
-    allLoaded: "\u0412\u0441\u0435 {count} \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043E"
-  },
-  createTicket: {
-    title: "\u041D\u043E\u0432\u043E\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435",
-    description: "\u041E\u043F\u0438\u0448\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0443, \u0438 \u043C\u044B \u043F\u043E\u043C\u043E\u0436\u0435\u043C \u0432\u0430\u043C",
-    subjectLabel: "\u0422\u0435\u043C\u0430",
-    subjectPlaceholder: "\u041A\u0440\u0430\u0442\u043A\u043E\u0435 \u043E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u044B",
-    messageLabel: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435",
-    messagePlaceholder: "\u041E\u043F\u0438\u0448\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0443 \u043F\u043E\u0434\u0440\u043E\u0431\u043D\u043E...",
-    cancel: "\u041E\u0442\u043C\u0435\u043D\u0430",
-    creating: "\u0421\u043E\u0437\u0434\u0430\u043D\u0438\u0435...",
-    create: "\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435"
-  },
-  validation: {
-    subjectRequired: "\u0422\u0435\u043C\u0430 \u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u0430",
-    subjectTooLong: "\u0422\u0435\u043C\u0430 \u0441\u043B\u0438\u0448\u043A\u043E\u043C \u0434\u043B\u0438\u043D\u043D\u0430\u044F (\u043C\u0430\u043A\u0441. 200 \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432)",
-    messageRequired: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E",
-    messageTooLong: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u0441\u043B\u0438\u0448\u043A\u043E\u043C \u0434\u043B\u0438\u043D\u043D\u043E\u0435 (\u043C\u0430\u043A\u0441. 5000 \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432)"
-  },
-  messages: {
-    ticketCreated: "\u041E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0441\u043E\u0437\u0434\u0430\u043D\u043E",
-    ticketCreateFailed: "\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u0441\u043E\u0437\u0434\u0430\u0442\u044C \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435",
-    messageSent: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u043E",
-    messageSendFailed: "\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435"
-  },
-  messageInput: {
-    placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435...",
-    ticketClosed: "\u041E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0437\u0430\u043A\u0440\u044B\u0442\u043E",
-    ticketClosedDescription: "\u042D\u0442\u043E \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0437\u0430\u043A\u0440\u044B\u0442\u043E. \u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 \u043D\u043E\u0432\u043E\u0435, \u0435\u0441\u043B\u0438 \u0432\u0430\u043C \u043D\u0443\u0436\u043D\u0430 \u043F\u043E\u043C\u043E\u0449\u044C."
-  },
-  messageList: {
-    noTicketSelected: "\u041E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u043D\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043E",
-    noTicketSelectedDescription: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0438\u0437 \u0441\u043F\u0438\u0441\u043A\u0430 \u0434\u043B\u044F \u043F\u0440\u043E\u0441\u043C\u043E\u0442\u0440\u0430 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439",
-    noMessages: "\u041D\u0435\u0442 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439",
-    noMessagesDescription: "\u041D\u0430\u0447\u043D\u0438\u0442\u0435 \u0434\u0438\u0430\u043B\u043E\u0433, \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0432 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435",
-    loadingOlder: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0441\u0442\u0430\u0440\u044B\u0445 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439...",
-    loadOlder: "\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0441\u0442\u0430\u0440\u044B\u0435",
-    supportTeam: "\u0421\u043B\u0443\u0436\u0431\u0430 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0438",
-    staff: "\u0421\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A"
-  },
-  time: {
-    justNow: "\u0422\u043E\u043B\u044C\u043A\u043E \u0447\u0442\u043E",
-    minutesAgo: "{count} \u043C\u0438\u043D \u043D\u0430\u0437\u0430\u0434",
-    hoursAgo: "{count}\u0447 \u043D\u0430\u0437\u0430\u0434",
-    daysAgo: "{count}\u0434 \u043D\u0430\u0437\u0430\u0434"
-  }
-};
-
 // src/i18n/locales/ko.ts
 var ko = {
   layout: {
@@ -2203,6 +2114,78 @@ var ko = {
   }
 };
 
+// src/i18n/locales/ru.ts
+var ru = {
+  layout: {
+    title: "\u0426\u0435\u043D\u0442\u0440 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0438",
+    titleShort: "\u041F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0430",
+    subtitle: "\u041F\u043E\u043B\u0443\u0447\u0438\u0442\u0435 \u043F\u043E\u043C\u043E\u0449\u044C \u043E\u0442 \u043D\u0430\u0448\u0435\u0439 \u043A\u043E\u043C\u0430\u043D\u0434\u044B \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0438",
+    newTicket: "\u041D\u043E\u0432\u043E\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435"
+  },
+  hero: {
+    openTickets: "\u041E\u0442\u043A\u0440\u044B\u0442\u044B\u0445 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439",
+    unreadMessages: "\u041D\u0435\u043F\u0440\u043E\u0447\u0438\u0442\u0430\u043D\u043D\u044B\u0445"
+  },
+  status: {
+    open: "\u041E\u0442\u043A\u0440\u044B\u0442",
+    waitingForUser: "\u041E\u0436\u0438\u0434\u0430\u0435\u0442 \u0432\u0430\u0441",
+    waitingForAdmin: "\u041E\u0436\u0438\u0434\u0430\u0435\u0442 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0443",
+    resolved: "\u0420\u0435\u0448\u0451\u043D",
+    closed: "\u0417\u0430\u043A\u0440\u044B\u0442"
+  },
+  ticketList: {
+    noTickets: "\u041D\u0435\u0442 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439",
+    noTicketsDescription: "\u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 \u043F\u0435\u0440\u0432\u043E\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435, \u0447\u0442\u043E\u0431\u044B \u043F\u043E\u043B\u0443\u0447\u0438\u0442\u044C \u043F\u043E\u043C\u043E\u0449\u044C",
+    loadingMore: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430...",
+    loadMore: "\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0435\u0449\u0451",
+    allLoaded: "\u0412\u0441\u0435 {count} \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0439 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043E"
+  },
+  createTicket: {
+    title: "\u041D\u043E\u0432\u043E\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435",
+    description: "\u041E\u043F\u0438\u0448\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0443, \u0438 \u043C\u044B \u043F\u043E\u043C\u043E\u0436\u0435\u043C \u0432\u0430\u043C",
+    subjectLabel: "\u0422\u0435\u043C\u0430",
+    subjectPlaceholder: "\u041A\u0440\u0430\u0442\u043A\u043E\u0435 \u043E\u043F\u0438\u0441\u0430\u043D\u0438\u0435 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u044B",
+    messageLabel: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435",
+    messagePlaceholder: "\u041E\u043F\u0438\u0448\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0443 \u043F\u043E\u0434\u0440\u043E\u0431\u043D\u043E...",
+    cancel: "\u041E\u0442\u043C\u0435\u043D\u0430",
+    creating: "\u0421\u043E\u0437\u0434\u0430\u043D\u0438\u0435...",
+    create: "\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435"
+  },
+  validation: {
+    subjectRequired: "\u0422\u0435\u043C\u0430 \u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u0430",
+    subjectTooLong: "\u0422\u0435\u043C\u0430 \u0441\u043B\u0438\u0448\u043A\u043E\u043C \u0434\u043B\u0438\u043D\u043D\u0430\u044F (\u043C\u0430\u043A\u0441. 200 \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432)",
+    messageRequired: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E",
+    messageTooLong: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u0441\u043B\u0438\u0448\u043A\u043E\u043C \u0434\u043B\u0438\u043D\u043D\u043E\u0435 (\u043C\u0430\u043A\u0441. 5000 \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432)"
+  },
+  messages: {
+    ticketCreated: "\u041E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0441\u043E\u0437\u0434\u0430\u043D\u043E",
+    ticketCreateFailed: "\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u0441\u043E\u0437\u0434\u0430\u0442\u044C \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435",
+    messageSent: "\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D\u043E",
+    messageSendFailed: "\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435"
+  },
+  messageInput: {
+    placeholder: "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435...",
+    ticketClosed: "\u041E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0437\u0430\u043A\u0440\u044B\u0442\u043E",
+    ticketClosedDescription: "\u042D\u0442\u043E \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0437\u0430\u043A\u0440\u044B\u0442\u043E. \u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 \u043D\u043E\u0432\u043E\u0435, \u0435\u0441\u043B\u0438 \u0432\u0430\u043C \u043D\u0443\u0436\u043D\u0430 \u043F\u043E\u043C\u043E\u0449\u044C."
+  },
+  messageList: {
+    noTicketSelected: "\u041E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u043D\u0435 \u0432\u044B\u0431\u0440\u0430\u043D\u043E",
+    noTicketSelectedDescription: "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u0435 \u0438\u0437 \u0441\u043F\u0438\u0441\u043A\u0430 \u0434\u043B\u044F \u043F\u0440\u043E\u0441\u043C\u043E\u0442\u0440\u0430 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439",
+    noMessages: "\u041D\u0435\u0442 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439",
+    noMessagesDescription: "\u041D\u0430\u0447\u043D\u0438\u0442\u0435 \u0434\u0438\u0430\u043B\u043E\u0433, \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0432 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435",
+    loadingOlder: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0441\u0442\u0430\u0440\u044B\u0445 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0439...",
+    loadOlder: "\u0417\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0441\u0442\u0430\u0440\u044B\u0435",
+    supportTeam: "\u0421\u043B\u0443\u0436\u0431\u0430 \u043F\u043E\u0434\u0434\u0435\u0440\u0436\u043A\u0438",
+    staff: "\u0421\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A"
+  },
+  time: {
+    justNow: "\u0422\u043E\u043B\u044C\u043A\u043E \u0447\u0442\u043E",
+    minutesAgo: "{count} \u043C\u0438\u043D \u043D\u0430\u0437\u0430\u0434",
+    hoursAgo: "{count}\u0447 \u043D\u0430\u0437\u0430\u0434",
+    daysAgo: "{count}\u0434 \u043D\u0430\u0437\u0430\u0434"
+  }
+};
+
 // src/i18n/useSupportT.ts
 var translations = { en, ru, ko };
 function getNestedValue(obj, path) {
@@ -2219,8 +2202,8 @@ function getNestedValue(obj, path) {
 }
 function useSupportT() {
   const locale = nextIntl.useLocale();
-  const t = React4.useMemo(() => translations[locale] || translations.en, [locale]);
-  return React4.useCallback(
+  const t = react.useMemo(() => translations[locale] || translations.en, [locale]);
+  return react.useCallback(
     (key) => getNestedValue(t, key),
     [t]
   );
@@ -2228,7 +2211,7 @@ function useSupportT() {
 function SupportHero({ onCreateTicket, className }) {
   const st = useSupportT();
   const { tickets, unreadCount, isLoadingTickets, refreshTickets } = useSupport();
-  const labels = React4.useMemo(() => ({
+  const labels = react.useMemo(() => ({
     title: st("layout.title"),
     subtitle: st("layout.subtitle"),
     newTicket: st("layout.newTicket"),
@@ -2236,27 +2219,22 @@ function SupportHero({ onCreateTicket, className }) {
     unreadMessages: st("hero.unreadMessages")
   }), [st]);
   const openTicketsCount = tickets.filter((t) => t.status !== "closed" && t.status !== "resolved").length;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex flex-col items-center py-16 px-4", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center mb-6", children: isLoadingTickets ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-12 w-12 mx-auto mb-4 rounded-full" }),
-      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-8 w-32 mx-auto mb-2" }),
-      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-4 w-48 mx-auto" })
-    ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-16 w-16 mx-auto mb-4 bg-primary/10 rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LifeBuoy, { className: "h-8 w-8 text-primary" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-3xl font-bold tracking-tight", children: labels.title }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-1", children: labels.subtitle })
-    ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex flex-col items-center py-12 px-4", className), children: [
+    isLoadingTickets ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-10 w-48 mx-auto mb-2" }),
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-5 w-64 mx-auto" })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-4xl font-bold tracking-tight", children: labels.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg text-muted-foreground mt-2", children: labels.subtitle })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 mt-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
         uiCore.Button,
         {
           size: "lg",
           onClick: onCreateTicket,
-          className: "rounded-full px-6",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-5 w-5 mr-2" }),
-            labels.newTicket
-          ]
+          className: "rounded-full px-8 h-12 text-base",
+          children: labels.newTicket
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -2265,46 +2243,103 @@ function SupportHero({ onCreateTicket, className }) {
           size: "icon",
           variant: "ghost",
           onClick: () => refreshTickets(),
-          className: "rounded-full",
+          className: "rounded-full h-10 w-10",
           children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RefreshCw, { className: "h-4 w-4" })
         }
       )
     ] }),
-    !isLoadingTickets && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-6 mt-6 text-sm text-muted-foreground", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block font-medium text-foreground text-xl tabular-nums", children: openTicketsCount }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels.openTickets })
+    !isLoadingTickets && (openTicketsCount > 0 || unreadCount > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mt-4", children: [
+      openTicketsCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-muted-foreground bg-muted px-3 py-1 rounded-full", children: [
+        openTicketsCount,
+        " ",
+        labels.openTickets.toLowerCase()
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-8 w-px bg-border" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: lib.cn(
-          "block font-medium text-xl tabular-nums",
-          unreadCount > 0 ? "text-destructive" : "text-foreground"
-        ), children: unreadCount }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: labels.unreadMessages })
+      unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-destructive bg-destructive/10 px-3 py-1 rounded-full", children: [
+        unreadCount,
+        " ",
+        labels.unreadMessages.toLowerCase()
       ] })
     ] })
   ] });
 }
-var getStatusBadgeVariant = (status) => {
-  switch (status) {
-    case "open":
-      return "default";
-    case "waiting_for_user":
-      return "secondary";
-    case "waiting_for_admin":
-      return "outline";
-    case "resolved":
-      return "outline";
-    case "closed":
-      return "secondary";
-    default:
-      return "default";
+
+// src/utils/status.ts
+var ticketStatusConfig = {
+  open: {
+    color: "text-blue-600 dark:text-blue-400",
+    bg: "bg-blue-500/10"
+  },
+  waiting_for_user: {
+    color: "text-orange-600 dark:text-orange-400",
+    bg: "bg-orange-500/10"
+  },
+  waiting_for_admin: {
+    color: "text-muted-foreground",
+    bg: "bg-muted"
+  },
+  resolved: {
+    color: "text-green-600 dark:text-green-400",
+    bg: "bg-green-500/10"
+  },
+  closed: {
+    color: "text-muted-foreground",
+    bg: "bg-muted"
   }
 };
+function getStatusConfig(status) {
+  return ticketStatusConfig[status] || ticketStatusConfig.open;
+}
+function formatMessageTime(date) {
+  if (!date) return "";
+  return moment__default.default.utc(date).local().format("h:mm A");
+}
+function formatDateSeparator(date) {
+  if (!date) return "";
+  const m = moment__default.default.utc(date).local();
+  const now = moment__default.default();
+  const today = now.clone().startOf("day");
+  const yesterday = now.clone().subtract(1, "day").startOf("day");
+  if (m.isSame(today, "day")) {
+    return "Today";
+  }
+  if (m.isSame(yesterday, "day")) {
+    return "Yesterday";
+  }
+  if (m.isSame(now, "year")) {
+    return m.format("MMM D");
+  }
+  return m.format("MMM D, YYYY");
+}
+function formatRelativeTime(date, labels) {
+  if (!date) return "N/A";
+  const m = moment__default.default.utc(date).local();
+  const now = moment__default.default();
+  const diffInSeconds = now.diff(m, "seconds");
+  if (diffInSeconds < 60) {
+    return labels.justNow;
+  }
+  if (diffInSeconds < 3600) {
+    return labels.minutesAgo.replace("{count}", String(Math.floor(diffInSeconds / 60)));
+  }
+  if (diffInSeconds < 86400) {
+    return labels.hoursAgo.replace("{count}", String(Math.floor(diffInSeconds / 3600)));
+  }
+  if (diffInSeconds < 604800) {
+    return labels.daysAgo.replace("{count}", String(Math.floor(diffInSeconds / 86400)));
+  }
+  return m.format("MMM D, YYYY");
+}
+function isSameDay(date1, date2) {
+  if (!date1 || !date2) return false;
+  return moment__default.default.utc(date1).format("YYYY-MM-DD") === moment__default.default.utc(date2).format("YYYY-MM-DD");
+}
+function formatTicketDate(date) {
+  if (!date) return "";
+  return moment__default.default.utc(date).local().format("MMM D, YYYY");
+}
 function TicketItem({ ticket, onClick }) {
   const st = useSupportT();
-  const labels = React4.useMemo(() => ({
+  const labels = react.useMemo(() => ({
     status: {
       open: st("status.open"),
       waiting_for_user: st("status.waitingForUser"),
@@ -2319,49 +2354,37 @@ function TicketItem({ ticket, onClick }) {
       daysAgo: st("time.daysAgo")
     }
   }), [st]);
-  const formatRelativeTime = React4.useCallback((date) => {
-    if (!date) return "N/A";
-    const m = moment2__default.default.utc(date).local();
-    const now = moment2__default.default();
-    const diffInSeconds = now.diff(m, "seconds");
-    if (diffInSeconds < 60) return labels.time.justNow;
-    if (diffInSeconds < 3600) return labels.time.minutesAgo.replace("{count}", String(Math.floor(diffInSeconds / 60)));
-    if (diffInSeconds < 86400) return labels.time.hoursAgo.replace("{count}", String(Math.floor(diffInSeconds / 3600)));
-    if (diffInSeconds < 604800) return labels.time.daysAgo.replace("{count}", String(Math.floor(diffInSeconds / 86400)));
-    return m.format("MMM D, YYYY");
+  const getRelativeTime = react.useCallback((date) => {
+    return formatRelativeTime(date, labels.time);
   }, [labels.time]);
   const statusLabel = labels.status[ticket.status] || ticket.status || labels.status.open;
+  const statusConfig = getStatusConfig(ticket.status || "open");
   const hasUnread = (ticket.unanswered_messages_count || 0) > 0;
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
+    "button",
     {
+      type: "button",
       className: lib.cn(
-        "group flex items-center gap-4 p-4 rounded-xl",
-        "cursor-pointer transition-all duration-200",
-        "hover:bg-accent/50",
-        "active:scale-[0.98]",
-        hasUnread && "bg-primary/5"
+        "w-full flex items-start gap-3 p-4 text-left",
+        "transition-colors duration-150",
+        "hover:bg-accent/50 active:bg-accent"
       ),
       onClick,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 flex-shrink-0", children: hasUnread && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full bg-primary animate-pulse" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 pt-1.5 shrink-0", children: hasUnread && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full bg-blue-500" }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: lib.cn(
-              "font-medium text-sm line-clamp-1",
-              hasUnread && "font-semibold"
-            ), children: ticket.subject }),
-            hasUnread && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Badge, { variant: "destructive", className: "shrink-0 text-xs", children: ticket.unanswered_messages_count })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 mt-1 text-xs text-muted-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(uiCore.Badge, { variant: getStatusBadgeVariant(ticket.status || "open"), className: "text-xs py-0", children: statusLabel }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "h-3 w-3" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatRelativeTime(ticket.created_at) })
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: lib.cn(
+            "text-[15px] line-clamp-1",
+            hasUnread ? "font-semibold" : "font-medium"
+          ), children: ticket.subject }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mt-0.5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: lib.cn("text-[13px]", statusConfig.color), children: statusLabel }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[13px] text-muted-foreground", children: [
+              "\xB7 ",
+              getRelativeTime(ticket.created_at)
             ] })
           ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-5 w-5 text-muted-foreground/50 group-hover:text-muted-foreground transition-colors flex-shrink-0" })
+        ] })
       ]
     }
   );
@@ -2376,15 +2399,15 @@ function TicketList({ onTicketClick, className }) {
     totalCount: totalTicketsCount,
     loadMore: loadMoreTickets
   } = useTickets();
-  const labels = React4.useMemo(() => ({
+  const labels = react.useMemo(() => ({
     noTickets: st("ticketList.noTickets"),
     noTicketsDescription: st("ticketList.noTicketsDescription"),
     loadingMore: st("ticketList.loadingMore"),
     loadMore: st("ticketList.loadMore")
   }), [st]);
-  const observerRef = React4.useRef(null);
-  const loadMoreRef = React4.useRef(null);
-  React4.useEffect(() => {
+  const observerRef = react.useRef(null);
+  const loadMoreRef = react.useRef(null);
+  react.useEffect(() => {
     if (observerRef.current) {
       observerRef.current.disconnect();
     }
@@ -2406,24 +2429,23 @@ function TicketList({ onTicketClick, className }) {
     };
   }, [hasMoreTickets, isLoadingMoreTickets, loadMoreTickets]);
   if (isLoadingTickets) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: lib.cn("px-4 py-6 space-y-3", className), children: [1, 2, 3, 4, 5].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: lib.cn("px-4 py-6", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-border/50", children: [1, 2, 3, 4, 5].map((i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-4", children: /* @__PURE__ */ jsxRuntime.jsx(
       uiCore.Skeleton,
       {
-        className: "h-20 w-full",
+        className: "h-12 w-full",
         style: { animationDelay: `${i * 100}ms` }
-      },
-      i
-    )) });
+      }
+    ) }, i)) }) });
   }
   if (!tickets || tickets.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex flex-col items-center justify-center py-16 px-8 text-center", className), children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-16 w-16 mx-auto mb-4 bg-muted rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-8 w-8 text-muted-foreground" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold mb-2", children: labels.noTickets }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: labels.noTicketsDescription })
+    return /* @__PURE__ */ jsxRuntime.jsxs(uiCore.Empty, { className: lib.cn("py-16", className), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.EmptyMedia, { variant: "icon", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-8 w-8" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.EmptyTitle, { children: labels.noTickets }),
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.EmptyDescription, { children: labels.noTicketsDescription })
     ] });
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("px-4 py-6", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: tickets.map((ticket) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("px-4 py-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-border/50", children: tickets.map((ticket) => /* @__PURE__ */ jsxRuntime.jsx(
       TicketItem,
       {
         ticket,
@@ -2453,59 +2475,81 @@ function TicketList({ onTicketClick, className }) {
     ) })
   ] });
 }
-var formatTime = (date) => {
-  if (!date) return "";
-  return moment2__default.default.utc(date).local().format("hh:mm A");
-};
-var formatDate = (date) => {
-  if (!date) return "";
-  return moment2__default.default.utc(date).local().format("MMM D, YYYY");
-};
-var getStatusBadgeVariant2 = (status) => {
-  switch (status) {
-    case "open":
-      return "default";
-    case "waiting_for_user":
-      return "secondary";
-    case "waiting_for_admin":
-      return "outline";
-    case "resolved":
-      return "outline";
-    case "closed":
-      return "secondary";
-    default:
-      return "default";
+function groupMessages(messages, currentUserId) {
+  const groups = [];
+  let currentGroup = null;
+  for (const msg of messages) {
+    const isFromUser = msg.sender?.id && currentUserId && String(msg.sender.id) === String(currentUserId) || msg.is_from_author;
+    const senderId = msg.sender?.id || null;
+    const shouldStartNewGroup = !currentGroup || currentGroup.isFromUser !== isFromUser || currentGroup.senderId !== senderId;
+    if (shouldStartNewGroup) {
+      currentGroup = {
+        senderId,
+        isFromUser: !!isFromUser,
+        messages: [msg]
+      };
+      groups.push(currentGroup);
+    } else {
+      currentGroup.messages.push(msg);
+    }
   }
-};
-var MessageBubble = ({ message, isFromUser, currentUser, labels }) => {
+  return groups;
+}
+var DateSeparator = ({ date }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center my-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] text-muted-foreground bg-muted/60 px-3 py-1 rounded-full", children: formatDateSeparator(date) }) });
+var MessageBubble = ({
+  message,
+  isFromUser,
+  showAvatar,
+  showTimestamp,
+  currentUser,
+  labels
+}) => {
   const sender = message.sender;
   const senderInitial = sender?.display_username?.charAt(0)?.toUpperCase() || sender?.initials || "S";
   const userInitial = currentUser?.display_username?.charAt(0)?.toUpperCase() || currentUser?.email?.charAt(0)?.toUpperCase() || currentUser?.initials || null;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex gap-3", isFromUser ? "justify-end" : "justify-start"), children: [
-    !isFromUser && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Avatar, { className: "h-8 w-8 shrink-0", children: sender?.avatar ? /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarImage, { src: sender.avatar, alt: sender.display_username || labels.supportTeam }) : /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarFallback, { className: "bg-primary text-primary-foreground", children: sender?.is_staff ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Headphones, { className: "h-4 w-4" }) : senderInitial }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex flex-col gap-1 flex-1 max-w-[80%]", isFromUser ? "items-end" : "items-start"), children: [
-      !isFromUser && sender && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground px-1", children: [
-        sender.display_username || sender.email || labels.supportTeam,
-        sender.is_staff && ` (${labels.staff})`
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Card, { className: lib.cn(
-        isFromUser ? "bg-primary text-primary-foreground" : "bg-muted"
-      ), children: /* @__PURE__ */ jsxRuntime.jsx(uiCore.CardContent, { className: "p-3", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm whitespace-pre-wrap break-words", children: message.text }) }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground px-1", children: formatTime(message.created_at) })
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex gap-2", isFromUser ? "justify-end" : "justify-start"), children: [
+    !isFromUser && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-8 shrink-0", children: showAvatar && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Avatar, { className: "h-8 w-8", children: sender?.avatar ? /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarImage, { src: sender.avatar, alt: sender.display_username || labels.supportTeam }) : /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarFallback, { className: "bg-primary text-primary-foreground text-xs", children: sender?.is_staff ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Headphones, { className: "h-4 w-4" }) : senderInitial }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex flex-col gap-0.5 max-w-[85%]", isFromUser ? "items-end" : "items-start"), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: lib.cn(
+            "px-4 py-2.5 rounded-[20px]",
+            isFromUser ? "bg-blue-500 text-white" : "bg-[#e9e9eb] dark:bg-zinc-800 text-foreground"
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[15px] leading-relaxed whitespace-pre-wrap break-words", children: message.text })
+        }
+      ),
+      showTimestamp && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] text-muted-foreground px-2 mt-0.5", children: formatMessageTime(message.created_at) })
     ] }),
-    isFromUser && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Avatar, { className: "h-8 w-8 shrink-0", children: currentUser?.avatar ? /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarImage, { src: currentUser.avatar, alt: currentUser.display_username || currentUser.email || "You" }) : /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarFallback, { className: "bg-primary/10 text-primary font-semibold", children: userInitial || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "h-4 w-4" }) }) })
+    isFromUser && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-8 shrink-0", children: showAvatar && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Avatar, { className: "h-8 w-8", children: currentUser?.avatar ? /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarImage, { src: currentUser.avatar, alt: currentUser.display_username || currentUser.email || "You" }) : /* @__PURE__ */ jsxRuntime.jsx(uiCore.AvatarFallback, { className: "bg-blue-500 text-white text-xs font-medium", children: userInitial || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "h-4 w-4" }) }) }) })
   ] });
 };
+var MessageGroupComponent = ({ group, currentUser, labels }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: group.messages.map((msg, idx) => /* @__PURE__ */ jsxRuntime.jsx(
+    MessageBubble,
+    {
+      message: msg,
+      isFromUser: group.isFromUser,
+      showAvatar: idx === 0,
+      showTimestamp: idx === group.messages.length - 1,
+      currentUser,
+      labels
+    },
+    msg.uuid
+  )) });
+};
 function TicketSheet({ ticket, open, onOpenChange }) {
   const st = useSupportT();
   const { user } = auth.useAuth();
   const { sendMessage } = useSupport();
   const { toast } = uiCore.useToast();
-  const [message, setMessage] = React4.useState("");
-  const [isSending, setIsSending] = React4.useState(false);
-  const scrollAreaRef = React4.useRef(null);
-  const firstRender = React4.useRef(true);
-  const labels = React4.useMemo(() => ({
+  const [message, setMessage] = react.useState("");
+  const [isSending, setIsSending] = react.useState(false);
+  const scrollAreaRef = react.useRef(null);
+  const textareaRef = react.useRef(null);
+  const firstRender = react.useRef(true);
+  const labels = react.useMemo(() => ({
     noMessages: st("messageList.noMessages"),
     noMessagesDescription: st("messageList.noMessagesDescription"),
     loadingOlder: st("messageList.loadingOlder"),
@@ -2535,10 +2579,11 @@ function TicketSheet({ ticket, open, onOpenChange }) {
     refresh: refreshMessages,
     addOptimistic
   } = useMessages(ticket?.uuid || null);
-  React4.useEffect(() => {
+  const messageGroups = react.useMemo(() => groupMessages(messages, user?.id), [messages, user?.id]);
+  react.useEffect(() => {
     firstRender.current = true;
   }, [ticket?.uuid]);
-  React4.useEffect(() => {
+  react.useEffect(() => {
     if (firstRender.current && messages.length > 0) {
       const scrollContainer = scrollAreaRef.current?.querySelector("[data-radix-scroll-area-viewport]");
       if (scrollContainer) {
@@ -2547,6 +2592,14 @@ function TicketSheet({ ticket, open, onOpenChange }) {
       firstRender.current = false;
     }
   }, [messages]);
+  const handleTextareaChange = react.useCallback((e) => {
+    setMessage(e.target.value);
+    const textarea = textareaRef.current;
+    if (textarea) {
+      textarea.style.height = "auto";
+      textarea.style.height = `${Math.min(textarea.scrollHeight, 120)}px`;
+    }
+  }, []);
   const handleSend = async (e) => {
     e.preventDefault();
     if (!message.trim() || !ticket?.uuid) return;
@@ -2572,6 +2625,9 @@ function TicketSheet({ ticket, open, onOpenChange }) {
       addOptimistic(optimisticMessage);
       await sendMessage({ ticketUuid: ticket.uuid, text: messageText });
       setMessage("");
+      if (textareaRef.current) {
+        textareaRef.current.style.height = "auto";
+      }
       await refreshMessages();
       const scrollContainer = scrollAreaRef.current?.querySelector("[data-radix-scroll-area-viewport]");
       if (scrollContainer) {
@@ -2592,7 +2648,7 @@ function TicketSheet({ ticket, open, onOpenChange }) {
       handleSend(e);
     }
   };
-  const handleLoadMore = React4.useCallback(() => {
+  const handleLoadMore = react.useCallback(() => {
     const scrollContainer = scrollAreaRef.current?.querySelector("[data-radix-scroll-area-viewport]");
     const previousHeight = scrollContainer?.scrollHeight || 0;
     loadMore();
@@ -2605,32 +2661,61 @@ function TicketSheet({ ticket, open, onOpenChange }) {
   }, [loadMore]);
   const canSendMessage = ticket?.status !== "closed";
   const statusLabel = ticket ? labels.status[ticket.status] || ticket.status || labels.status.open : "";
+  const statusConfig = getStatusConfig(ticket?.status || "open");
+  const renderMessages = () => {
+    const elements = [];
+    let lastDate = null;
+    for (const group of messageGroups) {
+      const firstMessage = group.messages[0];
+      if (!firstMessage) continue;
+      const messageDate = firstMessage.created_at;
+      if (!lastDate || !isSameDay(lastDate, messageDate)) {
+        elements.push(
+          /* @__PURE__ */ jsxRuntime.jsx(DateSeparator, { date: messageDate || "" }, `date-${messageDate}`)
+        );
+        lastDate = messageDate || null;
+      }
+      elements.push(
+        /* @__PURE__ */ jsxRuntime.jsx(
+          MessageGroupComponent,
+          {
+            group,
+            currentUser: user,
+            labels: { supportTeam: labels.supportTeam, staff: labels.staff }
+          },
+          `group-${firstMessage.uuid}`
+        )
+      );
+    }
+    return elements;
+  };
   return /* @__PURE__ */ jsxRuntime.jsx(uiCore.ResponsiveSheet, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(uiCore.ResponsiveSheetContent, { className: "sm:max-w-xl p-0 flex flex-col h-full", children: [
     /* @__PURE__ */ jsxRuntime.jsx(uiCore.ResponsiveSheetHeader, { className: "px-6 py-4 border-b flex-shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between gap-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
       /* @__PURE__ */ jsxRuntime.jsx(uiCore.ResponsiveSheetTitle, { className: "text-lg font-semibold line-clamp-2", children: ticket?.subject || "Ticket" }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mt-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(uiCore.Badge, { variant: getStatusBadgeVariant2(ticket?.status || "open"), className: "text-xs", children: statusLabel }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: formatDate(ticket?.created_at) })
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: lib.cn("text-[13px] px-2 py-0.5 rounded-full", statusConfig.bg, statusConfig.color), children: statusLabel }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] text-muted-foreground", children: formatTicketDate(ticket?.created_at) })
       ] })
     ] }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0 overflow-hidden", children: isLoadingMessages ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-6 space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-8 w-8 rounded-full" }),
-      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-16 flex-1 max-w-[70%]" })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0 overflow-hidden", children: isLoadingMessages ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-6 space-y-4", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex gap-2", i % 2 === 0 ? "justify-end" : "justify-start"), children: [
+      i % 2 !== 0 && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-8 w-8 rounded-full shrink-0" }),
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: lib.cn("h-16 rounded-[20px]", i % 2 === 0 ? "w-[60%]" : "w-[70%]") }),
+      i % 2 === 0 && /* @__PURE__ */ jsxRuntime.jsx(uiCore.Skeleton, { className: "h-8 w-8 rounded-full shrink-0" })
     ] }, i)) }) : messages.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center h-full p-8 text-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-12 w-12 text-muted-foreground mb-4" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-16 w-16 mx-auto mb-4 bg-muted rounded-full flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-8 w-8 text-muted-foreground" }) }),
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold mb-2", children: labels.noMessages }),
       /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: labels.noMessagesDescription })
-    ] }) : /* @__PURE__ */ jsxRuntime.jsx(uiCore.ScrollArea, { className: "h-full", viewportRef: scrollAreaRef, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-6 space-y-4", children: [
+    ] }) : /* @__PURE__ */ jsxRuntime.jsx(uiCore.ScrollArea, { className: "h-full", viewportRef: scrollAreaRef, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 space-y-3", children: [
       hasMore && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center pb-4", children: isLoadingMore ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-muted-foreground", children: [
         /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: labels.loadingOlder })
       ] }) : /* @__PURE__ */ jsxRuntime.jsxs(
         uiCore.Button,
         {
-          variant: "outline",
+          variant: "ghost",
           size: "sm",
           onClick: handleLoadMore,
-          className: "text-xs",
+          className: "text-xs text-muted-foreground",
           children: [
             labels.loadOlder,
             " (",
@@ -2639,67 +2724,52 @@ function TicketSheet({ ticket, open, onOpenChange }) {
           ]
         }
       ) }),
-      messages.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-border" }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: formatDate(messages[0]?.created_at) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-border" })
-      ] }),
-      messages.map((msg, index) => {
-        const isFromUser = msg.sender?.id && user?.id && String(msg.sender.id) === String(user.id) || msg.sender?.email && user?.email && msg.sender.email === user.email || msg.is_from_author && ticket?.user && user?.id && String(ticket.user) === String(user.id);
-        const previousMessage = index > 0 ? messages[index - 1] : null;
-        const showDateSeparator = previousMessage && moment2__default.default.utc(previousMessage.created_at || "").format("YYYY-MM-DD") !== moment2__default.default.utc(msg.created_at || "").format("YYYY-MM-DD");
-        return /* @__PURE__ */ jsxRuntime.jsxs(React4__default.default.Fragment, { children: [
-          showDateSeparator && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 my-4", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-border" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: formatDate(msg.created_at) }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-px bg-border" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            MessageBubble,
-            {
-              message: msg,
-              isFromUser: !!isFromUser,
-              currentUser: user,
-              labels: { supportTeam: labels.supportTeam, staff: labels.staff }
-            }
-          )
-        ] }, msg.uuid);
-      })
+      renderMessages()
     ] }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSend, className: "p-4 border-t bg-background flex-shrink-0", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          uiCore.Textarea,
-          {
-            value: message,
-            onChange: (e) => setMessage(e.target.value),
-            onKeyDown: handleKeyDown,
-            placeholder: canSendMessage ? labels.placeholder : labels.ticketClosed,
-            className: "min-h-[60px] max-h-[150px] resize-none",
-            disabled: !canSendMessage || isSending
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          uiCore.Button,
-          {
-            type: "submit",
-            size: "icon",
-            disabled: !message.trim() || !canSendMessage || isSending,
-            className: "shrink-0",
-            children: isSending ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Send, { className: "h-4 w-4" })
-          }
-        )
-      ] }),
-      !canSendMessage && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-2", children: labels.ticketClosedDescription })
-    ] })
+    /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSend, className: "p-3 border-t bg-background/95 backdrop-blur flex-shrink-0", children: canSendMessage ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-end gap-2 bg-muted/50 rounded-[24px] px-4 py-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          ref: textareaRef,
+          value: message,
+          onChange: handleTextareaChange,
+          onKeyDown: handleKeyDown,
+          placeholder: labels.placeholder,
+          className: lib.cn(
+            "flex-1 bg-transparent border-none resize-none",
+            "text-[15px] placeholder:text-muted-foreground",
+            "min-h-[24px] max-h-[120px] focus:outline-none"
+          ),
+          rows: 1,
+          disabled: isSending
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        uiCore.Button,
+        {
+          type: "submit",
+          size: "icon",
+          variant: "ghost",
+          className: lib.cn(
+            "rounded-full h-8 w-8 shrink-0",
+            message.trim() ? "bg-blue-500 text-white hover:bg-blue-600" : ""
+          ),
+          disabled: !message.trim() || isSending,
+          children: isSending ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-4 w-4" })
+        }
+      )
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center py-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: labels.ticketClosed }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-1", children: labels.ticketClosedDescription })
+    ] }) })
   ] }) });
 }
 function CreateTicketSheet({ open, onOpenChange, onSuccess }) {
   const st = useSupportT();
   const { createTicket } = useSupport();
   const { toast } = uiCore.useToast();
-  const [isSubmitting, setIsSubmitting] = React4.useState(false);
-  const labels = React4.useMemo(() => ({
+  const [isSubmitting, setIsSubmitting] = react.useState(false);
+  const labels = react.useMemo(() => ({
     title: st("createTicket.title"),
     description: st("createTicket.description"),
     subjectLabel: st("createTicket.subjectLabel"),
@@ -2718,7 +2788,7 @@ function CreateTicketSheet({ open, onOpenChange, onSuccess }) {
       messageTooLong: st("validation.messageTooLong")
     }
   }), [st]);
-  const createTicketSchema = React4.useMemo(() => zod.z.object({
+  const createTicketSchema = react.useMemo(() => zod.z.object({
     subject: zod.z.string().min(1, labels.validation.subjectRequired).max(200, labels.validation.subjectTooLong),
     message: zod.z.string().min(1, labels.validation.messageRequired).max(5e3, labels.validation.messageTooLong)
   }), [labels.validation]);
@@ -2752,13 +2822,10 @@ function CreateTicketSheet({ open, onOpenChange, onSuccess }) {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(uiCore.ResponsiveSheet, { open, onOpenChange: handleClose, children: /* @__PURE__ */ jsxRuntime.jsxs(uiCore.ResponsiveSheetContent, { className: "sm:max-w-lg", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(uiCore.ResponsiveSheetHeader, { children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(uiCore.ResponsiveSheetTitle, { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-5 w-5" }),
-        labels.title
-      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(uiCore.ResponsiveSheetTitle, { children: labels.title }),
       /* @__PURE__ */ jsxRuntime.jsx(uiCore.ResponsiveSheetDescription, { children: labels.description })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(uiCore.Form, { ...form, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className: "space-y-6 mt-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(uiCore.Form, { ...form, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className: "space-y-5 mt-4", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         uiCore.FormField,
         {
@@ -2798,7 +2865,7 @@ function CreateTicketSheet({ open, onOpenChange, onSuccess }) {
           ] })
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-3 pt-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-3 pt-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           uiCore.Button,
           {
@@ -2812,23 +2879,20 @@ function CreateTicketSheet({ open, onOpenChange, onSuccess }) {
         /* @__PURE__ */ jsxRuntime.jsx(uiCore.Button, { type: "submit", disabled: isSubmitting, children: isSubmitting ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
           labels.creating
-        ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4 mr-2" }),
-          labels.create
-        ] }) })
+        ] }) : labels.create })
       ] })
     ] }) })
   ] }) });
 }
 var SupportContent = () => {
-  const [createSheetOpen, setCreateSheetOpen] = React4.useState(false);
-  const [selectedTicket, setSelectedTicket] = React4.useState(null);
-  const [ticketSheetOpen, setTicketSheetOpen] = React4.useState(false);
-  const handleTicketClick = React4.useCallback((ticket) => {
+  const [createSheetOpen, setCreateSheetOpen] = react.useState(false);
+  const [selectedTicket, setSelectedTicket] = react.useState(null);
+  const [ticketSheetOpen, setTicketSheetOpen] = react.useState(false);
+  const handleTicketClick = react.useCallback((ticket) => {
     setSelectedTicket(ticket);
     setTicketSheetOpen(true);
   }, []);
-  const handleTicketCreated = React4.useCallback((ticket) => {
+  const handleTicketCreated = react.useCallback((ticket) => {
     setSelectedTicket(ticket);
     setTicketSheetOpen(true);
   }, []);
@@ -2870,7 +2934,7 @@ function ApiSupportPage() {
   return /* @__PURE__ */ jsxRuntime.jsx(SupportProvider, { adapter, children: /* @__PURE__ */ jsxRuntime.jsx(SupportContent, {}) });
 }
 function DemoSupportPage() {
-  const adapter = React4.useMemo(() => createDemoAdapter(), []);
+  const adapter = react.useMemo(() => createDemoAdapter(), []);
   return /* @__PURE__ */ jsxRuntime.jsx(SupportProvider, { adapter, children: /* @__PURE__ */ jsxRuntime.jsx(SupportContent, {}) });
 }
 function SupportPageInner({ isDemo = false }) {
@@ -2886,7 +2950,7 @@ function SupportPage({ isDemo = false }) {
 // package.json
 var package_default = {
   name: "@djangocfg/ext-support",
-  version: "1.0.24",
+  version: "1.0.26",
   description: "Support ticket system extension for DjangoCFG",
   keywords: [
     "django",