Update modals.js

static/js/ui/modals.js

@@ -1,3 +1,4 @@
+// --- START OF FILE modals.js ---
 // static/js/ui/modals.js
 
 import { dom } from './dom.js';
@@ -5,23 +6,19 @@ import { dom } from './dom.js';
 let currentGalleryImages = [];
 let currentGalleryIndex = 0;
 
+// تابع کمکی برای ساخت آیتم‌های منو
 const createMenuItem = (options) => {
     const { action, format = '', text, icon, isDanger = false, type = 'button' } = options;
     const element = document.createElement(type);
     element.className = `menu-item ${isDanger ? 'danger' : ''}`;
     element.dataset.action = action;
     if (format) element.dataset.format = format;
+    // اضافه کردن آیکون و متن + لودینگ مخفی
     element.innerHTML = `${icon}<span>${text}</span><div class="hidden w-4 h-4 border-2 border-slate-300 border-t-blue-500 rounded-full animate-spin ml-auto"></div>`;
     return element;
 };
 
-const getConversionMenuItems = (action) => `
-    ${createMenuItem({ action, format: 'pdf', text: 'تبدیل به PDF', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m.75 12l3 3m0 0l3-3m-3 3v-6m-1.5-9H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" /></svg>` }).outerHTML}
-    ${createMenuItem({ action, format: 'docx', text: 'تبدیل به Word', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H15M2.25 3h1.5M2.25 6h1.5M2.25 9h1.5M2.25 12h1.5M2.25 15h1.5M2.25 18h1.5M4.5 21h15a2.25 2.25 0 002.25-2.25V5.25A2.25 2.25 0 0019.5 3h-15A2.25 2.25 0 002.25 5.25v13.5A2.25 2.25 0 004.5 21z" /></svg>` }).outerHTML}
-    ${createMenuItem({ action, format: 'txt', text: 'تبدیل به Text', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12" /></svg>` }).outerHTML}
-    ${createMenuItem({ action, format: 'html', text: 'تبدیل به HTML', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M17.25 6.75L22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3l-4.5 16.5" /></svg>` }).outerHTML}
-`;
-
+// تابع نمایش تصویر در گالری (بدون تغییر)
 function showImageInGallery(index) {
     if (index < 0 || index >= currentGalleryImages.length) return;
     currentGalleryIndex = index;
@@ -141,35 +138,81 @@ export function toggleHtmlPreviewModal(show, htmlContent = '') {
     }
 }
 
+// *** تابع اصلی که منوی سه نقطه تاریخچه را می‌سازد (به روز شده) ***
 export function showHistoryMenu(event, sessionId) {
     event.stopPropagation();
     const menu = dom.historyItemMenu;
 
+    // تعریف دقیق آیتم‌ها به ترتیب خواسته شده
     menu.innerHTML = `
-        ${createMenuItem({ action: 'rename', text: 'تغییر نام گفتگو', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125" /></svg>` }).outerHTML}
+        ${createMenuItem({ 
+            action: 'rename', 
+            text: 'تغییر نام گفتگو', 
+            icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125" /></svg>` 
+        }).outerHTML}
+        
         <div class="menu-divider"></div>
-        ${getConversionMenuItems('convert-chat')}
+        
+        ${createMenuItem({ 
+            action: 'convert-chat', 
+            format: 'pdf', 
+            text: 'تبدیل به PDF', 
+            icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m.75 12l3 3m0 0l3-3m-3 3v-6m-1.5-9H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" /></svg>` 
+        }).outerHTML}
+        
+        ${createMenuItem({ 
+            action: 'convert-chat', 
+            format: 'docx', 
+            text: 'تبدیل به Word', 
+            icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H15M2.25 3h1.5M2.25 6h1.5M2.25 9h1.5M2.25 12h1.5M2.25 15h1.5M2.25 18h1.5M4.5 21h15a2.25 2.25 0 002.25-2.25V5.25A2.25 2.25 0 0019.5 3h-15A2.25 2.25 0 002.25 5.25v13.5A2.25 2.25 0 004.5 21z" /></svg>` 
+        }).outerHTML}
+
+        ${createMenuItem({ 
+            action: 'convert-chat', 
+            format: 'txt', 
+            text: 'تبدیل به Text', 
+            icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12" /></svg>` 
+        }).outerHTML}
+
+        ${createMenuItem({ 
+            action: 'convert-chat', 
+            format: 'html', 
+            text: 'تبدیل به HTML', 
+            icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M17.25 6.75L22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3l-4.5 16.5" /></svg>` 
+        }).outerHTML}
+        
         <div class="menu-divider"></div>
-        ${createMenuItem({ action: 'delete', text: 'حذف گفتگو', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" /></svg>`, isDanger: true }).outerHTML}
+        
+        ${createMenuItem({ 
+            action: 'delete', 
+            text: 'حذف گفتگو', 
+            icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0" /></svg>`, 
+            isDanger: true 
+        }).outerHTML}
     `;
 
     menu.dataset.sessionId = sessionId;
 
+    // تنظیم موقعیت منو
     const buttonRect = event.currentTarget.getBoundingClientRect();
-    const menuHeight = 220;
+    const menuHeight = 350; // ارتفاع تخمینی منو با گزینه‌های بیشتر
     const margin = 8;
     
     let top = buttonRect.bottom + margin;
     let right = window.innerWidth - buttonRect.right;
     
+    // اگر پایین صفحه جا نیست، منو را به سمت بالا باز کن
     if (top + menuHeight > window.innerHeight) {
         top = buttonRect.top - menuHeight - margin;
     }
     
+    // جلوگیری از بیرون زدن از بالای صفحه
+    if (top < 0) top = 10;
+
     menu.style.top = `${top}px`;
     menu.style.right = `${right}px`;
     menu.style.left = 'auto';
-    menu.style.transformOrigin = (top > buttonRect.top) ? 'bottom right' : 'top right';
+    menu.style.transformOrigin = (top > buttonRect.top) ? 'top right' : 'bottom right';
 
     menu.classList.add('visible');
     const closeMenu = () => {
@@ -189,10 +232,15 @@ export function showMessageMenu(event, messageIndex, activeChat, escapeHTML) {
     const textPart = message.parts.find(p => p.text);
     const textContent = textPart ? textPart.text : '[محتوای غیر متنی]';
 
+    // برای منوی پیام تکی هم همان گزینه‌ها را با استفاده از تابع کمکی می‌سازیم
     let menuItemsHtml = '';
+    
     if (message.role === 'assistant' && textPart) {
-        menuItemsHtml += getConversionMenuItems('convert-message');
-        menuItemsHtml += '<div class="menu-divider"></div>';
+         menuItemsHtml += createMenuItem({ action: 'convert-message', format: 'pdf', text: 'تبدیل به PDF', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m.75 12l3 3m0 0l3-3m-3 3v-6m-1.5-9H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" /></svg>` }).outerHTML;
+         menuItemsHtml += createMenuItem({ action: 'convert-message', format: 'docx', text: 'تبدیل به Word', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H15M2.25 3h1.5M2.25 6h1.5M2.25 9h1.5M2.25 12h1.5M2.25 15h1.5M2.25 18h1.5M4.5 21h15a2.25 2.25 0 002.25-2.25V5.25A2.25 2.25 0 0019.5 3h-15A2.25 2.25 0 002.25 5.25v13.5A2.25 2.25 0 004.5 21z" /></svg>` }).outerHTML;
+         menuItemsHtml += createMenuItem({ action: 'convert-message', format: 'txt', text: 'تبدیل به Text', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12" /></svg>` }).outerHTML;
+         menuItemsHtml += createMenuItem({ action: 'convert-message', format: 'html', text: 'تبدیل به HTML', icon: `<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M17.25 6.75L22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3l-4.5 16.5" /></svg>` }).outerHTML;
+         menuItemsHtml += '<div class="menu-divider"></div>';
     }
     
     menuItemsHtml += createMenuItem({ 
@@ -376,4 +424,5 @@ export function togglePlusRequiredModal(show) {
             modal.classList.add('hidden');
         }, 300);
     }
-}
+}
+// --- END OF FILE modals.js ---