fix(recipe): show checkpoint-linked recipes in model modal (#851)

tests/frontend/components/modelMetadata.renamePath.test.js

@@ -82,7 +82,7 @@ vi.mock(MODEL_VERSIONS_MODULE, () => ({
 }));
 
 vi.mock(RECIPE_TAB_MODULE, () => ({
-  loadRecipesForLora: vi.fn(),
+  loadRecipesForModel: vi.fn(),
 }));
 
 vi.mock(I18N_HELPERS_MODULE, () => ({
@@ -103,11 +103,14 @@ vi.mock(API_FACTORY, () => ({
 
 describe('Model metadata interactions keep file path in sync', () => {
   let getModelApiClient;
+  let loadRecipesForModel;
 
   beforeEach(async () => {
     document.body.innerHTML = '';
     ({ getModelApiClient } = await import(API_FACTORY));
+    ({ loadRecipesForModel } = await import(RECIPE_TAB_MODULE));
     getModelApiClient.mockReset();
+    loadRecipesForModel.mockReset();
   });
 
   afterEach(() => {
@@ -206,4 +209,33 @@ describe('Model metadata interactions keep file path in sync', () => {
       expect(saveModelMetadata).toHaveBeenCalledWith('models/Qwen.testing.safetensors', { notes: 'Updated notes' });
     });
   });
+
+  it('shows recipes tab for checkpoint modals and loads linked recipes by hash', async () => {
+    const fetchModelMetadata = vi.fn().mockResolvedValue(null);
+
+    getModelApiClient.mockReturnValue({
+      fetchModelMetadata,
+      saveModelMetadata: vi.fn(),
+    });
+
+    const { showModelModal } = await import(MODAL_MODULE);
+
+    await showModelModal(
+      {
+        model_name: 'Flux Base',
+        file_path: 'models/checkpoints/flux-base.safetensors',
+        file_name: 'flux-base.safetensors',
+        sha256: 'ABC123',
+        civitai: {},
+      },
+      'checkpoints',
+    );
+
+    expect(document.querySelector('.tab-btn[data-tab="recipes"]')).not.toBeNull();
+    expect(loadRecipesForModel).toHaveBeenCalledWith({
+      modelKind: 'checkpoint',
+      displayName: 'Flux Base',
+      sha256: 'ABC123',
+    });
+  });
 });

tests/frontend/components/modelModal.licenseIcons.test.js

@@ -80,7 +80,7 @@ vi.mock(MODEL_VERSIONS_MODULE, () => ({
 }));
 
 vi.mock(RECIPE_TAB_MODULE, () => ({
-  loadRecipesForLora: vi.fn(),
+  loadRecipesForModel: vi.fn(),
 }));
 
 vi.mock(I18N_HELPERS_MODULE, () => ({

tests/frontend/pages/recipesPage.test.js

@@ -6,6 +6,7 @@ const initializePageFeaturesMock = vi.fn();
 const getCurrentPageStateMock = vi.fn();
 const getSessionItemMock = vi.fn();
 const removeSessionItemMock = vi.fn();
+const getStorageItemMock = vi.fn();
 const RecipeContextMenuMock = vi.fn();
 const refreshVirtualScrollMock = vi.fn();
 const refreshRecipesMock = vi.fn();
@@ -51,6 +52,7 @@ vi.mock('../../../static/js/state/index.js', () => ({
 vi.mock('../../../static/js/utils/storageHelpers.js', () => ({
   getSessionItem: getSessionItemMock,
   removeSessionItem: removeSessionItemMock,
+  getStorageItem: getStorageItemMock,
 }));
 
 vi.mock('../../../static/js/components/ContextMenu/index.js', () => ({
@@ -117,11 +119,14 @@ describe('RecipeManager', () => {
       const map = {
         lora_to_recipe_filterLoraName: 'Flux Dream',
         lora_to_recipe_filterLoraHash: 'abc123',
+        checkpoint_to_recipe_filterCheckpointName: null,
+        checkpoint_to_recipe_filterCheckpointHash: null,
         viewRecipeId: '42',
       };
       return map[key] ?? null;
     });
     removeSessionItemMock.mockImplementation(() => { });
+    getStorageItemMock.mockImplementation((_, defaultValue = null) => defaultValue);
 
     renderRecipesPage();
 
@@ -166,6 +171,8 @@ describe('RecipeManager', () => {
       active: true,
       loraName: 'Flux Dream',
       loraHash: 'abc123',
+      checkpointName: null,
+      checkpointHash: null,
       recipeId: '42',
     });
 
@@ -177,6 +184,8 @@ describe('RecipeManager', () => {
 
     expect(removeSessionItemMock).toHaveBeenCalledWith('lora_to_recipe_filterLoraName');
     expect(removeSessionItemMock).toHaveBeenCalledWith('lora_to_recipe_filterLoraHash');
+    expect(removeSessionItemMock).toHaveBeenCalledWith('checkpoint_to_recipe_filterCheckpointName');
+    expect(removeSessionItemMock).toHaveBeenCalledWith('checkpoint_to_recipe_filterCheckpointHash');
     expect(removeSessionItemMock).toHaveBeenCalledWith('viewRecipeId');
     expect(pageState.customFilter.active).toBe(false);
     expect(indicator.classList.contains('hidden')).toBe(true);
@@ -227,4 +236,36 @@ describe('RecipeManager', () => {
     await manager.refreshRecipes();
     expect(refreshRecipesMock).toHaveBeenCalledTimes(1);
   });
+
+  it('restores checkpoint recipe filter state and indicator text', async () => {
+    getSessionItemMock.mockImplementation((key) => {
+      const map = {
+        lora_to_recipe_filterLoraName: null,
+        lora_to_recipe_filterLoraHash: null,
+        checkpoint_to_recipe_filterCheckpointName: 'Flux Base',
+        checkpoint_to_recipe_filterCheckpointHash: 'ckpt123',
+        viewRecipeId: null,
+      };
+      return map[key] ?? null;
+    });
+
+    const manager = new RecipeManager();
+    await manager.initialize();
+
+    expect(pageState.customFilter).toEqual({
+      active: true,
+      loraName: null,
+      loraHash: null,
+      checkpointName: 'Flux Base',
+      checkpointHash: 'ckpt123',
+      recipeId: null,
+    });
+
+    const indicator = document.getElementById('customFilterIndicator');
+    const filterText = indicator.querySelector('#customFilterText');
+
+    expect(filterText.innerHTML).toContain('Recipes using checkpoint:');
+    expect(filterText.innerHTML).toContain('Flux Base');
+    expect(filterText.getAttribute('title')).toBe('Flux Base');
+  });
 });