From 0150433a94476f6a15030021eb4310bf9d929397 Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Fri, 27 Sep 2024 11:26:11 +0530
Subject: [PATCH 1/2] chore: added data cy attributes for orgs person form

---
 src/constants/formFields.js                   | 31 ++++++++++++-------
 .../CreateNewOrganization.jsx                 |  3 ++
 .../CreateNewPerson/CreateNewPerson.jsx       |  1 +
 3 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/constants/formFields.js b/src/constants/formFields.js
index 2ddcee06..9e25bb78 100644
--- a/src/constants/formFields.js
+++ b/src/constants/formFields.js
@@ -356,11 +356,12 @@ export const formFieldValue = [
       mappedField,
       isEntitiesFetching,
       isExternalSourceFetching,
+      fieldName,
     }) => {
       return (
         <>
           <Popover
-            data-cy={`popover-${mappedField}`}
+            data-cy={`popover-${mappedField ?? fieldName}`}
             open={isPopoverOpen}
             onOpenChange={(open) => setIsPopoverOpen(open)}
             overlayClassName="event-popover"
@@ -372,7 +373,9 @@ export const formFieldValue = [
               <div>
                 <div>
                   <>
-                    <div className="popover-section-header" data-cy={`div-${mappedField}-footlight-place-title`}>
+                    <div
+                      className="popover-section-header"
+                      data-cy={`div-${mappedField ?? fieldName}-footlight-place-title`}>
                       {t('dashboard.organization.createNew.search.footlightSectionHeading')}
                     </div>
                     <div className="search-scrollable-content">
@@ -395,7 +398,7 @@ export const formFieldValue = [
                                 form.setFieldValue(name, place?.value);
                                 setIsPopoverOpen(false);
                               }}
-                              data-cy={`div-${mappedField}-footlight-place-${index}`}>
+                              data-cy={`div-${mappedField ?? fieldName}-footlight-place-${index}`}>
                               {place?.label}
                             </div>
                           ))
@@ -405,7 +408,9 @@ export const formFieldValue = [
                     </div>
                   </>
 
-                  <div className="popover-section-header" data-cy={`div-${mappedField}-footlight-place-title`}>
+                  <div
+                    className="popover-section-header"
+                    data-cy={`div-${mappedField ?? fieldName}-footlight-place-title`}>
                     {t('dashboard.organization.createNew.search.importsFromFootlight')}
                   </div>
                   <div className="search-scrollable-content">
@@ -427,7 +432,7 @@ export const formFieldValue = [
                               form.setFieldValue(name, place?.value);
                               setIsPopoverOpen(false);
                             }}
-                            data-cy={`div-${mappedField}-footlight-place-${index}`}>
+                            data-cy={`div-${mappedField ?? fieldName}-footlight-place-${index}`}>
                             {place?.label}
                           </div>
                         ))
@@ -436,7 +441,9 @@ export const formFieldValue = [
                       ))}
                   </div>
 
-                  <div className="popover-section-header" data-cy={`div-${mappedField}-artsdata-place-title`}>
+                  <div
+                    className="popover-section-header"
+                    data-cy={`div-${mappedField ?? fieldName}-artsdata-place-title`}>
                     {t('dashboard.organization.createNew.search.artsDataSectionHeading')}
                   </div>
                   <div className="search-scrollable-content">
@@ -456,7 +463,7 @@ export const formFieldValue = [
                               form.setFieldValue(name, place?.uri);
                               setIsPopoverOpen(false);
                             }}
-                            data-cy={`div-${mappedField}-artsdata-place-${index}`}>
+                            data-cy={`div-${mappedField ?? fieldName}-artsdata-place-${index}`}>
                             {place?.label}
                           </div>
                         ))
@@ -477,7 +484,7 @@ export const formFieldValue = [
               onClick={() => {
                 setIsPopoverOpen(true);
               }}
-              data-cy={`input-${mappedField}`}
+              data-cy={`input-${mappedField ?? fieldName}`}
             />
           </Popover>
           {locationPlace && (
@@ -550,12 +557,13 @@ export const renderFormFields = ({
   mappedField,
   t,
   validations,
+  fieldName,
 }) => {
   return (
     <>
       {position === 'top' && datatype !== dataTypes.IMAGE && <p className="add-event-date-heading">{userTips}</p>}
       <Form.Item
-        data-cy={`form-item-${mappedField}`}
+        data-cy={`form-item-${mappedField ?? fieldName?.toLowerCase()}`}
         label={label}
         name={name}
         key={key}
@@ -571,7 +579,7 @@ export const renderFormFields = ({
         required={required}
         hidden={hidden}
         style={style}
-        className={mappedField}
+        className={mappedField ?? fieldName?.toLowerCase()}
         rules={rules
           ?.map((rule) => {
             if (datatype === rule?.dataType) return rule.rule;
@@ -588,7 +596,7 @@ export const renderFormFields = ({
             <p
               className="add-event-date-heading"
               style={{ marginTop: '-15px' }}
-              data-cy={`form-item-helper-text-${mappedField}`}>
+              data-cy={`form-item-helper-text-${mappedField ?? fieldName?.toLowerCase()}`}>
               {userTips}
             </p>
           ) : undefined
@@ -639,6 +647,7 @@ export const returnFormDataWithFields = ({
     datatype: field?.datatype,
     required: checkMandatoryAdminOnlyFields(field?.name, mandatoryFields),
     element: formField?.element({
+      fieldName: field?.name?.toLowerCase(),
       mappedField: field?.mappedField,
       data: entityData && entityData[field?.mappedField],
       datatype: field?.datatype,
diff --git a/src/pages/Dashboard/CreateNewOrganization/CreateNewOrganization.jsx b/src/pages/Dashboard/CreateNewOrganization/CreateNewOrganization.jsx
index 19356e9e..49c2d1da 100644
--- a/src/pages/Dashboard/CreateNewOrganization/CreateNewOrganization.jsx
+++ b/src/pages/Dashboard/CreateNewOrganization/CreateNewOrganization.jsx
@@ -1284,6 +1284,7 @@ function CreateNewOrganization() {
                               <Form.Item
                                 key={index}
                                 name={['dynamicFields', taxonomy?.id]}
+                                data-cy={`form-item-organization-dynamic-fields-${index}`}
                                 label={bilingual({
                                   data: taxonomy?.name,
                                   interfaceLanguage: user?.interfaceLanguage?.toLowerCase(),
@@ -1301,6 +1302,7 @@ function CreateNewOrganization() {
                                   taxonomy?.isAdminOnly ? (adminCheckHandler({ calendar, user }) ? false : true) : false
                                 }>
                                 <TreeSelectOption
+                                  data-cy={`treeselect-organization-dynamic-fields-${index}`}
                                   allowClear
                                   treeDefaultExpandAll
                                   notFoundContent={<NoContent />}
@@ -1314,6 +1316,7 @@ function CreateNewOrganization() {
                                     const { label, closable, onClose } = props;
                                     return (
                                       <Tags
+                                        data-cy={`tag-organization-dynamic-field-${label}`}
                                         closable={closable}
                                         onClose={onClose}
                                         closeIcon={
diff --git a/src/pages/Dashboard/CreateNewPerson/CreateNewPerson.jsx b/src/pages/Dashboard/CreateNewPerson/CreateNewPerson.jsx
index ac25e64a..69cc757e 100644
--- a/src/pages/Dashboard/CreateNewPerson/CreateNewPerson.jsx
+++ b/src/pages/Dashboard/CreateNewPerson/CreateNewPerson.jsx
@@ -809,6 +809,7 @@ function CreateNewPerson() {
                               <Form.Item
                                 key={index}
                                 name={['dynamicFields', taxonomy?.id]}
+                                data-cy={`form-item-person-dynamic-fields-${index}`}
                                 label={bilingual({
                                   data: taxonomy?.name,
                                   interfaceLanguage: user?.interfaceLanguage?.toLowerCase(),

From 8e87480290bfb0f566d9ece122eac40ef602a04a Mon Sep 17 00:00:00 2001
From: Abhishek P Anil <abhishek@culturecreates.com>
Date: Fri, 27 Sep 2024 11:52:53 +0530
Subject: [PATCH 2/2] chore: added data cy attributes for listing filter
 dropdowns

---
 src/components/Sort/Sort.jsx   | 2 +-
 src/constants/sortByOptions.js | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/Sort/Sort.jsx b/src/components/Sort/Sort.jsx
index 884b56e3..04dc8eb4 100644
--- a/src/components/Sort/Sort.jsx
+++ b/src/components/Sort/Sort.jsx
@@ -53,7 +53,7 @@ function Sort(props) {
             {sortByOptionsOrgsPlacesPerson?.map((sortBy, index) => {
               if (sortBy?.key === filter?.sort)
                 return (
-                  <span key={index} data-cy={`span-sort-option-${sortBy?.label}`}>
+                  <span key={index} data-cy={`span-sort-option-${sortBy['data-cy']}`}>
                     {sortBy?.label}
                   </span>
                 );
diff --git a/src/constants/sortByOptions.js b/src/constants/sortByOptions.js
index 4900fbc4..8de624a0 100644
--- a/src/constants/sortByOptions.js
+++ b/src/constants/sortByOptions.js
@@ -24,10 +24,12 @@ export const sortByOptionsOrgsPlacesPerson = [
   {
     label: <Translation>{(t) => t('dashboard.events.filter.sort.name')}</Translation>,
     key: `name`,
+    ['data-cy']: 'name',
   },
   {
     label: <Translation>{(t) => t('dashboard.taxonomy.listing.sort.createdDate')}</Translation>,
     key: 'metadata.createdAt',
+    ['data-cy']: 'createdDate',
   },
 ];