feat: add possibility to create an event from the planning view

changelogs/unreleased/87524.json

@@ -0,0 +1,5 @@
+{
+  "title": "Planning view: add possibility to create an event",
+  "type": "feat",
+  "packages": "crm"
+}

packages/apps/crm/src/hooks/use-crm-header-actions.ts

@@ -386,11 +386,34 @@ const useEventDetailsActions = () => {
   }, [mobileSettings, event]);
 };
 
+const useEventPlanningActions = () => {
+  const I18n = useTranslator();
+  const navigation = useNavigation();
+  const {canCreate} = usePermitted({modelName: 'com.axelor.apps.crm.db.Event'});
+
+  useEffect(() => {
+    headerActionsProvider.registerModel('crm_event_planning', {
+      actions: [
+        {
+          key: 'event-openEventForm',
+          order: 10,
+          iconName: 'calendar-plus-fill',
+          title: I18n.t('Crm_CreateEvent'),
+          hideIf: !canCreate,
+          onPress: () => navigation.navigate('EventFormScreen'),
+          showInHeader: true,
+        },
+      ],
+    });
+  }, [navigation, canCreate, I18n]);
+};
+
 export const useCRMHeaders = () => {
   useCatalogListActions();
   useClientDetailsActions();
   useContactDetailsActions();
   useEventDetailsActions();
+  useEventPlanningActions();
   useLeadListActions();
   useLeadDetailsActions();
   useOpportunityListActions();

packages/apps/crm/src/screens/event/EventPlanningScreen.js

@@ -23,6 +23,7 @@ import {
   filterChip,
   PlanningView,
   useDispatch,
+  useIsFocused,
   useSelector,
   useTranslator,
   useTypes,
@@ -34,6 +35,7 @@ import {EventSearchBar, PlanningEventCard} from '../../components';
 function EventPlanningScreen({navigation}) {
   const dispatch = useDispatch();
   const I18n = useTranslator();
+  const isFocused = useIsFocused();
   const {Event} = useTypes();
   const {getItemColor, getSelectionItems} = useTypeHelpers();
 
@@ -77,9 +79,10 @@ function EventPlanningScreen({navigation}) {
   const fetchItemsByMonth = useCallback(
     date => {
       dateSave === null && setDateSave(date);
-      dispatch(fetchPlannedEvent({date: date, searchValue: filter}));
+      isFocused &&
+        dispatch(fetchPlannedEvent({date: date, searchValue: filter}));
     },
-    [dispatch, dateSave, filter],
+    [dispatch, dateSave, filter, isFocused],
   );
 
   const filterOnStatus = useCallback(

packages/apps/crm/src/screens/event/index.js

@@ -24,6 +24,7 @@ export default {
   EventPlanningScreen: {
     title: 'Crm_Events',
     component: EventPlanningScreen,
+    actionID: 'crm_event_planning',
     options: {
       shadedHeader: false,
     },