save

Author: AntoLC

src/frontend/apps/impress/src/features/docs/doc-management/api/useCreateDoc.tsx

@@ -6,9 +6,14 @@ import { Doc } from '../types';
 
 import { KEY_LIST_DOC } from './useDocs';
 
-export const createDoc = async (): Promise<Doc> => {
+type CreateDocParams = {
+  title?: string;
+} | void;
+
+export const createDoc = async (params: CreateDocParams): Promise<Doc> => {
   const response = await fetchAPI(`documents/`, {
     method: 'POST',
+    body: JSON.stringify({ title: params?.title }),
   });
 
   if (!response.ok) {
@@ -25,7 +30,7 @@ interface CreateDocProps {
 
 export function useCreateDoc({ onSuccess, onError }: CreateDocProps) {
   const queryClient = useQueryClient();
-  return useMutation<Doc, APIError>({
+  return useMutation<Doc, APIError, CreateDocParams>({
     mutationFn: createDoc,
     onSuccess: (data) => {
       void queryClient.resetQueries({

src/frontend/apps/impress/src/features/docs/doc-share/api/useUpdateDocLink.tsx

@@ -1,17 +1,23 @@
 import { VariantType, useToastProvider } from '@openfun/cunningham-react';
-import { useMutation, useQueryClient } from '@tanstack/react-query';
+import {
+  UseMutationOptions,
+  useMutation,
+  useQueryClient,
+} from '@tanstack/react-query';
 import { useTranslation } from 'react-i18next';
 
 import { APIError, errorCauses, fetchAPI } from '@/api';
-import { Doc } from '@/docs/doc-management';
+import { Doc, LinkReach, LinkRole } from '@/docs/doc-management';
 
 export type UpdateDocLinkParams = Pick<Doc, 'id' | 'link_reach'> &
   Partial<Pick<Doc, 'link_role'>>;
 
+type UpdateDocLinkResponse = { link_role: LinkRole; link_reach: LinkReach };
+
 export const updateDocLink = async ({
   id,
   ...params
-}: UpdateDocLinkParams): Promise<Doc> => {
+}: UpdateDocLinkParams): Promise<UpdateDocLinkResponse> => {
   const response = await fetchAPI(`documents/${id}/link-configuration/`, {
     method: 'PUT',
     body: JSON.stringify({
@@ -26,26 +32,27 @@ export const updateDocLink = async ({
     );
   }
 
-  return response.json() as Promise<Doc>;
+  return response.json() as Promise<UpdateDocLinkResponse>;
 };
 
-interface UpdateDocLinkProps {
-  onSuccess?: (data: Doc) => void;
+type UseUpdateDocLinkOptions = UseMutationOptions<
+  UpdateDocLinkResponse,
+  APIError,
+  UpdateDocLinkParams
+> & {
   listInvalidQueries?: string[];
-}
+};
 
-export function useUpdateDocLink({
-  onSuccess,
-  listInvalidQueries,
-}: UpdateDocLinkProps = {}) {
+export function useUpdateDocLink(options?: UseUpdateDocLinkOptions) {
   const queryClient = useQueryClient();
   const { toast } = useToastProvider();
   const { t } = useTranslation();
 
-  return useMutation<Doc, APIError, UpdateDocLinkParams>({
+  return useMutation<UpdateDocLinkResponse, APIError, UpdateDocLinkParams>({
     mutationFn: updateDocLink,
-    onSuccess: (data) => {
-      listInvalidQueries?.forEach((queryKey) => {
+    ...options,
+    onSuccess: (data, variables, onMutateResult, context) => {
+      options?.listInvalidQueries?.forEach((queryKey) => {
         void queryClient.invalidateQueries({
           queryKey: [queryKey],
         });
@@ -59,7 +66,7 @@ export function useUpdateDocLink({
         },
       );
 
-      onSuccess?.(data);
+      options?.onSuccess?.(data, variables, onMutateResult, context);
     },
   });
 }

src/frontend/apps/impress/src/pages/docs/new/index.tsx

@@ -1,10 +1,15 @@
+import { captureException } from '@sentry/nextjs';
 import Head from 'next/head';
 import { useSearchParams } from 'next/navigation';
 import { useRouter } from 'next/router';
-import { ReactElement, useEffect } from 'react';
+import { ReactElement, useCallback, useEffect } from 'react';
 
 import { Loading } from '@/components';
-import { LinkReach, useCreateDoc } from '@/features/docs/doc-management';
+import {
+  LinkReach,
+  LinkRole,
+  useCreateDoc,
+} from '@/features/docs/doc-management';
 import { useUpdateDocLink } from '@/features/docs/doc-share/api/useUpdateDocLink';
 import { useSkeletonStore } from '@/features/skeletons';
 import { MainLayout } from '@/layouts';
@@ -15,8 +20,8 @@ const Page: NextPageWithLayout = () => {
   const router = useRouter();
   const searchParams = useSearchParams();
   const linkReach = searchParams.get('link-reach');
-  const linkTitle = searchParams.get('title');
-  const linkpermission = searchParams.get('linkpermission');
+  const linkRole = searchParams.get('link-role');
+  const title = searchParams.get('title');
   const peoplesharing = searchParams.get('peoplesharing');
 
   const {
@@ -25,49 +30,75 @@ const Page: NextPageWithLayout = () => {
     data: doc,
   } = useCreateDoc({
     onSuccess: (doc) => {
-      if (linkReach || linkpermission || peoplesharing) {
+      if ((linkReach && linkRole) || linkReach || peoplesharing) {
         return;
       }
 
-      router
-        .push(`/docs/${doc.id}`)
-        .then(() => {})
-        .catch(() => {});
+      redirectToDoc(doc.id);
     },
     onError: () => {},
   });
 
-  const { mutate: updateDocLink } = useUpdateDocLink();
+  const { mutate: updateDocLink } = useUpdateDocLink({
+    onSuccess: (response, params) => {
+      if (peoplesharing || !params.id) {
+        return;
+      }
+
+      redirectToDoc(params.id);
+    },
+    onError: (error, params) => {
+      captureException(error, {
+        extra: {
+          docId: params.id,
+          linkReach,
+          linkRole,
+        },
+      });
+
+      if (params.id) {
+        redirectToDoc(params.id);
+      }
+    },
+  });
+
+  const redirectToDoc = useCallback(
+    (docId: string) => {
+      void router.push(`/docs/${docId}`);
+    },
+    [router],
+  );
 
   useEffect(() => {
     setIsSkeletonVisible(true);
   }, [setIsSkeletonVisible]);
 
+  // Doc creation effect
   useEffect(() => {
     if (doc) {
       return;
     }
 
-    createDoc();
-  }, [createDoc, doc]);
+    createDoc({
+      title: title || undefined,
+    });
+  }, [createDoc, doc, title]);
 
   useEffect(() => {
     if (!linkReach || !doc) {
       return;
     }
 
-    console.log('linkReach', linkReach);
-
-    if (!Object.values(LinkReach).includes(linkReach as LinkReach)) {
-      throw new Error('Invalid link reach value');
-    }
-
     updateDocLink({
       id: doc.id,
       link_reach: linkReach as LinkReach,
-      //link_role: linkRole,
+      link_role: (linkRole as LinkRole | undefined) || undefined,
     });
-  }, [linkReach, doc, updateDocLink]);
+  }, [linkReach, doc, updateDocLink, redirectToDoc, linkRole]);
+
+  if (!linkReach && linkRole) {
+    console.warn('link-reach parameter is missing');
+  }
 
   return <Loading />;
 };