refactor: restructure logic

apps/web/src/app/(dashboard)/documents/data-table-action-button.tsx

@@ -20,7 +20,7 @@ export type DataTableActionButtonProps = {
 export const DataTableActionButton = ({ row }: DataTableActionButtonProps) => {
   const { data: session } = useSession();
 
-  const { copyShareLink, isCopyingShareLink } = useCopyShareLink();
+  const { createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink();
 
   if (!session) {
     return null;
@@ -63,12 +63,12 @@ export const DataTableActionButton = ({ row }: DataTableActionButtonProps) => {
       <Button
         className="w-24"
         loading={isCopyingShareLink}
-        onClick={() => {
+        onClick={async () =>
-          void copyShareLink({
+          createAndCopyShareLink({
             token: recipient?.token,
             documentId: row.id,
-          });
+          })
-        }}
+        }
       >
         {!isCopyingShareLink && <Share className="-ml-1 mr-2 h-4 w-4" />}
         Share

apps/web/src/app/(dashboard)/documents/data-table-action-dropdown.tsx

@@ -39,7 +39,7 @@ export type DataTableActionDropdownProps = {
 export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) => {
   const { data: session } = useSession();
 
-  const { copyShareLink, isCopyingShareLink } = useCopyShareLink();
+  const { createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink();
 
   if (!session) {
     return null;
@@ -140,12 +140,12 @@ export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) =
         </DropdownMenuItem>
 
         <DropdownMenuItem
-          onClick={() => {
+          onClick={async () =>
-            void copyShareLink({
+            createAndCopyShareLink({
               token: recipient?.token,
               documentId: row.id,
-            });
+            })
-          }}
+          }
         >
           {isCopyingShareLink ? (
             <Loader className="mr-2 h-4 w-4" />

apps/web/src/app/(signing)/sign/[token]/complete/share-button.tsx

@@ -24,7 +24,7 @@ export type ShareButtonProps = HTMLAttributes<HTMLButtonElement> & {
 };
 
 export const ShareButton = ({ token, documentId }: ShareButtonProps) => {
-  const { copyShareLink, isCopyingShareLink } = useCopyShareLink();
+  const { copyShareLink, createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink();
 
   const [isOpen, setIsOpen] = useState(false);
 
@@ -46,14 +46,14 @@ export const ShareButton = ({ token, documentId }: ShareButtonProps) => {
   };
 
   const onCopyClick = async () => {
-    const copyToClipboardValue = shareLink
+    if (shareLink) {
-      ? `${window.location.origin}/share/${shareLink.slug}`
+      await copyShareLink(`${window.location.origin}/share/${shareLink.slug}`);
-      : {
+    } else {
+      await createAndCopyShareLink({
         token,
         documentId,
-        };
+      });
-
+    }
-    await copyShareLink(copyToClipboardValue);
 
     setIsOpen(false);
   };

packages/lib/client-only/hooks/use-copy-share-link.ts

@@ -13,22 +13,26 @@ export function useCopyShareLink() {
     trpc.shareLink.createOrGetShareLink.useMutation();
 
   /**
-   * Copy a share link to the user's clipboard.
+   * Copy a newly created, or pre-existing share link to the user's clipboard.
    *
-   * Will create or get a share link if one is not provided.
+   * @param payload The payload to create or get a share link.
-   *
-   * @param payload Either the share link itself or the input to create a new share link.
    */
-  const copyShareLink = async (payload: TCreateOrGetShareLinkMutationSchema | string) => {
+  const createAndCopyShareLink = async (payload: TCreateOrGetShareLinkMutationSchema) => {
-    const valueToCopy =
+    const valueToCopy = createOrGetShareLink(payload).then(
-      typeof payload === 'string'
-        ? payload
-        : createOrGetShareLink(payload).then(
       (result) => `${window.location.origin}/share/${result.slug}`,
     );
 
+    await copyShareLink(valueToCopy);
+  };
+
+  /**
+   * Copy a share link to the user's clipboard.
+   *
+   * @param shareLink Either the share link itself or a promise that returns a shared link.
+   */
+  const copyShareLink = async (shareLink: Promise<string> | string) => {
     try {
-      const isCopySuccess = await copyToClipboard(valueToCopy);
+      const isCopySuccess = await copyToClipboard(shareLink);
       if (!isCopySuccess) {
         throw new Error('Copy to clipboard failed');
       }
@@ -48,7 +52,8 @@ export function useCopyShareLink() {
   };
 
   return {
-    isCopyingShareLink: isCreatingShareLink,
+    createAndCopyShareLink,
     copyShareLink,
+    isCopyingShareLink: isCreatingShareLink,
   };
 }