🚚(frontend) reduce features coupling

Move some components and assets to `doc-management`
to reduce coupling between features:
- SimpleDocItem from `doc-grid` to `doc-management`
- useCreateChildDoc from `doc-tree` to `doc-management`
- isOwnerOrAdmin from `doc-tree` to `doc-management`

Author: AntoLC

src/frontend/apps/impress/src/features/docs/doc-management/api/index.ts

@@ -1,3 +1,4 @@
+export * from './useCreateChildDoc';
 export * from './useCreateDoc';
 export * from './useCreateFavoriteDoc';
 export * from './useDeleteFavoriteDoc';

src/frontend/apps/impress/src/features/docs/doc-tree/api/useCreateChildren.tsx renamed to src/frontend/apps/impress/src/features/docs/doc-management/api/useCreateChildDoc.tsx

@@ -2,16 +2,16 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
 
 import { APIError, errorCauses, fetchAPI } from '@/api';
 
-import { Doc, KEY_LIST_DOC } from '../../doc-management';
+import { Doc, KEY_LIST_DOC } from '..';
 
-export type CreateDocParam = Pick<Doc, 'title'> & {
+export type CreateChildDocParam = Pick<Doc, 'title'> & {
   parentId: string;
 };
 
-export const createDocChildren = async ({
+export const createChildDoc = async ({
   title,
   parentId,
-}: CreateDocParam): Promise<Doc> => {
+}: CreateChildDocParam): Promise<Doc> => {
   const response = await fetchAPI(`documents/${parentId}/children/`, {
     method: 'POST',
     body: JSON.stringify({
@@ -26,19 +26,19 @@ export const createDocChildren = async ({
   return response.json() as Promise<Doc>;
 };
 
-interface CreateDocProps {
-  onSuccess: (data: Doc) => void;
+interface UseCreateChildDocProps {
+  onSuccess: (doc: Doc) => void;
 }
 
-export function useCreateChildrenDoc({ onSuccess }: CreateDocProps) {
+export function useCreateChildDoc({ onSuccess }: UseCreateChildDocProps) {
   const queryClient = useQueryClient();
-  return useMutation<Doc, APIError, CreateDocParam>({
-    mutationFn: createDocChildren,
-    onSuccess: (data) => {
+  return useMutation<Doc, APIError, CreateChildDocParam>({
+    mutationFn: createChildDoc,
+    onSuccess: (doc) => {
       void queryClient.resetQueries({
         queryKey: [KEY_LIST_DOC],
       });
-      onSuccess(data);
+      onSuccess(doc);
     },
   });
 }

src/frontend/apps/impress/src/features/docs/docs-grid/assets/pinned-document.svg renamed to src/frontend/apps/impress/src/features/docs/doc-management/assets/pinned-document.svg

@@ -1 +1,2 @@
 export * from './ModalRemoveDoc';
+export * from './SimpleDocItem';

src/frontend/apps/impress/src/features/docs/docs-grid/assets/simple-document.svg renamed to src/frontend/apps/impress/src/features/docs/doc-management/assets/simple-document.svg

@@ -22,3 +22,9 @@ export const base64ToYDoc = (base64: string) => {
 export const base64ToBlocknoteXmlFragment = (base64: string) => {
   return base64ToYDoc(base64).getXmlFragment('document-store');
 };
+
+export const isOwnerOrAdmin = (doc: Doc): boolean => {
+  return doc.user_roles.some(
+    (role) => role === Role.OWNER || role === Role.ADMIN,
+  );
+};

src/frontend/apps/impress/src/features/docs/docs-grid/components/SimpleDocItem.tsx renamed to src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx

@@ -1,7 +1,6 @@
 import { Box, Icon } from '@/components';
 import { QuickSearchItemContent } from '@/components/quick-search/';
-import { Doc } from '@/docs/doc-management';
-import { SimpleDocItem } from '@/docs/docs-grid/';
+import { Doc, SimpleDocItem } from '@/docs/doc-management';
 import { useResponsiveStore } from '@/stores';
 
 type DocSearchItemProps = {

src/frontend/apps/impress/src/features/docs/doc-management/components/index.ts

@@ -10,9 +10,14 @@ import { css } from 'styled-components';
 
 import { Box, StyledLink } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
+import {
+  Doc,
+  KEY_SUB_PAGE,
+  SimpleDocItem,
+  useDoc,
+  useDocStore,
+} from '@/docs/doc-management';
 
-import { Doc, KEY_SUB_PAGE, useDoc, useDocStore } from '../../doc-management';
-import { SimpleDocItem } from '../../docs-grid';
 import { useDocTree } from '../api/useDocTree';
 import { useMoveDoc } from '../api/useMove';
 import { canDrag, canDrop, serializeDocToSubPage } from '../utils';

src/frontend/apps/impress/src/features/docs/doc-management/utils.ts

@@ -10,14 +10,18 @@ import { useTranslation } from 'react-i18next';
 import { css } from 'styled-components';
 
 import { Box, BoxButton, Icon } from '@/components';
+import {
+  Doc,
+  ModalRemoveDoc,
+  isOwnerOrAdmin,
+  useCopyDocLink,
+  useCreateChildDoc,
+} from '@/docs/doc-management';
 import { useLeftPanelStore } from '@/features/left-panel';
 
-import { Doc, ModalRemoveDoc, useCopyDocLink } from '../../doc-management';
-import { useCreateChildrenDoc } from '../api/useCreateChildren';
 import { useDetachDoc } from '../api/useDetach';
 import MoveDocIcon from '../assets/doc-extract-bold.svg';
 import { useTreeUtils } from '../hooks';
-import { isOwnerOrAdmin } from '../utils';
 
 type DocTreeItemActionsProps = {
   doc: Doc;
@@ -92,7 +96,7 @@ export const DocTreeItemActions = ({
     },
   ];
 
-  const { mutate: createChildrenDoc } = useCreateChildrenDoc({
+  const { mutate: createChildDoc } = useCreateChildDoc({
     onSuccess: (doc) => {
       onCreateSuccess?.(doc);
       togglePanel();
@@ -144,7 +148,7 @@ export const DocTreeItemActions = ({
               e.stopPropagation();
               e.preventDefault();
 
-              createChildrenDoc({
+              createChildDoc({
                 parentId: doc.id,
               });
             }}

src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchItem.tsx

@@ -1,6 +1,6 @@
 import { TreeViewDataType } from '@gouvfr-lasuite/ui-kit';
 
-import { Doc, Role } from '../doc-management';
+import { Doc, isOwnerOrAdmin } from '../doc-management';
 
 export const serializeDocToSubPage = (doc: Doc): Doc => {
   return { ...doc, childrenCount: doc.numchild };
@@ -14,12 +14,6 @@ export const subPageToTree = (children: Doc[]): TreeViewDataType<Doc>[] => {
   return children;
 };
 
-export const isOwnerOrAdmin = (doc: Doc): boolean => {
-  return doc.user_roles.some(
-    (role) => role === Role.OWNER || role === Role.ADMIN,
-  );
-};
-
 export const canDrag = (doc: Doc): boolean => {
   return isOwnerOrAdmin(doc);
 };

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocTree.tsx

@@ -5,19 +5,20 @@ import { css } from 'styled-components';
 
 import { Box, Icon, StyledLink, Text } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
-import { Doc, LinkReach } from '@/docs/doc-management';
+import { Doc, LinkReach, SimpleDocItem } from '@/docs/doc-management';
 import { DocShareModal } from '@/docs/doc-share';
 import { useResponsiveStore } from '@/stores';
 
 import { useResponsiveDocGrid } from '../hooks/useResponsiveDocGrid';
 
 import { DocsGridActions } from './DocsGridActions';
 import { DocsGridItemSharedButton } from './DocsGridItemSharedButton';
-import { SimpleDocItem } from './SimpleDocItem';
+
 type DocsGridItemProps = {
   doc: Doc;
   dragMode?: boolean;
 };
+
 export const DocsGridItem = ({ doc, dragMode = false }: DocsGridItemProps) => {
   const { t } = useTranslation();
   const { isDesktop } = useResponsiveStore();

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocTreeItemActions.tsx

@@ -1,4 +1,3 @@
 export * from './DocsGrid';
 export * from './DocsGridActions';
-export * from './SimpleDocItem';
 export * from './DocsGridLoader';

src/frontend/apps/impress/src/features/docs/doc-tree/utils.ts

@@ -3,9 +3,9 @@ import { css } from 'styled-components';
 
 import { Box, StyledLink } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
-import { Doc } from '@/docs/doc-management';
+import { Doc, SimpleDocItem } from '@/docs/doc-management';
 import { DocShareModal } from '@/docs/doc-share';
-import { DocsGridActions, SimpleDocItem } from '@/docs/docs-grid';
+import { DocsGridActions } from '@/docs/docs-grid';
 import { useResponsiveStore } from '@/stores';
 
 type LeftPanelFavoriteItemProps = {

src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridItem.tsx

@@ -3,9 +3,13 @@ import { Button } from '@openfun/cunningham-react';
 import { useRouter } from 'next/router';
 import { useTranslation } from 'react-i18next';
 
-import { Doc, useCreateDoc, useDocStore } from '@/features/docs';
-import { useCreateChildrenDoc } from '@/features/docs/doc-tree/api/useCreateChildren';
-import { isOwnerOrAdmin } from '@/features/docs/doc-tree/utils';
+import {
+  Doc,
+  isOwnerOrAdmin,
+  useCreateChildDoc,
+  useCreateDoc,
+  useDocStore,
+} from '@/docs/doc-management';
 
 import { useLeftPanelStore } from '../stores';
 
@@ -44,7 +48,7 @@ export const LeftPanelHeaderDocButton = () => {
   const { togglePanel } = useLeftPanelStore();
   const treeContext = useTreeContext<Doc>();
   const tree = treeContext?.treeData;
-  const { mutate: createChildrenDoc } = useCreateChildrenDoc({
+  const { mutate: createChildDoc } = useCreateChildDoc({
     onSuccess: (doc) => {
       tree?.addRootNode(doc);
       tree?.selectNodeById(doc.id);
@@ -54,19 +58,20 @@ export const LeftPanelHeaderDocButton = () => {
   });
 
   const onCreateDoc = () => {
-    if (treeContext && treeContext.root) {
-      createChildrenDoc({
-        parentId: treeContext.root.id,
-      });
+    if (!treeContext?.root) {
+      return;
     }
+
+    createChildDoc({
+      parentId: treeContext.root.id,
+    });
   };
 
+  const disabled =
+    (currentDoc && !isOwnerOrAdmin(currentDoc)) || !treeContext?.root;
+
   return (
-    <Button
-      color="tertiary"
-      onClick={onCreateDoc}
-      disabled={currentDoc && !isOwnerOrAdmin(currentDoc)}
-    >
+    <Button color="tertiary" onClick={onCreateDoc} disabled={disabled}>
       {t('New page')}
     </Button>
   );