chore: update embeds for v2 envelopes

2025-11-17 18:21:32 +10:00 · 2025-11-06 23:43:41 +11:00
parent f72cabf5ca
commit c40471281a
23 changed files with 1271 additions and 375 deletions
--- a/apps/remix/app/components/general/document-signing/document-signing-complete-dialog.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-complete-dialog.tsx
@ -34,6 +34,7 @@ import {
 } from '@documenso/ui/primitives/form/form';
 import { Input } from '@documenso/ui/primitives/input';

+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';
 import { AccessAuth2FAForm } from '~/components/general/document-signing/access-auth-2fa-form';
 import { DocumentSigningDisclosure } from '~/components/general/document-signing/document-signing-disclosure';

@ -102,6 +103,8 @@ export const DocumentSigningCompleteDialog = ({

  const { derivedRecipientAccessAuth } = useRequiredDocumentSigningAuthContext();

+  const { isNameLocked, isEmailLocked } = useEmbedSigningContext() || {};
+
  const form = useForm<TNextSignerFormSchema>({
    resolver: allowDictateNextSigner ? zodResolver(ZNextSignerFormSchema) : undefined,
    defaultValues: {
@ -267,7 +270,12 @@ export const DocumentSigningCompleteDialog = ({
                              <Trans>Your Name</Trans>
                            </FormLabel>
                            <FormControl>
-                              <Input {...field} className="mt-2" placeholder={t`Enter your name`} />
+                              <Input
+                                {...field}
+                                className="mt-2"
+                                placeholder={t`Enter your name`}
+                                disabled={isNameLocked}
+                              />
                            </FormControl>

                            <FormMessage />
@ -289,6 +297,7 @@ export const DocumentSigningCompleteDialog = ({
                                type="email"
                                className="mt-2"
                                placeholder={t`Enter your email`}
+                                disabled={!!field.value && isEmailLocked}
                              />
                            </FormControl>
                            <FormMessage />
--- a/apps/remix/app/components/general/document-signing/document-signing-mobile-widget.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-mobile-widget.tsx
@ -8,6 +8,9 @@ import { match } from 'ts-pattern';

 import { Button } from '@documenso/ui/primitives/button';

+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';
+
+import { BrandingLogo } from '../branding-logo';
 import EnvelopeSignerForm from '../envelope-signing/envelope-signer-form';
 import { EnvelopeSignerCompleteDialog } from '../envelope-signing/envelope-signing-complete-dialog';
 import { useRequiredEnvelopeSigningContext } from './envelope-signing-provider';
@ -15,6 +18,8 @@ import { useRequiredEnvelopeSigningContext } from './envelope-signing-provider';
 export const DocumentSigningMobileWidget = () => {
  const [isExpanded, setIsExpanded] = useState(false);

+  const { hidePoweredBy = true } = useEmbedSigningContext() || {};
+
  const { recipientFieldsRemaining, recipient, requiredRecipientFields } =
    useRequiredEnvelopeSigningContext();

@ -29,7 +34,7 @@ export const DocumentSigningMobileWidget = () => {

  return (
    <div className="pointer-events-none fixed bottom-0 left-0 right-0 z-50 flex justify-center px-2 pb-2 sm:px-4 sm:pb-6">
-      <div className="pointer-events-auto w-full max-w-2xl">
+      <div className="pointer-events-auto w-full max-w-[760px]">
        <div className="bg-card border-border overflow-hidden rounded-xl border shadow-2xl">
          {/* Main Header Bar */}
          <div className="flex items-center justify-between gap-4 p-4">
@ -114,6 +119,13 @@ export const DocumentSigningMobileWidget = () => {
          {isExpanded && (
            <div className="border-border animate-in slide-in-from-bottom-2 border-t p-4 duration-200">
              <EnvelopeSignerForm />
+
+              {!hidePoweredBy && (
+                <div className="bg-primary text-primary-foreground mt-2 inline-block rounded px-2 py-1 text-xs font-medium opacity-60 hover:opacity-100 lg:hidden">
+                  <span>Powered by</span>
+                  <BrandingLogo className="ml-2 inline-block h-[14px]" />
+                </div>
+              )}
            </div>
          )}
        </div>
--- a/apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
+++ b/apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
@ -22,7 +22,9 @@ import { SignFieldNameDialog } from '~/components/dialogs/sign-field-name-dialog
 import { SignFieldNumberDialog } from '~/components/dialogs/sign-field-number-dialog';
 import { SignFieldSignatureDialog } from '~/components/dialogs/sign-field-signature-dialog';
 import { SignFieldTextDialog } from '~/components/dialogs/sign-field-text-dialog';
+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';

+import { BrandingLogo } from '../branding-logo';
 import { DocumentSigningAttachmentsPopover } from '../document-signing/document-signing-attachments-popover';
 import { EnvelopeItemSelector } from '../envelope-editor/envelope-file-selector';
 import EnvelopeSignerForm from '../envelope-signing/envelope-signer-form';
@ -48,6 +50,13 @@ export const DocumentSigningPageViewV2 = () => {
    selectedAssistantRecipientFields,
  } = useRequiredEnvelopeSigningContext();

+  const {
+    isEmbed = false,
+    allowDocumentRejection = true,
+    hidePoweredBy = true,
+    onDocumentRejected,
+  } = useEmbedSigningContext() || {};
+
  /**
   * The total remaining fields remaining for the current recipient or selected assistant recipient.
   *
@ -77,7 +86,7 @@ export const DocumentSigningPageViewV2 = () => {
      {/* Main Content Area */}
      <div className="flex h-[calc(100vh-4rem)] w-screen">
        {/* Left Section - Step Navigation */}
-        <div className="bg-background border-border hidden w-80 flex-shrink-0 flex-col overflow-y-auto border-r py-4 lg:flex">
+        <div className="embed--DocumentWidgetContainer bg-background border-border hidden w-80 flex-shrink-0 flex-col overflow-y-auto border-r py-4 lg:flex">
          <div className="px-4">
            <h3 className="text-foreground flex items-end justify-between text-sm font-semibold">
              {match(recipient.role)
@ -107,7 +116,7 @@ export const DocumentSigningPageViewV2 = () => {
              />
            </div>

-            <div className="mt-6 space-y-3">
+            <div className="embed--DocumentWidgetContent mt-6 space-y-3">
              <EnvelopeSignerForm />
            </div>
          </div>
@ -116,7 +125,7 @@ export const DocumentSigningPageViewV2 = () => {

          {/* Quick Actions. */}
          {!isDirectTemplate && (
-            <div className="space-y-3 px-4">
+            <div className="embed--Actions space-y-3 px-4">
              <h4 className="text-foreground text-sm font-semibold">
                <Trans>Actions</Trans>
              </h4>
@ -145,10 +154,21 @@ export const DocumentSigningPageViewV2 = () => {
                }
              />

-              {envelope.type === EnvelopeType.DOCUMENT && (
+              {envelope.type === EnvelopeType.DOCUMENT && allowDocumentRejection && (
                <DocumentSigningRejectDialog
                  documentId={mapSecondaryIdToDocumentId(envelope.secondaryId)}
                  token={recipient.token}
+                  onRejected={
+                    onDocumentRejected &&
+                    ((reason) =>
+                      onDocumentRejected({
+                        token: recipient.token,
+                        documentId: mapSecondaryIdToDocumentId(envelope.secondaryId),
+                        envelopeId: envelope.id,
+                        recipientId: recipient.id,
+                        reason,
+                      }))
+                  }
                  trigger={
                    <Button
                      variant="ghost"
@ -164,18 +184,22 @@ export const DocumentSigningPageViewV2 = () => {
            </div>
          )}

-          {/* Footer of left sidebar. */}
-          <div className="mt-auto px-4">
-            <Button asChild variant="ghost" className="w-full justify-start">
-              <Link to="/">
-                <ArrowLeftIcon className="mr-2 h-4 w-4" />
-                <Trans>Return</Trans>
-              </Link>
-            </Button>
+          <div className="embed--DocumentWidgetFooter">
+            {/* Footer of left sidebar. */}
+            {!isEmbed && (
+              <div className="mt-auto px-4">
+                <Button asChild variant="ghost" className="w-full justify-start">
+                  <Link to="/">
+                    <ArrowLeftIcon className="mr-2 h-4 w-4" />
+                    <Trans>Return</Trans>
+                  </Link>
+                </Button>
+              </div>
+            )}
          </div>
        </div>

-        <div className="flex-1 overflow-y-auto">
+        <div className="embed--DocumentContainer flex-1 overflow-y-auto">
          <div className="flex flex-col">
            {/* Horizontal envelope item selector */}
            {envelopeItems.length > 1 && (
@ -202,7 +226,7 @@ export const DocumentSigningPageViewV2 = () => {
            )}

            {/* Document View */}
-            <div className="flex flex-col items-center justify-center p-2 sm:mt-4 sm:p-4">
+            <div className="embed--DocumentViewer flex flex-col items-center justify-center p-2 sm:mt-4 sm:p-4">
              {currentEnvelopeItem ? (
                <PDFViewerKonvaLazy
                  renderer="signing"
@ -218,9 +242,20 @@ export const DocumentSigningPageViewV2 = () => {
              )}

              {/* Mobile widget - Additional padding to allow users to scroll */}
-              <div className="block pb-16 lg:hidden">
+              <div className="block pb-28 lg:hidden">
                <DocumentSigningMobileWidget />
              </div>
+
+              {!hidePoweredBy && (
+                <a
+                  href="https://documenso.com"
+                  target="_blank"
+                  className="bg-primary text-primary-foreground fixed bottom-0 right-0 z-40 hidden cursor-pointer rounded-tl px-2 py-1 text-xs font-medium opacity-60 hover:opacity-100 lg:block"
+                >
+                  <span>Powered by</span>
+                  <BrandingLogo className="ml-2 inline-block h-[14px]" />
+                </a>
+              )}
            </div>
          </div>
        </div>
--- a/apps/remix/app/components/general/document-signing/envelope-signing-provider.tsx
+++ b/apps/remix/app/components/general/document-signing/envelope-signing-provider.tsx
@ -56,7 +56,7 @@ export type EnvelopeSigningContextValue = {
    _fieldId: number,
    _value: TSignEnvelopeFieldValue,
    authOptions?: TRecipientActionAuth,
-  ) => Promise<void>;
+  ) => Promise<Pick<Field, 'id' | 'inserted'>>;
 };

 const EnvelopeSigningContext = createContext<EnvelopeSigningContextValue | null>(null);
@ -296,16 +296,19 @@ export const EnvelopeSigningProvider = ({
  ) => {
    // Set the field locally for direct templates.
    if (isDirectTemplate) {
-      handleDirectTemplateFieldInsertion(fieldId, fieldValue);
-      return;
+      const signedField = handleDirectTemplateFieldInsertion(fieldId, fieldValue);
+
+      return signedField;
    }

-    await signEnvelopeField({
+    const { signedField } = await signEnvelopeField({
      token: envelopeData.recipient.token,
      fieldId,
      fieldValue,
      authOptions,
    });
+
+    return signedField;
  };

  const handleDirectTemplateFieldInsertion = (
@ -363,6 +366,8 @@ export const EnvelopeSigningProvider = ({
        fields: prev.recipient.fields.map((field) => (field.id === fieldId ? updatedField : field)),
      },
    }));
+
+    return updatedField;
  };

  return (
--- a/apps/remix/app/components/general/envelope-editor/envelope-file-selector.tsx
+++ b/apps/remix/app/components/general/envelope-editor/envelope-file-selector.tsx
@ -29,7 +29,7 @@ export const EnvelopeItemSelector = ({
      {...buttonProps}
    >
      <div
-        className={`flex h-6 w-6 items-center justify-center rounded-full text-xs font-medium ${
+        className={`flex h-6 w-6 flex-shrink-0 items-center justify-center rounded-full text-xs font-medium ${
          isSelected ? 'bg-green-100 text-green-600' : 'bg-gray-200 text-gray-600'
        }`}
      >
--- a/apps/remix/app/components/general/envelope-signing/envelope-signer-form.tsx
+++ b/apps/remix/app/components/general/envelope-signing/envelope-signer-form.tsx
@ -8,6 +8,8 @@ import { Label } from '@documenso/ui/primitives/label';
 import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
 import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';

+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';
+
 import { useRequiredEnvelopeSigningContext } from '../document-signing/envelope-signing-provider';

 export default function EnvelopeSignerForm() {
@ -25,6 +27,8 @@ export default function EnvelopeSignerForm() {
    setSelectedAssistantRecipientId,
  } = useRequiredEnvelopeSigningContext();

+  const { isNameLocked, isEmailLocked } = useEmbedSigningContext() || {};
+
  const hasSignatureField = useMemo(() => {
    return recipientFields.some((field) => field.type === FieldType.SIGNATURE);
  }, [recipientFields]);
@ -37,7 +41,7 @@ export default function EnvelopeSignerForm() {

  if (recipient.role === RecipientRole.ASSISTANT) {
    return (
-      <fieldset className="dark:bg-background border-border rounded-2xl sm:border sm:p-3">
+      <fieldset className="embed--DocumentWidgetForm dark:bg-background border-border rounded-2xl sm:border sm:p-3">
        <RadioGroup
          className="gap-0 space-y-2 shadow-none sm:space-y-3"
          value={selectedAssistantRecipient?.id?.toString()}
@ -101,7 +105,8 @@ export default function EnvelopeSignerForm() {
            id="full-name"
            className="bg-background mt-2"
            value={fullName}
-            onChange={(e) => setFullName(e.target.value.trimStart())}
+            disabled={isNameLocked}
+            onChange={(e) => !isNameLocked && setFullName(e.target.value.trimStart())}
          />
        </div>

--- a/apps/remix/app/components/general/envelope-signing/envelope-signer-header.tsx
+++ b/apps/remix/app/components/general/envelope-signing/envelope-signer-header.tsx
@ -16,6 +16,7 @@ import {
 import { Separator } from '@documenso/ui/primitives/separator';

 import { EnvelopeDownloadDialog } from '~/components/dialogs/envelope-download-dialog';
+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';
 import { BrandingLogo } from '~/components/general/branding-logo';

 import { BrandingLogoIcon } from '../branding-logo-icon';
@ -28,7 +29,7 @@ export const EnvelopeSignerHeader = () => {
    useRequiredEnvelopeSigningContext();

  return (
-    <nav className="bg-background border-border max-w-screen flex flex-row justify-between border-b px-4 py-3 md:px-6">
+    <nav className="embed--DocumentWidgetHeader bg-background border-border max-w-screen flex flex-row justify-between border-b px-4 py-3 md:px-6">
      {/* Left side - Logo and title */}
      <div className="flex min-w-0 flex-1 items-center space-x-2 md:w-auto md:flex-none">
        <Link to="/" className="flex-shrink-0">
@ -72,7 +73,7 @@ export const EnvelopeSignerHeader = () => {
      </div>

      {/* Right side - Desktop content */}
-      <div className="hidden items-center space-x-2 md:flex">
+      <div className="hidden items-center space-x-2 lg:flex">
        <p className="text-muted-foreground mr-2 flex-shrink-0 text-sm">
          <Plural
            one="1 Field Remaining"
@ -85,7 +86,7 @@ export const EnvelopeSignerHeader = () => {
      </div>

      {/* Mobile Actions button */}
-      <div className="flex-shrink-0 md:hidden">
+      <div className="flex-shrink-0 lg:hidden">
        <MobileDropdownMenu />
      </div>
    </nav>
@ -95,6 +96,8 @@ export const EnvelopeSignerHeader = () => {
 const MobileDropdownMenu = () => {
  const { envelope, recipient } = useRequiredEnvelopeSigningContext();

+  const { allowDocumentRejection } = useEmbedSigningContext() || {};
+
  return (
    <DropdownMenu>
      <DropdownMenuTrigger asChild>
@ -119,7 +122,7 @@ const MobileDropdownMenu = () => {
          }
        />

-        {envelope.type === EnvelopeType.DOCUMENT && (
+        {envelope.type === EnvelopeType.DOCUMENT && allowDocumentRejection !== false && (
          <DocumentSigningRejectDialog
            documentId={mapSecondaryIdToDocumentId(envelope.secondaryId)}
            token={recipient.token}
--- a/apps/remix/app/components/general/envelope-signing/envelope-signer-page-renderer.tsx
+++ b/apps/remix/app/components/general/envelope-signing/envelope-signer-page-renderer.tsx
@ -10,6 +10,7 @@ import { usePageRenderer } from '@documenso/lib/client-only/hooks/use-page-rende
 import { useCurrentEnvelopeRender } from '@documenso/lib/client-only/providers/envelope-render-provider';
 import { useOptionalSession } from '@documenso/lib/client-only/providers/session';
 import { DIRECT_TEMPLATE_RECIPIENT_EMAIL } from '@documenso/lib/constants/direct-templates';
+import { isBase64Image } from '@documenso/lib/constants/signatures';
 import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import { ZFullFieldSchema } from '@documenso/lib/types/field';
 import { createSpinner } from '@documenso/lib/universal/field-renderer/field-generic-items';
@ -22,6 +23,7 @@ import { EnvelopeFieldToolTip } from '@documenso/ui/components/field/envelope-fi
 import type { TRecipientColor } from '@documenso/ui/lib/recipient-colors';
 import { useToast } from '@documenso/ui/primitives/use-toast';

+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';
 import { handleCheckboxFieldClick } from '~/utils/field-signing/checkbox-field';
 import { handleDropdownFieldClick } from '~/utils/field-signing/dropdown-field';
 import { handleEmailFieldClick } from '~/utils/field-signing/email-field';
@ -60,6 +62,8 @@ export default function EnvelopeSignerPageRenderer() {
    isDirectTemplate,
  } = useRequiredEnvelopeSigningContext();

+  const { onFieldSigned, onFieldUnsigned } = useEmbedSigningContext() || {};
+
  const {
    stage,
    pageLayer,
@ -378,7 +382,19 @@ export default function EnvelopeSignerPageRenderer() {
    authOptions?: TRecipientActionAuth,
  ) => {
    try {
-      await signFieldInternal(fieldId, payload, authOptions);
+      const { inserted } = await signFieldInternal(fieldId, payload, authOptions);
+
+      // ?: The two callbacks below are used within the embedding context
+      if (inserted && onFieldSigned) {
+        const value = payload.value ? JSON.stringify(payload.value) : undefined;
+        const isBase64 = value ? isBase64Image(value) : undefined;
+
+        onFieldSigned({ fieldId, value, isBase64 });
+      }
+
+      if (!inserted && onFieldUnsigned) {
+        onFieldUnsigned({ fieldId });
+      }
    } catch (err) {
      console.error(err);

--- a/apps/remix/app/components/general/envelope-signing/envelope-signing-complete-dialog.tsx
+++ b/apps/remix/app/components/general/envelope-signing/envelope-signing-complete-dialog.tsx
@ -2,16 +2,19 @@ import { useMemo } from 'react';

 import { useLingui } from '@lingui/react/macro';
 import { FieldType } from '@prisma/client';
-import { useNavigate, useSearchParams } from 'react-router';
+import { useNavigate, useRevalidator, useSearchParams } from 'react-router';

 import { useAnalytics } from '@documenso/lib/client-only/hooks/use-analytics';
 import { useCurrentEnvelopeRender } from '@documenso/lib/client-only/providers/envelope-render-provider';
 import { isBase64Image } from '@documenso/lib/constants/signatures';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import type { TRecipientAccessAuth } from '@documenso/lib/types/document-auth';
 import { mapSecondaryIdToDocumentId } from '@documenso/lib/utils/envelope';
 import { trpc } from '@documenso/trpc/react';
 import { useToast } from '@documenso/ui/primitives/use-toast';

+import { useEmbedSigningContext } from '~/components/embed/embed-signing-context';
+
 import { DocumentSigningCompleteDialog } from '../document-signing/document-signing-complete-dialog';
 import { useRequiredEnvelopeSigningContext } from '../document-signing/envelope-signing-provider';

@ -19,8 +22,9 @@ export const EnvelopeSignerCompleteDialog = () => {
  const navigate = useNavigate();
  const analytics = useAnalytics();

-  const { toast } = useToast();
  const { t } = useLingui();
+  const { toast } = useToast();
+  const { revalidate } = useRevalidator();

  const [searchParams] = useSearchParams();

@ -37,6 +41,8 @@ export const EnvelopeSignerCompleteDialog = () => {

  const { currentEnvelopeItem, setCurrentEnvelopeItem } = useCurrentEnvelopeRender();

+  const { onDocumentCompleted, onDocumentError } = useEmbedSigningContext() || {};
+
  const { mutateAsync: completeDocument, isPending } =
    trpc.recipient.completeDocumentWithToken.useMutation();

@ -68,25 +74,54 @@ export const EnvelopeSignerCompleteDialog = () => {
    nextSigner?: { name: string; email: string },
    accessAuthOptions?: TRecipientAccessAuth,
  ) => {
-    const payload = {
-      token: recipient.token,
-      documentId: mapSecondaryIdToDocumentId(envelope.secondaryId),
-      authOptions: accessAuthOptions,
-      ...(nextSigner?.email && nextSigner?.name ? { nextSigner } : {}),
-    };
+    try {
+      const payload = {
+        token: recipient.token,
+        documentId: mapSecondaryIdToDocumentId(envelope.secondaryId),
+        authOptions: accessAuthOptions,
+        ...(nextSigner?.email && nextSigner?.name ? { nextSigner } : {}),
+      };

-    await completeDocument(payload);
+      await completeDocument(payload);

-    analytics.capture('App: Recipient has completed signing', {
-      signerId: recipient.id,
-      documentId: envelope.id,
-      timestamp: new Date().toISOString(),
-    });
+      analytics.capture('App: Recipient has completed signing', {
+        signerId: recipient.id,
+        documentId: envelope.id,
+        timestamp: new Date().toISOString(),
+      });

-    if (envelope.documentMeta.redirectUrl) {
-      window.location.href = envelope.documentMeta.redirectUrl;
-    } else {
-      await navigate(`/sign/${recipient.token}/complete`);
+      if (onDocumentCompleted) {
+        onDocumentCompleted({
+          token: recipient.token,
+          documentId: mapSecondaryIdToDocumentId(envelope.secondaryId),
+          recipientId: recipient.id,
+          envelopeId: envelope.id,
+        });
+
+        await revalidate();
+
+        return;
+      }
+
+      if (envelope.documentMeta.redirectUrl) {
+        window.location.href = envelope.documentMeta.redirectUrl;
+      } else {
+        await navigate(`/sign/${recipient.token}/complete`);
+      }
+    } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code !== AppErrorCode.TWO_FACTOR_AUTH_FAILED) {
+        toast({
+          title: t`Something went wrong`,
+          description: t`We were unable to submit this document at this time. Please try again later.`,
+          variant: 'destructive',
+        });
+
+        onDocumentError?.();
+      }
+
+      throw err;
    }
  };

@ -105,8 +140,12 @@ export const EnvelopeSignerCompleteDialog = () => {
        directTemplateExternalId = decodeURIComponent(directTemplateExternalId);
      }

+      if (!recipient.directToken) {
+        throw new Error('Recipient direct token is required');
+      }
+
      const { token } = await createDocumentFromDirectTemplate({
-        directTemplateToken: recipient.token, // The direct template token is inserted into the recipient token for ease of use.
+        directTemplateToken: recipient.directToken, // The direct template token is inserted into the recipient token for ease of use.
        directTemplateExternalId,
        directRecipientName: recipientDetails?.name || fullName,
        directRecipientEmail: recipientDetails?.email || email,
@ -132,18 +171,31 @@ export const EnvelopeSignerCompleteDialog = () => {

      const redirectUrl = envelope.documentMeta.redirectUrl;

+      if (onDocumentCompleted) {
+        await navigate({
+          pathname: `/embed/sign/${token}`,
+          search: window.location.search,
+          hash: window.location.hash,
+        });
+
+        return;
+      }
+
      if (redirectUrl) {
        window.location.href = redirectUrl;
      } else {
        await navigate(`/sign/${token}/complete`);
      }
    } catch (err) {
+      console.log('err', err);
      toast({
        title: t`Something went wrong`,
-        description: t`We were unable to submit this document at this time. Please try again later.`,
+        description: t`Weeeeeeee were unable to submit this document at this time. Please try again later.`,
        variant: 'destructive',
      });

+      onDocumentError?.();
+
      throw err;
    }
  };