feat: improve management of root element creation

axelor · Dec 16, 2024 · 83cef98 · 83cef98
1 parent 69d6665
commit 83cef98
Show file tree

Hide file tree

Showing 9 changed files with 80 additions and 47 deletions.
diff --git a/changelogs/unreleased/88573.json b/changelogs/unreleased/88573.json
@@ -0,0 +1,5 @@
+{
+  "title": "SearchTreeView: add onParentChange props to get parent update",
+  "type": "feat",
+  "packages": "core"
+}
diff --git a/...s/apps/dms/src/components/organisms/ParentDirectorySearchBar/ParentDirectorySearchBar.tsx b/...s/apps/dms/src/components/organisms/ParentDirectorySearchBar/ParentDirectorySearchBar.tsx
@@ -17,8 +17,9 @@
  */
 
 import React, {useCallback, useMemo} from 'react';
+import {StyleSheet} from 'react-native';
 import {useDispatch, useSelector, useTranslator} from '@axelor/aos-mobile-core';
-import {AutoCompleteSearch} from '@axelor/aos-mobile-ui';
+import {AutoCompleteSearch, Label} from '@axelor/aos-mobile-ui';
 import {searchDirectory} from '../../../features/documentSlice';
 
 interface ParentDirectorySearchBarProps {
@@ -28,6 +29,7 @@ interface ParentDirectorySearchBarProps {
   onChange?: (any: any) => void;
   readonly?: boolean;
   required?: boolean;
+  displayRootInfo?: boolean;
 }
 
 const ParentDirectorySearchBar = ({
@@ -37,6 +39,7 @@ const ParentDirectorySearchBar = ({
   onChange = () => {},
   readonly = false,
   required = false,
+  displayRootInfo = false,
 }: ParentDirectorySearchBarProps) => {
   const I18n = useTranslator();
   const dispatch = useDispatch();
@@ -69,26 +72,42 @@ const ParentDirectorySearchBar = ({
   );
 
   return (
-    <AutoCompleteSearch
-      style={style}
-      title={I18n.t(title)}
-      objectList={extendedDirectoryList}
-      value={defaultValue}
-      required={required}
-      readonly={readonly}
-      onChangeValue={onChange}
-      fetchData={searchParentDirectoryAPI}
-      displayValue={item => item.fileName}
-      placeholder={I18n.t(title)}
-      showDetailsPopup={true}
-      loadingList={loadingDirectory}
-      moreLoading={moreLoadingDirectory}
-      isListEnd={isListEndDirectory}
-      navigate={false}
-      oneFilter={false}
-      translator={I18n.t}
-    />
+    <>
+      <AutoCompleteSearch
+        style={style}
+        title={I18n.t(title)}
+        objectList={extendedDirectoryList}
+        value={defaultValue}
+        required={required}
+        readonly={readonly}
+        onChangeValue={onChange}
+        fetchData={searchParentDirectoryAPI}
+        displayValue={item => item.fileName}
+        placeholder={I18n.t(title)}
+        showDetailsPopup={true}
+        loadingList={loadingDirectory}
+        moreLoading={moreLoadingDirectory}
+        isListEnd={isListEndDirectory}
+        navigate={false}
+        oneFilter={false}
+        translator={I18n.t}
+      />
+      {displayRootInfo && (
+        <Label
+          style={styles.label}
+          type="info"
+          message={I18n.t('Dms_SearchBarRootInfo')}
+        />
+      )}
+    </>
   );
 };
 
+const styles = StyleSheet.create({
+  label: {
+    width: '90%',
+    alignSelf: 'center',
+  },
+});
+
 export default ParentDirectorySearchBar;
diff --git a/packages/apps/dms/src/components/templates/DocumentList/DocumentList.tsx b/packages/apps/dms/src/components/templates/DocumentList/DocumentList.tsx
@@ -16,8 +16,9 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React, {useMemo, useState} from 'react';
+import React, {useEffect, useMemo, useState} from 'react';
 import {
+  headerActionsProvider,
   SearchTreeView,
   useNavigation,
   useSelector,
@@ -41,6 +42,7 @@ const DocumentList = ({defaultParent}: DocumentListProps) => {
 
   const [author, setAuthor] = useState(null);
   const [selectedExtensions, setSelectedExtensions] = useState([]);
+  const [parentList, setParentList] = useState([]);
 
   const {
     loadingDocument,
@@ -66,6 +68,25 @@ const DocumentList = ({defaultParent}: DocumentListProps) => {
     [author?.id, selectedExtensions],
   );
 
+  useEffect(() => {
+    headerActionsProvider.registerModel('dms_all_documents', {
+      actions: [
+        {
+          key: 'newDocument',
+          order: 10,
+          iconName: 'plus-lg',
+          title: I18n.t('Dms_NewDocument'),
+          iconColor: Colors.primaryColor.background,
+          onPress: () =>
+            navigation.navigate('DocumentFormScreen', {
+              parent: parentList.at(-1),
+            }),
+          showInHeader: true,
+        },
+      ],
+    });
+  }, [Colors, I18n, navigation, parentList]);
+
   return (
     <Screen removeSpaceOnTop={true}>
       <SearchTreeView
@@ -128,6 +149,7 @@ const DocumentList = ({defaultParent}: DocumentListProps) => {
         }
         displayBreadcrumb
         defaultParent={defaultParent}
+        onParentChange={setParentList}
       />
     </Screen>
   );

diff --git a/packages/apps/dms/src/hooks/use-dms-header-actions.ts b/packages/apps/dms/src/hooks/use-dms-header-actions.ts
@@ -24,36 +24,12 @@ import {
   useSelector,
   useTranslator,
 } from '@axelor/aos-mobile-core';
-import {useThemeColor} from '@axelor/aos-mobile-ui';
 import {getAction} from '../utils';
 
 export const useDMSHeaders = () => {
-  useAllDocumentsActions();
   useAttachedFilesGenericAction();
 };
 
-const useAllDocumentsActions = () => {
-  const Colors = useThemeColor();
-  const navigation = useNavigation();
-  const I18n = useTranslator();
-
-  useEffect(() => {
-    headerActionsProvider.registerModel('dms_all_documents', {
-      actions: [
-        {
-          key: 'newDocument',
-          order: 10,
-          iconName: 'plus-lg',
-          title: I18n.t('Dms_NewDocument'),
-          iconColor: Colors.primaryColor.background,
-          onPress: () => navigation.navigate('DocumentFormScreen'),
-          showInHeader: true,
-        },
-      ],
-    });
-  }, [Colors, I18n, navigation]);
-};
-
 const useAttachedFilesGenericAction = () => {
   const I18n = useTranslator();
   const navigation = useNavigation();

diff --git a/packages/apps/dms/src/i18n/en.json b/packages/apps/dms/src/i18n/en.json
@@ -17,6 +17,7 @@
   "Dms_AttachedFiles": "Attached files",
   "Dms_NoAttachedFiles": "No attached files",
   "Dms_DoYouWantToAddFile": "Do you want to add a file?",
+  "Dms_SearchBarRootInfo": "To add a document to your root folder you must select 'Root' in the search bar",
   "Dms_SliceAction_SearchDocument": "search document",
   "Dms_SliceAction_SearchDirectory": "search directory",
   "Dms_SliceAction_SearchFavoriteDocument": "search favorite document",

diff --git a/packages/apps/dms/src/i18n/fr.json b/packages/apps/dms/src/i18n/fr.json
@@ -17,6 +17,7 @@
   "Dms_AttachedFiles": "Fichiers joints",
   "Dms_NoAttachedFiles": "Pas de fichiers joints",
   "Dms_DoYouWantToAddFile": "Voulez-vous ajouter un fichier ?",
+  "Dms_SearchBarRootInfo": "Pour ajouter un document à votre dossier racine il faut sélectionner 'Racine' dans la barre de recherche",
   "Dms_SliceAction_SearchDocument": "recherche sur les documents",
   "Dms_SliceAction_SearchDirectory": "recherche sur les dossiers",
   "Dms_SliceAction_SearchFavoriteDocument": "recherche sur les documents favoris",

diff --git a/packages/apps/dms/src/models/forms.ts b/packages/apps/dms/src/models/forms.ts
@@ -36,6 +36,7 @@ export const dms_formsRegister: FormConfigs = {
         type: 'object',
         widget: 'custom',
         customComponent: ParentDirectorySearchBar,
+        options: {displayRootInfo: true},
         hideIf: ({objectState}) => objectState.isAttachedFileCreation,
         requiredIf: ({objectState}) =>
           !objectState.parent?.fileName && !objectState.isAttachedFileCreation,

diff --git a/packages/apps/dms/src/screens/DocumentFormScreen.tsx b/packages/apps/dms/src/screens/DocumentFormScreen.tsx
@@ -34,9 +34,11 @@ const DocumentFormScreen = ({navigation, route}) => {
   const creationDefaultValue = useMemo(
     () => ({
       isAttachedFileCreation: model && modelId,
-      parent: parent,
+      parent: parent ?? {
+        fileName: I18n.t('Dms_Root'),
+      },
     }),
-    [model, modelId, parent],
+    [I18n, model, modelId, parent],
   );
 
   const defaultValue = useMemo(

diff --git a/packages/core/src/components/templates/SearchTreeView/SearchTreeView.tsx b/packages/core/src/components/templates/SearchTreeView/SearchTreeView.tsx
@@ -69,6 +69,7 @@ interface SearchTreeViewProps {
   verticalActions?: boolean;
   displayBreadcrumb?: boolean;
   defaultParent?: any;
+  onParentChange?: (parent: any) => void;
 }
 
 const SearchTreeView = ({
@@ -107,6 +108,7 @@ const SearchTreeView = ({
   verticalActions,
   displayBreadcrumb = false,
   defaultParent,
+  onParentChange,
 }: SearchTreeViewProps) => {
   const I18n = useTranslator();
   const dispatch = useDispatch();
@@ -123,6 +125,10 @@ const SearchTreeView = ({
     }
   }, [defaultParent, isFocused]);
 
+  useEffect(() => {
+    onParentChange(parent);
+  }, [onParentChange, parent]);
+
   const handleChangeParent = value => {
     setParent(current => {
       const _parent = [...current];