feat: update release notes and version to 0.8.9 with new favorites system and UI enhancements

feat: implement theme management with auto-detection and user prefere…

README.md

@@ -20,6 +20,12 @@ Watch this quick tutorial to learn how to use the new one-click LoRA integration
 
 ## Release Notes
 
+### v0.8.9
+* **Favorites System** - New functionality to bookmark your favorite LoRAs and checkpoints for quick access and better organization
+* **Enhanced UI Controls** - Increased model card button sizes for improved usability and easier interaction
+* **Smoother Page Transitions** - Optimized interface switching between pages, eliminating flash issues particularly noticeable in dark theme
+* **Bug Fixes & Stability** - Resolved various issues to enhance overall reliability and performance
+
 ### v0.8.8
 * **Real-time TriggerWord Updates** - Enhanced TriggerWord Toggle node to instantly update when connected Lora Loader or Lora Stacker nodes change, without requiring workflow execution
 * **Optimized Metadata Recovery** - Improved utilization of existing .civitai.info files for faster initialization and preservation of metadata from models deleted from CivitAI
@@ -146,7 +152,7 @@ Watch this quick tutorial to learn how to use the new one-click LoRA integration
 ```bash
 git clone https://github.com/willmiao/ComfyUI-Lora-Manager.git
 cd ComfyUI-Lora-Manager
-pip install requirements.txt
+pip install -r requirements.txt
 ```
 
 ## Usage
@@ -169,21 +175,28 @@ pip install requirements.txt
 
 ---
 
+## Contributing
+
+Thank you for your interest in contributing to ComfyUI LoRA Manager! As this project is currently in its early stages and undergoing rapid development and refactoring, we are temporarily not accepting pull requests.
+
+However, your feedback and ideas are extremely valuable to us:
+- Please feel free to open issues for any bugs you encounter
+- Submit feature requests through GitHub issues
+- Share your suggestions for improvements
+
+We appreciate your understanding and look forward to potentially accepting code contributions once the project architecture stabilizes.
+
+---
+
 ## Credits
 
 This project has been inspired by and benefited from other excellent ComfyUI extensions:
 
-- [ComfyUI-SaveImageWithMetaData](https://github.com/Comfy-Community/ComfyUI-SaveImageWithMetaData) - For the image metadata functionality
+- [ComfyUI-SaveImageWithMetaData](https://github.com/nkchocoai/ComfyUI-SaveImageWithMetaData) - For the image metadata functionality
 - [rgthree-comfy](https://github.com/rgthree/rgthree-comfy) - For the lora loader functionality
 
 ---
 
-## Contributing
-
-If you have suggestions, bug reports, or improvements, feel free to open an issue or contribute directly to the codebase. Pull requests are always welcome!
-
----
-
 ## ☕ Support
 
 If you find this project helpful, consider supporting its development:

py/config.py

@@ -110,7 +110,7 @@ class Config:
         for path in raw_paths:
             if os.path.exists(path):
                 real_path = os.path.normpath(os.path.realpath(path)).replace(os.sep, '/')
-                path_map[real_path] = path_map.get(real_path, path)  # preserve first seen
+                path_map[real_path] = path_map.get(real_path, path.replace(os.sep, "/"))  # preserve first seen
         
         # Now sort and use only the deduplicated real paths
         unique_paths = sorted(path_map.values(), key=lambda p: p.lower())

py/routes/api_routes.py

@@ -125,6 +125,7 @@ class ApiRoutes:
             # Get filter parameters
             base_models = request.query.get('base_models', None)
             tags = request.query.get('tags', None)
+            favorites_only = request.query.get('favorites_only', 'false').lower() == 'true'  # New parameter
             
             # New parameters for recipe filtering
             lora_hash = request.query.get('lora_hash', None)
@@ -155,7 +156,8 @@ class ApiRoutes:
                 base_models=filters.get('base_model', None),
                 tags=filters.get('tags', None),
                 search_options=search_options,
-                hash_filters=hash_filters
+                hash_filters=hash_filters,
+                favorites_only=favorites_only  # Pass favorites_only parameter
             )
 
             # Get all available folders from cache
@@ -195,6 +197,7 @@ class ApiRoutes:
             "from_civitai": lora.get("from_civitai", True),
             "usage_tips": lora.get("usage_tips", ""),
             "notes": lora.get("notes", ""),
+            "favorite": lora.get("favorite", False),  # Include favorite status in response
             "civitai": ModelRouteUtils.filter_civitai_data(lora.get("civitai", {}))
         }
 

py/routes/checkpoints_routes.py

@@ -69,6 +69,7 @@ class CheckpointsRoutes:
             fuzzy_search = request.query.get('fuzzy_search', 'false').lower() == 'true'
             base_models = request.query.getall('base_model', [])
             tags = request.query.getall('tag', [])
+            favorites_only = request.query.get('favorites_only', 'false').lower() == 'true'  # Add favorites_only parameter
             
             # Process search options
             search_options = {
@@ -101,7 +102,8 @@ class CheckpointsRoutes:
                 base_models=base_models,
                 tags=tags,
                 search_options=search_options,
-                hash_filters=hash_filters
+                hash_filters=hash_filters,
+                favorites_only=favorites_only  # Pass favorites_only parameter
             )
             
             # Format response items
@@ -123,7 +125,8 @@ class CheckpointsRoutes:
     async def get_paginated_data(self, page, page_size, sort_by='name', 
                                folder=None, search=None, fuzzy_search=False,
                                base_models=None, tags=None,
-                               search_options=None, hash_filters=None):
+                               search_options=None, hash_filters=None,
+                               favorites_only=False):  # Add favorites_only parameter with default False
         """Get paginated and filtered checkpoint data"""
         cache = await self.scanner.get_cached_data()
 
@@ -181,6 +184,13 @@ class CheckpointsRoutes:
                 if not cp.get('preview_nsfw_level') or cp.get('preview_nsfw_level') < NSFW_LEVELS['R']
             ]
         
+        # Apply favorites filtering if enabled
+        if favorites_only:
+            filtered_data = [
+                cp for cp in filtered_data
+                if cp.get('favorite', False) is True
+            ]
+        
         # Apply folder filtering
         if folder is not None:
             if search_options.get('recursive', False):
@@ -276,6 +286,7 @@ class CheckpointsRoutes:
             "from_civitai": checkpoint.get("from_civitai", True),
             "notes": checkpoint.get("notes", ""),
             "model_type": checkpoint.get("model_type", "checkpoint"),
+            "favorite": checkpoint.get("favorite", False),
             "civitai": ModelRouteUtils.filter_civitai_data(checkpoint.get("civitai", {}))
         }
     

py/routes/recipe_routes.py

@@ -74,6 +74,9 @@ class RecipeRoutes:
         
         # Add route to get recipes for a specific Lora
         app.router.add_get('/api/recipes/for-lora', routes.get_recipes_for_lora)
+        
+        # Add new endpoint for scanning and rebuilding the recipe cache
+        app.router.add_get('/api/recipes/scan', routes.scan_recipes)
     
     async def _init_cache(self, app):
         """Initialize cache on startup"""
@@ -1255,3 +1258,24 @@ class RecipeRoutes:
         except Exception as e:
             logger.error(f"Error getting recipes for Lora: {str(e)}")
             return web.json_response({'success': False, 'error': str(e)}, status=500)
+
+    async def scan_recipes(self, request: web.Request) -> web.Response:
+        """API endpoint for scanning and rebuilding the recipe cache"""
+        try:
+            # Ensure services are initialized
+            await self.init_services()
+            
+            # Force refresh the recipe cache
+            logger.info("Manually triggering recipe cache rebuild")
+            await self.recipe_scanner.get_cached_data(force_refresh=True)
+            
+            return web.json_response({
+                'success': True,
+                'message': 'Recipe cache refreshed successfully'
+            })
+        except Exception as e:
+            logger.error(f"Error refreshing recipe cache: {e}", exc_info=True)
+            return web.json_response({
+                'success': False,
+                'error': str(e)
+            }, status=500)

py/services/civitai_client.py

@@ -34,6 +34,7 @@ class CivitaiClient:
             'User-Agent': 'ComfyUI-LoRA-Manager/1.0'
         }
         self._session = None
+        self._session_created_at = None
         # Set default buffer size to 1MB for higher throughput
         self.chunk_size = 1024 * 1024
     
@@ -44,8 +45,8 @@ class CivitaiClient:
             # Optimize TCP connection parameters
             connector = aiohttp.TCPConnector(
                 ssl=True,
-                limit=10,  # Increase parallel connections
-                ttl_dns_cache=300,  # DNS cache time
+                limit=3,  # Further reduced from 5 to 3
+                ttl_dns_cache=0,  # Disabled DNS caching completely
                 force_close=False,  # Keep connections for reuse
                 enable_cleanup_closed=True
             )
@@ -57,7 +58,18 @@ class CivitaiClient:
                 trust_env=trust_env,
                 timeout=timeout
             )
+            self._session_created_at = datetime.now()
         return self._session
+    
+    async def _ensure_fresh_session(self):
+        """Refresh session if it's been open too long"""
+        if self._session is not None:
+            if not hasattr(self, '_session_created_at') or \
+               (datetime.now() - self._session_created_at).total_seconds() > 300:  # 5 minutes
+                await self.close()
+                self._session = None
+        
+        return await self.session
 
     def _parse_content_disposition(self, header: str) -> str:
         """Parse filename from content-disposition header"""
@@ -103,13 +115,15 @@ class CivitaiClient:
         Returns:
             Tuple[bool, str]: (success, save_path or error message)
         """
-        session = await self.session
+        logger.debug(f"Resolving DNS for: {url}")
+        session = await self._ensure_fresh_session()
         try:
             headers = self._get_request_headers()
             
             # Add Range header to allow resumable downloads
             headers['Accept-Encoding'] = 'identity'  # Disable compression for better chunked downloads
             
+            logger.debug(f"Starting download from: {url}")
             async with session.get(url, headers=headers, allow_redirects=True) as response:
                 if response.status != 200:
                     # Handle 401 unauthorized responses
@@ -124,6 +138,7 @@ class CivitaiClient:
                         return False, "Access forbidden: You don't have permission to download this file."
                     
                     # Generic error response for other status codes
+                    logger.error(f"Download failed for {url} with status {response.status}")
                     return False, f"Download failed with status {response.status}"
 
                 # Get filename from content-disposition header
@@ -170,7 +185,7 @@ class CivitaiClient:
 
     async def get_model_by_hash(self, model_hash: str) -> Optional[Dict]:
         try:
-            session = await self.session
+            session = await self._ensure_fresh_session()
             async with session.get(f"{self.base_url}/model-versions/by-hash/{model_hash}") as response:
                 if response.status == 200:
                     return await response.json()
@@ -181,7 +196,7 @@ class CivitaiClient:
 
     async def download_preview_image(self, image_url: str, save_path: str):
         try:
-            session = await self.session
+            session = await self._ensure_fresh_session()
             async with session.get(image_url) as response:
                 if response.status == 200:
                     content = await response.read()
@@ -196,7 +211,7 @@ class CivitaiClient:
     async def get_model_versions(self, model_id: str) -> List[Dict]:
         """Get all versions of a model with local availability info"""
         try:
-            session = await self.session  # 等待获取 session
+            session = await self._ensure_fresh_session()  # Use fresh session
             async with session.get(f"{self.base_url}/models/{model_id}") as response:
                 if response.status != 200:
                     return None
@@ -222,12 +237,14 @@ class CivitaiClient:
                 - An error message if there was an error, or None on success
         """
         try:
-            session = await self.session
+            session = await self._ensure_fresh_session()
             url = f"{self.base_url}/model-versions/{version_id}"
             headers = self._get_request_headers()
             
+            logger.debug(f"Resolving DNS for model version info: {url}")
             async with session.get(url, headers=headers) as response:
                 if response.status == 200:
+                    logger.debug(f"Successfully fetched model version info for: {version_id}")
                     return await response.json(), None
                 
                 # Handle specific error cases
@@ -242,6 +259,7 @@ class CivitaiClient:
                         return None, "Model not found (status 404)"
                 
                 # Other error cases
+                logger.error(f"Failed to fetch model info for {version_id} (status {response.status})")
                 return None, f"Failed to fetch model info (status {response.status})"
         except Exception as e:
             error_msg = f"Error fetching model version info: {e}"
@@ -260,7 +278,7 @@ class CivitaiClient:
                 - The HTTP status code from the request
         """
         try:
-            session = await self.session
+            session = await self._ensure_fresh_session()
             headers = self._get_request_headers()
             url = f"{self.base_url}/models/{model_id}"
             
@@ -304,10 +322,11 @@ class CivitaiClient:
     async def _get_hash_from_civitai(self, model_version_id: str) -> Optional[str]:
         """Get hash from Civitai API"""
         try:
-            if not self._session:
+            session = await self._ensure_fresh_session()
+            if not session:
                 return None
             
-            version_info = await self._session.get(f"{self.base_url}/model-versions/{model_version_id}")
+            version_info = await session.get(f"{self.base_url}/model-versions/{model_version_id}")
             
             if not version_info or not version_info.json().get('files'):
                 return None

py/services/download_manager.py

@@ -88,16 +88,16 @@ class DownloadManager:
             version_info = None
             error_msg = None
             
-            if download_url:
-                # Extract version ID from download URL
-                version_id = download_url.split('/')[-1]
-                version_info, error_msg = await civitai_client.get_model_version_info(version_id)
+            if model_hash:
+                # Get model by hash
+                version_info = await civitai_client.get_model_by_hash(model_hash)
             elif model_version_id:
                 # Use model version ID directly
                 version_info, error_msg = await civitai_client.get_model_version_info(model_version_id)
-            elif model_hash:
-                # Get model by hash
-                version_info = await civitai_client.get_model_by_hash(model_hash)
+            elif download_url:
+                # Extract version ID from download URL
+                version_id = download_url.split('/')[-1]
+                version_info, error_msg = await civitai_client.get_model_version_info(version_id)
 
             
             if not version_info:

py/services/lora_scanner.py

@@ -122,7 +122,8 @@ class LoraScanner(ModelScanner):
     async def get_paginated_data(self, page: int, page_size: int, sort_by: str = 'name', 
                                folder: str = None, search: str = None, fuzzy_search: bool = False,
                                base_models: list = None, tags: list = None,
-                               search_options: dict = None, hash_filters: dict = None) -> Dict:
+                               search_options: dict = None, hash_filters: dict = None,
+                               favorites_only: bool = False) -> Dict:
         """Get paginated and filtered lora data
         
         Args:
@@ -136,6 +137,7 @@ class LoraScanner(ModelScanner):
             tags: List of tags to filter by
             search_options: Dictionary with search options (filename, modelname, tags, recursive)
             hash_filters: Dictionary with hash filtering options (single_hash or multiple_hashes)
+            favorites_only: Filter for favorite models only
         """
         cache = await self.get_cached_data()
 
@@ -194,6 +196,13 @@ class LoraScanner(ModelScanner):
                 if not lora.get('preview_nsfw_level') or lora.get('preview_nsfw_level') < NSFW_LEVELS['R']
             ]
         
+        # Apply favorites filtering if enabled
+        if favorites_only:
+            filtered_data = [
+                lora for lora in filtered_data
+                if lora.get('favorite', False) is True
+            ]
+        
         # Apply folder filtering
         if folder is not None:
             if search_options.get('recursive', False):

py/services/model_scanner.py

@@ -736,6 +736,12 @@ class ModelScanner:
                 shutil.move(source_metadata, target_metadata)
                 metadata = await self._update_metadata_paths(target_metadata, target_file)
             
+            # Move civitai.info file if exists
+            source_civitai = os.path.join(source_dir, f"{base_name}.civitai.info")
+            if os.path.exists(source_civitai):
+                target_civitai = os.path.join(target_path, f"{base_name}.civitai.info")
+                shutil.move(source_civitai, target_civitai)
+            
             for ext in PREVIEW_EXTENSIONS:
                 source_preview = os.path.join(source_dir, f"{base_name}{ext}")
                 if os.path.exists(source_preview):

py/utils/models.py

@@ -22,6 +22,7 @@ class BaseModelMetadata:
     tags: List[str] = None      # Model tags
     modelDescription: str = ""  # Full model description
     civitai_deleted: bool = False  # Whether deleted from Civitai
+    favorite: bool = False      # Whether the model is a favorite
 
     def __post_init__(self):
         # Initialize empty lists to avoid mutable default parameter issue

py/utils/recipe_parsers.py

@@ -97,8 +97,9 @@ class RecipeMetadataParser(ABC):
                 
                 # Process file information if available
                 if 'files' in civitai_info:
+                    # Find the primary model file (type="Model" and primary=true) in the files list
                     model_file = next((file for file in civitai_info.get('files', []) 
-                                    if file.get('type') == 'Model'), None)
+                                      if file.get('type') == 'Model' and file.get('primary') == True), None)
                     
                     if model_file:
                         # Get size

pyproject.toml

@@ -1,7 +1,7 @@
 [project]
 name = "comfyui-lora-manager"
 description = "LoRA Manager for ComfyUI - Access it at http://localhost:8188/loras for managing LoRA models with previews and metadata integration."
-version = "0.8.8"
+version = "0.8.9"
 license = {file = "LICENSE"}
 dependencies = [
     "aiohttp",
@@ -12,7 +12,8 @@ dependencies = [
     "piexif",
     "Pillow",
     "olefile", # for getting rid of warning message
-    "requests"
+    "requests",
+    "toml"
 ]
 
 [project.urls]

requirements.txt

@@ -6,4 +6,5 @@ beautifulsoup4
 piexif
 Pillow
 olefile
-requests
+requests
+toml

static/css/base.css

@@ -59,6 +59,16 @@ html, body {
     --scrollbar-width: 8px; /* 添加滚动条宽度变量 */
 }
 
+html[data-theme="dark"] {
+    background-color: #1a1a1a !important;
+    color-scheme: dark;
+}
+
+html[data-theme="light"] {
+    background-color: #ffffff !important;
+    color-scheme: light;
+}
+
 [data-theme="dark"] {
     --bg-color: #1a1a1a;
     --text-color: #e0e0e0;

static/css/components/card.css

@@ -192,12 +192,43 @@
     margin-left: var(--space-1);
     cursor: pointer;
     color: white;
-    transition: opacity 0.2s;
-    font-size: 0.9em;
+    transition: opacity 0.2s, transform 0.15s ease;
+    font-size: 1.0em; /* Increased from 0.9em for better visibility */
+    width: 16px; /* Fixed width for consistent spacing */
+    height: 16px; /* Fixed height for larger touch target */
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 50%;
+    padding: 4px; /* Add padding to increase clickable area */
+    box-sizing: content-box; /* Ensure padding adds to dimensions */
+    position: relative; /* For proper positioning */
+    margin: 0; /* Reset margin */
+}
+
+.card-actions i::before {
+    position: absolute; /* Position the icon glyph */
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%); /* Center the icon */
+}
+
+.card-actions {
+    display: flex;
+    gap: var(--space-1); /* Use gap instead of margin for spacing between icons */
+    align-items: center;
 }
 
 .card-actions i:hover {
-    opacity: 0.8;
+    opacity: 0.9;
+    transform: scale(1.1);
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+/* Style for active favorites */
+.favorite-active {
+    color: #ffc107 !important; /* Gold color for favorites */
+    text-shadow: 0 0 5px rgba(255, 193, 7, 0.5);
 }
 
 /* 响应式设计 */

static/css/layout.css

@@ -81,6 +81,22 @@
     opacity: 1;
 }
 
+/* Controls */
+.control-group button.favorite-filter {
+    position: relative;
+    overflow: hidden;
+}
+
+.control-group button.favorite-filter.active {
+    background: var(--lora-accent);
+    color: white;
+}
+
+.control-group button.favorite-filter i {
+    margin-right: 4px;
+    color: #ffc107;
+}
+
 /* Active state for buttons that can be toggled */
 .control-group button.active {
     background: var(--lora-accent);

static/js/api/baseModelApi.js

@@ -45,6 +45,11 @@ export async function loadMoreModels(options = {}) {
             params.append('folder', pageState.activeFolder);
         }
 
+        // Add favorites filter parameter if enabled
+        if (pageState.showFavoritesOnly) {
+            params.append('favorites_only', 'true');
+        }
+
         // Add search parameters if there's a search term
         if (pageState.filters?.search) {
             params.append('search', pageState.filters.search);

static/js/api/checkpointApi.js

@@ -62,8 +62,13 @@ export async function refreshSingleCheckpointMetadata(filePath) {
     return refreshSingleModelMetadata(filePath, 'checkpoint');
 }
 
-// Save checkpoint metadata (similar to the Lora version)
-export async function saveCheckpointMetadata(filePath, data) {
+/**
+ * Save model metadata to the server
+ * @param {string} filePath - Path to the model file
+ * @param {Object} data - Metadata to save
+ * @returns {Promise} - Promise that resolves with the server response
+ */
+export async function saveModelMetadata(filePath, data) {
     const response = await fetch('/api/checkpoints/save-metadata', {
         method: 'POST',
         headers: {
@@ -79,5 +84,5 @@ export async function saveCheckpointMetadata(filePath, data) {
         throw new Error('Failed to save metadata');
     }
     
-    return await response.json();
+    return response.json();
 }

static/js/api/loraApi.js

@@ -9,6 +9,31 @@ import {
     refreshSingleModelMetadata
 } from './baseModelApi.js';
 
+/**
+ * Save model metadata to the server
+ * @param {string} filePath - File path
+ * @param {Object} data - Data to save
+ * @returns {Promise} Promise of the save operation
+ */
+export async function saveModelMetadata(filePath, data) {
+    const response = await fetch('/api/loras/save-metadata', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+            file_path: filePath,
+            ...data
+        })
+    });
+
+    if (!response.ok) {
+        throw new Error('Failed to save metadata');
+    }
+    
+    return response.json();
+}
+
 export async function loadMoreLoras(resetPage = false, updateFolders = false) {
     return loadMoreModels({
         resetPage,

static/js/components/CheckpointCard.js

@@ -2,7 +2,7 @@ import { showToast, copyToClipboard } from '../utils/uiHelpers.js';
 import { state } from '../state/index.js';
 import { showCheckpointModal } from './checkpointModal/index.js';
 import { NSFW_LEVELS } from '../utils/constants.js';
-import { replaceCheckpointPreview as apiReplaceCheckpointPreview } from '../api/checkpointApi.js';
+import { replaceCheckpointPreview as apiReplaceCheckpointPreview, saveModelMetadata } from '../api/checkpointApi.js';
 
 export function createCheckpointCard(checkpoint) {
     const card = document.createElement('div');
@@ -17,6 +17,7 @@ export function createCheckpointCard(checkpoint) {
     card.dataset.from_civitai = checkpoint.from_civitai;
     card.dataset.notes = checkpoint.notes || '';
     card.dataset.base_model = checkpoint.base_model || 'Unknown';
+    card.dataset.favorite = checkpoint.favorite ? 'true' : 'false';
 
     // Store metadata if available
     if (checkpoint.civitai) {
@@ -65,6 +66,9 @@ export function createCheckpointCard(checkpoint) {
     const isVideo = previewUrl.endsWith('.mp4');
     const videoAttrs = autoplayOnHover ? 'controls muted loop' : 'controls autoplay muted loop';
 
+    // Get favorite status from checkpoint data
+    const isFavorite = checkpoint.favorite === true;
+
     card.innerHTML = `
         <div class="card-preview ${shouldBlur ? 'blurred' : ''}">
             ${isVideo ? 
@@ -82,6 +86,9 @@ export function createCheckpointCard(checkpoint) {
                     ${checkpoint.base_model}
                 </span>
                 <div class="card-actions">
+                    <i class="${isFavorite ? 'fas fa-star favorite-active' : 'far fa-star'}" 
+                       title="${isFavorite ? 'Remove from favorites' : 'Add to favorites'}">
+                    </i>
                     <i class="fas fa-globe" 
                        title="${checkpoint.from_civitai ? 'View on Civitai' : 'Not available from Civitai'}"
                        ${!checkpoint.from_civitai ? 'style="opacity: 0.5; cursor: not-allowed"' : ''}>
@@ -198,6 +205,39 @@ export function createCheckpointCard(checkpoint) {
         });
     }
 
+    // Favorite button click event
+    card.querySelector('.fa-star')?.addEventListener('click', async e => {
+        e.stopPropagation();
+        const starIcon = e.currentTarget;
+        const isFavorite = starIcon.classList.contains('fas');
+        const newFavoriteState = !isFavorite;
+        
+        try {
+            // Save the new favorite state to the server
+            await saveModelMetadata(card.dataset.filepath, { 
+                favorite: newFavoriteState 
+            });
+
+            // Update the UI
+            if (newFavoriteState) {
+                starIcon.classList.remove('far');
+                starIcon.classList.add('fas', 'favorite-active');
+                starIcon.title = 'Remove from favorites';
+                card.dataset.favorite = 'true';
+                showToast('Added to favorites', 'success');
+            } else {
+                starIcon.classList.remove('fas', 'favorite-active');
+                starIcon.classList.add('far');
+                starIcon.title = 'Add to favorites';
+                card.dataset.favorite = 'false';
+                showToast('Removed from favorites', 'success');
+            }
+        } catch (error) {
+            console.error('Failed to update favorite status:', error);
+            showToast('Failed to update favorite status', 'error');
+        }
+    });
+
     // Copy button click event
     card.querySelector('.fa-copy')?.addEventListener('click', async e => {
         e.stopPropagation();

static/js/components/ContextMenu/CheckpointContextMenu.js

@@ -1,5 +1,5 @@
 import { BaseContextMenu } from './BaseContextMenu.js';
-import { refreshSingleCheckpointMetadata, saveCheckpointMetadata } from '../../api/checkpointApi.js';
+import { refreshSingleCheckpointMetadata, saveModelMetadata } from '../../api/checkpointApi.js';
 import { showToast, getNSFWLevelName } from '../../utils/uiHelpers.js';
 import { NSFW_LEVELS } from '../../utils/constants.js';
 import { getStorageItem } from '../../utils/storageHelpers.js';
@@ -82,7 +82,7 @@ export class CheckpointContextMenu extends BaseContextMenu {
                 if (!filePath) return;
                 
                 try {
-                    await saveCheckpointMetadata(filePath, { preview_nsfw_level: level });
+                    await saveModelMetadata(filePath, { preview_nsfw_level: level });
                     
                     // Update card data
                     const card = document.querySelector(`.lora-card[data-filepath="${filePath}"]`);

static/js/components/ContextMenu/LoraContextMenu.js

@@ -1,5 +1,5 @@
 import { BaseContextMenu } from './BaseContextMenu.js';
-import { refreshSingleLoraMetadata } from '../../api/loraApi.js';
+import { refreshSingleLoraMetadata, saveModelMetadata } from '../../api/loraApi.js';
 import { showToast, getNSFWLevelName } from '../../utils/uiHelpers.js';
 import { NSFW_LEVELS } from '../../utils/constants.js';
 import { getStorageItem } from '../../utils/storageHelpers.js';
@@ -111,22 +111,7 @@ export class LoraContextMenu extends BaseContextMenu {
     }
 
     async saveModelMetadata(filePath, data) {
-        const response = await fetch('/api/loras/save-metadata', {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
-            body: JSON.stringify({
-                file_path: filePath,
-                ...data
-            })
-        });
-    
-        if (!response.ok) {
-            throw new Error('Failed to save metadata');
-        }
-        
-        return await response.json();
+        return saveModelMetadata(filePath, data);
     }
 
     updateCardBlurEffect(card, level) {

static/js/components/LoraCard.js

@@ -3,7 +3,7 @@ import { state } from '../state/index.js';
 import { showLoraModal } from './loraModal/index.js';
 import { bulkManager } from '../managers/BulkManager.js';
 import { NSFW_LEVELS } from '../utils/constants.js';
-import { replacePreview, deleteModel } from '../api/loraApi.js'
+import { replacePreview, deleteModel, saveModelMetadata } from '../api/loraApi.js'
 
 export function createLoraCard(lora) {
     const card = document.createElement('div');
@@ -20,6 +20,7 @@ export function createLoraCard(lora) {
     card.dataset.usage_tips = lora.usage_tips;
     card.dataset.notes = lora.notes;
     card.dataset.meta = JSON.stringify(lora.civitai || {});
+    card.dataset.favorite = lora.favorite ? 'true' : 'false';
     
     // Store tags and model description
     if (lora.tags && Array.isArray(lora.tags)) {
@@ -65,6 +66,9 @@ export function createLoraCard(lora) {
     const isVideo = previewUrl.endsWith('.mp4');
     const videoAttrs = autoplayOnHover ? 'controls muted loop' : 'controls autoplay muted loop';
 
+    // Get favorite status from the lora data
+    const isFavorite = lora.favorite === true;
+
     card.innerHTML = `
         <div class="card-preview ${shouldBlur ? 'blurred' : ''}">
             ${isVideo ? 
@@ -82,6 +86,9 @@ export function createLoraCard(lora) {
                     ${lora.base_model}
                 </span>
                 <div class="card-actions">
+                    <i class="${isFavorite ? 'fas fa-star favorite-active' : 'far fa-star'}" 
+                       title="${isFavorite ? 'Remove from favorites' : 'Add to favorites'}">
+                    </i>
                     <i class="fas fa-globe" 
                        title="${lora.from_civitai ? 'View on Civitai' : 'Not available from Civitai'}"
                        ${!lora.from_civitai ? 'style="opacity: 0.5; cursor: not-allowed"' : ''}>
@@ -135,6 +142,7 @@ export function createLoraCard(lora) {
                 base_model: card.dataset.base_model,
                 usage_tips: card.dataset.usage_tips,
                 notes: card.dataset.notes,
+                favorite: card.dataset.favorite === 'true',
                 // Parse civitai metadata from the card's dataset
                 civitai: (() => {
                     try {
@@ -198,6 +206,39 @@ export function createLoraCard(lora) {
         });
     }
 
+    // Favorite button click event
+    card.querySelector('.fa-star')?.addEventListener('click', async e => {
+        e.stopPropagation();
+        const starIcon = e.currentTarget;
+        const isFavorite = starIcon.classList.contains('fas');
+        const newFavoriteState = !isFavorite;
+        
+        try {
+            // Save the new favorite state to the server
+            await saveModelMetadata(card.dataset.filepath, { 
+                favorite: newFavoriteState 
+            });
+
+            // Update the UI
+            if (newFavoriteState) {
+                starIcon.classList.remove('far');
+                starIcon.classList.add('fas', 'favorite-active');
+                starIcon.title = 'Remove from favorites';
+                card.dataset.favorite = 'true';
+                showToast('Added to favorites', 'success');
+            } else {
+                starIcon.classList.remove('fas', 'favorite-active');
+                starIcon.classList.add('far');
+                starIcon.title = 'Add to favorites';
+                card.dataset.favorite = 'false';
+                showToast('Removed from favorites', 'success');
+            }
+        } catch (error) {
+            console.error('Failed to update favorite status:', error);
+            showToast('Failed to update favorite status', 'error');
+        }
+    });
+
     // Copy button click event
     card.querySelector('.fa-copy')?.addEventListener('click', async e => {
         e.stopPropagation();

static/js/components/checkpointModal/ModelMetadata.js

@@ -5,31 +5,7 @@
 import { showToast } from '../../utils/uiHelpers.js';
 import { BASE_MODELS } from '../../utils/constants.js';
 import { updateCheckpointCard } from '../../utils/cardUpdater.js';
-
-/**
- * Save model metadata to the server
- * @param {string} filePath - Path to the model file
- * @param {Object} data - Metadata to save
- * @returns {Promise} - Promise that resolves with the server response
- */
-export async function saveModelMetadata(filePath, data) {
-    const response = await fetch('/api/checkpoints/save-metadata', {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-            file_path: filePath,
-            ...data
-        })
-    });
-
-    if (!response.ok) {
-        throw new Error('Failed to save metadata');
-    }
-    
-    return response.json();
-}
+import { saveModelMetadata } from '../../api/checkpointApi.js';
 
 /**
  * Set up model name editing functionality

static/js/components/checkpointModal/index.js

@@ -11,9 +11,9 @@ import { setupTabSwitching, loadModelDescription } from './ModelDescription.js';
 import { 
     setupModelNameEditing, 
     setupBaseModelEditing, 
-    setupFileNameEditing,
-    saveModelMetadata
+    setupFileNameEditing
 } from './ModelMetadata.js';
+import { saveModelMetadata } from '../../api/checkpointApi.js';
 import { renderCompactTags, setupTagTooltip, formatFileSize } from './utils.js';
 import { updateCheckpointCard } from '../../utils/cardUpdater.js';
 

static/js/components/controls/LorasControls.js

@@ -2,7 +2,6 @@
 import { PageControls } from './PageControls.js';
 import { loadMoreLoras, fetchCivitai, resetAndReload, refreshLoras } from '../../api/loraApi.js';
 import { getSessionItem, removeSessionItem } from '../../utils/storageHelpers.js';
-import { showToast } from '../../utils/uiHelpers.js';
 
 /**
  * LorasControls class - Extends PageControls for LoRA-specific functionality

static/js/components/controls/PageControls.js

@@ -1,6 +1,6 @@
 // PageControls.js - Manages controls for both LoRAs and Checkpoints pages
 import { state, getCurrentPageState, setCurrentPageType } from '../../state/index.js';
-import { getStorageItem, setStorageItem } from '../../utils/storageHelpers.js';
+import { getStorageItem, setStorageItem, getSessionItem, setSessionItem } from '../../utils/storageHelpers.js';
 import { showToast } from '../../utils/uiHelpers.js';
 
 /**
@@ -26,6 +26,9 @@ export class PageControls {
         // Initialize event listeners
         this.initEventListeners();
         
+        // Initialize favorites filter button state
+        this.initFavoritesFilter();
+        
         console.log(`PageControls initialized for ${pageType} page`);
     }
     
@@ -121,6 +124,12 @@ export class PageControls {
                 bulkButton.addEventListener('click', () => this.toggleBulkMode());
             }
         }
+        
+        // Favorites filter button handler
+        const favoriteFilterBtn = document.getElementById('favoriteFilterBtn');
+        if (favoriteFilterBtn) {
+            favoriteFilterBtn.addEventListener('click', () => this.toggleFavoritesOnly());
+        }
     }
     
     /**
@@ -385,4 +394,50 @@ export class PageControls {
             showToast('Failed to clear custom filter: ' + error.message, 'error');
         }
     }
+    
+    /**
+     * Initialize the favorites filter button state
+     */
+    initFavoritesFilter() {
+        const favoriteFilterBtn = document.getElementById('favoriteFilterBtn');
+        if (favoriteFilterBtn) {
+            // Get current state from session storage with page-specific key
+            const storageKey = `show_favorites_only_${this.pageType}`;
+            const showFavoritesOnly = getSessionItem(storageKey, false);
+            
+            // Update button state
+            if (showFavoritesOnly) {
+                favoriteFilterBtn.classList.add('active');
+            }
+            
+            // Update app state
+            this.pageState.showFavoritesOnly = showFavoritesOnly;
+        }
+    }
+    
+    /**
+     * Toggle favorites-only filter and reload models
+     */
+    async toggleFavoritesOnly() {
+        const favoriteFilterBtn = document.getElementById('favoriteFilterBtn');
+        
+        // Toggle the filter state in storage
+        const storageKey = `show_favorites_only_${this.pageType}`;
+        const currentState = this.pageState.showFavoritesOnly;
+        const newState = !currentState;
+        
+        // Update session storage
+        setSessionItem(storageKey, newState);
+        
+        // Update state
+        this.pageState.showFavoritesOnly = newState;
+        
+        // Update button appearance
+        if (favoriteFilterBtn) {
+            favoriteFilterBtn.classList.toggle('active', newState);
+        }
+        
+        // Reload models with new filter
+        await this.resetAndReload(true);
+    }
 }

static/js/components/loraModal/ModelMetadata.js

@@ -5,31 +5,7 @@
 import { showToast } from '../../utils/uiHelpers.js';
 import { BASE_MODELS } from '../../utils/constants.js';
 import { updateLoraCard } from '../../utils/cardUpdater.js';
-
-/**
- * 保存模型元数据到服务器
- * @param {string} filePath - 文件路径
- * @param {Object} data - 要保存的数据
- * @returns {Promise} 保存操作的Promise
- */
-export async function saveModelMetadata(filePath, data) {
-    const response = await fetch('/api/loras/save-metadata', {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-            file_path: filePath,
-            ...data
-        })
-    });
-
-    if (!response.ok) {
-        throw new Error('Failed to save metadata');
-    }
-    
-    return response.json();
-}
+import { saveModelMetadata } from '../../api/loraApi.js';
 
 /**
  * 设置模型名称编辑功能

static/js/components/loraModal/PresetTags.js

@@ -2,8 +2,7 @@
  * PresetTags.js
  * 处理LoRA模型预设参数标签相关的功能模块
  */
-import { saveModelMetadata } from './ModelMetadata.js';
-import { showToast } from '../../utils/uiHelpers.js';
+import { saveModelMetadata } from '../../api/loraApi.js';
 
 /**
  * 解析预设参数

static/js/components/loraModal/TriggerWords.js

@@ -3,7 +3,7 @@
  * 处理LoRA模型触发词相关的功能模块
  */
 import { showToast, copyToClipboard } from '../../utils/uiHelpers.js';
-import { saveModelMetadata } from './ModelMetadata.js';
+import { saveModelMetadata } from '../../api/loraApi.js';
 
 /**
  * 渲染触发词

static/js/components/loraModal/index.js

@@ -13,9 +13,9 @@ import { loadRecipesForLora } from './RecipeTab.js'; // Add import for recipe ta
 import { 
     setupModelNameEditing, 
     setupBaseModelEditing, 
-    setupFileNameEditing,
-    saveModelMetadata
+    setupFileNameEditing
 } from './ModelMetadata.js';
+import { saveModelMetadata } from '../../api/loraApi.js';
 import { renderCompactTags, setupTagTooltip, formatFileSize } from './utils.js';
 import { updateLoraCard } from '../../utils/cardUpdater.js';
 

static/js/recipes.js

@@ -268,6 +268,32 @@ class RecipeManager {
         }
     }
     
+    /**
+     * Refreshes the recipe list by first rebuilding the cache and then loading recipes
+     */
+    async refreshRecipes() {
+        try {           
+            // Call the new endpoint to rebuild the recipe cache
+            const response = await fetch('/api/recipes/scan');
+            
+            if (!response.ok) {
+                const data = await response.json();
+                throw new Error(data.error || 'Failed to refresh recipe cache');
+            }
+            
+            // After successful cache rebuild, load the recipes
+            await this.loadRecipes(true);
+            
+            appCore.showToast('Refresh complete', 'success');
+        } catch (error) {
+            console.error('Error refreshing recipes:', error);
+            appCore.showToast(error.message || 'Failed to refresh recipes', 'error');
+            
+            // Still try to load recipes even if scan failed
+            await this.loadRecipes(true);
+        }
+    }
+    
     async _loadSpecificRecipe(recipeId) {
         try {
             // Fetch specific recipe by ID

static/js/state/index.js

@@ -42,6 +42,7 @@ export const state = {
             bulkMode: false,
             selectedLoras: new Set(),
             loraMetadataCache: new Map(),
+            showFavoritesOnly: false,
         },
         
         recipes: {
@@ -61,7 +62,8 @@ export const state = {
                 tags: [],
                 search: ''
             },
-            pageSize: 20
+            pageSize: 20,
+            showFavoritesOnly: false,
         },
         
         checkpoints: {
@@ -80,7 +82,8 @@ export const state = {
             filters: {
                 baseModel: [],
                 tags: []
-            }
+            },
+            showFavoritesOnly: false,
         }
     },
     

static/js/utils/uiHelpers.js

@@ -114,13 +114,55 @@ export function restoreFolderFilter() {
 }
 
 export function initTheme() {
-    document.body.dataset.theme = getStorageItem('theme') || 'dark';
+    const savedTheme = getStorageItem('theme') || 'auto';
+    applyTheme(savedTheme);
+    
+    // Update theme when system preference changes (for 'auto' mode)
+    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+        const currentTheme = getStorageItem('theme') || 'auto';
+        if (currentTheme === 'auto') {
+            applyTheme('auto');
+        }
+    });
 }
 
 export function toggleTheme() {
-    const theme = document.body.dataset.theme === 'light' ? 'dark' : 'light';
-    document.body.dataset.theme = theme;
-    setStorageItem('theme', theme);
+    const currentTheme = getStorageItem('theme') || 'auto';
+    let newTheme;
+    
+    if (currentTheme === 'dark') {
+        newTheme = 'light';
+    } else {
+        newTheme = 'dark';
+    }
+    
+    setStorageItem('theme', newTheme);
+    applyTheme(newTheme);
+    
+    // Force a repaint to ensure theme changes are applied immediately
+    document.body.style.display = 'none';
+    document.body.offsetHeight; // Trigger a reflow
+    document.body.style.display = '';
+    
+    return newTheme;
+}
+
+// Add a new helper function to apply the theme
+function applyTheme(theme) {
+    const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+    const htmlElement = document.documentElement;
+    
+    // Remove any existing theme attributes
+    htmlElement.removeAttribute('data-theme');
+    
+    // Apply the appropriate theme
+    if (theme === 'dark' || (theme === 'auto' && prefersDark)) {
+        htmlElement.setAttribute('data-theme', 'dark');
+        document.body.dataset.theme = 'dark';
+    } else {
+        htmlElement.setAttribute('data-theme', 'light');
+        document.body.dataset.theme = 'light';
+    }
 }
 
 export function toggleFolder(tag) {

templates/base.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="/loras_static/css/style.css">
     {% block page_css %}{% endblock %}
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
+    <link rel="stylesheet" href="/loras_static/vendor/font-awesome/css/all.min.css"
         crossorigin="anonymous" referrerpolicy="no-referrer">
     <link rel="icon" type="image/png" sizes="32x32" href="/loras_static/images/favicon-32x32.png">
     <link rel="icon" type="image/png" sizes="16x16" href="/loras_static/images/favicon-16x16.png">
@@ -17,7 +17,7 @@
     {% block preload %}{% endblock %}
 
     <!-- 优化字体加载 -->
-    <link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/webfonts/fa-solid-900.woff2"
+    <link rel="preload" href="/loras_static/vendor/font-awesome/webfonts/fa-solid-900.woff2"
         as="font" type="font/woff2" crossorigin>
 
     <!-- 添加性能监控 -->
@@ -35,7 +35,7 @@
 
     <!-- 添加资源加载策略 -->
     <link rel="preconnect" href="https://civitai.com">
-    <link rel="preconnect" href="https://cdnjs.cloudflare.com">
+    <!-- <link rel="preconnect" href="https://cdnjs.cloudflare.com"> -->
 
     <script>
         // 计算滚动条宽度并设置CSS变量
@@ -48,6 +48,20 @@
             document.documentElement.style.setProperty('--scrollbar-width', scrollbarWidth + 'px');
         });
     </script>
+    <script>
+      (function() {
+        // Apply theme immediately based on stored preference
+        const STORAGE_PREFIX = 'lora_manager_';
+        const savedTheme = localStorage.getItem(STORAGE_PREFIX + 'theme') || 'auto';
+        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        
+        if (savedTheme === 'dark' || (savedTheme === 'auto' && prefersDark)) {
+          document.documentElement.setAttribute('data-theme', 'dark');
+        } else {
+          document.documentElement.setAttribute('data-theme', 'light');
+        }
+      })();
+    </script>
     {% block head_scripts %}{% endblock %}
 </head>
 

templates/components/controls.html

@@ -35,6 +35,11 @@
                 </button>
             </div>
             {% endif %}
+            <div class="control-group">
+                <button id="favoriteFilterBtn" data-action="toggle-favorites" class="favorite-filter" title="Show favorites only">
+                    <i class="fas fa-star"></i> Favorites
+                </button>
+            </div>
             <div id="customFilterIndicator" class="control-group hidden">
                 <div class="filter-active">
                     <i class="fas fa-filter"></i> <span class="customFilterText" title=""></span>

templates/recipes.html

@@ -37,7 +37,7 @@
     <div class="controls">
         <div class="action-buttons">
             <div title="Refresh recipe list" class="control-group">
-                <button onclick="recipeManager.loadRecipes(true)"><i class="fas fa-sync"></i> Refresh</button>
+                <button onclick="recipeManager.refreshRecipes()"><i class="fas fa-sync"></i> Refresh</button>
             </div>
             <div title="Import recipes" class="control-group">
                 <button onclick="importManager.showImportModal()"><i class="fas fa-file-import"></i> Import</button>