From 45b434dd996da7b5314c59b28e295c6aafcd5550 Mon Sep 17 00:00:00 2001
From: Sacha Al Himdani <sacha@probo.com>
Date: Wed, 24 Jun 2026 11:31:50 +0200
Subject: [PATCH] Redirect employee to tab list for missing documents

When an email link points to an employee signature or approval document
that has been deleted or is no longer accessible to the user, the detail
pages rendered an infinite spinner. Redirect to the signatures/approvals
tab list instead, both when the document resolves to null and when it has
no accessible versions.

Signed-off-by: Sacha Al Himdani <sacha@probo.com>
---
 .../documents/approve/DocumentApprovePage.tsx | 19 +++++++++++++----
 .../EmployeeDocumentSignaturePage.tsx         | 21 ++++++++++++++-----
 2 files changed, 31 insertions(+), 9 deletions(-)

diff --git a/apps/console/src/pages/organizations/documents/approve/DocumentApprovePage.tsx b/apps/console/src/pages/organizations/documents/approve/DocumentApprovePage.tsx
index fc2e0a5ac..041378849 100644
--- a/apps/console/src/pages/organizations/documents/approve/DocumentApprovePage.tsx
+++ b/apps/console/src/pages/organizations/documents/approve/DocumentApprovePage.tsx
@@ -38,7 +38,7 @@ import {
   useMutation,
   usePreloadedQuery,
 } from "react-relay";
-import { useNavigate } from "react-router";
+import { Navigate, useNavigate } from "react-router";
 import { graphql } from "relay-runtime";
 import { useWindowSize } from "usehooks-ts";
 
@@ -142,6 +142,7 @@ export function DocumentApprovePage(props: {
   queryRef: PreloadedQuery<DocumentApprovePageQuery>;
 }) {
   const { queryRef } = props;
+  const organizationId = useOrganizationId();
   const data = usePreloadedQuery<DocumentApprovePageQuery>(
     documentApprovePageQuery,
     queryRef,
@@ -150,9 +151,10 @@ export function DocumentApprovePage(props: {
   const document = data.viewer.approvableDocument;
   if (!document) {
     return (
-      <div className="flex items-center justify-center h-full">
-        <Spinner />
-      </div>
+      <Navigate
+        to={`/organizations/${organizationId}/employee/approvals`}
+        replace
+      />
     );
   }
 
@@ -497,6 +499,15 @@ function DocumentApproveContent({
     };
   }, [selectedVersion?.id, exportPDF, toast, __]);
 
+  if (versions.length === 0) {
+    return (
+      <Navigate
+        to={`/organizations/${organizationId}/employee/approvals`}
+        replace
+      />
+    );
+  }
+
   return (
     <div className="fixed inset-0 top-12 bg-level-2 flex flex-col">
       <div className="grid lg:grid-cols-2 min-h-0 h-full">
diff --git a/apps/console/src/pages/organizations/employee/EmployeeDocumentSignaturePage.tsx b/apps/console/src/pages/organizations/employee/EmployeeDocumentSignaturePage.tsx
index 011c79d24..576b7173f 100644
--- a/apps/console/src/pages/organizations/employee/EmployeeDocumentSignaturePage.tsx
+++ b/apps/console/src/pages/organizations/employee/EmployeeDocumentSignaturePage.tsx
@@ -15,7 +15,7 @@
 import { formatError } from "@probo/helpers";
 import { usePageTitle } from "@probo/hooks";
 import { useTranslate } from "@probo/i18n";
-import { Card, Spinner, useToast } from "@probo/ui";
+import { Card, useToast } from "@probo/ui";
 import { useEffect, useRef, useState } from "react";
 import {
   type PreloadedQuery,
@@ -24,7 +24,7 @@ import {
   usePreloadedQuery,
 } from "react-relay";
 import { graphql } from "react-relay";
-import { useNavigate } from "react-router";
+import { Navigate, useNavigate } from "react-router";
 import { useWindowSize } from "usehooks-ts";
 
 import type { EmployeeDocumentSignaturePageDocumentFragment$key } from "#/__generated__/core/EmployeeDocumentSignaturePageDocumentFragment.graphql";
@@ -94,6 +94,7 @@ export function EmployeeDocumentSignaturePage(props: {
   queryRef: PreloadedQuery<EmployeeDocumentSignaturePageQuery>;
 }) {
   const { queryRef } = props;
+  const organizationId = useOrganizationId();
   const { viewer } = usePreloadedQuery<EmployeeDocumentSignaturePageQuery>(
     employeeDocumentSignaturePageQuery,
     queryRef,
@@ -102,9 +103,10 @@ export function EmployeeDocumentSignaturePage(props: {
 
   if (!document) {
     return (
-      <div className="flex items-center justify-center h-full">
-        <Spinner />
-      </div>
+      <Navigate
+        to={`/organizations/${organizationId}/employee/signatures`}
+        replace
+      />
     );
   }
 
@@ -232,6 +234,15 @@ function DocumentSignatureContent({
     };
   }, [selectedVersion?.id, exportEmployeeDocumentVersionPDF, toast, __]);
 
+  if (versions.length === 0) {
+    return (
+      <Navigate
+        to={`/organizations/${organizationId}/employee/signatures`}
+        replace
+      />
+    );
+  }
+
   return (
     <div
       className="fixed bg-level-2 flex flex-col"