feat: some refactoring

This commit is contained in:
Catalin Pit
2024-08-14 10:36:40 +03:00
parent a0788656f5
commit 75c05bf82b
2 changed files with 19 additions and 12 deletions

View File

@ -6,6 +6,7 @@ import { useRouter } from 'next/navigation';
import { Loader } from 'lucide-react'; import { Loader } from 'lucide-react';
import { useDebouncedValue } from '@documenso/lib/client-only/hooks/use-debounced-value';
import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc'; import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error'; import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth'; import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
@ -42,6 +43,8 @@ export const InitialsField = ({
const { fullName } = useRequiredSigningContext(); const { fullName } = useRequiredSigningContext();
const initials = extractInitials(fullName); const initials = extractInitials(fullName);
const debouncedTerm = useDebouncedValue(initials, 5000);
const [isPending, startTransition] = useTransition(); const [isPending, startTransition] = useTransition();
const { executeActionAuthProcedure } = useRequiredDocumentAuthContext(); const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
@ -58,7 +61,7 @@ export const InitialsField = ({
const onSign = async (authOptions?: TRecipientActionAuth) => { const onSign = async (authOptions?: TRecipientActionAuth) => {
try { try {
const value = initials ?? ''; const value = debouncedTerm ?? '';
const payload: TSignFieldWithTokenMutationSchema = { const payload: TSignFieldWithTokenMutationSchema = {
token: recipient.token, token: recipient.token,
@ -126,7 +129,7 @@ export const InitialsField = ({
actionTarget: field.type, actionTarget: field.type,
}); });
} }
}, [field]); }, [field, debouncedTerm]);
return ( return (
<SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Initials"> <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Initials">

View File

@ -67,7 +67,7 @@ export const SigningFieldContainer = ({
const parsedFieldMeta = field.fieldMeta ? ZFieldMetaSchema.parse(field.fieldMeta) : undefined; const parsedFieldMeta = field.fieldMeta ? ZFieldMetaSchema.parse(field.fieldMeta) : undefined;
const readOnlyField = parsedFieldMeta?.readOnly || false; const readOnlyField = parsedFieldMeta?.readOnly || false;
const automatedFields = ['Initials', 'Email', 'Name', 'Date'].includes(type ?? ''); const automatedFields = ['Email', 'Date'].includes(type ?? '');
const handleInsertField = async () => { const handleInsertField = async () => {
if (field.inserted || !onSign) { if (field.inserted || !onSign) {
@ -147,7 +147,7 @@ export const SigningFieldContainer = ({
</button> </button>
)} )}
{type === 'Date' && field.inserted && !loading && !readOnlyField && ( {field.inserted && !automatedFields && !loading && !readOnlyField && (
<Tooltip delayDuration={0}> <Tooltip delayDuration={0}>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<button <button
@ -173,14 +173,18 @@ export const SigningFieldContainer = ({
</button> </button>
)} )}
{type !== 'Checkbox' && field.inserted && !loading && !readOnlyField && ( {type !== 'Checkbox' &&
<button !automatedFields &&
className="text-destructive bg-background/50 absolute inset-0 z-10 flex h-full w-full items-center justify-center rounded-md text-sm opacity-0 duration-200 group-hover:opacity-100" field.inserted &&
onClick={onRemoveSignedFieldClick} !loading &&
> !readOnlyField && (
Remove <button
</button> className="text-destructive bg-background/50 absolute inset-0 z-10 flex h-full w-full items-center justify-center rounded-md text-sm opacity-0 duration-200 group-hover:opacity-100"
)} onClick={onRemoveSignedFieldClick}
>
Remove
</button>
)}
{children} {children}
</FieldRootContainer> </FieldRootContainer>