Develop

package.json

@@ -12,6 +12,7 @@
     "compressorjs": "^1.1.1",
     "env-cmd": "^10.1.0",
     "i18next": "^22.0.5",
+    "immutability-helper": "^3.1.1",
     "js-cookie": "^3.0.1",
     "localforage": "^1.10.0",
     "moment": "^2.29.4",
@@ -20,6 +21,8 @@
     "rc-year-calendar": "^1.0.2",
     "react": "^18.2.0",
     "react-colorful": "^5.6.1",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.2.0",
     "react-easy-crop": "^5.0.0",
     "react-i18next": "^12.0.0",

src/components/Accordion/CalendarAccordion/CalendarAccordion.jsx

@@ -90,10 +90,24 @@ function CalendarAccordion(props) {
       .unwrap()
       .then((response) => {
         if (type == 'organizers') {
-          setOrganizersList(treeEntitiesOption(response, user, calendarContentLanguage, sourceOptions.CMS));
+          setOrganizersList(
+            treeEntitiesOption(
+              response?.map((v) => ({ ...v, image: v?.image?.find((image) => image?.isMain) })),
+              user,
+              calendarContentLanguage,
+              sourceOptions.CMS,
+            ),
+          );
         }
         if (type == 'people') {
-          setPeopleList(treeEntitiesOption(response, user, calendarContentLanguage, sourceOptions.CMS));
+          setPeopleList(
+            treeEntitiesOption(
+              response?.map((v) => ({ ...v, image: v?.image?.find((image) => image?.isMain) })),
+              user,
+              calendarContentLanguage,
+              sourceOptions.CMS,
+            ),
+          );
         }
       })
       .catch((error) => console.log(error));
@@ -111,13 +125,27 @@ function CalendarAccordion(props) {
 
   useEffect(() => {
     if (initialEntities && currentCalendarData) {
-      setOrganizersList(treeEntitiesOption(initialEntities, user, calendarContentLanguage, sourceOptions.CMS));
+      setOrganizersList(
+        treeEntitiesOption(
+          initialEntities?.map((v) => ({ ...v, image: v?.image?.find((image) => image?.isMain) })),
+          user,
+          calendarContentLanguage,
+          sourceOptions.CMS,
+        ),
+      );
     }
   }, [initialEntityLoading, currentCalendarData]);
 
   useEffect(() => {
     if (initialPersonEntities && currentCalendarData) {
-      setPeopleList(treeEntitiesOption(initialPersonEntities, user, calendarContentLanguage, sourceOptions.CMS));
+      setPeopleList(
+        treeEntitiesOption(
+          initialPersonEntities?.map((v) => ({ ...v, image: v?.image?.find((image) => image?.isMain) })),
+          user,
+          calendarContentLanguage,
+          sourceOptions.CMS,
+        ),
+      );
     }
   }, [initialPersonEntityLoading, currentCalendarData]);
 
@@ -170,7 +198,11 @@ function CalendarAccordion(props) {
           if (response?.data?.length > 0)
             setSelectedPeople(
               treeEntitiesOption(
-                response?.data?.map((v) => ({ ...v, type: entitiesClass.people })),
+                response?.data?.map((v) => ({
+                  ...v,
+                  type: entitiesClass.people,
+                  image: v?.image?.find((image) => image?.isMain),
+                })),
                 user,
                 calendarContentLanguage,
                 sourceOptions.CMS,