Cache fix issues V2 (#5237)

# Description of Changes  --- ## Checklist ### General - [ ] I have read the [Contribution Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md) - [ ] I have read the [Stirling-PDF Developer Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md) (if applicable) - [ ] I have read the [How to add new languages to Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md) (if applicable) - [ ] I have performed a self-review of my own code - [ ] My changes generate no new warnings ### Documentation - [ ] I have updated relevant docs on [Stirling-PDF's doc repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/) (if functionality has heavily changed) - [ ] I have read the section [Add New Translation Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md#add-new-translation-tags) (for new translation tags only) ### UI Changes (if applicable) - [ ] Screenshots or videos demonstrating the UI changes are attached (e.g., as comments or direct attachments in the PR) ### Testing (if applicable) - [ ] I have tested my changes locally. Refer to the [Testing Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md#6-testing) for more details.
2026-07-16 19:33:11 +02:00 · 2025-12-15 23:54:25 +00:00
parent 336ec34125
commit d80e627899
26 changed files with 805 additions and 229 deletions
@@ -238,6 +238,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
  const originalImagesRef = useRef<PdfJsonImageElement[][]>([]);
  const originalGroupsRef = useRef<TextGroup[][]>([]);
  const imagesByPageRef = useRef<PdfJsonImageElement[][]>([]);
+  const lastLoadedFileRef = useRef<File | null>(null);
  const autoLoadKeyRef = useRef<string | null>(null);
  const sourceFileIdRef = useRef<string | null>(null);
  const loadRequestIdRef = useRef(0);
@@ -251,6 +252,10 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
  const pagePreviewsRef = useRef<Map<number, string>>(pagePreviews);
  const previewScaleRef = useRef<Map<number, number>>(new Map());
  const cachedJobIdRef = useRef<string | null>(null);
+  const previousCachedJobIdRef = useRef<string | null>(null);
+  const cacheRecoveryInProgressRef = useRef(false);
+  const cacheRecoveryAttemptsRef = useRef(0);
+  const recoverCacheAndReloadRef = useRef<() => Promise<boolean>>(async () => false);

  // Keep ref in sync with state for access in async callbacks
  useEffect(() => {
@@ -279,6 +284,13 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
    };
  }, []);

+  const isCacheUnavailableError = useCallback((error: any): boolean => {
+    const status = error?.response?.status;
+    // Treat any 410 as cache unavailable, since responseType: 'blob' makes
+    // it impossible to reliably check the JSON body
+    return status === 410;
+  }, []);
+
  const dirtyPages = useMemo(
    () => getDirtyPages(groupsByPage, imagesByPage, originalGroupsRef.current, originalImagesRef.current),
    [groupsByPage, imagesByPage],
@@ -316,6 +328,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
      loadedImagePagesRef.current = new Set();
      loadingImagePagesRef.current = new Set();
      setSelectedPage(0);
+      setIsLazyMode(false);
+      setCachedJobId(null);
+      cachedJobIdRef.current = null;
      return;
    }
    const cloned = deepCloneDocument(document);
@@ -365,11 +380,14 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
  }, []);

  useEffect(() => {
-    const previousJobId = cachedJobIdRef.current;
+    // Clear old cached job when job ID changes
+    const previousJobId = previousCachedJobIdRef.current;
    if (previousJobId && previousJobId !== cachedJobId) {
+      console.log(`[PdfTextEditor] Clearing old cache for jobId: ${previousJobId}, new jobId: ${cachedJobId}`);
      clearCachedJob(previousJobId);
    }
-    cachedJobIdRef.current = cachedJobId;
+    // Update the previous jobId ref for next time
+    previousCachedJobIdRef.current = cachedJobId;
  }, [cachedJobId, clearCachedJob]);

  const initializePdfPreview = useCallback(
@@ -489,6 +507,11 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
        );
      } catch (error) {
        console.error(`[loadImagesForPage] Failed to load images for page ${pageNumber}:`, error);
+        if (isCacheUnavailableError(error)) {
+          console.log('[loadImagesForPage] Cache expired, triggering automatic recovery...');
+          // Automatically recover by reloading the file
+          void recoverCacheAndReloadRef.current();
+        }
      } finally {
        loadingImagePagesRef.current.delete(pageIndex);
        setLoadingImagePages((prev) => {
@@ -498,7 +521,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
        });
      }
    },
-    [isLazyMode, cachedJobId],
+    [isLazyMode, cachedJobId, isCacheUnavailableError],
  );

  const handleLoadFile = useCallback(
@@ -507,6 +530,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
        return;
      }

+      lastLoadedFileRef.current = file;
      const requestId = loadRequestIdRef.current + 1;
      loadRequestIdRef.current = requestId;

@@ -555,59 +579,35 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
            message: 'Starting conversion...',
          });

-          let jobComplete = false;
-          let attempts = 0;
-          const maxAttempts = 600;
+        let jobComplete = false;
+        let attempts = 0;
+        const maxAttempts = 600;
+        let pollDelay = 500;

-          while (!jobComplete && attempts < maxAttempts) {
-            await new Promise((resolve) => setTimeout(resolve, 1000));
-            attempts += 1;
+        while (!jobComplete && attempts < maxAttempts) {
+          await new Promise((resolve) => setTimeout(resolve, pollDelay));
+          attempts += 1;
+          if (pollDelay < 10000) {
+            pollDelay = Math.min(10000, Math.floor(pollDelay * 1.5));
+          }

            try {
              const statusResponse = await apiClient.get(`/api/v1/general/job/${jobId}`);
              const jobStatus = statusResponse.data;
              console.log(`Job status (attempt ${attempts}):`, jobStatus);

-              if (jobStatus.notes && jobStatus.notes.length > 0) {
-                const lastNote = jobStatus.notes[jobStatus.notes.length - 1];
-                console.log('Latest note:', lastNote);
-                const matchWithCount = lastNote.match(
-                  /\[(\d+)%\]\s+(\w+):\s+(.+?)\s+\((\d+)\/(\d+)\)/,
-                );
-                if (matchWithCount) {
-                  const percent = parseInt(matchWithCount[1], 10);
-                  const stage = matchWithCount[2];
-                  const message = matchWithCount[3];
-                  const current = parseInt(matchWithCount[4], 10);
-                  const total = parseInt(matchWithCount[5], 10);
-                  setConversionProgress({
-                    percent,
-                    stage,
-                    message,
-                    current,
-                    total,
-                  });
-                } else {
-                  const match = lastNote.match(/\[(\d+)%\]\s+(\w+):\s+(.+)/);
-                  if (match) {
-                    const percent = parseInt(match[1], 10);
-                    const stage = match[2];
-                    const message = match[3];
-                    setConversionProgress({
-                      percent,
-                      stage,
-                      message,
-                    });
-                  }
-                }
-              } else if (jobStatus.progress !== undefined) {
-                const percent = Math.min(Math.max(jobStatus.progress, 0), 100);
-                setConversionProgress({
-                  percent,
-                  stage: jobStatus.stage || 'processing',
-                  message: jobStatus.note || 'Converting PDF to JSON...',
-                });
-              }
+              const percent = Math.min(Math.max(jobStatus.progress ?? 0, 0), 100);
+              const stage = jobStatus.stage || 'processing';
+              const message = jobStatus.note || 'Converting PDF to JSON...';
+              const current = jobStatus.current ?? undefined;
+              const total = jobStatus.total ?? undefined;
+              setConversionProgress({
+                percent,
+                stage,
+                message,
+                current,
+                total,
+              });

              if (jobStatus.complete) {
                if (jobStatus.error) {
@@ -701,7 +701,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
        setLoadedDocument(parsed);
        resetToDocument(parsed, groupingMode);
        setIsLazyMode(shouldUseLazyMode);
-        setCachedJobId(shouldUseLazyMode ? pendingJobId : null);
+        const newJobId = shouldUseLazyMode ? pendingJobId : null;
+        setCachedJobId(newJobId);
+        cachedJobIdRef.current = newJobId;
        setFileName(file.name);
        setErrorMessage(null);
      } catch (error: any) {
@@ -719,6 +721,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
        setLoadedDocument(null);
        resetToDocument(null, groupingMode);
        clearPdfPreview();
+        setIsLazyMode(false);
+        setCachedJobId(null);
+        cachedJobIdRef.current = null;

        if (isPdf) {
          const errorMsg =
@@ -743,6 +748,38 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
    [groupingMode, resetToDocument, t],
  );

+  const recoverCacheAndReload = useCallback(async () => {
+    if (cacheRecoveryInProgressRef.current) {
+      return false;
+    }
+    if (cacheRecoveryAttemptsRef.current >= 2) {
+      console.warn('[PdfTextEditor] Cache recovery limit reached');
+      return false;
+    }
+    cacheRecoveryAttemptsRef.current += 1;
+    const file = lastLoadedFileRef.current;
+    if (!file) {
+      console.warn('[PdfTextEditor] No file available for cache recovery');
+      return false;
+    }
+    cacheRecoveryInProgressRef.current = true;
+    try {
+      console.log('[PdfTextEditor] Automatically reloading file due to cache expiration...');
+      await handleLoadFile(file);
+      console.log('[PdfTextEditor] Cache recovery successful');
+      return true;
+    } catch (error) {
+      console.error('[PdfTextEditor] Cache recovery failed', error);
+      return false;
+    } finally {
+      cacheRecoveryInProgressRef.current = false;
+    }
+  }, [handleLoadFile]);
+
+  useEffect(() => {
+    recoverCacheAndReloadRef.current = recoverCacheAndReload;
+  }, [recoverCacheAndReload]);
+
  // Wrapper for loading files from the dropzone - adds to workbench first
  const handleLoadFileFromDropzone = useCallback(
    async (file: File) => {
@@ -1057,7 +1094,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
        try {
          const payload = buildPayload();
          if (!payload) {
-            return;
+            throw new Error('Failed to build payload');
          }

          const { document, filename } = payload;
@@ -1076,7 +1113,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
          const baseName = sanitizeBaseName(filename).replace(/-edited$/u, '');
          const expectedName = `${baseName || 'document'}.pdf`;
          const response = await apiClient.post(
-            `/api/v1/convert/pdf/text-editor/partial/${cachedJobId}?filename=${encodeURIComponent(expectedName)}`,
+            `/api/v1/convert/pdf/text-editor/partial/${cachedJobIdRef.current}?filename=${encodeURIComponent(expectedName)}`,
            partialDocument,
            {
              responseType: 'blob',
@@ -1100,6 +1137,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
            '[handleGeneratePdf] Incremental export failed, falling back to full export',
            incrementalError,
          );
+          // Fall through to full export below
        }
      }

@@ -1636,6 +1674,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
    }, 0);
  }, [navigationActions, navigationState.selectedTool]);

+  // Register workbench view (re-runs when dependencies change)
  useEffect(() => {
    registerCustomWorkbenchView({
      id: WORKBENCH_VIEW_ID,
@@ -1646,24 +1685,30 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
    });
    setLeftPanelView('hidden');
    setCustomWorkbenchViewData(WORKBENCH_VIEW_ID, latestViewDataRef.current);
-
-    return () => {
-      // Clear backend cache if we were using lazy loading
-      clearCachedJob(cachedJobIdRef.current);
-      clearCustomWorkbenchViewData(WORKBENCH_VIEW_ID);
-      unregisterCustomWorkbenchView(WORKBENCH_VIEW_ID);
-      setLeftPanelView('toolPicker');
-    };
  }, [
-    clearCachedJob,
-    clearCustomWorkbenchViewData,
    registerCustomWorkbenchView,
    setCustomWorkbenchViewData,
    setLeftPanelView,
    viewLabel,
-    unregisterCustomWorkbenchView,
  ]);

+  // Cleanup ONLY on component unmount (not on re-renders)
+  useEffect(() => {
+    return () => {
+      // Clear backend cache when leaving the tool
+      const jobId = cachedJobIdRef.current;
+      if (jobId) {
+        console.log(`[PdfTextEditor] Cleaning up cached document on unmount: ${jobId}`);
+        apiClient.post(`/api/v1/convert/pdf/text-editor/clear-cache/${jobId}`).catch((error) => {
+          console.warn('[PdfTextEditor] Failed to clear cache on unmount:', error);
+        });
+      }
+      clearCustomWorkbenchViewData(WORKBENCH_VIEW_ID);
+      unregisterCustomWorkbenchView(WORKBENCH_VIEW_ID);
+      setLeftPanelView('toolPicker');
+    };
+  }, []); // Empty deps = cleanup only on unmount
+
  // Note: Compare tool doesn't auto-force workbench, and neither should we
  // The workbench should be set when the tool is selected via proper channels
  // (tool registry, tool picker, etc.) - not forced here
@@ -343,7 +343,7 @@ describe('SpringAuthClient', () => {
      });

      const result = await springAuth.signInWithOAuth({
-        provider: 'github',
+        provider: '/oauth2/authorization/github',
        options: { redirectTo: '/auth/callback' },
      });

@@ -250,11 +250,11 @@ class SpringAuthClient {
  }

  /**
-   * Sign in with OAuth provider (GitHub, Google, Authentik, etc.)
-   * This redirects to the Spring OAuth2 authorization endpoint
+   * Sign in with OAuth/SAML provider (GitHub, Google, Authentik, etc.)
+   * This redirects to the Spring OAuth2/SAML2 authorization endpoint
   *
-   * @param params.provider - OAuth provider ID (e.g., 'github', 'google', 'authentik', 'mycompany')
-   *                          Can be any known provider or custom string - the backend determines available providers
+   * @param params.provider - Full auth path from backend (e.g., '/oauth2/authorization/google', '/saml2/authenticate/stirling')
+   *                          The backend provides the complete path including the auth type and provider ID
   */
  async signInWithOAuth(params: {
    provider: OAuthProvider;
@@ -264,15 +264,16 @@ class SpringAuthClient {
      const redirectPath = normalizeRedirectPath(params.options?.redirectTo);
      persistRedirectPath(redirectPath);

-      // Redirect to Spring OAuth2 endpoint (Vite will proxy to backend)
-      const redirectUrl = `/oauth2/authorization/${params.provider}`;
-      // console.log('[SpringAuth] Redirecting to OAuth:', redirectUrl);
+      // Use the full path provided by the backend
+      // This supports both OAuth2 (/oauth2/authorization/...) and SAML2 (/saml2/authenticate/...)
+      const redirectUrl = params.provider;
+      // console.log('[SpringAuth] Redirecting to SSO:', redirectUrl);
      // Use window.location.assign for full page navigation
      window.location.assign(redirectUrl);
      return { error: null };
    } catch (error) {
      return {
-        error: { message: error instanceof Error ? error.message : 'OAuth redirect failed' },
+        error: { message: error instanceof Error ? error.message : 'SSO redirect failed' },
      };
    }
  }
@@ -295,9 +295,9 @@ describe('Login', () => {
    await user.click(oauthButton);

    await waitFor(() => {
-      // Should use 'authentik' directly, NOT map to 'oidc'
+      // Should use full path directly, NOT map to 'oidc'
      expect(springAuth.signInWithOAuth).toHaveBeenCalledWith({
-        provider: 'authentik',
+        provider: '/oauth2/authorization/authentik',
        options: { redirectTo: '/auth/callback' }
      });
    });
@@ -338,10 +338,10 @@ describe('Login', () => {
    await user.click(oauthButton);

    await waitFor(() => {
-      // Should use 'mycompany' directly - this is the critical fix
+      // Should use full path directly - this is the critical fix
      // Previously it would map unknown providers to 'oidc'
      expect(springAuth.signInWithOAuth).toHaveBeenCalledWith({
-        provider: 'mycompany',
+        provider: '/oauth2/authorization/mycompany',
        options: { redirectTo: '/auth/callback' }
      });
    });
@@ -382,9 +382,9 @@ describe('Login', () => {
    await user.click(oauthButton);

    await waitFor(() => {
-      // Should use 'oidc' when explicitly configured
+      // Should use full path when explicitly configured
      expect(springAuth.signInWithOAuth).toHaveBeenCalledWith({
-        provider: 'oidc',
+        provider: '/oauth2/authorization/oidc',
        options: { redirectTo: '/auth/callback' }
      });
    });
@@ -109,13 +109,12 @@ export default function Login() {
          updateSupportedLanguages(data.languages, data.defaultLocale);
        }

-        // Extract provider IDs from the providerList map
-        // The keys are like "/oauth2/authorization/google" - extract the last part
-        const providerIds = Object.keys(data.providerList || {})
-          .map(key => key.split('/').pop())
-          .filter((id): id is string => id !== undefined);
+        // Use the full paths from providerList as provider identifiers
+        // The backend provides paths like "/oauth2/authorization/google" or "/saml2/authenticate/stirling"
+        // We'll use these full paths so the auth client knows where to redirect
+        const providerPaths = Object.keys(data.providerList || {});

-        setEnabledProviders(providerIds);
+        setEnabledProviders(providerPaths);
      } catch (err) {
        console.error('[Login] Failed to fetch enabled providers:', err);
      }
@@ -26,7 +26,7 @@ interface OAuthButtonsProps {
  onProviderClick: (provider: OAuthProvider) => void
  isSubmitting: boolean
  layout?: 'vertical' | 'grid' | 'icons'
-  enabledProviders?: OAuthProvider[]  // List of enabled provider IDs from backend
+  enabledProviders?: OAuthProvider[]  // List of full auth paths from backend (e.g., '/oauth2/authorization/google', '/saml2/authenticate/stirling')
 }

 export default function OAuthButtons({ onProviderClick, isSubmitting, layout = 'vertical', enabledProviders = [] }: OAuthButtonsProps) {
@@ -37,19 +37,24 @@ export default function OAuthButtons({ onProviderClick, isSubmitting, layout = '
    ? Object.keys(oauthProviderConfig)
    : enabledProviders;

-  // Build provider list - use provider ID to determine icon and label
-  const providers = providersToShow.map(id => {
-    if (id in oauthProviderConfig) {
+  // Build provider list - extract provider ID from full path for display
+  const providers = providersToShow.map(pathOrId => {
+    // Extract provider ID from full path (e.g., '/saml2/authenticate/stirling' -> 'stirling')
+    const providerId = pathOrId.split('/').pop() || pathOrId;
+
+    if (providerId in oauthProviderConfig) {
      // Known provider - use predefined icon and label
      return {
-        id,
-        ...oauthProviderConfig[id]
+        id: pathOrId,  // Keep full path for redirect
+        providerId,    // Store extracted ID for display lookup
+        ...oauthProviderConfig[providerId]
      };
    }
    // Unknown provider - use generic icon and capitalize ID for label
    return {
-      id,
-      label: id.charAt(0).toUpperCase() + id.slice(1),
+      id: pathOrId,  // Keep full path for redirect
+      providerId,    // Store extracted ID for display lookup
+      label: providerId.charAt(0).toUpperCase() + providerId.slice(1),
      file: GENERIC_PROVIDER_ICON
    };
  });
@@ -55,12 +55,24 @@ export default defineConfig(({ mode }) => {
          secure: false,
          xfwd: true,
        },
+        '/saml2': {
+          target: 'http://localhost:8080',
+          changeOrigin: true,
+          secure: false,
+          xfwd: true,
+        },
        '/login/oauth2': {
          target: 'http://localhost:8080',
          changeOrigin: true,
          secure: false,
          xfwd: true,
        },
+        '/login/saml2': {
+          target: 'http://localhost:8080',
+          changeOrigin: true,
+          secure: false,
+          xfwd: true,
+        },
        '/swagger-ui': {
          target: 'http://localhost:8080',
          changeOrigin: true,