ci: Bump version to 0.6.4 [skip ci]

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "flyer-crawler",
-  "version": "0.6.2",
+  "version": "0.6.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "flyer-crawler",
-      "version": "0.6.2",
+      "version": "0.6.4",
       "dependencies": {
         "@bull-board/api": "^6.14.2",
         "@bull-board/express": "^6.14.2",

package.json

@@ -1,7 +1,7 @@
 {
   "name": "flyer-crawler",
   "private": true,
-  "version": "0.6.2",
+  "version": "0.6.4",
   "type": "module",
   "scripts": {
     "dev": "concurrently \"npm:start:dev\" \"vite\"",

src/features/flyer/FlyerUploader.test.tsx

@@ -268,13 +268,12 @@ describe('FlyerUploader', () => {
 
     // We need at least one 'active' response to establish a timeout loop so we have something to clear
     // The second call should be a rejection, as this is how getJobStatus signals a failure.
-    mockedAiApiClient.getJobStatus.mockImplementation(async () => {
-      // Fail on the second call by checking the number of times the mock has been invoked.
-      if (mockedAiApiClient.getJobStatus.mock.calls.length > 1) {
-        throw new aiApiClientModule.JobFailedError('Fatal Error', 'UNKNOWN_ERROR');
-      }
-      return { state: 'active', progress: { message: 'Working...' } } as aiApiClientModule.JobStatus;
-    });
+    mockedAiApiClient.getJobStatus
+      .mockResolvedValueOnce({
+        state: 'active',
+        progress: { message: 'Working...' },
+      } as aiApiClientModule.JobStatus)
+      .mockRejectedValueOnce(new aiApiClientModule.JobFailedError('Fatal Error', 'UNKNOWN_ERROR'));
 
     renderComponent();
     const file = new File(['content'], 'flyer.pdf', { type: 'application/pdf' });
@@ -289,10 +288,10 @@ describe('FlyerUploader', () => {
     await waitFor(() => expect(screen.getByText(/Polling failed: Fatal Error/i)).toBeInTheDocument(), { timeout: 4000 });
   });
 
-  it('should clear the polling timeout when the component unmounts', async () => {
-    const clearTimeoutSpy = vi.spyOn(global, 'clearTimeout');
-    console.log('--- [TEST LOG] ---: 1. Setting up mocks for unmount timeout clearance.');
+  it('should stop polling for job status when the component unmounts', async () => {
+    console.log('--- [TEST LOG] ---: 1. Setting up mocks for unmount polling stop.');
     mockedAiApiClient.uploadAndProcessFlyer.mockResolvedValue({ jobId: 'job-unmount' });
+    // Mock getJobStatus to always return 'active' to keep polling
     mockedAiApiClient.getJobStatus.mockResolvedValue({
       state: 'active',
       progress: { message: 'Polling...' },
@@ -304,18 +303,29 @@ describe('FlyerUploader', () => {
 
     fireEvent.change(input, { target: { files: [file] } });
 
-    // Wait for the first poll to complete and the UI to show the polling state
+    // Wait for the first poll to complete and UI to update
     await screen.findByText('Polling...');
 
-    // Now that we are in a polling state (and a timeout is set), unmount the component
-    console.log('--- [TEST LOG] ---: 2. Unmounting component to trigger cleanup effect.');
+    // Wait for exactly one call to be sure polling has started.
+    await waitFor(() => {
+      expect(mockedAiApiClient.getJobStatus).toHaveBeenCalledTimes(1);
+    });
+    console.log('--- [TEST LOG] ---: 2. First poll confirmed.');
+
+    // Record the number of calls before unmounting.
+    const callsBeforeUnmount = mockedAiApiClient.getJobStatus.mock.calls.length;
+
+    // Now unmount the component, which should stop the polling.
+    console.log('--- [TEST LOG] ---: 3. Unmounting component.');
     unmount();
 
-    // Verify that the cleanup function in the useEffect hook was called
-    expect(clearTimeoutSpy).toHaveBeenCalled();
-    console.log('--- [TEST LOG] ---: 3. clearTimeout confirmed.');
+    // Wait for a duration longer than the polling interval (3s) to see if more calls are made.
+    console.log('--- [TEST LOG] ---: 4. Waiting for 4 seconds to check for further polling.');
+    await act(() => new Promise((resolve) => setTimeout(resolve, 4000)));
 
-    clearTimeoutSpy.mockRestore();
+    // Verify that getJobStatus was not called again after unmounting.
+    console.log('--- [TEST LOG] ---: 5. Asserting no new polls occurred.');
+    expect(mockedAiApiClient.getJobStatus).toHaveBeenCalledTimes(callsBeforeUnmount);
   });
 
   it('should handle a duplicate flyer error (409)', async () => {

src/hooks/useApi.ts

@@ -3,6 +3,7 @@ import { useState, useCallback, useRef, useEffect } from 'react';
 import { logger } from '../services/logger.client';
 import { notifyError } from '../services/notificationService';
 
+
 /**
  * A custom React hook to simplify API calls, including loading and error states.
  * It is designed to work with apiClient functions that return a `Promise<Response>`.

src/hooks/useFlyerUploader.ts

@@ -106,7 +106,10 @@ export const useFlyerUploader = () => {
   // Consolidate state derivation for the UI from the react-query hooks using useMemo.
   // This improves performance by memoizing the derived state and makes the logic easier to follow.
   const { processingState, errorMessage, duplicateFlyerId, flyerId, statusMessage } = useMemo(() => {
+    // The order of these checks is critical. Errors must be checked first to override
+    // any stale `jobStatus` from a previous successful poll.
     const state: ProcessingState = (() => {
+      if (uploadMutation.isError || pollError) return 'error';
       if (uploadMutation.isPending) return 'uploading';
       if (jobStatus && (jobStatus.state === 'active' || jobStatus.state === 'waiting'))
         return 'polling';
@@ -114,7 +117,6 @@ export const useFlyerUploader = () => {
         if (!jobStatus.returnValue?.flyerId) return 'error';
         return 'completed';
       }
-      if (uploadMutation.isError || jobStatus?.state === 'failed' || pollError) return 'error';
       return 'idle';
     })();