refactor: extract toast

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

@@ -7,8 +7,13 @@ import { useSession } from 'next-auth/react';
 import { match } from 'ts-pattern';
 
 import { useCopyShareLink } from '@documenso/lib/client-only/hooks/use-copy-share-link';
+import {
+  TOAST_DOCUMENT_SHARE_ERROR,
+  TOAST_DOCUMENT_SHARE_SUCCESS,
+} from '@documenso/lib/constants/toast';
 import { Document, DocumentStatus, Recipient, SigningStatus, User } from '@documenso/prisma/client';
 import { Button } from '@documenso/ui/primitives/button';
+import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export type DataTableActionButtonProps = {
   row: Document & {
@@ -20,7 +25,12 @@ export type DataTableActionButtonProps = {
 export const DataTableActionButton = ({ row }: DataTableActionButtonProps) => {
   const { data: session } = useSession();
 
-  const { createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink();
+  const { toast } = useToast();
+
+  const { createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink({
+    onSuccess: () => toast(TOAST_DOCUMENT_SHARE_SUCCESS),
+    onError: () => toast(TOAST_DOCUMENT_SHARE_ERROR),
+  });
 
   if (!session) {
     return null;

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

@@ -19,6 +19,10 @@ import {
 import { useSession } from 'next-auth/react';
 
 import { useCopyShareLink } from '@documenso/lib/client-only/hooks/use-copy-share-link';
+import {
+  TOAST_DOCUMENT_SHARE_ERROR,
+  TOAST_DOCUMENT_SHARE_SUCCESS,
+} from '@documenso/lib/constants/toast';
 import { getFile } from '@documenso/lib/universal/upload/get-file';
 import { Document, DocumentStatus, Recipient, User } from '@documenso/prisma/client';
 import { DocumentWithData } from '@documenso/prisma/types/document-with-data';
@@ -30,6 +34,7 @@ import {
   DropdownMenuLabel,
   DropdownMenuTrigger,
 } from '@documenso/ui/primitives/dropdown-menu';
+import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { DeleteDraftDocumentDialog } from './delete-draft-document-dialog';
 
@@ -43,7 +48,12 @@ export type DataTableActionDropdownProps = {
 export const DataTableActionDropdown = ({ row }: DataTableActionDropdownProps) => {
   const { data: session } = useSession();
 
-  const { createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink();
+  const { toast } = useToast();
+
+  const { createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink({
+    onSuccess: () => toast(TOAST_DOCUMENT_SHARE_SUCCESS),
+    onError: () => toast(TOAST_DOCUMENT_SHARE_ERROR),
+  });
 
   const [isDeleteDialogOpen, setDeleteDialogOpen] = useState(false);
 

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

@@ -1,12 +1,14 @@
 import { trpc } from '@documenso/trpc/react';
 import { TCreateOrGetShareLinkMutationSchema } from '@documenso/trpc/server/share-link-router/schema';
-import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { useCopyToClipboard } from './use-copy-to-clipboard';
 
-export function useCopyShareLink() {
+export type UseCopyShareLinkOptions = {
-  const { toast } = useToast();
+  onSuccess?: () => void;
+  onError?: () => void;
+};
 
+export function useCopyShareLink({ onSuccess, onError }: UseCopyShareLinkOptions) {
   const [, copyToClipboard] = useCopyToClipboard();
 
   const { mutateAsync: createOrGetShareLink, isLoading: isCreatingShareLink } =
@@ -37,17 +39,9 @@ export function useCopyShareLink() {
         throw new Error('Copy to clipboard failed');
       }
 
-      toast({
+      onSuccess?.();
-        title: 'Copied to clipboard',
+    } catch (e) {
-        description: 'The sharing link has been copied to your clipboard.',
+      onError?.();
-      });
-    } catch {
-      toast({
-        variant: 'destructive',
-        title: 'Something went wrong',
-        description: 'The sharing link could not be created at this time. Please try again.',
-        duration: 5000,
-      });
     }
   };
 

packages/lib/constants/toast.ts

@@ -0,0 +1,13 @@
+import { Toast } from '@documenso/ui/primitives/use-toast';
+
+export const TOAST_DOCUMENT_SHARE_SUCCESS: Toast = {
+  title: 'Copied to clipboard',
+  description: 'The sharing link has been copied to your clipboard.',
+} as const;
+
+export const TOAST_DOCUMENT_SHARE_ERROR: Toast = {
+  variant: 'destructive',
+  title: 'Something went wrong',
+  description: 'The sharing link could not be created at this time. Please try again.',
+  duration: 5000,
+};

packages/ui/components/document/document-share-button.tsx

@@ -6,6 +6,10 @@ import { Copy, Share } from 'lucide-react';
 import { FaXTwitter } from 'react-icons/fa6';
 
 import { useCopyShareLink } from '@documenso/lib/client-only/hooks/use-copy-share-link';
+import {
+  TOAST_DOCUMENT_SHARE_ERROR,
+  TOAST_DOCUMENT_SHARE_SUCCESS,
+} from '@documenso/lib/constants/toast';
 import { generateTwitterIntent } from '@documenso/lib/universal/generate-twitter-intent';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -18,6 +22,7 @@ import {
   DialogTitle,
   DialogTrigger,
 } from '@documenso/ui/primitives/dialog';
+import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export type DocumentShareButtonProps = HTMLAttributes<HTMLButtonElement> & {
   token: string;
@@ -25,7 +30,12 @@ export type DocumentShareButtonProps = HTMLAttributes<HTMLButtonElement> & {
 };
 
 export const DocumentShareButton = ({ token, documentId, className }: DocumentShareButtonProps) => {
-  const { copyShareLink, createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink();
+  const { toast } = useToast();
+
+  const { copyShareLink, createAndCopyShareLink, isCopyingShareLink } = useCopyShareLink({
+    onSuccess: () => toast(TOAST_DOCUMENT_SHARE_SUCCESS),
+    onError: () => toast(TOAST_DOCUMENT_SHARE_ERROR),
+  });
 
   const [isOpen, setIsOpen] = useState(false);
 

packages/ui/primitives/use-toast.ts

@@ -133,7 +133,7 @@ function dispatch(action: Action) {
   });
 }
 
-type Toast = Omit<ToasterToast, 'id'>;
+export type Toast = Omit<ToasterToast, 'id'>;
 
 function toast({ ...props }: Toast) {
   const id = genId();