mirror of
https://github.com/documenso/documenso.git
synced 2025-11-20 03:32:14 +10:00
feat: detect fields
This commit is contained in:
Ephraim Atta-Duncan
@ -1,7 +1,7 @@
|
||||
import { lazy, useEffect, useMemo, useState } from 'react';
|
||||
|
||||
import type { MessageDescriptor } from '@lingui/core';
|
||||
import { msg } from '@lingui/core/macro';
|
||||
import { msg, plural } from '@lingui/core/macro';
|
||||
import { Trans, useLingui } from '@lingui/react/macro';
|
||||
import { FieldType, RecipientRole } from '@prisma/client';
|
||||
import { FileTextIcon } from 'lucide-react';
|
||||
@ -54,7 +54,6 @@ const EnvelopeEditorFieldsPageRenderer = lazy(
|
||||
async () => import('./envelope-editor-fields-page-renderer'),
|
||||
);
|
||||
|
||||
// Expands fields to minimum usable dimensions (30px height, 36px width) and centers them
|
||||
const enforceMinimumFieldDimensions = (params: {
|
||||
positionX: number;
|
||||
positionY: number;
|
||||
@ -184,6 +183,7 @@ export const EnvelopeEditorFieldsPage = () => {
|
||||
current: number;
|
||||
total: number;
|
||||
} | null>(null);
|
||||
const [hasAutoPlacedFields, setHasAutoPlacedFields] = useState(false);
|
||||
|
||||
const selectedField = useMemo(
|
||||
() => structuredClone(editorFields.selectedField),
|
||||
@ -204,9 +204,6 @@ export const EnvelopeEditorFieldsPage = () => {
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the selected recipient to the first recipient in the envelope.
|
||||
*/
|
||||
useEffect(() => {
|
||||
const firstSelectableRecipient = envelope.recipients.find(
|
||||
(recipient) =>
|
||||
@ -216,16 +213,143 @@ export const EnvelopeEditorFieldsPage = () => {
|
||||
editorFields.setSelectedRecipient(firstSelectableRecipient?.id ?? null);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (hasAutoPlacedFields || !currentEnvelopeItem) {
|
||||
return;
|
||||
}
|
||||
|
||||
const storageKey = `autoPlaceFields_${envelope.id}`;
|
||||
const storedData = sessionStorage.getItem(storageKey);
|
||||
|
||||
if (!storedData) {
|
||||
return;
|
||||
}
|
||||
|
||||
sessionStorage.removeItem(storageKey);
|
||||
setHasAutoPlacedFields(true);
|
||||
|
||||
try {
|
||||
const { fields: detectedFields, recipientCount } = JSON.parse(storedData) as {
|
||||
fields: TDetectedFormField[];
|
||||
recipientCount: number;
|
||||
};
|
||||
|
||||
let totalAdded = 0;
|
||||
|
||||
const fieldsPerPage = new Map<number, TDetectedFormField[]>();
|
||||
for (const field of detectedFields) {
|
||||
if (!fieldsPerPage.has(field.pageNumber)) {
|
||||
fieldsPerPage.set(field.pageNumber, []);
|
||||
}
|
||||
fieldsPerPage.get(field.pageNumber)!.push(field);
|
||||
}
|
||||
|
||||
for (const [pageNumber, fields] of fieldsPerPage.entries()) {
|
||||
const pageCanvasRefs = getPageCanvasRefs(pageNumber);
|
||||
|
||||
for (const detected of fields) {
|
||||
const [ymin, xmin, ymax, xmax] = detected.boundingBox;
|
||||
let positionX = (xmin / 1000) * 100;
|
||||
let positionY = (ymin / 1000) * 100;
|
||||
let width = ((xmax - xmin) / 1000) * 100;
|
||||
let height = ((ymax - ymin) / 1000) * 100;
|
||||
|
||||
if (pageCanvasRefs) {
|
||||
const adjusted = enforceMinimumFieldDimensions({
|
||||
positionX,
|
||||
positionY,
|
||||
width,
|
||||
height,
|
||||
pageWidth: pageCanvasRefs.pdfCanvas.width,
|
||||
pageHeight: pageCanvasRefs.pdfCanvas.height,
|
||||
});
|
||||
|
||||
positionX = adjusted.positionX;
|
||||
positionY = adjusted.positionY;
|
||||
width = adjusted.width;
|
||||
height = adjusted.height;
|
||||
}
|
||||
|
||||
const fieldType = detected.label as FieldType;
|
||||
const resolvedRecipientId =
|
||||
envelope.recipients.find((recipient) => recipient.id === detected.recipientId)?.id ??
|
||||
editorFields.selectedRecipient?.id ??
|
||||
envelope.recipients[0]?.id;
|
||||
|
||||
if (!resolvedRecipientId) {
|
||||
console.warn('Skipping detected field because no recipient could be resolved', {
|
||||
detectedRecipientId: detected.recipientId,
|
||||
});
|
||||
continue;
|
||||
}
|
||||
|
||||
try {
|
||||
editorFields.addField({
|
||||
envelopeItemId: currentEnvelopeItem.id,
|
||||
page: pageNumber,
|
||||
type: fieldType,
|
||||
positionX,
|
||||
positionY,
|
||||
width,
|
||||
height,
|
||||
recipientId: resolvedRecipientId,
|
||||
fieldMeta: structuredClone(FIELD_META_DEFAULT_VALUES[fieldType]),
|
||||
});
|
||||
totalAdded++;
|
||||
} catch (error) {
|
||||
console.error(`Failed to add field on page ${pageNumber}:`, error);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (totalAdded > 0) {
|
||||
toast({
|
||||
title: t`Recipients and fields added`,
|
||||
description: t`Added ${recipientCount} ${plural(recipientCount, {
|
||||
one: 'recipient',
|
||||
other: 'recipients',
|
||||
})} and ${totalAdded} ${plural(totalAdded, { one: 'field', other: 'fields' })}`,
|
||||
duration: 5000,
|
||||
});
|
||||
} else {
|
||||
toast({
|
||||
title: t`Recipients added`,
|
||||
description: t`Added ${recipientCount} ${plural(recipientCount, {
|
||||
one: 'recipient',
|
||||
other: 'recipients',
|
||||
})}. No fields were detected in the document.`,
|
||||
duration: 5000,
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Failed to auto-place fields:', error);
|
||||
toast({
|
||||
title: t`Field placement failed`,
|
||||
description: t`Failed to automatically place fields. You can add them manually.`,
|
||||
variant: 'destructive',
|
||||
duration: 5000,
|
||||
});
|
||||
}
|
||||
}, [
|
||||
currentEnvelopeItem,
|
||||
envelope.id,
|
||||
envelope.recipients,
|
||||
editorFields,
|
||||
hasAutoPlacedFields,
|
||||
t,
|
||||
toast,
|
||||
]);
|
||||
|
||||
return (
|
||||
<div className="relative flex h-full">
|
||||
<div className="relative flex w-full flex-col overflow-y-auto">
|
||||
{/* Horizontal envelope item selector */}
|
||||
{isDetectingFields && (
|
||||
<>
|
||||
<div className="edge-glow edge-glow-top pointer-events-none fixed left-0 right-0 top-0 z-20 h-16" />
|
||||
<div className="edge-glow edge-glow-right pointer-events-none fixed bottom-0 right-0 top-0 z-20 w-16" />
|
||||
<div className="edge-glow edge-glow-bottom pointer-events-none fixed bottom-0 left-0 right-0 z-20 h-16" />
|
||||
<div className="edge-glow edge-glow-left pointer-events-none fixed bottom-0 left-0 top-0 z-20 w-16" />
|
||||
<div className="edge-glow edge-glow-top pointer-events-none fixed left-0 right-0 top-0 z-20 h-32" />
|
||||
<div className="edge-glow edge-glow-right pointer-events-none fixed bottom-0 right-0 top-0 z-20 w-32" />
|
||||
<div className="edge-glow edge-glow-bottom pointer-events-none fixed bottom-0 left-0 right-0 z-20 h-32" />
|
||||
<div className="edge-glow edge-glow-left pointer-events-none fixed bottom-0 left-0 top-0 z-20 w-32" />
|
||||
</>
|
||||
)}
|
||||
|
||||
@ -330,7 +454,7 @@ export const EnvelopeEditorFieldsPage = () => {
|
||||
try {
|
||||
if (!currentEnvelopeItem) {
|
||||
toast({
|
||||
title: t`Error`,
|
||||
title: t`No document selected`,
|
||||
description: t`No document selected. Please reload the page and try again.`,
|
||||
variant: 'destructive',
|
||||
});
|
||||
@ -339,7 +463,7 @@ export const EnvelopeEditorFieldsPage = () => {
|
||||
|
||||
if (!currentEnvelopeItem.documentDataId) {
|
||||
toast({
|
||||
title: t`Error`,
|
||||
title: t`Document data missing`,
|
||||
description: t`Document data not found. Please try reloading the page.`,
|
||||
variant: 'destructive',
|
||||
});
|
||||
@ -430,24 +554,24 @@ export const EnvelopeEditorFieldsPage = () => {
|
||||
}
|
||||
|
||||
toast({
|
||||
title: t`Success`,
|
||||
title: t`Fields added`,
|
||||
description,
|
||||
});
|
||||
} else if (failedPages > 0) {
|
||||
toast({
|
||||
title: t`Error`,
|
||||
title: t`Field detection failed`,
|
||||
description: t`Failed to detect fields on ${failedPages} pages. Please try again.`,
|
||||
variant: 'destructive',
|
||||
});
|
||||
} else {
|
||||
toast({
|
||||
title: t`Info`,
|
||||
title: t`No fields detected`,
|
||||
description: t`No fields were detected in the document`,
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
toast({
|
||||
title: t`Error`,
|
||||
title: t`Processing error`,
|
||||
description: t`An unexpected error occurred while processing pages.`,
|
||||
variant: 'destructive',
|
||||
});
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { type ReactNode, useState } from 'react';
|
||||
|
||||
import { plural } from '@lingui/core/macro';
|
||||
import { Trans, useLingui } from '@lingui/react/macro';
|
||||
import { EnvelopeType } from '@prisma/client';
|
||||
import { Loader } from 'lucide-react';
|
||||
@ -27,7 +28,6 @@ import { cn } from '@documenso/ui/lib/utils';
|
||||
import { useToast } from '@documenso/ui/primitives/use-toast';
|
||||
|
||||
import { RecipientDetectionPromptDialog } from '~/components/dialogs/recipient-detection-prompt-dialog';
|
||||
import { SuggestedRecipientsDialog } from '~/components/dialogs/suggested-recipients-dialog';
|
||||
import { useCurrentTeam } from '~/providers/team';
|
||||
import {
|
||||
type RecipientForCreation,
|
||||
@ -61,7 +61,6 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
const [showExtractionPrompt, setShowExtractionPrompt] = useState(false);
|
||||
const [uploadedDocumentId, setUploadedDocumentId] = useState<string | null>(null);
|
||||
const [pendingRecipients, setPendingRecipients] = useState<RecipientForCreation[] | null>(null);
|
||||
const [showRecipientsDialog, setShowRecipientsDialog] = useState(false);
|
||||
const [shouldNavigateAfterPromptClose, setShouldNavigateAfterPromptClose] = useState(true);
|
||||
|
||||
const userTimezone =
|
||||
@ -124,7 +123,6 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
// Show AI prompt dialog for documents
|
||||
setUploadedDocumentId(id);
|
||||
setPendingRecipients(null);
|
||||
setShowRecipientsDialog(false);
|
||||
setShouldNavigateAfterPromptClose(true);
|
||||
setShowExtractionPrompt(true);
|
||||
} else {
|
||||
@ -148,7 +146,7 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
.otherwise(() => t`An error occurred during upload.`);
|
||||
|
||||
toast({
|
||||
title: t`Error`,
|
||||
title: t`Upload failed`,
|
||||
description: errorMessage,
|
||||
variant: 'destructive',
|
||||
duration: 7500,
|
||||
@ -252,8 +250,6 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
|
||||
setPendingRecipients(recipientsWithEmails);
|
||||
setShouldNavigateAfterPromptClose(false);
|
||||
setShowExtractionPrompt(false);
|
||||
setShowRecipientsDialog(true);
|
||||
} catch (error) {
|
||||
if (!(error instanceof Error && error.message === 'NO_RECIPIENTS_DETECTED')) {
|
||||
const parsedError = AppError.parseError(error);
|
||||
@ -276,12 +272,6 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
navigateToEnvelopeEditor();
|
||||
};
|
||||
|
||||
const handleRecipientsCancel = () => {
|
||||
setShowRecipientsDialog(false);
|
||||
setPendingRecipients(null);
|
||||
navigateToEnvelopeEditor();
|
||||
};
|
||||
|
||||
const handleRecipientsConfirm = async (recipientsToCreate: RecipientForCreation[]) => {
|
||||
if (!uploadedDocumentId) {
|
||||
return;
|
||||
@ -295,11 +285,17 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
|
||||
toast({
|
||||
title: t`Recipients added`,
|
||||
description: t`Successfully detected ${recipientsToCreate.length} recipient(s)`,
|
||||
description: t`Successfully detected ${recipientsToCreate.length} ${plural(
|
||||
recipientsToCreate.length,
|
||||
{
|
||||
one: 'recipient',
|
||||
other: 'recipients',
|
||||
},
|
||||
)}`,
|
||||
duration: 5000,
|
||||
});
|
||||
|
||||
setShowRecipientsDialog(false);
|
||||
setShowExtractionPrompt(false);
|
||||
setPendingRecipients(null);
|
||||
navigateToEnvelopeEditor();
|
||||
} catch (error) {
|
||||
@ -401,20 +397,8 @@ export const EnvelopeDropZoneWrapper = ({
|
||||
onOpenChange={handlePromptDialogOpenChange}
|
||||
onAccept={handleStartRecipientDetection}
|
||||
onSkip={handleSkipRecipientDetection}
|
||||
/>
|
||||
|
||||
<SuggestedRecipientsDialog
|
||||
open={showRecipientsDialog}
|
||||
recipients={pendingRecipients}
|
||||
onOpenChange={(open) => {
|
||||
if (!open) {
|
||||
handleRecipientsCancel();
|
||||
} else {
|
||||
setShowRecipientsDialog(true);
|
||||
}
|
||||
}}
|
||||
onCancel={handleRecipientsCancel}
|
||||
onSubmit={handleRecipientsConfirm}
|
||||
onRecipientsSubmit={handleRecipientsConfirm}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { useMemo, useState } from 'react';
|
||||
|
||||
import { msg } from '@lingui/core/macro';
|
||||
import { msg, plural } from '@lingui/core/macro';
|
||||
import { useLingui } from '@lingui/react/macro';
|
||||
import { Trans } from '@lingui/react/macro';
|
||||
import { EnvelopeType } from '@prisma/client';
|
||||
@ -28,8 +28,8 @@ import {
|
||||
import { useToast } from '@documenso/ui/primitives/use-toast';
|
||||
|
||||
import { RecipientDetectionPromptDialog } from '~/components/dialogs/recipient-detection-prompt-dialog';
|
||||
import { SuggestedRecipientsDialog } from '~/components/dialogs/suggested-recipients-dialog';
|
||||
import { useCurrentTeam } from '~/providers/team';
|
||||
import { detectFieldsInDocument } from '~/utils/detect-document-fields';
|
||||
import {
|
||||
type RecipientForCreation,
|
||||
detectRecipientsInDocument,
|
||||
@ -65,8 +65,8 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
const [showExtractionPrompt, setShowExtractionPrompt] = useState(false);
|
||||
const [uploadedDocumentId, setUploadedDocumentId] = useState<string | null>(null);
|
||||
const [pendingRecipients, setPendingRecipients] = useState<RecipientForCreation[] | null>(null);
|
||||
const [showRecipientsDialog, setShowRecipientsDialog] = useState(false);
|
||||
const [shouldNavigateAfterPromptClose, setShouldNavigateAfterPromptClose] = useState(true);
|
||||
const [isAutoAddingFields, setIsAutoAddingFields] = useState(false);
|
||||
|
||||
const { mutateAsync: createEnvelope } = trpc.envelope.create.useMutation();
|
||||
const { mutateAsync: createRecipients } = trpc.envelope.recipient.createMany.useMutation();
|
||||
@ -121,11 +121,9 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
? formatDocumentsPath(team.url)
|
||||
: formatTemplatesPath(team.url);
|
||||
|
||||
// Show AI prompt dialog for documents only
|
||||
if (type === EnvelopeType.DOCUMENT) {
|
||||
setUploadedDocumentId(id);
|
||||
setPendingRecipients(null);
|
||||
setShowRecipientsDialog(false);
|
||||
setShouldNavigateAfterPromptClose(true);
|
||||
setShowExtractionPrompt(true);
|
||||
|
||||
@ -135,7 +133,6 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
duration: 5000,
|
||||
});
|
||||
} else {
|
||||
// Templates - navigate immediately
|
||||
await navigate(`${pathPrefix}/${id}/edit`);
|
||||
|
||||
toast({
|
||||
@ -162,7 +159,7 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
.otherwise(() => t`An error occurred while uploading your document.`);
|
||||
|
||||
toast({
|
||||
title: t`Error`,
|
||||
title: t`Upload failed`,
|
||||
description: errorMessage,
|
||||
variant: 'destructive',
|
||||
duration: 7500,
|
||||
@ -229,12 +226,11 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
|
||||
setPendingRecipients(recipientsWithEmails);
|
||||
setShouldNavigateAfterPromptClose(false);
|
||||
setShowExtractionPrompt(false);
|
||||
setShowRecipientsDialog(true);
|
||||
} catch (err) {
|
||||
if (!(err instanceof Error && err.message === 'NO_RECIPIENTS_DETECTED')) {
|
||||
const error = AppError.parseError(err);
|
||||
const error = AppError.parseError(err);
|
||||
|
||||
// Only show toast if this wasn't a "no recipients found" case
|
||||
if (error.code !== 'NO_RECIPIENTS_DETECTED') {
|
||||
toast({
|
||||
title: t`Failed to analyze recipients`,
|
||||
description: error.userMessage || t`You can add recipients manually in the editor`,
|
||||
@ -243,7 +239,7 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
});
|
||||
}
|
||||
|
||||
throw err;
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
@ -253,12 +249,6 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
navigateToEnvelopeEditor();
|
||||
};
|
||||
|
||||
const handleRecipientsCancel = () => {
|
||||
setShowRecipientsDialog(false);
|
||||
setPendingRecipients(null);
|
||||
navigateToEnvelopeEditor();
|
||||
};
|
||||
|
||||
const handleRecipientsConfirm = async (recipientsToCreate: RecipientForCreation[]) => {
|
||||
if (!uploadedDocumentId) {
|
||||
return;
|
||||
@ -272,11 +262,17 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
|
||||
toast({
|
||||
title: t`Recipients added`,
|
||||
description: t`Successfully detected ${recipientsToCreate.length} recipient(s)`,
|
||||
description: t`Successfully detected ${recipientsToCreate.length} ${plural(
|
||||
recipientsToCreate.length,
|
||||
{
|
||||
one: 'recipient',
|
||||
other: 'recipients',
|
||||
},
|
||||
)}`,
|
||||
duration: 5000,
|
||||
});
|
||||
|
||||
setShowRecipientsDialog(false);
|
||||
setShowExtractionPrompt(false);
|
||||
setPendingRecipients(null);
|
||||
navigateToEnvelopeEditor();
|
||||
} catch (err) {
|
||||
@ -289,7 +285,72 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
duration: 7500,
|
||||
});
|
||||
|
||||
throw err;
|
||||
// Error is handled, dialog stays open for retry
|
||||
}
|
||||
};
|
||||
|
||||
const handleAutoAddFields = async (recipientsToCreate: RecipientForCreation[]) => {
|
||||
if (!uploadedDocumentId) {
|
||||
return;
|
||||
}
|
||||
|
||||
setIsAutoAddingFields(true);
|
||||
|
||||
try {
|
||||
await createRecipients({
|
||||
envelopeId: uploadedDocumentId,
|
||||
data: recipientsToCreate,
|
||||
});
|
||||
|
||||
let detectedFields;
|
||||
try {
|
||||
detectedFields = await detectFieldsInDocument(uploadedDocumentId);
|
||||
} catch (error) {
|
||||
console.error('Field detection failed:', error);
|
||||
|
||||
toast({
|
||||
title: t`Field detection failed`,
|
||||
description: t`Recipients added successfully, but field detection encountered an error. You can add fields manually.`,
|
||||
variant: 'destructive',
|
||||
duration: 7500,
|
||||
});
|
||||
|
||||
setShowExtractionPrompt(false);
|
||||
setPendingRecipients(null);
|
||||
setIsAutoAddingFields(false);
|
||||
|
||||
const pathPrefix = formatDocumentsPath(team.url);
|
||||
void navigate(`${pathPrefix}/${uploadedDocumentId}/edit?step=addFields`);
|
||||
return;
|
||||
}
|
||||
|
||||
if (detectedFields.length > 0) {
|
||||
sessionStorage.setItem(
|
||||
`autoPlaceFields_${uploadedDocumentId}`,
|
||||
JSON.stringify({
|
||||
fields: detectedFields,
|
||||
recipientCount: recipientsToCreate.length,
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
setShowExtractionPrompt(false);
|
||||
setPendingRecipients(null);
|
||||
setIsAutoAddingFields(false);
|
||||
|
||||
const pathPrefix = formatDocumentsPath(team.url);
|
||||
void navigate(`${pathPrefix}/${uploadedDocumentId}/edit?step=addFields`);
|
||||
} catch (err) {
|
||||
const error = AppError.parseError(err);
|
||||
|
||||
toast({
|
||||
title: t`Failed to add recipients`,
|
||||
description: error.userMessage || t`Please try again`,
|
||||
variant: 'destructive',
|
||||
duration: 7500,
|
||||
});
|
||||
|
||||
setIsAutoAddingFields(false);
|
||||
}
|
||||
};
|
||||
|
||||
@ -344,20 +405,10 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
|
||||
onOpenChange={handlePromptDialogOpenChange}
|
||||
onAccept={handleStartRecipientDetection}
|
||||
onSkip={handleSkipRecipientDetection}
|
||||
/>
|
||||
|
||||
<SuggestedRecipientsDialog
|
||||
open={showRecipientsDialog}
|
||||
recipients={pendingRecipients}
|
||||
onOpenChange={(open) => {
|
||||
if (!open) {
|
||||
handleRecipientsCancel();
|
||||
} else {
|
||||
setShowRecipientsDialog(true);
|
||||
}
|
||||
}}
|
||||
onCancel={handleRecipientsCancel}
|
||||
onSubmit={handleRecipientsConfirm}
|
||||
onRecipientsSubmit={handleRecipientsConfirm}
|
||||
onAutoAddFields={handleAutoAddFields}
|
||||
isProcessingRecipients={isAutoAddingFields}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user