refactor:legacy cms bugs

ui/src/components/ContentMapper/index.tsx

@@ -1277,7 +1277,9 @@ const ContentMapper = ({projectData}:ContentMapperComponentProps) => {
     return result;
   }
   const tableHeight = calcHeight();
-
+
+  //variable for button component in table
+  const onlyIcon= true;
   return (
     <div className="step-container">
       <div className="d-flex flex-wrap table-container">
@@ -1393,18 +1395,18 @@ const ContentMapper = ({projectData}:ContentMapperComponentProps) => {
                   <div className='d-flex align-items-center' style={{ gap: '8px' }}>
                     {!IsEmptyStack && (
                       <Tooltip content={'fetch the content type'} position="left">
-                        <Icon icon="FetchTemplate" size="small" version="v2" onClick={handleFetchContentType}  hover={true}  />
+                        <Button buttonType="light" icon={onlyIcon ? "v2-FetchTemplate" : ''}
+                         version="v2" onlyIcon={true} onlyIconHoverColor={'primary'} 
+                         size='small' onClick={handleFetchContentType}>
+                        </Button>
+
                       </Tooltip>
                     )}
 
                     <Tooltip content={'Reset to intial mapping'} position="left">
-                      <Icon
-                        icon="ResetReverse"
-                        size="small"
-                        version="v2"
-                        onClick={handleResetContentType}
-                        hover={true}
-                      />
+                       <Button buttonType="light" icon={onlyIcon ? "v2-ResetReverse" : ''} 
+                       version="v2" onlyIcon={true} onlyIconHoverColor={'primary'} 
+                       size='small' onClick={handleResetContentType}></Button>
                     </Tooltip>
 
                     {!IsEmptyStack && (

ui/src/components/LegacyCms/Actions/LoadPrefix.tsx

@@ -128,6 +128,17 @@ const LoadPreFix = (props: LoadSelectCmsProps) => {
     } else {
       setIsError(true);
       setErrorMessage('Please enter Affix');
+      const newMigrationDataObj: INewMigration = {
+        ...newMigrationData,
+        legacy_cms: {
+          ...newMigrationData?.legacy_cms,
+          affix: value,
+          isRestictedKeywordCheckboxChecked: isCheckedBoxChecked
+        }
+      };
+
+      dispatch(updateNewMigrationData(newMigrationDataObj));
+
     }
   });
 

ui/src/components/LegacyCms/Actions/LoadUploadFile.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { FileDetails, INewMigration } from '../../../context/app/app.interface';
 import { fileValidation, getConfig } from '../../../services/api/upload.service';
@@ -57,7 +57,7 @@ const LoadUploadFile = (props: LoadUploadFileProps) => {
   const selectedOrganisation = useSelector((state:RootState)=>state?.authentication?.selectedOrganisation); 
   const migrationData = useSelector((state:RootState)=>state?.migration?.migrationData);
 
-
+  const newMigrationDataRef = useRef(newMigrationData);
   const dispatch = useDispatch();
   const [isLoading, setIsLoading] = useState<boolean>(false);
   const [isValidated, setIsValidated] = useState<boolean>(newMigrationData?.legacy_cms?.uploadedFile?.isValidated);
@@ -104,9 +104,9 @@ const LoadUploadFile = (props: LoadUploadFileProps) => {
 
 
     const newMigrationDataObj: INewMigration = {
-      ...newMigrationData,
+      ...newMigrationDataRef?.current,
       legacy_cms: {
-        ...newMigrationData?.legacy_cms,
+        ...newMigrationDataRef?.current?.legacy_cms,
         uploadedFile: {
           name: res?.data?.localPath,
           url: res?.data?.localPath,
@@ -155,8 +155,8 @@ const LoadUploadFile = (props: LoadUploadFileProps) => {
 
     }
     else{
-      //setIsValidated(false);
-      setValidationMessage('Validation Falied');
+      setIsValidated(false);
+      setValidationMessage('Validation is failed');
       setIsValidationAttempted(true);
       setProgressPercentage(100);
 
@@ -216,9 +216,9 @@ const LoadUploadFile = (props: LoadUploadFileProps) => {
       setFileExtension(extension);
 
       const newMigrationDataObj: INewMigration = {
-        ...newMigrationData,
+        ...newMigrationDataRef?.current,
         legacy_cms: {
-          ...newMigrationData?.legacy_cms,
+          ...newMigrationDataRef?.current?.legacy_cms,
           uploadedFile: {
             name: res?.data?.localPath,
             url: res?.data?.localPath,
@@ -397,6 +397,10 @@ const LoadUploadFile = (props: LoadUploadFileProps) => {
 
   },[newMigrationData?.legacy_cms?.selectedFileFormat]);
 
+  useEffect(() => {
+    newMigrationDataRef.current = newMigrationData;
+  }, [newMigrationData]);
+
   const validationClassName = isValidated ? 'success' : 'error';
 
   const containerClassName = `validation-container ${isValidationAttempted && !isValidated ? 'error-container pb-2' : ''}`;

ui/src/components/LegacyCms/index.tsx

@@ -50,7 +50,7 @@ const LegacyCMSComponent = forwardRef(({ legacyCMSData, projectData, isCompleted
   const [isValidated, setisValidated] = useState<boolean>(
     newMigrationData?.legacy_cms?.uploadedFile?.isValidated || false
   );
-
+  const [isAllStepsCompleted, setIsAllStepsCompleted] = useState(false);
   const navigate = useNavigate();
   const autoVerticalStepper = useRef<any>(null);
 
@@ -185,7 +185,7 @@ const LegacyCMSComponent = forwardRef(({ legacyCMSData, projectData, isCompleted
             },
             isValidated: legacyCMSData?.is_fileValid || newMigrationData?.legacy_cms?.uploadedFile?.isValidated,
           }, //need to add backend data once endpoint exposed.
-          affix: legacyCMSData?.affix || newMigrationData?.legacy_cms?.affix || '',
+          affix: legacyCMSData?.affix || '',
           isFileFormatCheckboxChecked: true, //need to add backend data once endpoint exposed.
           isRestictedKeywordCheckboxChecked: true //need to add backend data once endpoint exposed.
         }
@@ -249,6 +249,21 @@ const LegacyCMSComponent = forwardRef(({ legacyCMSData, projectData, isCompleted
     }
 
   },[newMigrationData]);
+
+  useEffect(()=>{
+   if(! isEmptyString(newMigrationData?.legacy_cms?.affix) 
+      && !isEmptyString(newMigrationData?.legacy_cms?.selectedFileFormat?.title) &&
+    ! isEmptyString(newMigrationData?.legacy_cms?.selectedCms?.title) && 
+    newMigrationData?.legacy_cms?.uploadedFile?.isValidated){
+      setIsAllStepsCompleted(true);
+      handleAllStepsComplete(true);
+    }
+    else{
+      setIsAllStepsCompleted(false);
+      handleAllStepsComplete(false);
+
+    }
+  },[newMigrationData,isAllStepsCompleted])
 
   return (
     <>