From 9be6fa8f0b8dd68f44f0db83a6d87f59f6a2c66e Mon Sep 17 00:00:00 2001
From: meetul <meetulrathore98@gmail.com>
Date: Wed, 30 Oct 2024 21:02:31 +0530
Subject: [PATCH] more changes

---
 .../AddPeopleToTag/AddPeopleToTag.module.css  |  3 +-
 .../AddPeopleToTag/AddPeopleToTag.test.tsx    |  2 +-
 .../AddPeopleToTag/AddPeopleToTag.tsx         |  2 +-
 src/components/TagActions/TagActions.test.tsx |  2 +-
 src/components/TagActions/TagActions.tsx      |  7 +++--
 src/components/TagActions/TagNode.tsx         |  6 ++--
 src/screens/ManageTag/EditUserTagModal.tsx    |  9 +++++-
 src/screens/ManageTag/ManageTag.tsx           |  2 +-
 src/screens/ManageTag/RemoveUserTagModal.tsx  |  7 +++--
 .../OrganizationTags.module.css               |  1 +
 .../OrganizationTags/OrganizationTags.tsx     |  4 +--
 src/screens/SubTags/SubTags.tsx               | 31 +++++++++----------
 src/utils/organizationTagsUtils.ts            |  8 +++++
 13 files changed, 52 insertions(+), 32 deletions(-)

diff --git a/src/components/AddPeopleToTag/AddPeopleToTag.module.css b/src/components/AddPeopleToTag/AddPeopleToTag.module.css
index c7c5c4582b..d025435c3a 100644
--- a/src/components/AddPeopleToTag/AddPeopleToTag.module.css
+++ b/src/components/AddPeopleToTag/AddPeopleToTag.module.css
@@ -30,7 +30,8 @@
 .scrollContainer {
   max-height: 100px;
   overflow-y: auto;
-  margin-bottom: 1rem;
+  margin-top: 0.5rem;
+  margin-bottom: 1.7rem;
 }
 
 .memberBadge {
diff --git a/src/components/AddPeopleToTag/AddPeopleToTag.test.tsx b/src/components/AddPeopleToTag/AddPeopleToTag.test.tsx
index d6749ad23b..e21ccd1a52 100644
--- a/src/components/AddPeopleToTag/AddPeopleToTag.test.tsx
+++ b/src/components/AddPeopleToTag/AddPeopleToTag.test.tsx
@@ -74,7 +74,7 @@ const renderAddPeopleToTagModal = (
           <I18nextProvider i18n={i18n}>
             <Routes>
               <Route
-                path="/orgtags/:orgId/managetag/:tagId"
+                path="/orgtags/:orgId/manageTag/:tagId"
                 element={<AddPeopleToTag {...props} />}
               />
             </Routes>
diff --git a/src/components/AddPeopleToTag/AddPeopleToTag.tsx b/src/components/AddPeopleToTag/AddPeopleToTag.tsx
index 2ff78d9121..915452c210 100644
--- a/src/components/AddPeopleToTag/AddPeopleToTag.tsx
+++ b/src/components/AddPeopleToTag/AddPeopleToTag.tsx
@@ -113,7 +113,7 @@ const AddPeopleToTag: React.FC<InterfaceAddPeopleToTagProps> = ({
   const userTagMembersToAssignTo =
     userTagsMembersToAssignToData?.getUsersToAssignTo.usersToAssignTo.edges.map(
       (edge) => edge.node,
-    );
+    ) ?? /* istanbul ignore next */ [];
 
   const handleAddOrRemoveMember = (member: InterfaceMemberData): void => {
     setAssignToMembers((prevMembers) => {
diff --git a/src/components/TagActions/TagActions.test.tsx b/src/components/TagActions/TagActions.test.tsx
index 03a955d9d0..140504d044 100644
--- a/src/components/TagActions/TagActions.test.tsx
+++ b/src/components/TagActions/TagActions.test.tsx
@@ -96,7 +96,7 @@ const renderTagActionsModal = (
           <I18nextProvider i18n={i18n}>
             <Routes>
               <Route
-                path="/orgtags/:orgId/managetag/:tagId"
+                path="/orgtags/:orgId/manageTag/:tagId"
                 element={<TagActions {...props} />}
               />
             </Routes>
diff --git a/src/components/TagActions/TagActions.tsx b/src/components/TagActions/TagActions.tsx
index 29f1105cf2..60099e855d 100644
--- a/src/components/TagActions/TagActions.tsx
+++ b/src/components/TagActions/TagActions.tsx
@@ -102,9 +102,10 @@ const TagActions: React.FC<InterfaceTagActionsProps> = ({
     });
   };
 
-  const userTagsList = orgUserTagsData?.organizations[0]?.userTags.edges.map(
-    (edge) => edge.node,
-  );
+  const userTagsList =
+    orgUserTagsData?.organizations[0]?.userTags.edges.map(
+      (edge) => edge.node,
+    ) ?? /* istanbul ignore next */ [];
 
   const [checkedTagId, setCheckedTagId] = useState<string | null>(null);
   const [uncheckedTagId, setUncheckedTagId] = useState<string | null>(null);
diff --git a/src/components/TagActions/TagNode.tsx b/src/components/TagActions/TagNode.tsx
index 38949dd01f..e05d572f30 100644
--- a/src/components/TagActions/TagNode.tsx
+++ b/src/components/TagActions/TagNode.tsx
@@ -92,9 +92,9 @@ const TagNode: React.FC<InterfaceTagNodeProps> = ({
     );
   }
 
-  const subTagsList = subTagsData?.getChildTags.childTags.edges.map(
-    (edge) => edge.node,
-  );
+  const subTagsList =
+    subTagsData?.getChildTags.childTags.edges.map((edge) => edge.node) ??
+    /* istanbul ignore next */ [];
 
   const handleTagClick = (): void => {
     setExpanded(!expanded);
diff --git a/src/screens/ManageTag/EditUserTagModal.tsx b/src/screens/ManageTag/EditUserTagModal.tsx
index e686375f49..5fa8ae2771 100644
--- a/src/screens/ManageTag/EditUserTagModal.tsx
+++ b/src/screens/ManageTag/EditUserTagModal.tsx
@@ -43,7 +43,14 @@ const EditUserTagModal: React.FC<InterfaceEditUserTagModalProps> = ({
         >
           <Modal.Title className="text-white">{t('tagDetails')}</Modal.Title>
         </Modal.Header>
-        <Form onSubmitCapture={handleEditUserTag}>
+        <Form
+          onSubmitCapture={(e: FormEvent<HTMLFormElement>): void => {
+            e.preventDefault();
+            if (newTagName.trim()) {
+              handleEditUserTag(e);
+            }
+          }}
+        >
           <Modal.Body>
             <Form.Label htmlFor="tagName">{t('tagName')}</Form.Label>
             <Form.Control
diff --git a/src/screens/ManageTag/ManageTag.tsx b/src/screens/ManageTag/ManageTag.tsx
index f190395816..f04965ba4d 100644
--- a/src/screens/ManageTag/ManageTag.tsx
+++ b/src/screens/ManageTag/ManageTag.tsx
@@ -276,7 +276,7 @@ function ManageTag(): JSX.Element {
   const userTagAssignedMembers =
     userTagAssignedMembersData?.getAssignedUsers.usersAssignedTo.edges.map(
       (edge) => edge.node,
-    );
+    ) ?? /* istanbul ignore next */ [];
   const orgUserTagAncestors = orgUserTagAncestorsData?.getUserTagAncestors;
 
   const redirectToSubTags = (tagId: string): void => {
diff --git a/src/screens/ManageTag/RemoveUserTagModal.tsx b/src/screens/ManageTag/RemoveUserTagModal.tsx
index eeb84e1abe..dc000f443c 100644
--- a/src/screens/ManageTag/RemoveUserTagModal.tsx
+++ b/src/screens/ManageTag/RemoveUserTagModal.tsx
@@ -26,6 +26,7 @@ const RemoveUserTagModal: React.FC<InterfaceRemoveUserTagModalProps> = ({
       <Modal
         size="sm"
         id="removeUserTagModal"
+        aria-describedby="removeUserTagMessage"
         show={removeUserTagModalIsOpen}
         onHide={toggleRemoveUserTagModal}
         backdrop="static"
@@ -33,11 +34,13 @@ const RemoveUserTagModal: React.FC<InterfaceRemoveUserTagModalProps> = ({
         centered
       >
         <Modal.Header closeButton className="bg-primary">
-          <Modal.Title className="text-white" id={`deleteActionItem`}>
+          <Modal.Title className="text-white" id="removeUserTag">
             {t('removeUserTag')}
           </Modal.Title>
         </Modal.Header>
-        <Modal.Body>{t('removeUserTagMessage')}</Modal.Body>
+        <Modal.Body id="removeUserTagMessage">
+          {t('removeUserTagMessage')}
+        </Modal.Body>
         <Modal.Footer>
           <Button
             type="button"
diff --git a/src/screens/OrganizationTags/OrganizationTags.module.css b/src/screens/OrganizationTags/OrganizationTags.module.css
index 91fbca0961..aa2e2abb40 100644
--- a/src/screens/OrganizationTags/OrganizationTags.module.css
+++ b/src/screens/OrganizationTags/OrganizationTags.module.css
@@ -146,4 +146,5 @@
 
   max-height: calc(100vh - 18rem);
   overflow: auto;
+  position: sticky;
 }
diff --git a/src/screens/OrganizationTags/OrganizationTags.tsx b/src/screens/OrganizationTags/OrganizationTags.tsx
index 42d0d25fd7..ce37528cc1 100644
--- a/src/screens/OrganizationTags/OrganizationTags.tsx
+++ b/src/screens/OrganizationTags/OrganizationTags.tsx
@@ -367,9 +367,9 @@ function OrganizationTags(): JSX.Element {
                   getRowClassName={() => `${styles.rowBackground}`}
                   autoHeight
                   rowHeight={65}
-                  rows={userTagsList?.map((fund, index) => ({
+                  rows={userTagsList?.map((userTag, index) => ({
                     id: index + 1,
-                    ...fund,
+                    ...userTag,
                   }))}
                   columns={columns}
                   isRowSelectable={() => false}
diff --git a/src/screens/SubTags/SubTags.tsx b/src/screens/SubTags/SubTags.tsx
index 6b62287015..193670ac59 100644
--- a/src/screens/SubTags/SubTags.tsx
+++ b/src/screens/SubTags/SubTags.tsx
@@ -178,9 +178,9 @@ function SubTags(): JSX.Element {
     );
   }
 
-  const userTagsList = subTagsData?.getChildTags.childTags.edges.map(
-    (edge) => edge.node,
-  );
+  const subTagsList =
+    subTagsData?.getChildTags.childTags.edges.map((edge) => edge.node) ??
+    /* istanbul ignore next */ [];
 
   const orgUserTagAncestors = orgUserTagAncestorsData?.getUserTagAncestors;
 
@@ -343,17 +343,16 @@ function SubTags(): JSX.Element {
               >
                 {`${t('manageTag')} ${subTagsData?.getChildTags.name}`}
               </Button>
-
-              <Button
-                variant="success"
-                onClick={showAddSubTagModal}
-                data-testid="addSubTagBtn"
-                className="ms-auto"
-              >
-                <i className={'fa fa-plus me-2'} />
-                {t('addChildTag')}
-              </Button>
             </div>
+            <Button
+              variant="success"
+              onClick={showAddSubTagModal}
+              data-testid="addSubTagBtn"
+              className="ms-auto"
+            >
+              <i className={'fa fa-plus me-2'} />
+              {t('addChildTag')}
+            </Button>
           </div>
 
           <div className="mb-4">
@@ -392,7 +391,7 @@ function SubTags(): JSX.Element {
               className={styles.subTagsScrollableDiv}
             >
               <InfiniteScroll
-                dataLength={userTagsList?.length ?? 0}
+                dataLength={subTagsList?.length ?? 0}
                 next={loadMoreSubTags}
                 hasMore={
                   subTagsData?.getChildTags.childTags.pageInfo.hasNextPage ??
@@ -422,9 +421,9 @@ function SubTags(): JSX.Element {
                   getRowClassName={() => `${styles.rowBackground}`}
                   autoHeight
                   rowHeight={65}
-                  rows={userTagsList?.map((fund, index) => ({
+                  rows={subTagsList?.map((subTag, index) => ({
                     id: index + 1,
-                    ...fund,
+                    ...subTag,
                   }))}
                   columns={columns}
                   isRowSelectable={() => false}
diff --git a/src/utils/organizationTagsUtils.ts b/src/utils/organizationTagsUtils.ts
index c58c09efe4..75c001816e 100644
--- a/src/utils/organizationTagsUtils.ts
+++ b/src/utils/organizationTagsUtils.ts
@@ -28,6 +28,14 @@ export const dataGridStyle = {
   '& .MuiDataGrid-main': {
     borderRadius: '0.1rem',
   },
+  '& .MuiDataGrid-topContainer': {
+    position: 'fixed',
+    top: 259,
+    zIndex: 1,
+  },
+  '& .MuiDataGrid-virtualScrollerContent': {
+    marginTop: 6.5,
+  },
 };
 
 // the data chunk size for tag related queries