[CMG-102] - UI for for On row uncheck make isdeleted value to true

ui/src/components/ContentMapper/contentMapper.interface.ts

@@ -108,3 +108,11 @@ export interface optionsType {
 export interface ExstingContentTypeMatch {
   [key: string]: string;
 }
+
+export interface UidMap {
+  [key: string]: boolean;
+}
+
+export interface ContentTypeMap {
+  [key: string]: string;
+}

ui/src/components/ContentMapper/index.tsx

@@ -50,7 +50,9 @@ import {
   ExistingFieldType,
   ContentTypeList,
   ContentTypesSchema,
-  optionsType
+  optionsType,
+  UidMap,
+  ContentTypeMap
 } from './contentMapper.interface';
 import { ItemStatusMapProp } from '@contentstack/venus-components/build/components/Table/types';
 import { ModalObj } from '../Modal/modal.interface';
@@ -84,9 +86,6 @@ const Fields: Mapping = {
   CheckBox: 'Select'
 };
 
-interface ContentTypeMap {
-  [key: string]: string;
-}
 interface ModalProps {
   e:React.MouseEvent<HTMLElement>;
   newIndex:number;
@@ -157,7 +156,9 @@ const ContentMapper = () => {
 
   const [searchContentType, setSearchContentType] = useState('');
 
-  const [selectedFields, setSelectedFields] = useState<FieldMapType[]>([]);
+  const [rowIds, setRowIds] = useState({})
+  const [selectedEntries, setSelectedEntries] = useState<FieldMapType[]>([]);
+
 
   /** ALL HOOKS Here */
   const { projectId = '' } = useParams();
@@ -216,6 +217,15 @@ const ContentMapper = () => {
     }
   }, [tableData, isContentTypeSaved]);
 
+  // To make all the fields checked
+  useEffect(() => {
+    const selectedId = tableData.reduce<UidMap>((acc, item) => {
+      acc[item?.id] = true;
+      return acc;
+    }, {});
+    setRowIds(selectedId)
+  }, [tableData])
+
   // Method to fetch content types
   const fetchContentTypes = async (searchText: string) => {
     const { data } = await getContentTypes(projectId || '', 0, 10, searchContentType || ''); //org id will always present
@@ -337,7 +347,7 @@ const ContentMapper = () => {
     fetchFields(contentTypes?.[i]?.id, searchText || '');
     setotherCmsUid(contentTypes?.[i]?.otherCmsUid);
     setSelectedContentType(contentTypes?.[i]);
-   };
+  };
 
   //function to handle previous content type navigation
   const handlePrevClick = (e: React.MouseEvent<HTMLElement>) => {
@@ -483,15 +493,17 @@ const ContentMapper = () => {
       </div>
     );
   };
-  interface UidMap {
-    [key: string]: boolean;
+
+  // Function to handle selected fields
+  const handleSelectedEntries = (singleSelectedRowIds: any, selectedData: any) => {
+    const selectedObj: any = {}
+    singleSelectedRowIds.forEach((uid: any) => {
+      selectedObj[uid] = true;
+    })
+    setRowIds(selectedObj)
+    setSelectedEntries(selectedData)
   }
 
-  const rowIds = tableData.reduce<UidMap>((acc, item) => {
-    acc[item?.id] = true;
-    return acc;
-  }, {});
-
   // Method for change select value
   const handleValueChange = (value: FieldTypes, rowIndex: string) => {
     setisDropDownCHanged(true);
@@ -812,7 +824,7 @@ const ContentMapper = () => {
           updateAt: new Date(),
           contentstackTitle: selectedContentType?.contentstackTitle,
           contentstackUid: selectedContentType?.contnetStackUid,
-          fieldMapping: tableData
+          fieldMapping: selectedEntries
         }
       };
 
@@ -1039,6 +1051,7 @@ const ContentMapper = () => {
                 ),
                 showExportCta: true
               }}
+              getSelectedRow={handleSelectedEntries}
             />
           </div>
 

ui/src/components/MainHeader/index.scss

@@ -56,3 +56,10 @@
     }
   }
 }
+.Dropdown__header__label {
+  line-height: $line-height-reset;
+}
+.Dropdown__header__value {
+  color: $color-black-222!important;
+  line-height: $line-height-reset;
+}

ui/src/pages/Login/index.tsx

@@ -202,6 +202,8 @@ const Login: FC<IProps> = () => {
                             className="mb-2"
                             version="v2"
                             htmlFor="tfa_token"
+                          aria-label="tfa_token"
+
                           >
                             {twoFactorAuthentication?.security_code?.title}
                           </FieldLabel>
@@ -213,6 +215,7 @@ const Login: FC<IProps> = () => {
                           error={meta?.error && meta?.touched}
                           width="large"
                           testId="cs-tfa-token-input-field"
+                          id="tfa_token"
                         />
                         {meta?.error && meta?.touched && (
                           <ValidationMessage
@@ -285,7 +288,7 @@ const Login: FC<IProps> = () => {
                                     className="mb-2"
                                     required={true}
                                     version="v2"
-                                    htmlFor="email"
+                                    htmlFor={login?.email}
                                   >
                                     {login?.email}
                                   </FieldLabel>
@@ -302,14 +305,15 @@ const Login: FC<IProps> = () => {
                                       }
                                     }));
                                   }}
-                                  name="email"
+                                  name={login?.email}
                                   width="large"
                                   id="email"
                                   version="v2"
                                   type="email"
                                   data-testid="cs-login-email-input-field"
                                   placeholder={login?.placeholder?.email}
                                   error={(meta?.error || meta?.submitError) && meta?.touched}
+                                  aria-label={login?.email}
                                 />
                                 {meta.error && meta.touched && (
                                   <ValidationMessage
@@ -390,7 +394,7 @@ const Login: FC<IProps> = () => {
                             buttonType="primary"
                             type="submit"
                             icon="v2-Login"
-                            tabIndex={0}
+                            tabindex={0}
                           >
                             {login?.cta?.title}
                           </Button>

ui/src/pages/RegionalLogin/index.tsx

@@ -102,7 +102,6 @@ const RegionalLogin = () => {
                               region?.service_title as string
                             )
                           }
-                          aria-label={`${region?.cta?.title} with ${region?.service_title} ${region?.region_title}`}
                         >
                           <span className="link-basic-icon link-arrow">{region?.cta?.title}</span>
                         </a>

ui/src/scss/_variables.scss

@@ -27,6 +27,8 @@ $color-brand-warning-medium: #eb5646;
 $color-font-disabled: rgba(160, 174, 192, 0.5);
 $color-font-gray: #637392;
 $color-black-2121: #212121;
+$color-black-222: #222222;
+
 
 $font-family-primary: 'Inter', sans-serif;
 $font-family-secondary: 'Montserrat', sans-serif;
@@ -43,8 +45,6 @@ $size-font-4-xl: 1.875rem; /* 30px[H3] */
 $size-font-5-xl: 1.75rem; /* 28px[H2] */
 $size-font-6-xl: 2.5rem; /* 40px[H1] */
 
-$font-base: 16;
-
 $font-weight-regular: 400;
 $font-weight-medium: 500;
 $font-weight-semi-bold: 600;