From 6dd6144f911c2360fd3d57a85de9658b17a77b0c Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Thu, 9 Nov 2023 13:30:49 +0530
Subject: [PATCH 1/6] feat: added support for parent-child node in treeselect
 ,closes #culturecreates/tech-support-tickets/issues/11

---
 .../TreeSelectOption/TreeSelectOption.jsx     |  5 ++-
 .../treeSelectOption.settings.js              | 31 +++++++++++++++++--
 2 files changed, 32 insertions(+), 4 deletions(-)

diff --git a/src/components/TreeSelectOption/TreeSelectOption.jsx b/src/components/TreeSelectOption/TreeSelectOption.jsx
index 0a0cd451f..2ce031e76 100644
--- a/src/components/TreeSelectOption/TreeSelectOption.jsx
+++ b/src/components/TreeSelectOption/TreeSelectOption.jsx
@@ -3,6 +3,8 @@ import { TreeSelect } from 'antd';
 import './treeSelectOption.css';
 
 function TreeSelectOption(props) {
+  const TITLE = 'title';
+  const LABEL = 'label';
   return (
     <TreeSelect
       getPopupContainer={(trigger) => trigger.parentNode}
@@ -13,7 +15,8 @@ function TreeSelectOption(props) {
       }}
       multiple
       showSearch
-      treeNodeFilterProp={'title'}
+      treeNodeFilterProp={TITLE}
+      treeNodeLabelProp={LABEL}
       {...props}
       showArrow={props?.showArrow ?? true}
     />
diff --git a/src/components/TreeSelectOption/treeSelectOption.settings.js b/src/components/TreeSelectOption/treeSelectOption.settings.js
index 7351cfa68..5a7fd8f97 100644
--- a/src/components/TreeSelectOption/treeSelectOption.settings.js
+++ b/src/components/TreeSelectOption/treeSelectOption.settings.js
@@ -5,7 +5,7 @@ import { ReactComponent as Organizations } from '../../assets/icons/organisation
 import { taxonomyClass } from '../../constants/taxonomyClass';
 import { sourceOptions } from '../../constants/sourceOptions';
 
-const handleMultilevelTreeSelect = (children, user, calendarContentLanguage) => {
+const handleMultilevelTreeSelect = (children, user, calendarContentLanguage, parentLabel) => {
   return children?.map((child) => {
     return {
       title: contentLanguageBilingual({
@@ -16,8 +16,17 @@ const handleMultilevelTreeSelect = (children, user, calendarContentLanguage) =>
       }),
       value: child?.id,
       ...(child?.children && {
-        children: handleMultilevelTreeSelect(child?.children, user, calendarContentLanguage),
+        children: handleMultilevelTreeSelect(child?.children, user, calendarContentLanguage, parentLabel),
       }),
+      label:
+        parentLabel +
+        '-' +
+        contentLanguageBilingual({
+          en: child?.name?.en,
+          fr: child?.name?.fr,
+          interfaceLanguage: user?.interfaceLanguage?.toLowerCase(),
+          calendarContentLanguage: calendarContentLanguage,
+        }),
     };
   });
 };
@@ -43,7 +52,23 @@ export const treeTaxonomyOptions = (data, user, mappedToField, isDynamicField, c
         }),
         value: concept?.id,
         ...(concept?.children && {
-          children: handleMultilevelTreeSelect(concept?.children, user, calendarContentLanguage),
+          children: handleMultilevelTreeSelect(
+            concept?.children,
+            user,
+            calendarContentLanguage,
+            contentLanguageBilingual({
+              en: concept?.name?.en,
+              fr: concept?.name?.fr,
+              interfaceLanguage: user?.interfaceLanguage?.toLowerCase(),
+              calendarContentLanguage: calendarContentLanguage,
+            }),
+          ),
+        }),
+        label: contentLanguageBilingual({
+          en: concept?.name?.en,
+          fr: concept?.name?.fr,
+          interfaceLanguage: user?.interfaceLanguage?.toLowerCase(),
+          calendarContentLanguage: calendarContentLanguage,
         }),
       };
     });

From 33d62955d90f618d64f68133a5bfb411ad034582 Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Thu, 9 Nov 2023 15:18:45 +0530
Subject: [PATCH 2/6] feat: added translations for image crop modal,changed
 radio button color,closes #755

---
 src/components/ImageCrop/ImageCrop.jsx | 22 ++++++++++------------
 src/components/ImageCrop/imageCrop.css | 19 +++++++++++++++++--
 src/locales/en/translationEn.json      |  4 +++-
 src/locales/fr/transalationFr.json     |  8 +++++---
 4 files changed, 35 insertions(+), 18 deletions(-)

diff --git a/src/components/ImageCrop/ImageCrop.jsx b/src/components/ImageCrop/ImageCrop.jsx
index 40c3928bf..b22bddbb3 100644
--- a/src/components/ImageCrop/ImageCrop.jsx
+++ b/src/components/ImageCrop/ImageCrop.jsx
@@ -186,14 +186,6 @@ function ImageCrop(props) {
               {t('dashboard.events.addEditEvent.otherInformation.image.crop.subHeading')}
             </span>
           </Col>
-          <Col span={24}>
-            <span
-              className="quick-select-modal-sub-heading"
-              style={{ fontWeight: 700, color: '#222732' }}
-              data-cy="span-image-crop-frame-size-text">
-              {t('dashboard.events.addEditEvent.otherInformation.image.crop.savedFrameSize')}
-            </span>
-          </Col>
           <Col span={24}>
             <Radio.Group
               defaultValue={ASPECT_RATIO_TYPE.large.type}
@@ -201,11 +193,17 @@ function ImageCrop(props) {
               onChange={(event) => aspectRatioControl(event.target.value)}
               style={{ color: '#222732' }}>
               <Space direction="vertical">
-                <Radio value={ASPECT_RATIO_TYPE.large.type} data-cy="radio-button-large-aspect-ratio">
-                  {largeAspectRatio} {t('dashboard.events.addEditEvent.otherInformation.image.crop.ratio')}
+                <Radio
+                  value={ASPECT_RATIO_TYPE.large.type}
+                  data-cy="radio-button-large-aspect-ratio"
+                  className="image-ratio-text">
+                  {largeAspectRatio} {t('dashboard.events.addEditEvent.otherInformation.image.crop.largeImage')}
                 </Radio>
-                <Radio value={ASPECT_RATIO_TYPE.thumbnail.type} data-cy="radio-button-thumbnail-aspect-ratio">
-                  {thumbnailAspectRatio} {t('dashboard.events.addEditEvent.otherInformation.image.crop.ratio')}
+                <Radio
+                  value={ASPECT_RATIO_TYPE.thumbnail.type}
+                  data-cy="radio-button-thumbnail-aspect-ratio"
+                  className="image-ratio-text">
+                  {thumbnailAspectRatio} {t('dashboard.events.addEditEvent.otherInformation.image.crop.thumbnailImage')}
                 </Radio>
               </Space>
             </Radio.Group>
diff --git a/src/components/ImageCrop/imageCrop.css b/src/components/ImageCrop/imageCrop.css
index f5753f8ad..fa1e42278 100644
--- a/src/components/ImageCrop/imageCrop.css
+++ b/src/components/ImageCrop/imageCrop.css
@@ -60,6 +60,21 @@
   box-shadow: 0px 0px 0px 8px rgba(63, 81, 181, 0.16);
 }
 
-.image-crop-wrapper .crop-container .reactEasyCrop_Contain{
+.image-crop-wrapper .crop-container .reactEasyCrop_Contain {
   z-index: -1;
-}
\ No newline at end of file
+}
+
+.image-crop-wrapper .image-ratio-text {
+  color: #222732;
+  font-size: 16px;
+  font-style: normal;
+  line-height: 24px;
+}
+
+.image-crop-wrapper .image-ratio-text .ant-radio-inner::after {
+  background-color: #1b3de6;
+}
+
+.image-crop-wrapper .ant-radio-checked .ant-radio-inner {
+  border-color: #1b3de6;
+}
diff --git a/src/locales/en/translationEn.json b/src/locales/en/translationEn.json
index eddfa2cec..a9d076c86 100644
--- a/src/locales/en/translationEn.json
+++ b/src/locales/en/translationEn.json
@@ -233,8 +233,10 @@
             "crop": {
               "title": "Position image",
               "subHeading": "Adjust position if necessary.",
-              "savedFrameSize": "Saved frame sizes",
+              "savedFrameSize": "Available image ratios",
               "ratio": "Ratio",
+              "thumbnailImage": "Thumbnail image",
+              "largeImage": "Large image",
               "save": "Save",
               "cancel": "Cancel"
             }
diff --git a/src/locales/fr/transalationFr.json b/src/locales/fr/transalationFr.json
index 7d30c9c76..cda83b4ff 100644
--- a/src/locales/fr/transalationFr.json
+++ b/src/locales/fr/transalationFr.json
@@ -230,10 +230,12 @@
             "dragAndDrop": "ou glisser pour télécharger",
             "browse": "Parcourir",
             "crop": {
-              "title": "Position image",
-              "subHeading": "Adjust position if necessary.",
-              "savedFrameSize": "Saved frame sizes",
+              "title": "Positionnement de l’image",
+              "subHeading": "Ajuster la position de l’image si nécessaire.",
+              "savedFrameSize": "Ratios d'images disponibles",
               "ratio": "Ratio",
+              "thumbnailImage": "Vignette",
+              "largeImage": "Image grand format",
               "save": "Sauvegarder",
               "cancel": "Annuler"
             }

From e76f34c9686d1f4d8044051938b67d0d59eb5d57 Mon Sep 17 00:00:00 2001
From: syam babu <syam@dexlock.com>
Date: Thu, 9 Nov 2023 15:54:56 +0530
Subject: [PATCH 3/6] fix: closes #748. invitaion success message added

---
 src/locales/en/translationEn.json       | 2 +-
 src/locales/fr/transalationFr.json      | 2 +-
 src/pages/Dashboard/AddUser/AddUser.jsx | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/locales/en/translationEn.json b/src/locales/en/translationEn.json
index eddfa2cec..68d3bfabb 100644
--- a/src/locales/en/translationEn.json
+++ b/src/locales/en/translationEn.json
@@ -859,7 +859,7 @@
           "language": "Select preferred language."
         },
         "notification": {
-          "invitation": "Invitation send successfully",
+          "invitation": "Success! Invitation sent.",
           "updateUser": "Success! User profile has been updated.",
           "deleteUser": "Are you sure you want to permanently delete this user?"
         },
diff --git a/src/locales/fr/transalationFr.json b/src/locales/fr/transalationFr.json
index 7d30c9c76..ac4bf599c 100644
--- a/src/locales/fr/transalationFr.json
+++ b/src/locales/fr/transalationFr.json
@@ -853,7 +853,7 @@
           "language": "Sélectionnez la langue préférée"
         },
         "notification": {
-          "invitation": "L'invitation a été envoyée avec succès",
+          "invitation": "Succès! L'invitation a été envoyée.",
           "updateUser": "Succès ! Le profil de l'utilisateur a été mis à jour.",
           "deleteUser": "Êtes-vous sûr de vouloir supprimer définitivement cet utilisateur?"
         },
diff --git a/src/pages/Dashboard/AddUser/AddUser.jsx b/src/pages/Dashboard/AddUser/AddUser.jsx
index d886014ae..9e8ba3221 100644
--- a/src/pages/Dashboard/AddUser/AddUser.jsx
+++ b/src/pages/Dashboard/AddUser/AddUser.jsx
@@ -211,7 +211,7 @@ const AddUser = () => {
             language: values?.languagePreference?.key,
             calendarId,
           }).then((res) => {
-            if (res.statusCode == 202) {
+            if (res.statusCode == 201) {
               notification.success({
                 description: t(`dashboard.settings.addUser.notification.invitation`),
                 key: res.message,

From 1da23e0b9c9b3b6abe8a46c861d32ccd73c3e31d Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Fri, 10 Nov 2023 15:22:54 +0530
Subject: [PATCH 4/6] feat: added data cy attribute for antd components till
 date

---
 .../RecurringEvents/RecurringEvents.jsx       | 23 ++++++++---
 .../RecurringModal/RecurringModal.jsx         | 19 ++++++---
 src/pages/Dashboard/AddEvent/AddEvent.jsx     | 41 +++++++++++++------
 3 files changed, 60 insertions(+), 23 deletions(-)

diff --git a/src/components/RecurringEvents/RecurringEvents.jsx b/src/components/RecurringEvents/RecurringEvents.jsx
index 881ad58ed..c18014a49 100644
--- a/src/components/RecurringEvents/RecurringEvents.jsx
+++ b/src/components/RecurringEvents/RecurringEvents.jsx
@@ -317,7 +317,8 @@ const RecurringEvents = function ({
         <Form.Item
           name="frequency"
           label={t('dashboard.events.addEditEvent.dates.frequency')}
-          initialValue={formFields?.frequency ?? dateFrequencyOptions[0]?.value}>
+          initialValue={formFields?.frequency ?? dateFrequencyOptions[0]?.value}
+          data-cy="form-item-date-frequency-label">
           <Select
             style={{ height: '40px' }}
             options={dateFrequencyOptions}
@@ -398,17 +399,22 @@ const RecurringEvents = function ({
             name="startDateRecur"
             className="status-comment-item"
             label={t('dashboard.events.addEditEvent.dates.multipleDates')}
-            rules={[{ required: true, message: t('dashboard.events.addEditEvent.validations.date') }]}>
+            rules={[{ required: true, message: t('dashboard.events.addEditEvent.validations.date') }]}
+            data-cy="form-item-multiple-start-date-range-label">
             <DateRangePicker
               style={{ width: '423px' }}
               disabled={(isCustom || formFields?.frequency === 'CUSTOM') && startDateRecur?.length == 2 && true}
               suffixIcon={
                 subEventCount > 0 && (
-                  <Tags style={{ color: '#1572BB', borderRadius: '4px' }} color={'#DBF3FD'}>
+                  <Tags
+                    style={{ color: '#1572BB', borderRadius: '4px' }}
+                    color={'#DBF3FD'}
+                    data-cy="tag-sub-event-count">
                     {pluralize(subEventCount, t('dashboard.events.list.event'))}
                   </Tags>
                 )
               }
+              data-cy="multiple-start-date-range"
             />
           </Form.Item>
         </div>
@@ -441,11 +447,13 @@ const RecurringEvents = function ({
                   <Form.Item
                     name="startTimeRecur"
                     className="status-comment-item"
-                    label={t('dashboard.events.addEditEvent.dates.startTime')}>
+                    label={t('dashboard.events.addEditEvent.dates.startTime')}
+                    data-cy="form-item-multiple-start-time-label">
                     <TimePickerStyled
                       placeholder={t('dashboard.events.addEditEvent.dates.timeFormatPlaceholder')}
                       use12Hours={i18n?.language === 'en' ? true : false}
                       format={i18n?.language === 'en' ? 'h:mm a' : 'HH:mm'}
+                      data-cy="multiple-start-time"
                     />
                   </Form.Item>
                 </Col>
@@ -453,13 +461,15 @@ const RecurringEvents = function ({
                   <Form.Item
                     name="endTimeRecur"
                     className="status-comment-item"
-                    label={t('dashboard.events.addEditEvent.dates.endTime')}>
+                    label={t('dashboard.events.addEditEvent.dates.endTime')}
+                    data-cy="form-item-multiple-end-time">
                     <TimePickerStyled
                       placeholder={t('dashboard.events.addEditEvent.dates.timeFormatPlaceholder')}
                       use12Hours={i18n?.language === 'en' ? true : false}
                       format={i18n?.language === 'en' ? 'h:mm a' : 'HH:mm'}
                       disabledHours={disabledHours}
                       disabledMinutes={disabledMinutes}
+                      data-cy="multiple-end-time"
                     />
                   </Form.Item>
                 </Col>
@@ -499,7 +509,8 @@ const RecurringEvents = function ({
       <Form.Item
         name="daysOfWeek"
         label={t('dashboard.events.addEditEvent.dates.days')}
-        hidden={formFields?.frequency === dateFrequencyOptions[1].value ? false : true}>
+        hidden={formFields?.frequency === dateFrequencyOptions[1].value ? false : true}
+        data-cy="form-item-days-of-week">
         <div style={{ display: 'flex', gap: '8px' }}>
           {daysOfWeek.map((day, index) => {
             return (
diff --git a/src/components/RecurringEvents/RecurringModal/RecurringModal.jsx b/src/components/RecurringEvents/RecurringModal/RecurringModal.jsx
index 1438119e3..52249a242 100644
--- a/src/components/RecurringEvents/RecurringModal/RecurringModal.jsx
+++ b/src/components/RecurringEvents/RecurringModal/RecurringModal.jsx
@@ -241,11 +241,11 @@ const RecurringModal = ({
       onCancel={() => setIsModalVisible(false)}
       title={
         <div className="custom-modal-title-wrapper">
-          <span className="custom-modal-title-heading">
+          <span className="custom-modal-title-heading" data-cy="span-recurring-title">
             {t('dashboard.events.addEditEvent.dates.modal.titleHeading')}
           </span>
           <div className="custom-modal-title-right-contents">
-            <span className="custom-modal-title-heading">
+            <span className="custom-modal-title-heading" data-cy="span-recurring-start-date-end-date-title">
               {sortedDates?.length > 0 &&
                 moment(sortedDates[0]?.initDate).locale(i18n.language).format('MMMM DD, YYYY')}
               {sortedDates?.length > 1 &&
@@ -327,6 +327,7 @@ const RecurringModal = ({
               onRenderEnd={() => {
                 setIsCalendarRenderComplete(true);
               }}
+              data-cy="calendar-custom-dates"
             />
           )}
         </Col>
@@ -423,7 +424,8 @@ const RecurringModal = ({
                         <Form.Item
                           name="startTimeCustom"
                           //   className="status-comment-item"
-                          label={t('dashboard.events.addEditEvent.dates.startTime')}>
+                          label={t('dashboard.events.addEditEvent.dates.startTime')}
+                          data-cy="custom-start-time-label">
                           <TimePickerStyled
                             placeholder={t('dashboard.events.addEditEvent.dates.timeFormatPlaceholder')}
                             use12Hours={i18n?.language === 'en' ? true : false}
@@ -434,6 +436,7 @@ const RecurringModal = ({
                                 startTimeCustom: value,
                               });
                             }}
+                            data-cy="custom-start-time"
                           />
                         </Form.Item>
                       </Col>
@@ -441,7 +444,8 @@ const RecurringModal = ({
                         <Form.Item
                           name="endTimeCustom"
                           //   className="status-comment-item"
-                          label={t('dashboard.events.addEditEvent.dates.endTime')}>
+                          label={t('dashboard.events.addEditEvent.dates.endTime')}
+                          data-cy="custom-end-time-label">
                           <TimePickerStyled
                             placeholder={t('dashboard.events.addEditEvent.dates.timeFormatPlaceholder')}
                             use12Hours={i18n?.language === 'en' ? true : false}
@@ -452,12 +456,17 @@ const RecurringModal = ({
                                 endTimeCustom: value,
                               });
                             }}
+                            data-cy="custom-end-time"
                           />
                         </Form.Item>
                       </Col>
                     </Row>
                     <div className="flex-align">
-                      <Checkbox onChange={onChangeCheckbox} className="check-time" checked={updateAllTime}>
+                      <Checkbox
+                        onChange={onChangeCheckbox}
+                        className="check-time"
+                        checked={updateAllTime}
+                        data-cy="checkbox-add-time-to-all-dates">
                         {t('dashboard.events.addEditEvent.dates.modal.addTimeToAllDates')}
                       </Checkbox>
                       <div>
diff --git a/src/pages/Dashboard/AddEvent/AddEvent.jsx b/src/pages/Dashboard/AddEvent/AddEvent.jsx
index 16f8e3f65..af844b49d 100644
--- a/src/pages/Dashboard/AddEvent/AddEvent.jsx
+++ b/src/pages/Dashboard/AddEvent/AddEvent.jsx
@@ -1414,7 +1414,8 @@ function AddEvent() {
                     required: requiredFieldNames?.includes(eventFormRequiredFieldNames?.EVENT_TYPE),
                     message: t('dashboard.events.addEditEvent.validations.eventType'),
                   },
-                ]}>
+                ]}
+                data-cy="form-item-event-type-label">
                 <TreeSelectOption
                   placeholder={t('dashboard.events.addEditEvent.language.placeHolderEventType')}
                   allowClear
@@ -1428,11 +1429,13 @@ function AddEvent() {
                       <Tags
                         closable={closable}
                         onClose={onClose}
-                        closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
+                        closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}
+                        data-cy={`tag-event-type-${label}`}>
                         {label}
                       </Tags>
                     );
                   }}
+                  data-cy="treeselect-event-type"
                 />
               </Form.Item>
               <Form.Item
@@ -1454,7 +1457,8 @@ function AddEvent() {
                     required: requiredFieldNames?.includes(eventFormRequiredFieldNames?.AUDIENCE),
                     message: t('dashboard.events.addEditEvent.validations.targetAudience'),
                   },
-                ]}>
+                ]}
+                data-cy="form-item-audience-label">
                 <TreeSelectOption
                   allowClear
                   treeDefaultExpandAll
@@ -1462,10 +1466,12 @@ function AddEvent() {
                   clearIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '14px' }} />}
                   treeData={treeTaxonomyOptions(allTaxonomyData, user, 'Audience', false, calendarContentLanguage)}
                   placeholder={t('dashboard.events.addEditEvent.language.placeHolderTargetAudience')}
+                  data-cy="treeselect-audience"
                   tagRender={(props) => {
                     const { closable, onClose, label } = props;
                     return (
                       <Tags
+                        data-cy={`tag-audience-${label}`}
                         closable={closable}
                         onClose={onClose}
                         closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
@@ -1499,17 +1505,20 @@ function AddEvent() {
                       }
                       hidden={
                         dynamicAdminOnlyFields?.includes(taxonomy?.id) ? (adminCheckHandler() ? false : true) : false
-                      }>
+                      }
+                      data-cy={`form-item-${taxonomy?.id}`}>
                       <TreeSelectOption
                         allowClear
                         treeDefaultExpandAll
                         notFoundContent={<NoContent />}
                         clearIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '14px' }} />}
                         treeData={treeDynamicTaxonomyOptions(taxonomy?.concept, user, calendarContentLanguage)}
+                        data-cy={`treeselect-${taxonomy?.id}`}
                         tagRender={(props) => {
                           const { label, closable, onClose } = props;
                           return (
                             <Tags
+                              data-cy={`tag-${taxonomy?.id}`}
                               closable={closable}
                               onClose={onClose}
                               closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
@@ -1572,8 +1581,9 @@ function AddEvent() {
                                 required: requiredFieldNames?.includes(eventFormRequiredFieldNames?.START_DATE),
                                 message: t('dashboard.events.addEditEvent.validations.date'),
                               },
-                            ]}>
-                            <DatePickerStyled style={{ width: '423px' }} />
+                            ]}
+                            data-cy="form-item-event-single-date-label">
+                            <DatePickerStyled style={{ width: '423px' }} data-cy="single-date-event" />
                           </Form.Item>
                           <Row justify="space-between">
                             <Col flex={'203.5px'}>
@@ -1587,11 +1597,13 @@ function AddEvent() {
                                         eventData?.scheduleTimezone ?? 'Canada/Eastern',
                                       )
                                     : undefined
-                                }>
+                                }
+                                data-cy="form-item-single-date-start-time-label">
                                 <TimePickerStyled
                                   placeholder={t('dashboard.events.addEditEvent.dates.timeFormatPlaceholder')}
                                   use12Hours={i18n?.language === 'en' ? true : false}
                                   format={i18n?.language === 'en' ? 'h:mm a' : 'HH:mm'}
+                                  data-cy="single-date-start-time"
                                 />
                               </Form.Item>
                             </Col>
@@ -1603,11 +1615,13 @@ function AddEvent() {
                                   eventData?.endDateTime
                                     ? moment.tz(eventData?.endDateTime, eventData?.scheduleTimezone ?? 'Canada/Eastern')
                                     : undefined
-                                }>
+                                }
+                                data-cy="form-item-single-date-end-time-label">
                                 <TimePickerStyled
                                   placeholder={t('dashboard.events.addEditEvent.dates.timeFormatPlaceholder')}
                                   use12Hours={i18n?.language === 'en' ? true : false}
                                   format={i18n?.language === 'en' ? 'h:mm a' : 'HH:mm'}
+                                  data-cy="single-date-end-time"
                                 />
                               </Form.Item>
                             </Col>
@@ -1649,8 +1663,9 @@ function AddEvent() {
                               required: requiredFieldNames?.includes(eventFormRequiredFieldNames?.START_DATE),
                               message: t('dashboard.events.addEditEvent.validations.date'),
                             },
-                          ]}>
-                          <DateRangePicker style={{ width: '423px' }} />
+                          ]}
+                          data-cy="form-item-date-range-label">
+                          <DateRangePicker style={{ width: '423px' }} data-cy="date-range" />
                         </Form.Item>
                       )}
                       {dateType === dateTypes.MULTIPLE && (
@@ -1719,7 +1734,8 @@ function AddEvent() {
                   <Form.Item
                     name="eventStatus"
                     label={t('dashboard.events.addEditEvent.dates.status')}
-                    initialValue={eventData?.eventStatus ?? eventStatus.EventScheduled}>
+                    initialValue={eventData?.eventStatus ?? eventStatus.EventScheduled}
+                    data-cy="form-item-event-status-label">
                     <Select options={eventStatusOptions} data-cy="select-event-status" />
                   </Form.Item>
                 </Col>
@@ -1793,11 +1809,12 @@ function AddEvent() {
                   autoAdjustOverflow={false}
                   getPopupContainer={(trigger) => trigger.parentNode}
                   trigger={['click']}
+                  data-cy="popover-event-place"
                   content={
                     <div>
                       <div>
                         <>
-                          <div className="popover-section-header">
+                          <div className="popover-section-header" >
                             {t('dashboard.organization.createNew.search.footlightSectionHeading')}
                           </div>
                           <div className="search-scrollable-content">

From e35e14e0aec1b21a96d2f60a665158b943780590 Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Mon, 13 Nov 2023 12:50:15 +0530
Subject: [PATCH 5/6] chore: added data cy names to antd components in event
 form

---
 .../BilingualInput/BilingualInput.jsx         |   1 +
 src/components/ImageUpload/ImageUpload.jsx    |   1 +
 .../List/SelectionItem/SelectionItem.jsx      |  54 +++++---
 .../QuickCreateOrganization.jsx               |  12 +-
 .../QuickCreatePerson/QuickCreatePerson.jsx   |  16 ++-
 .../QuickCreatePlace/QuickCreatePlace.jsx     |  26 ++--
 .../QuickCreateSaving/QuickCreateSaving.jsx   |   4 +-
 src/components/TextEditor/TextEditor.jsx      |   7 +-
 src/pages/Dashboard/AddEvent/AddEvent.jsx     | 124 ++++++++++++------
 9 files changed, 166 insertions(+), 79 deletions(-)

diff --git a/src/components/BilingualInput/BilingualInput.jsx b/src/components/BilingualInput/BilingualInput.jsx
index 0529968d8..d95615e8e 100644
--- a/src/components/BilingualInput/BilingualInput.jsx
+++ b/src/components/BilingualInput/BilingualInput.jsx
@@ -65,6 +65,7 @@ function BilingualInput(props) {
       animated="false"
       tabBarStyle={{ margin: '0' }}
       className="bilingual-input-tab"
+      data-cy="bilingual-tabs"
     />
   );
 }
diff --git a/src/components/ImageUpload/ImageUpload.jsx b/src/components/ImageUpload/ImageUpload.jsx
index 2109283dc..cb7a76770 100644
--- a/src/components/ImageUpload/ImageUpload.jsx
+++ b/src/components/ImageUpload/ImageUpload.jsx
@@ -120,6 +120,7 @@ function ImageUpload(props) {
     <>
       <Form.Item name={formName ?? 'dragger'} valuePropName="fileList" getValueFromEvent={normFile}>
         <Upload.Dragger
+          data-cy="antd-image-upload"
           accept='.png, .jpg, .jpeg"'
           className="upload-wrapper"
           multiple={false}
diff --git a/src/components/List/SelectionItem/SelectionItem.jsx b/src/components/List/SelectionItem/SelectionItem.jsx
index 1f106b7eb..b89063374 100644
--- a/src/components/List/SelectionItem/SelectionItem.jsx
+++ b/src/components/List/SelectionItem/SelectionItem.jsx
@@ -39,13 +39,15 @@ function SelectionItem(props) {
       style={{ border: bordered && '1px solid#607EFC', width: itemWidth && itemWidth }}>
       <List.Item
         className="selection-item-list-wrapper"
+        data-cy="list-item"
         actions={[
           showExternalSourceLink && artsDataLink && (
             <ArtsDataLink
               onClick={(e) => {
                 e.stopPropagation();
                 window.open(`${artsDataLink}`, '_blank', 'noopener,noreferrer');
-              }}>
+              }}
+              data-cy="artsdata-link-tag">
               <span style={{ textDecoration: 'underline' }}>Artsdata</span>
               <LinkOutlined />
             </ArtsDataLink>
@@ -56,13 +58,19 @@ function SelectionItem(props) {
                 type="text"
                 key="list-loadmore-close"
                 onClick={onEdit}
-                style={{ color: '#1b3de6', fontSize: '12px', fontWeight: 600, padding: '0px' }}>
+                style={{ color: '#1b3de6', fontSize: '12px', fontWeight: 600, padding: '0px' }}
+                data-cy="button-edit-entity">
                 {t('dashboard.organization.readOnly.edit')}
               </Button>
             </ReadOnlyProtectedComponent>
           ),
           closable && (
-            <Button type="text" key="list-loadmore-close" onClick={onClose} style={{ padding: '0px' }}>
+            <Button
+              type="text"
+              key="list-loadmore-close"
+              onClick={onClose}
+              style={{ padding: '0px' }}
+              data-cy="button-close-entity">
               <CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '21px' }} />
             </Button>
           ),
@@ -78,10 +86,19 @@ function SelectionItem(props) {
                 backgroundColor: '#E3E8FF',
                 borderRadius: '4px',
               }}
+              data-cy="avatar-entity-logo"
             />
           }
-          title={<span className="selection-item-title">{name}</span>}
-          description={<span className="selection-item-subheading">{description}</span>}
+          title={
+            <span className="selection-item-title" data-cy="span-entity-name">
+              {name}
+            </span>
+          }
+          description={
+            <span className="selection-item-subheading" data-cy="span-entity-description">
+              {description}
+            </span>
+          }
         />
       </List.Item>
       {(postalAddress || accessibility) && (
@@ -90,7 +107,7 @@ function SelectionItem(props) {
             <Col flex="190px">
               <Row>
                 <Col>
-                  <span className="selection-item-sub-title">
+                  <span className="selection-item-sub-title" data-cy="span-street-address-title">
                     {t('dashboard.events.addEditEvent.location.streetAddress')}
                   </span>
                 </Col>
@@ -100,7 +117,7 @@ function SelectionItem(props) {
                   <div className="selection-item-sub-content">
                     <address>
                       {(postalAddress?.streetAddress?.en || postalAddress?.streetAddress?.fr) && (
-                        <span>
+                        <span data-cy="span-street-address">
                           {contentLanguageBilingual({
                             en: postalAddress?.streetAddress?.en,
                             fr: postalAddress?.streetAddress?.fr,
@@ -112,7 +129,7 @@ function SelectionItem(props) {
                       )}
                       {(postalAddress?.streetAddress?.en || postalAddress?.streetAddress?.fr) && <br />}
                       {postalAddress?.addressLocality && (
-                        <span>
+                        <span data-cy="span-address-locality">
                           {contentLanguageBilingual({
                             en: postalAddress?.addressLocality?.en,
                             fr: postalAddress?.addressLocality?.fr,
@@ -123,7 +140,7 @@ function SelectionItem(props) {
                         </span>
                       )}
                       {postalAddress?.addressRegion && (
-                        <span>
+                        <span data-cy="span-address-region">
                           {contentLanguageBilingual({
                             en: postalAddress?.addressRegion?.en,
                             fr: postalAddress?.addressRegion?.fr,
@@ -134,7 +151,7 @@ function SelectionItem(props) {
                         </span>
                       )}
 
-                      {postalAddress?.postalCode && <span>{postalAddress?.postalCode}</span>}
+                      {postalAddress?.postalCode && <span data-cy="span-postal-code">{postalAddress?.postalCode}</span>}
                       <br />
                       {Array.isArray(region) && (
                         <SmallButton
@@ -145,6 +162,7 @@ function SelectionItem(props) {
                             interfaceLanguage: user?.interfaceLanguage?.toLowerCase(),
                             calendarContentLanguage: calendarContentLanguage,
                           })}
+                          data-cy="show-region"
                         />
                       )}
                       {openingHours && (
@@ -154,8 +172,9 @@ function SelectionItem(props) {
                             target="_blank"
                             rel="noopener noreferrer"
                             className="selection-item-sub-content"
-                            style={{ color: '#0F0E98' }}>
-                            <span className="open-hour-url-link">
+                            style={{ color: '#0F0E98' }}
+                            data-cy="anchor-opening-hours">
+                            <span className="open-hour-url-link" data-cy="span-opening-hours">
                               {t('dashboard.events.addEditEvent.location.openingHours')}
                             </span>
                             &nbsp;
@@ -173,7 +192,7 @@ function SelectionItem(props) {
             <Col flex="190px">
               <Row>
                 <Col>
-                  <span className="selection-item-sub-title">
+                  <span className="selection-item-sub-title" data-cy="span-accessibility-title">
                     {t('dashboard.events.addEditEvent.location.venueAccessibility')}
                   </span>
                 </Col>
@@ -181,7 +200,7 @@ function SelectionItem(props) {
               <Row>
                 <Col>
                   {accessibility?.map((venueAccessibiltiy, index) => (
-                    <span className="selection-item-sub-content" key={index}>
+                    <span className="selection-item-sub-content" key={index} data-cy="span-accessibility">
                       {contentLanguageBilingual({
                         en: venueAccessibiltiy?.name?.en,
                         fr: venueAccessibiltiy?.name?.fr,
@@ -203,13 +222,14 @@ function SelectionItem(props) {
             <div className="arts-data-link-first-line">
               <span
                 style={{ textDecoration: 'underline', cursor: 'pointer' }}
-                onClick={() => window.open(`${artsDataLink}`, '_blank', 'noopener,noreferrer')}>
+                onClick={() => window.open(`${artsDataLink}`, '_blank', 'noopener,noreferrer')}
+                data-cy="span-artsdata-link">
                 Artsdata
               </span>
-              {name && <span>{name}</span>}
+              {name && <span data-cy="span-artsdata-entity-name">{name}</span>}
               {/* {description && <Badge color="#1B3DE6" size="small" />} */}
             </div>
-            {description && <span>{description}</span>}
+            {description && <span data-cy="span-artsdata-entity-description">{description}</span>}
           </div>
 
           <LinkOutlined style={{ fontSize: '16px' }} />
diff --git a/src/components/Modal/QuickCreateOrganization/QuickCreateOrganization.jsx b/src/components/Modal/QuickCreateOrganization/QuickCreateOrganization.jsx
index 13a844653..93af6c3be 100644
--- a/src/components/Modal/QuickCreateOrganization/QuickCreateOrganization.jsx
+++ b/src/components/Modal/QuickCreateOrganization/QuickCreateOrganization.jsx
@@ -328,7 +328,8 @@ function QuickCreateOrganization(props) {
                               );
                           },
                         }),
-                      ]}>
+                      ]}
+                      data-cy="form-item-quick-create-organizer-name-french-label">
                       <TextArea
                         autoSize
                         autoComplete="off"
@@ -367,7 +368,8 @@ function QuickCreateOrganization(props) {
                               );
                           },
                         }),
-                      ]}>
+                      ]}
+                      data-cy="form-item-quick-create-organizer-name-english-label">
                       <TextArea
                         autoSize
                         autoComplete="off"
@@ -389,7 +391,8 @@ function QuickCreateOrganization(props) {
                       type: 'url',
                       message: t('dashboard.events.addEditEvent.validations.url'),
                     },
-                  ]}>
+                  ]}
+                  data-cy="form-item-quick-create-organizer-website-label">
                   <StyledInput
                     addonBefore="https://"
                     autoComplete="off"
@@ -421,7 +424,8 @@ function QuickCreateOrganization(props) {
                           );
                       },
                     }),
-                  ]}>
+                  ]}
+                  data-cy="form-item-quick-create-organizer-logo-label">
                   <Row>
                     <Col>
                       <p
diff --git a/src/components/Modal/QuickCreatePerson/QuickCreatePerson.jsx b/src/components/Modal/QuickCreatePerson/QuickCreatePerson.jsx
index 385f37126..562cb4336 100644
--- a/src/components/Modal/QuickCreatePerson/QuickCreatePerson.jsx
+++ b/src/components/Modal/QuickCreatePerson/QuickCreatePerson.jsx
@@ -296,7 +296,8 @@ function QuickCreatePerson(props) {
                                 );
                             },
                           }),
-                        ]}>
+                        ]}
+                        data-cy="form-item-quick-create-person-name-french-label">
                         <TextArea
                           autoSize
                           autoComplete="off"
@@ -331,7 +332,8 @@ function QuickCreatePerson(props) {
                                 );
                             },
                           }),
-                        ]}>
+                        ]}
+                        data-cy="form-item-quick-create-person-name-english-label">
                         <TextArea
                           autoSize
                           autoComplete="off"
@@ -346,7 +348,8 @@ function QuickCreatePerson(props) {
                   <Form.Item
                     name="occupation"
                     label={taxonomyDetails(allTaxonomyData?.data, user, 'Occupation', 'name', false)}
-                    hidden={taxonomyDetails(allTaxonomyData?.data, user, 'Occupation', 'name', false) ? false : true}>
+                    hidden={taxonomyDetails(allTaxonomyData?.data, user, 'Occupation', 'name', false) ? false : true}
+                    data-cy="form-item-quick-create-person-occupation-label">
                     <TreeSelectOption
                       style={{
                         display: !taxonomyDetails(allTaxonomyData?.data, user, 'Occupation', 'name', false) && 'none',
@@ -365,13 +368,15 @@ function QuickCreatePerson(props) {
                         false,
                         calendarContentLanguage,
                       )}
+                      data-cy="treeselect-quick-create-person-occupation"
                       tagRender={(props) => {
                         const { label, closable, onClose } = props;
                         return (
                           <Tags
                             closable={closable}
                             onClose={onClose}
-                            closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
+                            closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}
+                            data-cy={`tags-quick-create-person-occupation-${label}`}>
                             {label}
                           </Tags>
                         );
@@ -386,7 +391,8 @@ function QuickCreatePerson(props) {
                         type: 'url',
                         message: t('dashboard.events.addEditEvent.validations.url'),
                       },
-                    ]}>
+                    ]}
+                    data-cy="form-item-quick-create-person-website-label">
                     <StyledInput
                       addonBefore="https://"
                       autoComplete="off"
diff --git a/src/components/Modal/QuickCreatePlace/QuickCreatePlace.jsx b/src/components/Modal/QuickCreatePlace/QuickCreatePlace.jsx
index 7bfe18e26..13d0ebfba 100644
--- a/src/components/Modal/QuickCreatePlace/QuickCreatePlace.jsx
+++ b/src/components/Modal/QuickCreatePlace/QuickCreatePlace.jsx
@@ -367,7 +367,8 @@ function QuickCreatePlace(props) {
                                 );
                             },
                           }),
-                        ]}>
+                        ]}
+                        data-cy="form-item-quick-create-place-name-french-label">
                         <TextArea
                           autoSize
                           autoComplete="off"
@@ -402,7 +403,8 @@ function QuickCreatePlace(props) {
                                 );
                             },
                           }),
-                        ]}>
+                        ]}
+                        data-cy="form-item-quick-create-place-name-english-label">
                         <TextArea
                           autoSize
                           autoComplete="off"
@@ -423,7 +425,8 @@ function QuickCreatePlace(props) {
                         message: t('dashboard.events.addEditEvent.location.quickCreatePlace.validations.address'),
                       },
                     ]}
-                    required>
+                    required
+                    data-cy="form-item-quick-create-place-address-label">
                     <PlacesAutocomplete value={address} onChange={handleChange} onSelect={handleSelect}>
                       {({ getInputProps, suggestions, getSuggestionItemProps }) => (
                         <Dropdown
@@ -443,7 +446,8 @@ function QuickCreatePlace(props) {
                             }),
                             selectable: true,
                           }}
-                          trigger={['click']}>
+                          trigger={['click']}
+                          data-cy="dropwdown-google-places">
                           <StyledInput
                             autoComplete="off"
                             {...getInputProps({
@@ -466,7 +470,8 @@ function QuickCreatePlace(props) {
 
                   <Form.Item
                     name="placeType"
-                    label={taxonomyDetails(allTaxonomyData?.data, user, 'Type', 'name', false)}>
+                    label={taxonomyDetails(allTaxonomyData?.data, user, 'Type', 'name', false)}
+                    data-cy="form-item-quick-create-place-type-label">
                     <TreeSelectOption
                       style={{
                         display: !taxonomyDetails(allTaxonomyData?.data, user, 'Type', 'name', false) && 'none',
@@ -483,11 +488,13 @@ function QuickCreatePlace(props) {
                           <Tags
                             closable={closable}
                             onClose={onClose}
-                            closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
+                            closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}
+                            data-cy={`tags-quick-create-place-type-${label}`}>
                             {label}
                           </Tags>
                         );
                       }}
+                      data-cy="treeselect-quick-create-place-type"
                     />
                   </Form.Item>
                   <Form.Item
@@ -498,7 +505,8 @@ function QuickCreatePlace(props) {
                       placeTaxonomyMappedFieldTypes.REGION,
                       'name',
                       false,
-                    )}>
+                    )}
+                    data-cy="form-item-quick-create-place-region-label">
                     <TreeSelectOption
                       style={{
                         display:
@@ -528,11 +536,13 @@ function QuickCreatePlace(props) {
                           <Tags
                             closable={closable}
                             onClose={onClose}
-                            closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
+                            closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}
+                            data-cy={`tags-quick-create-region-${label}`}>
                             {label}
                           </Tags>
                         );
                       }}
+                      data-cy="treeselect-quick-create-region"
                     />
                   </Form.Item>
                 </Form>
diff --git a/src/components/Modal/QuickCreateSaving/QuickCreateSaving.jsx b/src/components/Modal/QuickCreateSaving/QuickCreateSaving.jsx
index 29e6155d0..861d0ecad 100644
--- a/src/components/Modal/QuickCreateSaving/QuickCreateSaving.jsx
+++ b/src/components/Modal/QuickCreateSaving/QuickCreateSaving.jsx
@@ -44,7 +44,9 @@ const QuickCreateSaving = (props) => {
               justifyContent: 'center',
             }}
           />
-          <span className="text">{text}</span>
+          <span className="text" data-cy="loading-indicator-text">
+            {text}
+          </span>
         </div>
       </CustomModal>
     </div>
diff --git a/src/components/TextEditor/TextEditor.jsx b/src/components/TextEditor/TextEditor.jsx
index 3e39bf921..71b865e89 100644
--- a/src/components/TextEditor/TextEditor.jsx
+++ b/src/components/TextEditor/TextEditor.jsx
@@ -96,7 +96,7 @@ function TextEditor(props) {
       </Form.Item>
       <div className="event-description-footer">
         {descriptionMinimumWordCount > 1 ? (
-          <p>
+          <p data-cy="para-description-footer-title">
             {t('dashboard.events.addEditEvent.otherInformation.description.footerTitle', {
               wordCount: descriptionMinimumWordCount,
             })}
@@ -104,7 +104,9 @@ function TextEditor(props) {
         ) : (
           <div></div>
         )}
-        <p>{pluralize(wordCount, t('dashboard.events.addEditEvent.otherInformation.description.word'))}</p>
+        <p data-cy="description-word-count">
+          {pluralize(wordCount, t('dashboard.events.addEditEvent.otherInformation.description.word'))}
+        </p>
       </div>
       {calendarContentLanguage === contentLanguage.BILINGUAL && (
         <OutlinedButton
@@ -112,6 +114,7 @@ function TextEditor(props) {
           size="middle"
           disabled={wordCount > 1 ? false : true}
           onClick={translateHandler}
+          data-cy="button-translate"
         />
       )}
     </>
diff --git a/src/pages/Dashboard/AddEvent/AddEvent.jsx b/src/pages/Dashboard/AddEvent/AddEvent.jsx
index af844b49d..65d160777 100644
--- a/src/pages/Dashboard/AddEvent/AddEvent.jsx
+++ b/src/pages/Dashboard/AddEvent/AddEvent.jsx
@@ -1800,7 +1800,8 @@ function AddEvent() {
                       ? false
                       : true
                     : false
-                }>
+                }
+                data-cy="form-item-place-label">
                 <Popover
                   open={isPopoverOpen.locationPlace}
                   onOpenChange={(open) => setIsPopoverOpen({ ...isPopoverOpen, locationPlace: open })}
@@ -1814,7 +1815,7 @@ function AddEvent() {
                     <div>
                       <div>
                         <>
-                          <div className="popover-section-header" >
+                          <div className="popover-section-header" data-cy="div-place-footlight-title">
                             {t('dashboard.organization.createNew.search.footlightSectionHeading')}
                           </div>
                           <div className="search-scrollable-content">
@@ -1833,7 +1834,7 @@ function AddEvent() {
                                       locationPlace: false,
                                     });
                                   }}
-                                  data-cy="div-select-place">
+                                  data-cy={`div-select-place-${index}`}>
                                   {place?.label}
                                 </div>
                               ))
@@ -1844,7 +1845,7 @@ function AddEvent() {
                         </>
                         {quickCreateKeyword !== '' && (
                           <>
-                            <div className="popover-section-header">
+                            <div className="popover-section-header" data-cy="div-place-artsdata-title">
                               {t('dashboard.organization.createNew.search.artsDataSectionHeading')}
                             </div>
                             <div className="search-scrollable-content">
@@ -1861,7 +1862,7 @@ function AddEvent() {
                                         locationPlace: false,
                                       });
                                     }}
-                                    data-cy="div-select-arts-data-place">
+                                    data-cy={`div-select-arts-data-place-${index}`}>
                                     {place?.label}
                                   </div>
                                 ))
@@ -1950,13 +1951,15 @@ function AddEvent() {
                 className={virtualLocationFieldNames.virtualLocationName}
                 style={{
                   display: !addedFields?.includes(virtualLocationFieldNames.virtualLocationName) && 'none',
-                }}>
+                }}
+                data-cy="form-item-virtual-location-title">
                 <ContentLanguageInput calendarContentLanguage={calendarContentLanguage}>
                   <BilingualInput fieldData={initialVirtualLocation && initialVirtualLocation[0]?.name}>
                     <Form.Item
                       name="frenchVirtualLocation"
                       key={contentLanguage.FRENCH}
-                      initialValue={initialVirtualLocation && initialVirtualLocation[0]?.name?.fr}>
+                      initialValue={initialVirtualLocation && initialVirtualLocation[0]?.name?.fr}
+                      data-cy="form-item-virtual-location-french">
                       <TextArea
                         autoSize
                         autoComplete="off"
@@ -1969,7 +1972,8 @@ function AddEvent() {
                     <Form.Item
                       name="englishVirtualLocation"
                       key={contentLanguage.ENGLISH}
-                      initialValue={initialVirtualLocation && initialVirtualLocation[0]?.name?.en}>
+                      initialValue={initialVirtualLocation && initialVirtualLocation[0]?.name?.en}
+                      data-cy="form-item-virtual-location-english">
                       <TextArea
                         autoSize
                         autoComplete="off"
@@ -1995,7 +1999,8 @@ function AddEvent() {
                     type: 'url',
                     message: t('dashboard.events.addEditEvent.validations.url'),
                   },
-                ]}>
+                ]}
+                data-cy="form-item-virtual-location-link-title">
                 <StyledInput
                   addonBefore="https://"
                   autoComplete="off"
@@ -2043,7 +2048,8 @@ function AddEvent() {
                       ? false
                       : true
                     : false
-                }>
+                }
+                data-cy="form-item-description-title">
                 <ContentLanguageInput calendarContentLanguage={calendarContentLanguage}>
                   <BilingualInput fieldData={eventData?.description}>
                     <TextEditor
@@ -2245,7 +2251,9 @@ function AddEvent() {
                 />
               </Form.Item>
 
-              <Form.Item label={t('dashboard.events.addEditEvent.otherInformation.organizer.title')}>
+              <Form.Item
+                label={t('dashboard.events.addEditEvent.otherInformation.organizer.title')}
+                data-cy="form-item-organizer-title">
                 <Row>
                   <Col>
                     <p className="add-event-date-heading" data-cy="para-organizer-subheading">
@@ -2262,11 +2270,12 @@ function AddEvent() {
                     autoAdjustOverflow={false}
                     getPopupContainer={(trigger) => trigger.parentNode}
                     trigger={['click']}
+                    data-cy="popover-organizers"
                     content={
                       <div>
                         <div>
                           <>
-                            <div className="popover-section-header">
+                            <div className="popover-section-header" data-cy="div-organizers-footlight-entity-heading">
                               {t('dashboard.organization.createNew.search.footlightSectionHeading')}
                             </div>
                             <div className="search-scrollable-content">
@@ -2282,7 +2291,7 @@ function AddEvent() {
                                         organizer: false,
                                       });
                                     }}
-                                    data-cy="div-select-organizer">
+                                    data-cy={`div-select-organizer-${index}`}>
                                     {organizer?.label}
                                   </div>
                                 ))
@@ -2293,7 +2302,7 @@ function AddEvent() {
                           </>
                           {quickCreateKeyword !== '' && (
                             <>
-                              <div className="popover-section-header">
+                              <div className="popover-section-header" data-cy="div-organizers-artsdata-entity-heading">
                                 {t('dashboard.organization.createNew.search.artsDataSectionHeading')}
                               </div>
                               <div className="search-scrollable-content">
@@ -2309,7 +2318,7 @@ function AddEvent() {
                                           organizer: false,
                                         });
                                       }}
-                                      data-cy="div-select-artsdata-organizer">
+                                      data-cy={`div-select-artsdata-organizer-${index}`}>
                                       {organizer?.label}
                                     </div>
                                   ))
@@ -2431,19 +2440,22 @@ function AddEvent() {
                 name={otherInformationFieldNames.contact}
                 style={{
                   display: !addedFields?.includes(otherInformationFieldNames.contact) && 'none',
-                }}>
+                }}
+                data-cy="form-item-event-contact-label">
                 {selectedOrganizers?.length > 0 && selectedOrganizers[0]?.contact && (
                   <Outlined
                     icon={<SnippetsOutlined style={{ color: '#1B3DE6', fontSize: '20px' }} />}
                     size="large"
                     label={t('dashboard.events.addEditEvent.otherInformation.contact.copyOrganizerContact')}
                     onClick={copyOrganizerContactHandler}
+                    data-cy="button-copy-organizer-contact"
                   />
                 )}
 
                 <Form.Item
                   label={t('dashboard.events.addEditEvent.otherInformation.contact.contactTitle')}
-                  className="subheading-wrap">
+                  className="subheading-wrap"
+                  data-cy="form-item-event-contact-title">
                   <ContentLanguageInput calendarContentLanguage={calendarContentLanguage}>
                     <BilingualInput fieldData={eventData?.contactPoint?.name}>
                       <Form.Item
@@ -2490,7 +2502,8 @@ function AddEvent() {
                       type: 'url',
                       message: t('dashboard.events.addEditEvent.validations.url'),
                     },
-                  ]}>
+                  ]}
+                  data-cy="form-item-event-contact-website-label">
                   <StyledInput
                     addonBefore="https://"
                     autoComplete="off"
@@ -2502,7 +2515,8 @@ function AddEvent() {
                   name="contactPhoneNumber"
                   className="subheading-wrap"
                   label={t('dashboard.events.addEditEvent.otherInformation.contact.phoneNumber')}
-                  initialValue={eventData?.contactPoint?.telephone}>
+                  initialValue={eventData?.contactPoint?.telephone}
+                  data-cy="form-item-event-contact-phone-number-label">
                   <StyledInput
                     placeholder={t('dashboard.events.addEditEvent.otherInformation.contact.placeHolderPhoneNumber')}
                     data-cy="input-contact-phonenumber"
@@ -2518,7 +2532,8 @@ function AddEvent() {
                       type: 'email',
                       message: t('login.validations.invalidEmail'),
                     },
-                  ]}>
+                  ]}
+                  data-cy="form-item-event-contact-email-label">
                   <StyledInput
                     placeholder={t('dashboard.events.addEditEvent.otherInformation.contact.placeHolderEmail')}
                     data-cy="input-contact-email"
@@ -2531,7 +2546,8 @@ function AddEvent() {
                 className={otherInformationFieldNames.performerWrap}
                 style={{
                   display: !addedFields?.includes(otherInformationFieldNames.performerWrap) && 'none',
-                }}>
+                }}
+                data-cy="form-item-event-performer-label">
                 <Row>
                   <Col>
                     <p className="add-event-date-heading" data-cy="para-performer-subheading">
@@ -2548,10 +2564,11 @@ function AddEvent() {
                     autoAdjustOverflow={false}
                     trigger={['click']}
                     getPopupContainer={(trigger) => trigger.parentNode}
+                    data-cy="popover-performer"
                     content={
                       <div>
                         <>
-                          <div className="popover-section-header">
+                          <div className="popover-section-header" data-cy="performer-footlight-entity-heading">
                             {t('dashboard.organization.createNew.search.footlightSectionHeading')}
                           </div>
                           <div className="search-scrollable-content">
@@ -2567,7 +2584,7 @@ function AddEvent() {
                                       performer: false,
                                     });
                                   }}
-                                  data-cy="div-select-performer">
+                                  data-cy={`div-select-performer-${index}`}>
                                   {performer?.label}
                                 </div>
                               ))
@@ -2579,7 +2596,7 @@ function AddEvent() {
 
                         {quickCreateKeyword !== '' && (
                           <>
-                            <div className="popover-section-header">
+                            <div className="popover-section-header" data-cy="performer-artsdata-entity-heading">
                               {t('dashboard.organization.createNew.search.artsDataSectionHeading')}
                             </div>
                             <div className="search-scrollable-content">
@@ -2595,7 +2612,7 @@ function AddEvent() {
                                         performer: false,
                                       });
                                     }}
-                                    data-cy="div-select-artsdata-performer">
+                                    data-cy={`div-select-artsdata-performer-${index}`}>
                                     {performer?.label}
                                   </div>
                                 ))
@@ -2670,7 +2687,8 @@ function AddEvent() {
                 className={otherInformationFieldNames.supporterWrap}
                 style={{
                   display: !addedFields?.includes(otherInformationFieldNames.supporterWrap) && 'none',
-                }}>
+                }}
+                data-cy="form-item-supporter-label">
                 <Row>
                   <Col>
                     <p className="add-event-date-heading" data-cy="para-supporter-subheading">
@@ -2687,11 +2705,12 @@ function AddEvent() {
                     autoAdjustOverflow={false}
                     trigger={['click']}
                     getPopupContainer={(trigger) => trigger.parentNode}
+                    data-cy="popover-supporter"
                     content={
                       <div>
                         <div>
                           <>
-                            <div className="popover-section-header">
+                            <div className="popover-section-header" data-cy="supporter-footlight-entity-heading">
                               {t('dashboard.organization.createNew.search.footlightSectionHeading')}
                             </div>
                             <div className="search-scrollable-content">
@@ -2707,7 +2726,7 @@ function AddEvent() {
                                         supporter: false,
                                       });
                                     }}
-                                    data-cy="div-select-supporter">
+                                    data-cy={`div-select-supporter-${index}`}>
                                     {supporter?.label}
                                   </div>
                                 ))
@@ -2719,7 +2738,7 @@ function AddEvent() {
 
                           {quickCreateKeyword !== '' && (
                             <>
-                              <div className="popover-section-header">
+                              <div className="popover-section-header" data-cy="supporter-artsdata-entity-heading">
                                 {t('dashboard.organization.createNew.search.artsDataSectionHeading')}
                               </div>
                               <div className="search-scrollable-content">
@@ -2735,7 +2754,7 @@ function AddEvent() {
                                           supporter: false,
                                         });
                                       }}
-                                      data-cy="div-select-artsdata-supporter">
+                                      data-cy={`div-select-artsdata-supporter-${index}`}>
                                       {supporter?.label}
                                     </div>
                                   ))
@@ -2753,7 +2772,8 @@ function AddEvent() {
                               onClick={() => {
                                 setIsPopoverOpen({ ...isPopoverOpen, supporter: false });
                                 setQuickOrganizerModal(true);
-                              }}>
+                              }}
+                              data-cy="div-quick-create-keyword-supporter">
                               <PlusCircleOutlined data-cy="div-select-quick-create-supporter-keyword" />
                               &nbsp;{t('dashboard.events.addEditEvent.quickCreate.create')}&nbsp;&#34;
                               {quickCreateKeyword}&#34;
@@ -2817,7 +2837,8 @@ function AddEvent() {
                     type: 'url',
                     message: t('dashboard.events.addEditEvent.validations.url'),
                   },
-                ]}>
+                ]}
+                data-cy="form-item-event-link">
                 <StyledInput
                   addonBefore="https://"
                   autoComplete="off"
@@ -2838,7 +2859,8 @@ function AddEvent() {
                     type: 'url',
                     message: t('dashboard.events.addEditEvent.validations.url'),
                   },
-                ]}>
+                ]}
+                data-cy="form-item-video-link">
                 <StyledInput
                   addonBefore="https://"
                   autoComplete="off"
@@ -2861,7 +2883,8 @@ function AddEvent() {
                       type: 'url',
                       message: t('dashboard.events.addEditEvent.validations.url'),
                     },
-                  ]}>
+                  ]}
+                  data-cy="form-item-facebook-link">
                   <StyledInput
                     addonBefore="https://"
                     autoComplete="off"
@@ -2880,7 +2903,8 @@ function AddEvent() {
                   display: !addedFields?.includes(otherInformationFieldNames.keywords) && 'none',
                 }}
                 label={t('dashboard.events.addEditEvent.otherInformation.keywords')}
-                initialValue={eventData?.keywords}>
+                initialValue={eventData?.keywords}
+                data-cy="form-item-select-keywords-label">
                 <SelectOption
                   mode="tags"
                   allowClear
@@ -2893,7 +2917,8 @@ function AddEvent() {
                       <Tags
                         closable={closable}
                         onClose={onClose}
-                        closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
+                        closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}
+                        data-cy={`tag-select-keywords-${label}`}>
                         {label}
                       </Tags>
                     );
@@ -2913,7 +2938,8 @@ function AddEvent() {
                 label={taxonomyDetails(allTaxonomyData?.data, user, 'inLanguage', 'name', false)}
                 initialValue={eventData?.inLanguage?.map((inLanguage) => {
                   return inLanguage?.entityId;
-                })}>
+                })}
+                data-cy="form-item-eventlanguage-label">
                 <TreeSelectOption
                   allowClear
                   treeDefaultExpandAll
@@ -2921,10 +2947,12 @@ function AddEvent() {
                   notFoundContent={<NoContent />}
                   clearIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '14px' }} />}
                   treeData={treeTaxonomyOptions(allTaxonomyData, user, 'inLanguage', false, calendarContentLanguage)}
+                  data-cy="treeselect-event-language"
                   tagRender={(props) => {
                     const { closable, onClose, label } = props;
                     return (
                       <Tags
+                        data-cy={`tag-event-language-${label}`}
                         closable={closable}
                         onClose={onClose}
                         closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
@@ -2966,7 +2994,7 @@ function AddEvent() {
           {taxonomyDetails(allTaxonomyData?.data, user, 'EventAccessibility', 'name', false) && (
             <CardEvent title={t('dashboard.events.addEditEvent.eventAccessibility.title')}>
               <>
-                <p className="add-event-date-heading">
+                <p className="add-event-date-heading" data-cy="event-accessibility-subheading">
                   {t('dashboard.events.addEditEvent.eventAccessibility.subHeading')}
                 </p>
                 <Form.Item
@@ -2981,10 +3009,14 @@ function AddEvent() {
                       !taxonomyDetails(allTaxonomyData?.data, user, 'EventAccessibility', 'name', false) && 'none',
                   }}
                   help={
-                    <p className="add-event-date-heading" style={{ fontSize: '12px' }}>
+                    <p
+                      className="add-event-date-heading"
+                      style={{ fontSize: '12px' }}
+                      data-cy="para-event-accessibility-footer">
                       {t('dashboard.events.addEditEvent.eventAccessibility.footer')}
                     </p>
-                  }>
+                  }
+                  data-cy="form-item-event-accessibility-label">
                   <TreeSelectOption
                     allowClear
                     treeDefaultExpandAll
@@ -2999,10 +3031,12 @@ function AddEvent() {
                       calendarContentLanguage,
                     )}
                     placeholder={t('dashboard.events.addEditEvent.eventAccessibility.placeHolderEventAccessibility')}
+                    data-cy="treeselect-event-accessibility"
                     tagRender={(props) => {
                       const { label, closable, onClose } = props;
                       return (
                         <Tags
+                          data-cy={`tag-event-accessibility-${label}`}
                           closable={closable}
                           onClose={onClose}
                           closeIcon={<CloseCircleOutlined style={{ color: '#1b3de6', fontSize: '12px' }} />}>
@@ -3018,7 +3052,8 @@ function AddEvent() {
                   className={eventAccessibilityFieldNames.noteWrap}
                   style={{
                     display: !addedFields?.includes(eventAccessibilityFieldNames.noteWrap) && 'none',
-                  }}>
+                  }}
+                  data-cy="form-item-accessiblity-note-label">
                   <ContentLanguageInput calendarContentLanguage={calendarContentLanguage}>
                     <BilingualInput fieldData={eventData?.accessibilityNote}>
                       <Form.Item
@@ -3037,6 +3072,7 @@ function AddEvent() {
                             resize: 'vertical',
                           }}
                           size="large"
+                          data-cy="text-area-accessibility-note-french"
                         />
                       </Form.Item>
                       <Form.Item
@@ -3055,6 +3091,7 @@ function AddEvent() {
                             resize: 'vertical',
                           }}
                           size="large"
+                          data-cy="text-area-accessibility-note-english"
                         />
                       </Form.Item>
                     </BilingualInput>
@@ -3168,7 +3205,8 @@ function AddEvent() {
                           );
                       },
                     }),
-                  ]}>
+                  ]}
+                  data-cy="form-item-register-link-label">
                   <StyledInput
                     addonBefore="https://"
                     autoComplete="off"
@@ -3182,6 +3220,7 @@ function AddEvent() {
                   <Form.Item
                     name="ticketLink"
                     label={t('dashboard.events.addEditEvent.tickets.buyTicketLink')}
+                    data-cy="form-item-ticket-link-label"
                     initialValue={eventData?.offerConfiguration?.url?.uri}
                     rules={[
                       {
@@ -3394,6 +3433,7 @@ function AddEvent() {
             {ticketType && (ticketType == offerTypes.PAYING || ticketType == offerTypes.REGISTER) && (
               <Form.Item
                 label={t('dashboard.events.addEditEvent.tickets.changeTicketType')}
+                data-cy="form-item-change-ticket-type-label"
                 style={{ lineHeight: '2.5' }}>
                 {offerTypeOptions.map((type) => {
                   if (ticketType != type.type)

From 817c7d90565d4e767e609de9ee220ac31e427a13 Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Mon, 13 Nov 2023 14:15:36 +0530
Subject: [PATCH 6/6] chore: added fr translation for add full details

---
 src/locales/fr/transalationFr.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/locales/fr/transalationFr.json b/src/locales/fr/transalationFr.json
index 36763905b..585075687 100644
--- a/src/locales/fr/transalationFr.json
+++ b/src/locales/fr/transalationFr.json
@@ -368,7 +368,7 @@
           "person": "Personne",
           "organization": "Organisation",
           "create": "Créer",
-          "addFullDetails": "Add full details",
+          "addFullDetails": "Ajouter les détails",
           "cancel": "Annuler",
           "loaderModal": {
             "text": "Sauvegarde et redirection.",