From dc8d8433dd4a925653ba4358efd0ffca4227d3e7 Mon Sep 17 00:00:00 2001
From: David Nguyen <davidngu28@gmail.com>
Date: Sun, 17 Mar 2024 13:54:14 +0800
Subject: [PATCH] chore: update documentation

---
 .../animate/animate-generic-fade-in-out.tsx   |  6 ++--
 .../primitives/document-flow/add-settings.tsx | 35 ++++++++++++-------
 .../primitives/document-flow/add-signers.tsx  | 20 ++++++-----
 3 files changed, 37 insertions(+), 24 deletions(-)

diff --git a/packages/ui/components/animate/animate-generic-fade-in-out.tsx b/packages/ui/components/animate/animate-generic-fade-in-out.tsx
index 5478eaa50..78487b953 100644
--- a/packages/ui/components/animate/animate-generic-fade-in-out.tsx
+++ b/packages/ui/components/animate/animate-generic-fade-in-out.tsx
@@ -5,17 +5,17 @@ import { motion } from 'framer-motion';
 type AnimateGenericFadeInOutProps = {
   children: React.ReactNode;
   className?: string;
-  key?: string;
+  motionKey?: string;
 };
 
 export const AnimateGenericFadeInOut = ({
   children,
   className,
-  key,
+  motionKey,
 }: AnimateGenericFadeInOutProps) => {
   return (
     <motion.section
-      key={key}
+      key={motionKey}
       initial={{
         opacity: 0,
       }}
diff --git a/packages/ui/primitives/document-flow/add-settings.tsx b/packages/ui/primitives/document-flow/add-settings.tsx
index 2a66cd056..6e3cd190f 100644
--- a/packages/ui/primitives/document-flow/add-settings.tsx
+++ b/packages/ui/primitives/document-flow/add-settings.tsx
@@ -141,12 +141,16 @@ export const AddSettingsFormPartial = ({
                       </TooltipTrigger>
 
                       <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
-                        <p>The authentication requirement for recipients to view the document.</p>
+                        <h2>
+                          <strong>Document access</strong>
+                        </h2>
 
-                        <ul className="space-y-0.5">
+                        <p>The authentication required for recipients to view the document.</p>
+
+                        <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
                           <li>
-                            <strong>Require account</strong> - The recipient must have an account,
-                            and be signed in to view the document
+                            <strong>Require account</strong> - The recipient must be signed in to
+                            view the document
                           </li>
                           <li>
                             <strong>None</strong> - The document can be accessed directly by the URL
@@ -185,28 +189,33 @@ export const AddSettingsFormPartial = ({
               render={({ field }) => (
                 <FormItem>
                   <FormLabel className="flex flex-row items-center">
-                    Recipient signing authentication
+                    Recipient action authentication
                     <Tooltip>
                       <TooltipTrigger>
                         <InfoIcon className="mx-2 h-4 w-4" />
                       </TooltipTrigger>
 
                       <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
-                        <p>The authentication requirement for recipients to sign fields.</p>
+                        <h2>
+                          <strong>Global recipient action authentication</strong>
+                        </h2>
 
                         <p>
-                          You can also override this global setting by setting the authentication
-                          requirements directly on each recipient in the next step.
+                          The authentication required for recipients to sign fields and complete the
+                          document.
                         </p>
 
-                        <ul className="space-y-0.5">
+                        <p>
+                          This can be overriden by setting the authentication requirements directly
+                          on each recipient in the next step.
+                        </p>
+
+                        <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
                           <li>
-                            <strong>Require account</strong> - The recipient must have an account,
-                            and be signed in to sign fields
+                            <strong>Require account</strong> - The recipient must be signed in
                           </li>
                           <li>
-                            <strong>None</strong> - The recipient does not need any authentication
-                            to sign fields
+                            <strong>None</strong> - No authentication required
                           </li>
                         </ul>
                       </TooltipContent>
diff --git a/packages/ui/primitives/document-flow/add-signers.tsx b/packages/ui/primitives/document-flow/add-signers.tsx
index be5c6d429..8e174e578 100644
--- a/packages/ui/primitives/document-flow/add-signers.tsx
+++ b/packages/ui/primitives/document-flow/add-signers.tsx
@@ -174,7 +174,7 @@ export const AddSignersFormPartial = ({
           <ShowFieldItem key={index} field={field} recipients={recipients} />
         ))}
 
-        <AnimateGenericFadeInOut key={showAdvancedSettings ? 'Show' : 'Hide'}>
+        <AnimateGenericFadeInOut motionKey={showAdvancedSettings ? 'Show' : 'Hide'}>
           <Form {...form}>
             <div className="flex w-full flex-col gap-y-2">
               {signers.map((signer, index) => (
@@ -259,25 +259,29 @@ export const AddSignersFormPartial = ({
                                   </TooltipTrigger>
 
                                   <TooltipContent className="text-foreground max-w-md p-4">
+                                    <h2>
+                                      <strong>Recipient action authentication</strong>
+                                    </h2>
+
                                     <p>
-                                      The authentication requirements for recipients to sign fields.
+                                      The authentication required for recipients to sign fields and
+                                      complete the document.
                                     </p>
 
                                     <p className="mt-2">This will override any global settings.</p>
 
-                                    <ul className="mt-2 space-y-0.5">
+                                    <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
                                       <li>
                                         <strong>Inherit authentication method</strong> - Use the
-                                        global recipient signing authentication method configured in
+                                        global action signing authentication method configured in
                                         the "General Settings" step
                                       </li>
                                       <li>
-                                        <strong>Require account</strong> - The recipient must have
-                                        an account, and be signed in to sign fields
+                                        <strong>Require account</strong> - The recipient must be
+                                        signed in
                                       </li>
                                       <li>
-                                        <strong>None</strong> - The recipient does not need any
-                                        authentication to sign fields
+                                        <strong>None</strong> - No authentication required
                                       </li>
                                     </ul>
                                   </TooltipContent>