feat(ui): add global, bulk and per-recipe rematch actions

tests/frontend/components/recipeContextMenu.rematch.test.js

@@ -0,0 +1,188 @@
+import { describe, it, beforeEach, afterEach, expect, vi } from 'vitest';
+
+const showToastMock = vi.fn();
+const updateSingleItemMock = vi.fn();
+const handleCommonMenuActionsMock = vi.fn(() => false);
+
+const stateStub = {
+  virtualScroller: { updateSingleItem: updateSingleItemMock },
+};
+
+vi.mock('../../../static/js/utils/uiHelpers.js', () => ({
+  showToast: showToastMock,
+  copyToClipboard: vi.fn(),
+  sendLoraToWorkflow: vi.fn(),
+}));
+
+vi.mock('../../../static/js/utils/storageHelpers.js', () => ({
+  setSessionItem: vi.fn(),
+  removeSessionItem: vi.fn(),
+}));
+
+vi.mock('../../../static/js/api/recipeApi.js', () => ({
+  updateRecipeMetadata: vi.fn(),
+}));
+
+vi.mock('../../../static/js/state/index.js', () => ({
+  state: stateStub,
+}));
+
+vi.mock('../../../static/js/managers/MoveManager.js', () => ({
+  moveManager: { showMoveModal: vi.fn() },
+}));
+
+vi.mock('../../../static/js/components/ContextMenu/ModelContextMenuMixin.js', () => ({
+  ModelContextMenuMixin: {
+    handleCommonMenuActions: handleCommonMenuActionsMock,
+    initNSFWSelector: vi.fn(),
+  },
+}));
+
+const flushAsyncTasks = async (rounds = 5) => {
+  for (let i = 0; i < rounds; i++) {
+    await new Promise((resolve) => setTimeout(resolve, 0));
+  }
+};
+
+describe('RecipeContextMenu.rematchRecipe', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    document.body.innerHTML = `
+      <div id="recipeContextMenu" class="context-menu" style="display: none;">
+        <div class="context-menu-item" data-action="rematch"></div>
+        <div class="context-menu-item download-missing-item" data-action="download-missing"></div>
+      </div>
+      <div id="card" class="model-card" data-id="recipe-1" data-filepath="/recipes/recipe-1.webp"></div>
+    `;
+    global.fetch = vi.fn();
+  });
+
+  afterEach(() => {
+    delete global.fetch;
+  });
+
+  async function createMenu() {
+    const { RecipeContextMenu } = await import(
+      '../../../static/js/components/ContextMenu/RecipeContextMenu.js'
+    );
+    return new RecipeContextMenu();
+  }
+
+  // Oracle R4-F1 pin: branches on `result.rematched > 0` — a blind `repaired`
+  // mirror would fire the skipped toast here.
+  it('posts to the per-recipe rematch endpoint and toasts the rematched count', async () => {
+    const menu = await createMenu();
+    const card = document.getElementById('card');
+    menu.showMenu(100, 100, card);
+
+    global.fetch
+      .mockResolvedValueOnce({
+        ok: true,
+        json: async () => ({ success: true, rematched: 2, skipped: 0 }),
+      })
+      .mockResolvedValueOnce({
+        ok: true,
+        json: async () => ({ id: 'recipe-1', title: 'Updated Recipe' }),
+      });
+
+    document
+      .querySelector('[data-action="rematch"]')
+      .dispatchEvent(new Event('click', { bubbles: true }));
+
+    await flushAsyncTasks();
+
+    expect(global.fetch).toHaveBeenNthCalledWith(1, '/api/lm/recipe/recipe-1/rematch', {
+      method: 'POST',
+    });
+    expect(showToastMock).toHaveBeenCalledWith(
+      'toast.recipes.rematchComplete',
+      { rematched: 2, skipped: 0, total: 1 },
+      'success'
+    );
+    expect(showToastMock).not.toHaveBeenCalledWith(
+      'toast.recipes.rematchSkipped',
+      expect.anything(),
+      expect.anything()
+    );
+    expect(global.fetch).toHaveBeenNthCalledWith(2, '/api/lm/recipe/recipe-1');
+    expect(updateSingleItemMock).toHaveBeenCalledWith('/recipes/recipe-1.webp', {
+      id: 'recipe-1',
+      title: 'Updated Recipe',
+    });
+  });
+
+  it('toasts the skipped message when nothing was rematched', async () => {
+    const menu = await createMenu();
+    const card = document.getElementById('card');
+    menu.showMenu(100, 100, card);
+
+    global.fetch.mockResolvedValueOnce({
+      ok: true,
+      json: async () => ({ success: true, rematched: 0, skipped: 1 }),
+    });
+
+    document
+      .querySelector('[data-action="rematch"]')
+      .dispatchEvent(new Event('click', { bubbles: true }));
+
+    await flushAsyncTasks();
+
+    expect(showToastMock).toHaveBeenCalledWith(
+      'toast.recipes.rematchSkipped',
+      { total: 1 },
+      'info'
+    );
+    expect(showToastMock).not.toHaveBeenCalledWith(
+      'toast.recipes.rematchComplete',
+      expect.anything(),
+      expect.anything()
+    );
+    expect(global.fetch).toHaveBeenCalledTimes(1);
+  });
+
+  // Oracle R4-F2 pin: failure surfaces `result.error` (e.g. the 409 body).
+  it('surfaces result.error when the rematch is rejected', async () => {
+    const menu = await createMenu();
+    const card = document.getElementById('card');
+    menu.showMenu(100, 100, card);
+
+    global.fetch.mockResolvedValueOnce({
+      ok: false,
+      status: 409,
+      json: async () => ({ success: false, error: 'Recipe rematch already in progress' }),
+    });
+
+    document
+      .querySelector('[data-action="rematch"]')
+      .dispatchEvent(new Event('click', { bubbles: true }));
+
+    await flushAsyncTasks();
+
+    expect(showToastMock).toHaveBeenCalledWith(
+      'toast.recipes.rematchFailed',
+      { message: 'Recipe rematch already in progress' },
+      'error'
+    );
+    expect(global.fetch).toHaveBeenCalledTimes(1);
+  });
+
+  it('toasts the failure message when the fetch throws', async () => {
+    const menu = await createMenu();
+    const card = document.getElementById('card');
+    menu.showMenu(100, 100, card);
+
+    global.fetch.mockRejectedValueOnce(new Error('network down'));
+
+    document
+      .querySelector('[data-action="rematch"]')
+      .dispatchEvent(new Event('click', { bubbles: true }));
+
+    await flushAsyncTasks();
+
+    expect(showToastMock).toHaveBeenCalledWith(
+      'toast.recipes.rematchFailed',
+      { message: 'network down' },
+      'error'
+    );
+  });
+});