Introduce or Update useCreateLink Hook

[mahid797]

Implement a dedicated hook to handle the link creation API call (POST /api/documents/[documentId]/links) with typed request and response. Remove direct axios usage from the component logic, ensuring a DRY approach.

Detailed Tasks

1. Create a Hook under src/hooks/documentLinks/ (or documents/) named useCreateLink.ts.

   • Use useMutation from React Query (Tanstack Query) or similar.
   • Accept a typed payload (e.g. CreateDocumentLinkPayload) plus the documentId.

2. Models

   • The request is CreateDocumentLinkPayload, and the response might be DocumentLinkResponse:

     interface DocumentLinkResponse {
     	message: string;
     	link: {
     		linkUrl: string;
     		alias: string;
     		// ...
     	};
     }

   • Return these typed values for better code clarity.

3. Remove Direct axios in CreateLink.tsx

   • Instead, import useCreateLink and call createLink(payload).
   • Catch and display errors if the mutation fails.

4. Example

   // useCreateLink.ts
   import { useMutation } from '@tanstack/react-query';
   import axios from 'axios';
   import { CreateDocumentLinkPayload, DocumentLinkResponse } from '@/shared/models/links';
   
   export function useCreateLink(documentId: string) {
   	const mutation = useMutation(async (payload: CreateDocumentLinkPayload) => {
   		const res = await axios.post<DocumentLinkResponse>(
   			`/api/documents/${documentId}/links`,
   			payload,
   		);
   		return res.data;
   	});
   
   	return {
   		createLink: mutation.mutateAsync,
   		loading: mutation.isLoading,
   		error: mutation.error,
   	};
   }

Acceptance Criteria

• A new or updated useCreateLink hook in src/hooks/.
• CreateLink.tsx no longer calls axios.post directly.
• The hook returns typed data so the calling component can read res.link.linkUrl, etc.
• Error handling is consistent with other hooks (e.g., toasts, logs).
• The code is DRY—no repeated link creation logic in multiple places.