feat: remove the existing empty signer if its the only one

packages/ui/primitives/document-flow/add-signers.tsx

@@ -105,10 +105,14 @@ export const AddSignersFormPartial = ({
  const [showAdvancedSettings, setShowAdvancedSettings] = useState(alwaysShowAdvancedSettings);
 
  const {
+ setValue,
  formState: { errors, isSubmitting },
  control,
+ watch,
  } = form;
 
+ const watchedSigners = watch('signers');
+
  const onFormSubmit = form.handleSubmit(onSubmit);
 
  const {
@@ -120,6 +124,11 @@ export const AddSignersFormPartial = ({
  name: 'signers',
  });
 
+ const emptySignerIndex = watchedSigners.findIndex((signer) => !signer.name && !signer.email);
+ const isUserAlreadyARecipient = watchedSigners.some(
+ (signer) => signer.email.toLowerCase() === user?.email?.toLowerCase(),
+ );
+
  const hasBeenSentToRecipientId = (id?: number) => {
  if (!id) {
  return false;
@@ -133,16 +142,6 @@ export const AddSignersFormPartial = ({
  );
  };
 
- const onAddSelfSigner = () => {
- appendSigner({
- formId: nanoid(12),
- name: user?.name ?? '',
- email: user?.email ?? '',
- role: RecipientRole.SIGNER,
- actionAuth: undefined,
- });
- };
-
  const onAddSigner = () => {
  appendSigner({
  formId: nanoid(12),
@@ -169,6 +168,21 @@ export const AddSignersFormPartial = ({
  removeSigner(index);
  };
 
+ const onAddSelfSigner = () => {
+ if (emptySignerIndex !== -1) {
+ setValue(`signers.${emptySignerIndex}.name`, user?.name ?? '');
+ setValue(`signers.${emptySignerIndex}.email`, user?.email ?? '');
+ } else {
+ appendSigner({
+ formId: nanoid(12),
+ name: user?.name ?? '',
+ email: user?.email ?? '',
+ role: RecipientRole.SIGNER,
+ actionAuth: undefined,
+ });
+ }
+ };
+
  const onKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
  if (event.key === 'Enter' && event.target instanceof HTMLInputElement) {
  onAddSigner();
@@ -218,11 +232,7 @@ export const AddSignersFormPartial = ({
  type="email"
  placeholder="Email"
  {...field}
- disabled={
- isSubmitting ||
- hasBeenSentToRecipientId(signer.nativeId) ||
- signers[index].email === user?.email
- }
+ disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
  onKeyDown={onKeyDown}
  />
  </FormControl>
@@ -248,11 +258,7 @@ export const AddSignersFormPartial = ({
  <Input
  placeholder="Name"
  {...field}
- disabled={
- isSubmitting ||
- hasBeenSentToRecipientId(signer.nativeId) ||
- signers[index].email === user?.email
- }
+ disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
  onKeyDown={onKeyDown}
  />
  </FormControl>
@@ -335,14 +341,12 @@ export const AddSignersFormPartial = ({
  <Plus className="-ml-1 mr-2 h-5 w-5" />
  Add Signer
  </Button>
+
  <Button
  type="button"
  variant="secondary"
  className="dark:bg-muted dark:hover:bg-muted/80 bg-black/5 hover:bg-black/10"
- disabled={
- isSubmitting ||
- form.getValues('signers').some((signer) => signer.email === user?.email)
- }
+ disabled={isSubmitting || isUserAlreadyARecipient}
  onClick={() => onAddSelfSigner()}
  >
  <Plus className="-ml-1 mr-2 h-5 w-5" />