Enhance Lora and recipe integration with improved filtering and UI updates

- Added support for filtering LoRAs by hash in both API and UI components.
- Implemented session storage management for custom filter states when navigating between recipes and LoRAs.
- Introduced a new button in the recipe modal to view associated LoRAs, enhancing user navigation.
- Updated CSS styles for new UI elements, including a custom filter indicator and LoRA view button.
- Refactored existing JavaScript components to streamline the handling of filter parameters and improve maintainability.
This commit is contained in:
Will Miao
2025-04-08 12:23:51 +08:00
parent bddc7a438d
commit 801aa2e876
12 changed files with 352 additions and 158 deletions

View File

@@ -71,18 +71,15 @@ class RecipeManager {
}
_checkCustomFilter() {
// Check for bypass filter flag
const bypassExistingFilters = getSessionItem('bypassExistingFilters');
// Check for Lora filter
const filterLoraName = getSessionItem('filterLoraName');
const filterLoraHash = getSessionItem('filterLoraHash');
const filterLoraName = getSessionItem('lora_to_recipe_filterLoraName');
const filterLoraHash = getSessionItem('lora_to_recipe_filterLoraHash');
// Check for specific recipe ID
const viewRecipeId = getSessionItem('viewRecipeId');
// Set custom filter if any parameter is present
if (bypassExistingFilters || filterLoraName || filterLoraHash || viewRecipeId) {
if (filterLoraName || filterLoraHash || viewRecipeId) {
this.customFilter = {
active: true,
loraName: filterLoraName,
@@ -90,26 +87,9 @@ class RecipeManager {
recipeId: viewRecipeId
};
// Clean up session storage after reading
removeSessionItem('bypassExistingFilters');
// Show custom filter indicator
this._showCustomFilterIndicator();
}
// Check for create recipe dialog flag
const openCreateRecipeDialog = getSessionItem('openCreateRecipeDialog');
if (openCreateRecipeDialog) {
// Clean up session storage
removeSessionItem('openCreateRecipeDialog');
// Schedule showing the create dialog after the page loads
setTimeout(() => {
if (this.importManager && typeof this.importManager.showImportModal === 'function') {
this.importManager.showImportModal();
}
}, 500);
}
}
_showCustomFilterIndicator() {
@@ -176,8 +156,8 @@ class RecipeManager {
}
// Clear any session storage items
removeSessionItem('filterLoraName');
removeSessionItem('filterLoraHash');
removeSessionItem('lora_to_recipe_filterLoraName');
removeSessionItem('lora_to_recipe_filterLoraHash');
removeSessionItem('viewRecipeId');
// Reload recipes without custom filter
@@ -366,8 +346,4 @@ document.addEventListener('DOMContentLoaded', async () => {
});
// Export for use in other modules
export { RecipeManager };
// The RecipesManager class from the original file is preserved below (commented out)
// If needed, functionality can be migrated to the new RecipeManager class above
// ...rest of the existing code...
export { RecipeManager };