fix(ui): remove redundant Quick Refresh from Refresh split button dropdown

The main Refresh button and Quick Refresh dropdown item both called refreshModels(false). Split button dropdowns should only contain alternative actions (Hick's Law). Dropdown now has only Rebuild Cache (fullRebuild=true). Removed from 2 templates, 2 JS files, 1 test fixture, and 10 locale files.
feat(bulk): reorganize context menu with sections and submenu for workflow actions
2026-06-23 11:41:17 -03:00 · 2026-05-12 07:50:54 +08:00 · 2026-05-11 21:06:47 +08:00 · 2026-05-11 18:05:00 +08:00 · 2026-05-10 22:22:24 +08:00 · 2026-05-08 14:55:53 +08:00
26 changed files with 844 additions and 166 deletions
--- a/locales/de.json
+++ b/locales/de.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "Modelliste aktualisieren",
-                "quick": "Änderungen synchronisieren",
-                "quickTooltip": "Nach neuen oder fehlenden Modelldateien suchen, damit die Liste aktuell bleibt.",
                "full": "Cache neu aufbauen",
                "fullTooltip": "Alle Modelldetails aus Metadatendateien neu laden – nutzen, wenn die Bibliothek veraltet wirkt oder nach manuellen Änderungen."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "Aus Favoriten entfernen",
            "deleteAll": "Ausgewählte löschen",
            "downloadMissingLoras": "Fehlende LoRAs herunterladen",
+            "downloadExamples": "Beispielbilder herunterladen",
            "clear": "Auswahl löschen",
            "skipMetadataRefreshCount": "Überspringen（{count} Modelle）",
            "resumeMetadataRefreshCount": "Fortsetzen（{count} Modelle）",
+            "sendToWorkflow": "An Workflow senden",
+            "sections": {
+                "workflow": "Workflow",
+                "metadata": "Metadaten",
+                "attributes": "Attribute",
+                "organize": "Organisieren",
+                "download": "Download"
+            },
            "autoOrganizeProgress": {
                "initializing": "Automatische Organisation wird initialisiert...",
                "starting": "Automatische Organisation für {type} wird gestartet...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "Rezeptliste aktualisieren",
-                "quick": "Änderungen synchronisieren",
-                "quickTooltip": "Änderungen synchronisieren - schnelle Aktualisierung ohne Cache-Neubau",
                "full": "Cache neu aufbauen",
                "fullTooltip": "Cache neu aufbauen - vollständiger Rescan aller Rezeptdateien"
            },
@@ -1952,4 +1957,4 @@
            "retry": "Wiederholen"
        }
    }
-}
+}
--- a/locales/en.json
+++ b/locales/en.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "Refresh model list",
-                "quick": "Sync Changes",
-                "quickTooltip": "Scan for new or missing model files so the list stays current.",
                "full": "Rebuild Cache",
                "fullTooltip": "Reload all model details from metadata files—use if the library looks out of date or after manual edits."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "Remove from Favorites",
            "deleteAll": "Delete Selected",
            "downloadMissingLoras": "Download Missing LoRAs",
+            "downloadExamples": "Download Example Images",
            "clear": "Clear Selection",
            "skipMetadataRefreshCount": "Skip ({count} models)",
            "resumeMetadataRefreshCount": "Resume ({count} models)",
+            "sendToWorkflow": "Send to Workflow",
+            "sections": {
+                "workflow": "Workflow",
+                "metadata": "Metadata",
+                "attributes": "Attributes",
+                "organize": "Organize",
+                "download": "Download"
+            },
            "autoOrganizeProgress": {
                "initializing": "Initializing auto-organize...",
                "starting": "Starting auto-organize for {type}...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "Refresh recipe list",
-                "quick": "Sync Changes",
-                "quickTooltip": "Sync changes - quick refresh without rebuilding cache",
                "full": "Rebuild Cache",
                "fullTooltip": "Rebuild cache - full rescan of all recipe files"
            },
@@ -1952,4 +1957,4 @@
            "retry": "Retry"
        }
    }
-}
+}
--- a/locales/es.json
+++ b/locales/es.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "Actualizar lista de modelos",
-                "quick": "Sincronizar cambios",
-                "quickTooltip": "Busca archivos de modelo nuevos o faltantes para mantener la lista al día.",
                "full": "Reconstruir caché",
                "fullTooltip": "Vuelve a cargar todos los detalles desde los archivos de metadatos; úsalo si la biblioteca parece desactualizada o tras ediciones manuales."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "Quitar de favoritos",
            "deleteAll": "Eliminar seleccionados",
            "downloadMissingLoras": "Descargar LoRAs faltantes",
+            "downloadExamples": "Descargar imágenes de ejemplo",
            "clear": "Limpiar selección",
            "skipMetadataRefreshCount": "Omitir（{count} modelos）",
            "resumeMetadataRefreshCount": "Reanudar（{count} modelos）",
+            "sendToWorkflow": "Enviar al workflow",
+            "sections": {
+                "workflow": "Workflow",
+                "metadata": "Metadatos",
+                "attributes": "Atributos",
+                "organize": "Organizar",
+                "download": "Descargar"
+            },
            "autoOrganizeProgress": {
                "initializing": "Inicializando auto-organización...",
                "starting": "Iniciando auto-organización para {type}...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "Actualizar lista de recetas",
-                "quick": "Sincronizar cambios",
-                "quickTooltip": "Sincronizar cambios - actualización rápida sin reconstruir caché",
                "full": "Reconstruir caché",
                "fullTooltip": "Reconstruir caché - reescaneo completo de todos los archivos de recetas"
            },
@@ -1952,4 +1957,4 @@
            "retry": "Reintentar"
        }
    }
-}
+}
--- a/locales/fr.json
+++ b/locales/fr.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "Actualiser la liste des modèles",
-                "quick": "Synchroniser les changements",
-                "quickTooltip": "Analyse les nouveaux fichiers de modèle ou les fichiers manquants pour garder la liste à jour.",
                "full": "Reconstruire le cache",
                "fullTooltip": "Recharge tous les détails des modèles depuis les fichiers metadata — à utiliser si la bibliothèque paraît obsolète ou après des modifications manuelles."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "Retirer des favoris",
            "deleteAll": "Supprimer la sélection",
            "downloadMissingLoras": "Télécharger les LoRAs manquants",
+            "downloadExamples": "Télécharger les images d'exemple",
            "clear": "Effacer la sélection",
            "skipMetadataRefreshCount": "Ignorer（{count} modèles）",
            "resumeMetadataRefreshCount": "Reprendre（{count} modèles）",
+            "sendToWorkflow": "Envoyer au workflow",
+            "sections": {
+                "workflow": "Workflow",
+                "metadata": "Métadonnées",
+                "attributes": "Attributs",
+                "organize": "Organiser",
+                "download": "Télécharger"
+            },
            "autoOrganizeProgress": {
                "initializing": "Initialisation de l'auto-organisation...",
                "starting": "Démarrage de l'auto-organisation pour {type}...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "Actualiser la liste des recipes",
-                "quick": "Synchroniser les changements",
-                "quickTooltip": "Synchroniser les changements - actualisation rapide sans reconstruire le cache",
                "full": "Reconstruire le cache",
                "fullTooltip": "Reconstruire le cache - rescan complet de tous les fichiers de recipes"
            },
@@ -1952,4 +1957,4 @@
            "retry": "Réessayer"
        }
    }
-}
+}
--- a/locales/he.json
+++ b/locales/he.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "רענן רשימת מודלים",
-                "quick": "סנכרון שינויים",
-                "quickTooltip": "סריקה לאיתור קבצי מודל חדשים או חסרים כדי לשמור את הרשימה מעודכנת.",
                "full": "בניית מטמון מחדש",
                "fullTooltip": "טוען מחדש את כל פרטי המודלים מקבצי המטא-דאטה – לשימוש אם הספרייה נראית לא מעודכנת או לאחר עריכות ידניות."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "הסר ממועדפים",
            "deleteAll": "מחק נבחרים",
            "downloadMissingLoras": "הורדת LoRAs חסרים",
+            "downloadExamples": "הורד תמונות דוגמה",
            "clear": "נקה בחירה",
            "skipMetadataRefreshCount": "דילוג（{count} מודלים）",
            "resumeMetadataRefreshCount": "המשך（{count} מודלים）",
+            "sendToWorkflow": "שלח ל-Workflow",
+            "sections": {
+                "workflow": "Workflow",
+                "metadata": "מטא-נתונים",
+                "attributes": "מאפיינים",
+                "organize": "ארגן",
+                "download": "הורדה"
+            },
            "autoOrganizeProgress": {
                "initializing": "מאתחל ארגון אוטומטי...",
                "starting": "מתחיל ארגון אוטומטי עבור {type}...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "רענן רשימת מתכונים",
-                "quick": "סנכרן שינויים",
-                "quickTooltip": "סנכרן שינויים - רענון מהיר ללא בניית מטמון מחדש",
                "full": "בנה מטמון מחדש",
                "fullTooltip": "בנה מטמון מחדש - סריקה מחדש מלאה של כל קבצי המתכונים"
            },
@@ -1952,4 +1957,4 @@
            "retry": "נסה שוב"
        }
    }
-}
+}
--- a/locales/ja.json
+++ b/locales/ja.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "モデルリストを更新",
-                "quick": "変更を同期",
-                "quickTooltip": "新しいモデルファイルや欠けているファイルをスキャンして一覧を最新に保ちます。",
                "full": "キャッシュを再構築",
                "fullTooltip": "メタデータファイルから全モデル情報を再読み込みします。リストが古いと感じるときや手動編集後に使用してください。"
            },
@@ -692,9 +690,18 @@
            "unfavorite": "お気に入りから削除",
            "deleteAll": "選択したものを削除",
            "downloadMissingLoras": "不足している LoRA をダウンロード",
+            "downloadExamples": "例画像をダウンロード",
            "clear": "選択をクリア",
            "skipMetadataRefreshCount": "スキップ（{count}モデル）",
            "resumeMetadataRefreshCount": "再開（{count}モデル）",
+            "sendToWorkflow": "ワークフローに送信",
+            "sections": {
+                "workflow": "ワークフロー",
+                "metadata": "メタデータ",
+                "attributes": "属性",
+                "organize": "整理",
+                "download": "ダウンロード"
+            },
            "autoOrganizeProgress": {
                "initializing": "自動整理を初期化中...",
                "starting": "{type}の自動整理を開始中...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "レシピリストを更新",
-                "quick": "変更を同期",
-                "quickTooltip": "変更を同期 - キャッシュを再構築せずにクイック更新",
                "full": "キャッシュを再構築",
                "fullTooltip": "キャッシュを再構築 - すべてのレシピファイルを完全に再スキャン"
            },
@@ -1952,4 +1957,4 @@
            "retry": "再試行"
        }
    }
-}
+}
--- a/locales/ko.json
+++ b/locales/ko.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "모델 목록 새로고침",
-                "quick": "변경 사항 동기화",
-                "quickTooltip": "새로운 모델 파일이나 누락된 파일을 찾아 목록을 최신 상태로 유지합니다.",
                "full": "캐시 재구성",
                "fullTooltip": "메타데이터 파일에서 모든 모델 정보를 다시 불러옵니다. 라이브러리가 오래되어 보이거나 수동 수정 후에 사용하세요."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "즐겨찾기 해제",
            "deleteAll": "선택된 항목 삭제",
            "downloadMissingLoras": "누락된 LoRA 다운로드",
+            "downloadExamples": "예시 이미지 다운로드",
            "clear": "선택 지우기",
            "skipMetadataRefreshCount": "건너뛰기（{count}개 모델）",
            "resumeMetadataRefreshCount": "재개（{count}개 모델）",
+            "sendToWorkflow": "워크플로우로 보내기",
+            "sections": {
+                "workflow": "워크플로우",
+                "metadata": "메타데이터",
+                "attributes": "속성",
+                "organize": "정리",
+                "download": "다운로드"
+            },
            "autoOrganizeProgress": {
                "initializing": "자동 정리 초기화 중...",
                "starting": "{type}에 대한 자동 정리 시작...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "레시피 목록 새로고침",
-                "quick": "변경 사항 동기화",
-                "quickTooltip": "변경 사항 동기화 - 캐시를 재구성하지 않고 빠른 새로고침",
                "full": "캐시 재구성",
                "fullTooltip": "캐시 재구성 - 모든 레시피 파일을 완전히 다시 스캔"
            },
@@ -1952,4 +1957,4 @@
            "retry": "다시 시도"
        }
    }
-}
+}
--- a/locales/ru.json
+++ b/locales/ru.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "Обновить список моделей",
-                "quick": "Синхронизировать изменения",
-                "quickTooltip": "Находит новые или отсутствующие файлы моделей, чтобы список оставался актуальным.",
                "full": "Перестроить кэш",
                "fullTooltip": "Перечитывает все данные моделей из файлов метаданных — используйте, если библиотека выглядит устаревшей или после ручных правок."
            },
@@ -692,9 +690,18 @@
            "unfavorite": "Удалить из избранного",
            "deleteAll": "Удалить выбранные",
            "downloadMissingLoras": "Скачать отсутствующие LoRAs",
+            "downloadExamples": "Загрузить примеры изображений",
            "clear": "Очистить выбор",
            "skipMetadataRefreshCount": "Пропустить（{count} моделей）",
            "resumeMetadataRefreshCount": "Возобновить（{count} моделей）",
+            "sendToWorkflow": "Отправить в Workflow",
+            "sections": {
+                "workflow": "Workflow",
+                "metadata": "Метаданные",
+                "attributes": "Атрибуты",
+                "organize": "Организовать",
+                "download": "Скачать"
+            },
            "autoOrganizeProgress": {
                "initializing": "Инициализация автоматической организации...",
                "starting": "Запуск автоматической организации для {type}...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "Обновить список рецептов",
-                "quick": "Синхронизировать изменения",
-                "quickTooltip": "Синхронизировать изменения - быстрое обновление без перестроения кэша",
                "full": "Перестроить кэш",
                "fullTooltip": "Перестроить кэш - полное повторное сканирование всех файлов рецептов"
            },
@@ -1952,4 +1957,4 @@
            "retry": "Повторить"
        }
    }
-}
+}
--- a/locales/zh-CN.json
+++ b/locales/zh-CN.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "刷新模型列表",
-                "quick": "同步变更",
-                "quickTooltip": "扫描新的或缺失的模型文件，保持列表最新。",
                "full": "重建缓存",
                "fullTooltip": "从元数据文件重新加载所有模型信息；用于列表过时或手动编辑后。"
            },
@@ -692,9 +690,18 @@
            "unfavorite": "取消收藏",
            "deleteAll": "删除已选",
            "downloadMissingLoras": "下载缺失的 LoRAs",
+            "downloadExamples": "下载示例图片",
            "clear": "清除选择",
            "skipMetadataRefreshCount": "跳过（{count} 个模型）",
            "resumeMetadataRefreshCount": "恢复（{count} 个模型）",
+            "sendToWorkflow": "发送到工作流",
+            "sections": {
+                "workflow": "工作流",
+                "metadata": "元数据",
+                "attributes": "属性",
+                "organize": "整理",
+                "download": "下载"
+            },
            "autoOrganizeProgress": {
                "initializing": "正在初始化自动整理...",
                "starting": "正在为 {type} 启动自动整理...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "刷新配方列表",
-                "quick": "同步变更",
-                "quickTooltip": "同步变更 - 快速刷新而不重建缓存",
                "full": "重建缓存",
                "fullTooltip": "重建缓存 - 重新扫描所有配方文件"
            },
@@ -1952,4 +1957,4 @@
            "retry": "重试"
        }
    }
-}
+}
--- a/locales/zh-TW.json
+++ b/locales/zh-TW.json
@@ -640,8 +640,6 @@
            },
            "refresh": {
                "title": "重新整理模型列表",
-                "quick": "同步變更",
-                "quickTooltip": "掃描新的或缺少的模型檔案，讓清單保持最新。",
                "full": "重建快取",
                "fullTooltip": "從中繼資料檔重新載入所有模型資訊；適用於清單過時或手動編輯後。"
            },
@@ -692,9 +690,18 @@
            "unfavorite": "取消收藏",
            "deleteAll": "刪除所選",
            "downloadMissingLoras": "下載缺失的 LoRAs",
+            "downloadExamples": "下載範例圖片",
            "clear": "清除選取",
            "skipMetadataRefreshCount": "跳過（{count} 個模型）",
            "resumeMetadataRefreshCount": "恢復（{count} 個模型）",
+            "sendToWorkflow": "發送到工作流",
+            "sections": {
+                "workflow": "工作流",
+                "metadata": "元數據",
+                "attributes": "屬性",
+                "organize": "整理",
+                "download": "下載"
+            },
            "autoOrganizeProgress": {
                "initializing": "正在初始化自動整理...",
                "starting": "正在開始自動整理 {type}...",
@@ -807,8 +814,6 @@
            },
            "refresh": {
                "title": "重新整理配方列表",
-                "quick": "同步變更",
-                "quickTooltip": "同步變更 - 快速重新整理而不重建快取",
                "full": "重建快取",
                "fullTooltip": "重建快取 - 重新掃描所有配方檔案"
            },
@@ -1952,4 +1957,4 @@
            "retry": "重試"
        }
    }
-}
+}
--- a/py/config.py
+++ b/py/config.py
@@ -172,6 +172,12 @@ class Config:
        self.extra_unet_roots: List[str] = []
        self.extra_embeddings_roots: List[str] = []
        self.recipes_path: str = ""
+
+        # Load extra folder paths from active library settings before symlink scan
+        # so both primary and extra paths are discovered in a single pass.
+        if not standalone_mode:
+            self._load_extra_paths_from_settings()
+
        # Scan symbolic links during initialization
        self._initialize_symlink_mappings()

@@ -179,6 +185,96 @@ class Config:
            # Save the paths to settings.json when running in ComfyUI mode
            self.save_folder_paths_to_settings()

+    def _load_extra_paths_from_settings(self) -> None:
+        """Read extra folder paths from the active library and apply them.
+
+        Called during ``Config.__init__`` before the symlink scan so both primary and
+        extra paths are discovered in a single pass.  Mirrors the extra-path
+        portion of ``_apply_library_paths`` without replacing the primary roots
+        that were already resolved from ComfyUI's ``folder_paths``.
+        """
+        try:
+            from .services.settings_manager import get_settings_manager
+
+            settings_manager = get_settings_manager()
+            library_name = settings_manager.get_active_library_name()
+            libraries = settings_manager.get_libraries()
+
+            if not library_name or library_name not in libraries:
+                return
+
+            library_config = libraries[library_name]
+            if not isinstance(library_config, dict):
+                return
+
+            extra_folder_paths = library_config.get("extra_folder_paths")
+            if not isinstance(extra_folder_paths, dict):
+                return
+
+            extra_lora = extra_folder_paths.get("loras", []) or []
+            extra_checkpoint = extra_folder_paths.get("checkpoints", []) or []
+            extra_unet = extra_folder_paths.get("unet", []) or []
+            extra_embedding = extra_folder_paths.get("embeddings", []) or []
+
+            if not any([extra_lora, extra_checkpoint, extra_unet, extra_embedding]):
+                return
+
+            filtered_extra_lora = self._filter_overlapping_extra_lora_paths(
+                self.loras_roots, extra_lora
+            )
+            self.extra_loras_roots = self._prepare_lora_paths(filtered_extra_lora)
+            (
+                _,
+                self.extra_checkpoints_roots,
+                self.extra_unet_roots,
+            ) = self._prepare_checkpoint_paths(extra_checkpoint, extra_unet)
+            self.extra_embeddings_roots = self._prepare_embedding_paths(
+                extra_embedding
+            )
+
+            recipes_path = library_config.get("recipes_path", "")
+            if isinstance(recipes_path, str) and recipes_path:
+                self.recipes_path = recipes_path
+
+            if self.extra_loras_roots:
+                logger.info(
+                    "Found extra LoRA roots:"
+                    + "\n - "
+                    + "\n - ".join(self.extra_loras_roots)
+                )
+            if self.extra_checkpoints_roots:
+                logger.info(
+                    "Found extra checkpoint roots:"
+                    + "\n - "
+                    + "\n - ".join(self.extra_checkpoints_roots)
+                )
+            if self.extra_unet_roots:
+                logger.info(
+                    "Found extra diffusion model roots:"
+                    + "\n - "
+                    + "\n - ".join(self.extra_unet_roots)
+                )
+            if self.extra_embeddings_roots:
+                logger.info(
+                    "Found extra embedding roots:"
+                    + "\n - "
+                    + "\n - ".join(self.extra_embeddings_roots)
+                )
+
+            logger.info(
+                "Applied library settings for '%s' with extra paths: loras=%s, "
+                "checkpoints=%s, embeddings=%s",
+                library_name,
+                extra_lora,
+                extra_checkpoint,
+                extra_embedding,
+            )
+
+        except Exception as exc:
+            logger.debug(
+                "Could not load extra paths from library settings: %s", exc
+            )
+
    def save_folder_paths_to_settings(self):
        """Persist ComfyUI-derived folder paths to the multi-library settings."""
        try:
--- a/py/lora_manager.py
+++ b/py/lora_manager.py
@@ -184,39 +184,6 @@ class LoraManager:
    async def _initialize_services(cls):
        """Initialize all services using the ServiceRegistry"""
        try:
-            # Apply library settings to load extra folder paths before scanning
-            # Only apply if extra paths haven't been loaded yet (preserves test mocks)
-            try:
-                from .services.settings_manager import get_settings_manager
-
-                settings_manager = get_settings_manager()
-                library_name = settings_manager.get_active_library_name()
-                libraries = settings_manager.get_libraries()
-                if library_name and library_name in libraries:
-                    library_config = libraries[library_name]
-                    # Only apply settings if extra paths are not already configured
-                    # This preserves values set by tests via monkeypatch
-                    extra_paths = library_config.get("extra_folder_paths", {})
-                    has_extra_paths = (
-                        config.extra_loras_roots
-                        or config.extra_checkpoints_roots
-                        or config.extra_unet_roots
-                        or config.extra_embeddings_roots
-                    )
-                    if not has_extra_paths and any(extra_paths.values()):
-                        config.apply_library_settings(library_config)
-                        logger.info(
-                            "Applied library settings for '%s' with extra paths: loras=%s, checkpoints=%s, embeddings=%s",
-                            library_name,
-                            extra_paths.get("loras", []),
-                            extra_paths.get("checkpoints", []),
-                            extra_paths.get("embeddings", []),
-                        )
-            except Exception as exc:
-                logger.warning(
-                    "Failed to apply library settings during initialization: %s", exc
-                )
-
            # Initialize CivitaiClient first to ensure it's ready for other services
            await ServiceRegistry.get_civitai_client()

--- a/static/css/components/media-viewer.css
+++ b/static/css/components/media-viewer.css
@@ -0,0 +1,124 @@
+.media-viewer-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0);
+  z-index: 10000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: background 0.3s ease;
+}
+
+.media-viewer-overlay.active {
+  background: rgba(0, 0, 0, 0.92);
+}
+
+.media-viewer-close {
+  position: fixed;
+  top: 16px;
+  right: 16px;
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.1);
+  border: none;
+  color: #fff;
+  font-size: 18px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  z-index: 10001;
+  transition: background 0.2s ease;
+  opacity: 0;
+}
+
+.media-viewer-overlay.active .media-viewer-close {
+  opacity: 1;
+}
+
+.media-viewer-close:hover {
+  background: rgba(255, 255, 255, 0.25);
+}
+
+.media-viewer-content-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  max-width: 90vw;
+  max-height: 95vh;
+  cursor: default;
+}
+
+.media-viewer-media {
+  display: block;
+  max-width: 90vw;
+  max-height: 85vh;
+  object-fit: contain;
+  border-radius: 4px;
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
+}
+
+.media-viewer-video {
+  max-height: 80vh;
+}
+
+.media-viewer-counter {
+  margin-top: 8px;
+  color: rgba(255, 255, 255, 0.5);
+  font-size: 0.85em;
+  text-align: center;
+  min-height: 1.2em;
+}
+
+.media-viewer-title {
+  margin-top: 4px;
+  color: rgba(255, 255, 255, 0.7);
+  font-size: 0.9em;
+  text-align: center;
+  max-width: 90vw;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.media-viewer-nav {
+  position: fixed;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 48px;
+  height: 80px;
+  border-radius: 4px;
+  background: rgba(255, 255, 255, 0.06);
+  border: none;
+  color: #fff;
+  font-size: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  z-index: 10001;
+  opacity: 0;
+  transition: opacity 0.2s ease, background 0.2s ease;
+}
+
+.media-viewer-overlay.active .media-viewer-nav {
+  opacity: 1;
+}
+
+.media-viewer-nav:hover {
+  background: rgba(255, 255, 255, 0.18);
+}
+
+.media-viewer-prev {
+  left: 16px;
+}
+
+.media-viewer-next {
+  right: 16px;
+}
--- a/static/css/components/menu.css
+++ b/static/css/components/menu.css
@@ -41,6 +41,63 @@
    text-align: center;
 }

+/* Section Headers */
+.context-menu-section-header {
+    padding: 6px 12px 2px;
+    font-size: 11px;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+    color: var(--text-muted);
+    cursor: default;
+    user-select: none;
+}
+
+/* Submenu */
+.context-menu-item.has-submenu {
+    position: relative;
+    justify-content: space-between;
+}
+
+.submenu-arrow {
+    margin-left: auto;
+    font-size: 10px;
+    width: auto !important;
+}
+
+.context-submenu {
+    position: absolute;
+    left: calc(100% - 4px);
+    top: -1px;
+    display: none;
+    background: var(--lora-surface);
+    border: 1px solid var(--border-color);
+    border-radius: var(--border-radius-xs);
+    padding: 0;
+    min-width: 200px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+    z-index: 1001;
+    backdrop-filter: blur(10px);
+}
+
+.context-submenu .context-menu-item {
+    white-space: nowrap;
+    margin: 0;
+}
+
+.context-submenu .context-menu-item:first-child {
+    padding-top: 9px;
+}
+
+.context-submenu .context-menu-item:last-child {
+    padding-bottom: 9px;
+}
+
+.context-submenu.flip-left {
+    left: auto;
+    right: 100%;
+}
+
 /* NSFW Level Selector */
 .nsfw-level-selector {
    position: fixed;
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -39,6 +39,7 @@
@import 'components/keyboard-nav.css'; /* Add keyboard navigation component */
@import 'components/statistics.css'; /* Add statistics component */
@import 'components/sidebar.css'; /* Add sidebar component */
+@import 'components/media-viewer.css';

 .initialization-notice {
    display: flex;
--- a/static/js/components/ContextMenu/BaseContextMenu.js
+++ b/static/js/components/ContextMenu/BaseContextMenu.js
@@ -3,32 +3,113 @@ export class BaseContextMenu {
        this.menu = document.getElementById(menuId);
        this.cardSelector = cardSelector;
        this.currentCard = null;
-        
+        this.submenuTimeout = null;
+        this.openSubmenu = null;
+
        if (!this.menu) {
            console.error(`Context menu element with ID ${menuId} not found`);
            return;
        }
-        
+
        this.init();
    }

    init() {
-        // Hide menu on regular clicks
-        document.addEventListener('click', () => this.hideMenu());
+        // Hide menu when clicking outside
+        document.addEventListener('click', (e) => {
+            if (!this.menu.contains(e.target)) {
+                this.hideMenu();
+            }
+        });

-        // Handle menu item clicks
+        // Handle menu item clicks (including submenu items)
        this.menu.addEventListener('click', (e) => {
            const menuItem = e.target.closest('.context-menu-item');
            if (!menuItem || !this.currentCard) return;

+            // Ignore clicks on submenu trigger (has-submenu parent)
+            if (menuItem.classList.contains('has-submenu')) return;
+
            const action = menuItem.dataset.action;
            if (!action) return;
-            
+
            this.handleMenuAction(action, menuItem);
            this.hideMenu();
        });
+
+        // Submenu hover handling
+        // Use mouseover/mouseout (which bubble) with relatedTarget checks
+        // to reliably detect crossing the .has-submenu boundary
+        this.menu.addEventListener('mouseover', (e) => {
+            const trigger = e.target.closest('.has-submenu');
+            if (!trigger) return;
+
+            // Only act when entering from outside this trigger's tree
+            if (e.relatedTarget && trigger.contains(e.relatedTarget)) return;
+
+            this._openSubmenu(trigger);
+        });
+
+        this.menu.addEventListener('mouseout', (e) => {
+            const trigger = e.target.closest('.has-submenu');
+            if (!trigger) return;
+
+            // Only close when leaving the trigger's tree entirely
+            if (e.relatedTarget && trigger.contains(e.relatedTarget)) return;
+
+            this._scheduleSubmenuClose(trigger);
+        });
    }
-    
+
+    _openSubmenu(trigger) {
+        // Clear any pending close
+        if (this.submenuTimeout) {
+            clearTimeout(this.submenuTimeout);
+            this.submenuTimeout = null;
+        }
+
+        // Hide any previously open submenu
+        if (this.openSubmenu && this.openSubmenu !== trigger) {
+            this._hideSubmenu(this.openSubmenu);
+        }
+
+        const submenu = trigger.querySelector('.context-submenu');
+        if (!submenu) return;
+
+        submenu.style.display = 'block';
+        this.openSubmenu = trigger;
+        this._positionSubmenu(submenu);
+    }
+
+    _scheduleSubmenuClose(trigger) {
+        this.submenuTimeout = setTimeout(() => {
+            this._hideSubmenu(trigger);
+            this.submenuTimeout = null;
+        }, 250);
+    }
+
+    _hideSubmenu(trigger) {
+        const submenu = trigger.querySelector('.context-submenu');
+        if (submenu) {
+            submenu.style.display = 'none';
+            submenu.classList.remove('flip-left');
+        }
+        if (this.openSubmenu === trigger) {
+            this.openSubmenu = null;
+        }
+    }
+
+    _positionSubmenu(submenu) {
+        const submenuRect = submenu.getBoundingClientRect();
+        const viewportWidth = document.documentElement.clientWidth;
+
+        if (submenuRect.right > viewportWidth) {
+            submenu.classList.add('flip-left');
+        } else {
+            submenu.classList.remove('flip-left');
+        }
+    }
+
    handleMenuAction(action, menuItem) {
        // Override in subclass
        console.warn('handleMenuAction not implemented');
@@ -40,34 +121,41 @@ export class BaseContextMenu {

        // Get menu dimensions
        const menuRect = this.menu.getBoundingClientRect();
-        
+
        // Get viewport dimensions
        const viewportWidth = document.documentElement.clientWidth;
        const viewportHeight = document.documentElement.clientHeight;
-        
+
        // Calculate position
        let finalX = x;
        let finalY = y;
-        
+
        // Ensure menu doesn't go offscreen right
        if (x + menuRect.width > viewportWidth) {
            finalX = x - menuRect.width;
        }
-        
+
        // Ensure menu doesn't go offscreen bottom
        if (y + menuRect.height > viewportHeight) {
            finalY = y - menuRect.height;
        }
-        
+
        // Position menu
        this.menu.style.left = `${finalX}px`;
        this.menu.style.top = `${finalY}px`;
    }

    hideMenu() {
+        if (this.submenuTimeout) {
+            clearTimeout(this.submenuTimeout);
+            this.submenuTimeout = null;
+        }
+        if (this.openSubmenu) {
+            this._hideSubmenu(this.openSubmenu);
+        }
        if (this.menu) {
            this.menu.style.display = 'none';
        }
        this.currentCard = null;
    }
-}
+}
--- a/static/js/components/ContextMenu/BulkContextMenu.js
+++ b/static/js/components/ContextMenu/BulkContextMenu.js
@@ -4,6 +4,7 @@ import { bulkManager } from '../../managers/BulkManager.js';
 import { updateElementText, translate } from '../../utils/i18nHelpers.js';
 import { bulkMissingLoraDownloadManager } from '../../managers/BulkMissingLoraDownloadManager.js';
 import { showToast } from '../../utils/uiHelpers.js';
+import { getModelApiClient } from '../../api/modelApiFactory.js';

 export class BulkContextMenu extends BaseContextMenu {
    constructor() {
@@ -50,6 +51,14 @@ export class BulkContextMenu extends BaseContextMenu {
        if (copyAllItem) {
            copyAllItem.style.display = config.copyAll ? 'flex' : 'none';
        }
+
+        // Submenu parent visibility
+        const sendToWorkflowSubmenu = this.menu.querySelector('[data-has-submenu="send-to-workflow"]');
+        if (sendToWorkflowSubmenu) {
+            const hasWorkflowActions = config.sendToWorkflow || config.copyAll;
+            sendToWorkflowSubmenu.style.display = hasWorkflowActions ? 'flex' : 'none';
+        }
+
        if (refreshAllItem) {
            refreshAllItem.style.display = config.refreshAll ? 'flex' : 'none';
        }
@@ -107,6 +116,13 @@ export class BulkContextMenu extends BaseContextMenu {
            downloadMissingLorasItem.style.display = currentModelType === 'recipes' ? 'flex' : 'none';
        }

+        const downloadExampleImagesItem = this.menu.querySelector('[data-action="download-example-images"]');
+        if (downloadExampleImagesItem) {
+            // Show on model pages (loras, checkpoints, embeddings), hide on recipes
+            const modelPages = ['loras', 'checkpoints', 'embeddings'];
+            downloadExampleImagesItem.style.display = modelPages.includes(currentModelType) ? 'flex' : 'none';
+        }
+
        const skipMetadataRefreshItem = this.menu.querySelector('[data-action="skip-metadata-refresh"]');
        const resumeMetadataRefreshItem = this.menu.querySelector('[data-action="resume-metadata-refresh"]');

@@ -140,6 +156,14 @@ export class BulkContextMenu extends BaseContextMenu {
                );
            }
        }
+
+        // Hide empty sections
+        this.menu.querySelectorAll('.context-menu-section').forEach(section => {
+            const items = Array.from(section.querySelectorAll('.context-menu-item'))
+                .filter(item => !item.closest('.context-submenu'));
+            const allHidden = items.length > 0 && items.every(item => item.style.display === 'none');
+            section.style.display = allHidden ? 'none' : '';
+        });
    }

    updateSelectedCountHeader() {
@@ -235,6 +259,9 @@ export class BulkContextMenu extends BaseContextMenu {
            case 'download-missing-loras':
                this.handleDownloadMissingLoras();
                break;
+            case 'download-example-images':
+                this.handleDownloadExampleImages();
+                break;
            case 'clear':
                bulkManager.clearSelection();
                break;
@@ -277,4 +304,31 @@ export class BulkContextMenu extends BaseContextMenu {

        await bulkMissingLoraDownloadManager.downloadMissingLoras(selectedRecipes);
    }
+
+    async handleDownloadExampleImages() {
+        if (state.selectedModels.size === 0) {
+            return;
+        }
+
+        const hashes = new Set();
+        for (const filePath of state.selectedModels) {
+            const escapedPath = CSS.escape(filePath);
+            const card = document.querySelector(`.model-card[data-filepath="${escapedPath}"]`);
+            if (card?.dataset?.sha256) {
+                hashes.add(card.dataset.sha256);
+            }
+        }
+
+        if (hashes.size === 0) {
+            showToast('No valid model hashes found in selection', {}, 'warning');
+            return;
+        }
+
+        try {
+            const apiClient = getModelApiClient();
+            await apiClient.downloadExampleImages([...hashes]);
+        } catch (error) {
+            console.error('Bulk download example images failed:', error);
+        }
+    }
 }
--- a/static/js/components/RecipeModal.js
+++ b/static/js/components/RecipeModal.js
@@ -6,6 +6,7 @@ import { setSessionItem, removeSessionItem } from '../utils/storageHelpers.js';
 import { fetchRecipeDetails, updateRecipeMetadata } from '../api/recipeApi.js';
 import { downloadManager } from '../managers/DownloadManager.js';
 import { MODEL_TYPES } from '../api/apiConfig.js';
+import { openMediaViewer } from './shared/MediaViewer.js';

 const ALLOWED_GEN_PARAM_KEYS = new Set([
    'prompt',
@@ -112,6 +113,23 @@ class RecipeModal {

        // Set up document click handler to close edit fields
        document.addEventListener('click', (event) => {
+            const recipeModal = document.getElementById('recipeModal');
+            if (recipeModal && recipeModal.style.display !== 'none') {
+                const mediaEl = event.target.closest('.recipe-preview-media');
+                if (mediaEl && mediaEl.tagName) {
+                    event.stopPropagation();
+                    const isVideo = mediaEl.tagName === 'VIDEO';
+                    const url = mediaEl.src || mediaEl.currentSrc;
+                    if (url) {
+                        openMediaViewer(url, {
+                            type: isVideo ? 'video' : 'image',
+                            title: document.getElementById('recipeModalTitle')?.textContent || ''
+                        });
+                    }
+                    return;
+                }
+            }
+
            // Handle title edit
            const titleEditor = document.getElementById('recipeTitleEditor');
            if (titleEditor && titleEditor.classList.contains('active') &&
--- a/static/js/components/controls/PageControls.js
+++ b/static/js/components/controls/PageControls.js
@@ -166,17 +166,6 @@ export class PageControls {
            });
        });
        
-        // Handle quick refresh option
-        const quickRefreshOption = document.querySelector('[data-action="quick-refresh"]');
-        if (quickRefreshOption) {
-            quickRefreshOption.addEventListener('click', (e) => {
-                e.stopPropagation();
-                this.refreshModels(false);
-                // Close the dropdown
-                document.querySelector('.dropdown-group.active')?.classList.remove('active');
-            });
-        }
-        
        // Handle full rebuild option
        const fullRebuildOption = document.querySelector('[data-action="full-rebuild"]');
        if (fullRebuildOption) {
@@ -829,4 +818,4 @@ export class PageControls {
            this.sidebarManager.cleanup();
        }
    }
-}
+}
--- a/static/js/components/shared/MediaViewer.js
+++ b/static/js/components/shared/MediaViewer.js
@@ -0,0 +1,204 @@
+let activeViewer = null;
+
+function createMediaElement(item) {
+    const { url, type = 'image' } = item;
+    if (type === 'video') {
+        const el = document.createElement('video');
+        el.controls = true;
+        el.autoplay = true;
+        el.loop = true;
+        el.muted = true;
+        el.className = 'media-viewer-media media-viewer-video';
+        el.src = url;
+        return el;
+    }
+    const el = document.createElement('img');
+    el.className = 'media-viewer-media media-viewer-image';
+    el.src = url;
+    el.alt = 'Full size preview';
+    el.draggable = false;
+    return el;
+}
+
+function preloadAdjacent(items, index) {
+    [index - 1, index + 1].forEach(i => {
+        if (i >= 0 && i < items.length && items[i].type !== 'video') {
+            const preload = new Image();
+            preload.src = items[i].url;
+        }
+    });
+}
+
+export function openMediaViewer(arg1, arg2, arg3) {
+    closeMediaViewer();
+
+    let items, currentIndex, title = '';
+
+    if (Array.isArray(arg1)) {
+        items = arg1;
+        currentIndex = typeof arg2 === 'number' ? arg2 : 0;
+        title = (arg3 && arg3.title) || '';
+    } else {
+        items = [{ url: arg1, type: (arg2 && arg2.type) || 'image' }];
+        currentIndex = 0;
+        title = (arg2 && arg2.title) || '';
+    }
+
+    if (currentIndex < 0 || currentIndex >= items.length) currentIndex = 0;
+
+    const overlay = document.createElement('div');
+    overlay.className = 'media-viewer-overlay';
+    overlay.setAttribute('role', 'dialog');
+    overlay.setAttribute('aria-label', title || 'Media viewer');
+
+    const closeBtn = document.createElement('button');
+    closeBtn.className = 'media-viewer-close';
+    closeBtn.innerHTML = '<i class="fas fa-times"></i>';
+    closeBtn.title = 'Close (Esc)';
+    closeBtn.addEventListener('click', (e) => {
+        e.stopPropagation();
+        closeMediaViewer();
+    });
+
+    const contentContainer = document.createElement('div');
+    contentContainer.className = 'media-viewer-content-container';
+
+    let mediaElement = createMediaElement(items[currentIndex]);
+    contentContainer.appendChild(mediaElement);
+
+    const hasNavigation = items.length > 1;
+
+    const counter = document.createElement('div');
+    counter.className = 'media-viewer-counter';
+    counter.textContent = hasNavigation ? `${currentIndex + 1} / ${items.length}` : '';
+    contentContainer.appendChild(counter);
+
+    if (title) {
+        const titleBar = document.createElement('div');
+        titleBar.className = 'media-viewer-title';
+        titleBar.textContent = title;
+        contentContainer.appendChild(titleBar);
+    }
+
+    let prevBtn, nextBtn;
+    if (hasNavigation) {
+        prevBtn = document.createElement('button');
+        prevBtn.className = 'media-viewer-nav media-viewer-prev';
+        prevBtn.innerHTML = '<i class="fas fa-chevron-left"></i>';
+        prevBtn.title = 'Previous (←)';
+        nextBtn = document.createElement('button');
+        nextBtn.className = 'media-viewer-nav media-viewer-next';
+        nextBtn.innerHTML = '<i class="fas fa-chevron-right"></i>';
+        nextBtn.title = 'Next (→)';
+
+        const navigate = (delta) => {
+            const newIndex = (currentIndex + delta + items.length) % items.length;
+            currentIndex = newIndex;
+
+            const oldMedia = contentContainer.querySelector('.media-viewer-media');
+            const newMedia = createMediaElement(items[currentIndex]);
+
+            if (oldMedia) {
+                if (oldMedia.tagName === 'VIDEO') {
+                    oldMedia.pause();
+                    oldMedia.src = '';
+                }
+                oldMedia.replaceWith(newMedia);
+            }
+            mediaElement = newMedia;
+
+            counter.textContent = `${currentIndex + 1} / ${items.length}`;
+            preloadAdjacent(items, currentIndex);
+        };
+
+        prevBtn.addEventListener('click', (e) => { e.stopPropagation(); navigate(-1); });
+        nextBtn.addEventListener('click', (e) => { e.stopPropagation(); navigate(1); });
+
+        overlay.appendChild(prevBtn);
+        overlay.appendChild(nextBtn);
+    }
+
+    overlay.appendChild(closeBtn);
+    overlay.appendChild(contentContainer);
+    document.body.appendChild(overlay);
+
+    requestAnimationFrame(() => {
+        overlay.classList.add('active');
+    });
+
+    overlay.addEventListener('click', (e) => {
+        if (e.target === overlay) {
+            closeMediaViewer();
+        }
+    });
+
+    const keyHandler = (e) => {
+        if (e.key === 'Escape') {
+            closeMediaViewer();
+            return;
+        }
+        if (hasNavigation) {
+            if (e.key === 'ArrowLeft') {
+                e.stopPropagation();
+                e.preventDefault();
+                prevBtn.click();
+                return;
+            }
+            if (e.key === 'ArrowRight') {
+                e.stopPropagation();
+                e.preventDefault();
+                nextBtn.click();
+                return;
+            }
+        }
+    };
+    document.addEventListener('keydown', keyHandler, true);
+
+    activeViewer = { overlay, keyHandler };
+    preloadAdjacent(items, currentIndex);
+
+    if (items[currentIndex].type === 'video') {
+        const recipeVideo = document.getElementById('recipeModalVideo');
+        if (recipeVideo && !recipeVideo.paused) {
+            recipeVideo.pause();
+        }
+    }
+}
+
+export function closeMediaViewer() {
+    if (!activeViewer) return;
+
+    const { overlay, keyHandler } = activeViewer;
+
+    const video = overlay.querySelector('video');
+    if (video) {
+        video.pause();
+        video.src = '';
+    }
+
+    const img = overlay.querySelector('img');
+    if (img) {
+        img.src = '';
+    }
+
+    document.removeEventListener('keydown', keyHandler, true);
+
+    overlay.classList.remove('active');
+    overlay.addEventListener('transitionend', () => {
+        if (overlay.parentNode) {
+            overlay.parentNode.removeChild(overlay);
+        }
+    }, { once: true });
+
+    setTimeout(() => {
+        if (overlay.parentNode) {
+            overlay.parentNode.removeChild(overlay);
+        }
+    }, 500);
+
+    activeViewer = null;
+}
+
+export function isMediaViewerOpen() {
+    return activeViewer !== null;
+}
--- a/static/js/components/shared/showcase/ShowcaseView.js
+++ b/static/js/components/shared/showcase/ShowcaseView.js
@@ -17,6 +17,7 @@ import {
 import { generateMetadataPanel } from './MetadataPanel.js';
 import { generateImageWrapper, generateVideoWrapper } from './MediaRenderers.js';
 import { getShowcaseUrl } from '../../../utils/civitaiUtils.js';
+import { openMediaViewer } from '../MediaViewer.js';

 export const showcaseListenerMetrics = {
    wheelListeners: 0,
@@ -640,6 +641,27 @@ export function initShowcaseContent(carousel) {
    initMediaControlHandlers(carousel);
    positionAllMediaControls(carousel);

+    // Click-to-view: open full-size media viewer when clicking showcase images/videos
+    const viewerElements = carousel.querySelectorAll('.media-wrapper img, .media-wrapper video');
+    const allItems = [];
+    const elementIndexMap = new Map();
+    viewerElements.forEach((el) => {
+        const isVideo = el.tagName === 'VIDEO';
+        const url = el.src || el.dataset.localSrc || el.dataset.remoteSrc;
+        if (url) {
+            elementIndexMap.set(el, allItems.length);
+            allItems.push({ url, type: isVideo ? 'video' : 'image' });
+        }
+    });
+    viewerElements.forEach((mediaEl) => {
+        const idx = elementIndexMap.get(mediaEl);
+        if (idx === undefined) return;
+        mediaEl.addEventListener('click', (e) => {
+            e.stopPropagation();
+            openMediaViewer(allItems, idx);
+        });
+    });
+
    // Bind scroll-indicator click events
    bindScrollIndicatorEvents(carousel);
    
--- a/static/js/recipes.js
+++ b/static/js/recipes.js
@@ -286,16 +286,6 @@ class RecipeManager {
            });
        });

-        // Handle quick refresh option (Sync Changes)
-        const quickRefreshOption = document.querySelector('[data-action="quick-refresh"]');
-        if (quickRefreshOption) {
-            quickRefreshOption.addEventListener('click', (e) => {
-                e.stopPropagation();
-                this.pageControls.refreshModels(false);
-                this.closeDropdowns();
-            });
-        }
-
        // Handle full rebuild option (Rebuild Cache)
        const fullRebuildOption = document.querySelector('[data-action="full-rebuild"]');
        if (fullRebuildOption) {
@@ -407,4 +397,4 @@ document.addEventListener('DOMContentLoaded', async () => {
 });

 // Export for use in other modules
-export { RecipeManager };
+export { RecipeManager };
--- a/templates/components/context_menu.html
+++ b/templates/components/context_menu.html
@@ -53,49 +53,74 @@
        <span>{{ t('loras.bulkOperations.selected', {'count': 0}) }}</span>
    </div>
    <div class="context-menu-separator"></div>
-    <div class="context-menu-item" data-action="refresh-all">
-        <i class="fas fa-sync-alt"></i> <span>{{ t('loras.bulkOperations.refreshAll') }}</span>
+    <div class="context-menu-section" data-section="workflow">
+        <div class="context-menu-section-header">{{ t('loras.bulkOperations.sections.workflow') }}</div>
+        <div class="context-menu-item has-submenu" data-has-submenu="send-to-workflow">
+            <i class="fas fa-paper-plane"></i>
+            <span>{{ t('loras.bulkOperations.sendToWorkflow') }}</span>
+            <i class="fas fa-chevron-right submenu-arrow"></i>
+            <div class="context-submenu">
+                <div class="context-menu-item" data-action="send-to-workflow-append">
+                    <i class="fas fa-paper-plane"></i> <span>{{ t('loras.contextMenu.sendToWorkflowAppend') }}</span>
+                </div>
+                <div class="context-menu-item" data-action="send-to-workflow-replace">
+                    <i class="fas fa-exchange-alt"></i> <span>{{ t('loras.contextMenu.sendToWorkflowReplace') }}</span>
+                </div>
+                <div class="context-menu-item" data-action="copy-all">
+                    <i class="fas fa-copy"></i> <span>{{ t('loras.bulkOperations.copyAll') }}</span>
+                </div>
+            </div>
+        </div>
    </div>
-    <div class="context-menu-item" data-action="check-updates">
-        <i class="fas fa-bell"></i> <span>{{ t('loras.bulkOperations.checkUpdates') }}</span>
+    <div class="context-menu-section" data-section="metadata">
+        <div class="context-menu-section-header">{{ t('loras.bulkOperations.sections.metadata') }}</div>
+        <div class="context-menu-item" data-action="refresh-all">
+            <i class="fas fa-sync-alt"></i> <span>{{ t('loras.bulkOperations.refreshAll') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="check-updates">
+            <i class="fas fa-bell"></i> <span>{{ t('loras.bulkOperations.checkUpdates') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="skip-metadata-refresh">
+            <i class="fas fa-ban"></i> <span>{{ t('loras.bulkOperations.skipMetadataRefresh') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="resume-metadata-refresh">
+            <i class="fas fa-redo"></i> <span>{{ t('loras.bulkOperations.resumeMetadataRefresh') }}</span>
+        </div>
    </div>
-    <div class="context-menu-item" data-action="copy-all">
-        <i class="fas fa-copy"></i> <span>{{ t('loras.bulkOperations.copyAll') }}</span>
+    <div class="context-menu-section" data-section="attributes">
+        <div class="context-menu-section-header">{{ t('loras.bulkOperations.sections.attributes') }}</div>
+        <div class="context-menu-item" data-action="add-tags">
+            <i class="fas fa-tags"></i> <span>{{ t('loras.bulkOperations.addTags') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="set-base-model">
+            <i class="fas fa-layer-group"></i> <span>{{ t('loras.bulkOperations.setBaseModel') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="set-favorite">
+            <i class="fas fa-star"></i> <span>{{ t('loras.bulkOperations.setFavorite') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="set-content-rating">
+            <i class="fas fa-exclamation-triangle"></i> <span>{{ t('loras.bulkOperations.setContentRating') }}</span>
+        </div>
    </div>
-    <div class="context-menu-item" data-action="send-to-workflow-append">
-        <i class="fas fa-paper-plane"></i> <span>{{ t('loras.contextMenu.sendToWorkflowAppend') }}</span>
+    <div class="context-menu-section" data-section="organize">
+        <div class="context-menu-section-header">{{ t('loras.bulkOperations.sections.organize') }}</div>
+        <div class="context-menu-item" data-action="auto-organize">
+            <i class="fas fa-magic"></i> <span>{{ t('loras.bulkOperations.autoOrganize') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="move-all">
+            <i class="fas fa-folder-open"></i> <span>{{ t('loras.bulkOperations.moveAll') }}</span>
+        </div>
    </div>
-    <div class="context-menu-item" data-action="send-to-workflow-replace">
-        <i class="fas fa-exchange-alt"></i> <span>{{ t('loras.contextMenu.sendToWorkflowReplace') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="auto-organize">
-        <i class="fas fa-magic"></i> <span>{{ t('loras.bulkOperations.autoOrganize') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="add-tags">
-        <i class="fas fa-tags"></i> <span>{{ t('loras.bulkOperations.addTags') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="set-base-model">
-        <i class="fas fa-layer-group"></i> <span>{{ t('loras.bulkOperations.setBaseModel') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="set-favorite">
-        <i class="fas fa-star"></i> <span>{{ t('loras.bulkOperations.setFavorite') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="set-content-rating">
-        <i class="fas fa-exclamation-triangle"></i> <span>{{ t('loras.bulkOperations.setContentRating') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="skip-metadata-refresh">
-        <i class="fas fa-ban"></i> <span>{{ t('loras.bulkOperations.skipMetadataRefresh') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="resume-metadata-refresh">
-        <i class="fas fa-redo"></i> <span>{{ t('loras.bulkOperations.resumeMetadataRefresh') }}</span>
+    <div class="context-menu-section" data-section="download">
+        <div class="context-menu-section-header">{{ t('loras.bulkOperations.sections.download') }}</div>
+        <div class="context-menu-item" data-action="download-example-images">
+            <i class="fas fa-download"></i> <span>{{ t('loras.bulkOperations.downloadExamples') }}</span>
+        </div>
+        <div class="context-menu-item" data-action="download-missing-loras">
+            <i class="fas fa-download"></i> <span>{{ t('loras.bulkOperations.downloadMissingLoras') }}</span>
+        </div>
    </div>
    <div class="context-menu-separator"></div>
-    <div class="context-menu-item" data-action="download-missing-loras">
-        <i class="fas fa-download"></i> <span>{{ t('loras.bulkOperations.downloadMissingLoras') }}</span>
-    </div>
-    <div class="context-menu-item" data-action="move-all">
-        <i class="fas fa-folder-open"></i> <span>{{ t('loras.bulkOperations.moveAll') }}</span>
-    </div>
    <div class="context-menu-item delete-item" data-action="delete-all">
        <i class="fas fa-trash"></i> <span>{{ t('loras.bulkOperations.deleteAll') }}</span>
    </div>
--- a/templates/components/controls.html
+++ b/templates/components/controls.html
@@ -41,9 +41,6 @@
                    <i class="fas fa-caret-down"></i>
                </button>
                <div class="dropdown-menu">
-                    <div class="dropdown-item" data-action="quick-refresh" title="{{ t('loras.controls.refresh.quickTooltip') }}">
-                        <i class="fas fa-bolt"></i> <span>{{ t('loras.controls.refresh.quick') }}</span>
-                    </div>
                    <div class="dropdown-item" data-action="full-rebuild" title="{{ t('loras.controls.refresh.fullTooltip') }}">
                        <i class="fas fa-tools"></i> <span>{{ t('loras.controls.refresh.full') }}</span>
                    </div>
@@ -129,4 +126,4 @@
            </div>
        </div>
    </div>
-</div>
+</div>
--- a/templates/recipes.html
+++ b/templates/recipes.html
@@ -75,9 +75,6 @@
                    <i class="fas fa-caret-down"></i>
                </button>
                <div class="dropdown-menu">
-                    <div class="dropdown-item" data-action="quick-refresh" title="{{ t('recipes.controls.refresh.quickTooltip', default='Sync changes - quick refresh without rebuilding cache') }}">
-                        <i class="fas fa-bolt"></i> <span>{{ t('loras.controls.refresh.quick', default='Sync Changes') }}</span>
-                    </div>
                    <div class="dropdown-item" data-action="full-rebuild" title="{{ t('recipes.controls.refresh.fullTooltip', default='Rebuild cache - full rescan of all recipe files') }}">
                        <i class="fas fa-tools"></i> <span>{{ t('loras.controls.refresh.full', default='Rebuild Cache') }}</span>
                    </div>
@@ -196,4 +193,4 @@

 {% block main_script %}
 <script type="module" src="/loras_static/js/recipes.js?v={{ version }}"></script>
-{% endblock %}
+{% endblock %}
--- a/tests/frontend/components/pageControls.filtering.test.js
+++ b/tests/frontend/components/pageControls.filtering.test.js
@@ -135,7 +135,6 @@ function renderControlsDom(pageKey) {
            <button data-action="refresh" class="dropdown-main"></button>
            <button class="dropdown-toggle"></button>
            <div class="dropdown-menu">
-              <div class="dropdown-item" data-action="quick-refresh"></div>
              <div class="dropdown-item" data-action="full-rebuild"></div>
            </div>
          </div>
@@ -930,4 +929,4 @@ describe('PageControls favorites, sorting, and duplicates scenarios', () => {
    expect(stateModule.state.bulkMode).toBe(true);
    expect(pageState.duplicatesMode).toBe(true);
  });
-});
+});
Author	SHA1	Message	Date
Will Miao	df1410535e	fix(ui): remove redundant Quick Refresh from Refresh split button dropdown The main Refresh button and Quick Refresh dropdown item both called refreshModels(false). Split button dropdowns should only contain alternative actions (Hick's Law). Dropdown now has only Rebuild Cache (fullRebuild=true). Removed from 2 templates, 2 JS files, 1 test fixture, and 10 locale files.	2026-05-12 07:50:54 +08:00
Will Miao	75f74d54d8	feat(bulk): reorganize context menu with sections and submenu for workflow actions Group 15 flat menu items into 5 logical sections (Workflow, Metadata, Attributes, Organize, Download) with section headers to reduce cognitive load. Nest the three workflow-related actions (Append, Replace, Copy Syntax) into a single "Send to Workflow" hover-triggered submenu. Add submenu infrastructure to BaseContextMenu with mouseover/mouseout boundary detection, 250ms close delay, and viewport-aware positioning. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-11 21:06:47 +08:00
Will Miao	ab6100f596	feat(bulk): add "Download Example Images" to bulk select context menu (#923 ) Allows downloading example images only for selected models instead of the entire library. Reuses the existing /api/lm/force-download-example-images endpoint which already accepts an array of model hashes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-11 18:05:00 +08:00
Will Miao	5d3ab3bbf8	feat(showcase): click-to-view full-size image/video in recipe and model modals (#926 ) - Add MediaViewer overlay for full-size image/video display with prev/next navigation, direction keys, counter, and adjacent preloading - Recipe modal: click preview image/video opens full-size viewer - Model showcase: click any example image/video opens viewer with full gallery navigation; blurred NSFW content opens directly to clear view - Use Map<Element, number> for DOM-index mapping instead of URL comparison to avoid index mismatch from lazy-loaded vs data-attribute URLs	2026-05-10 22:22:24 +08:00
Will Miao	d9dc0dba8d	perf(startup): load extra model paths during Config init to avoid double symlink scan Move extra folder path resolution from _initialize_services (app.on_startup) into Config.__init__ via new _load_extra_paths_from_settings() method. This eliminates a redundant second symlink scan and consolidates all 'Found roots' / 'Found extra roots' logs into one contiguous block during custom node import, before the ComfyUI server starts.	2026-05-08 14:55:53 +08:00