Feature/dropdown field choices

ui/src/components/Card/index.tsx

@@ -29,7 +29,7 @@ const CardList = ({ project }: ProjectType) => {
    */
   const onClickProject = (id: string) => {
     if (isEmptyString(id)) return;
-    navigate(`/projects/${id}/migration/steps/1`);
+    navigate(`/projects/${id}/migration/steps/${project?.current_step}`);
   };
 
   const iconMapping: { [key: string]: string } = {

ui/src/components/LegacyCms/index.tsx

@@ -91,7 +91,7 @@ const LegacyCMSComponent = forwardRef(({ legacyCMSData, isCompleted, handleOnAll
 
   useEffect(() => {
     const fetchCMSData = async () => {
-      setIsLoading(true);
+      //setIsLoading(true);
 
       //check if offline CMS data field is set to true, if then read data from cms data file.
       const data = await getCMSDataFromFile(CS_ENTRIES.LEGACY_CMS);

ui/src/components/MainHeader/index.tsx

@@ -41,7 +41,7 @@ const MainHeader = () => {
   const newMigrationData = useSelector((state:RootState)=> state?.migration?.newMigrationData);
 
   const [data, setData] = useState<MainHeaderType>({});
-  const [orgsList, setOrgsList] = useState<IDropDown[]>([]);
+  const [orgsList, setOrgsList] = useState<IDropDown[]>(organisationsList ?? []);
   const [isModalOpen, setIsModalOpen] = useState(false);
 
 
@@ -51,9 +51,10 @@ const MainHeader = () => {
 
   const { logo, organization_label: organizationLabel } = data;
 
-  const name = `${user?.first_name?.charAt(0)}${user?.last_name?.charAt(0)}`.toUpperCase() ?? '';
+  const name = user ? `${user?.first_name?.charAt(0)}${user?.last_name?.charAt(0)}`.toUpperCase() ?? '' : '';
 
   const updateOrganisationListState = () => {
+
     if (organisationsList) {
       //set selected org as default
       const list = organisationsList.map((org: IDropDown) => ({
@@ -87,7 +88,7 @@ const MainHeader = () => {
 
   useEffect(() => {
     updateOrganisationListState();
-  }, [selectedOrganisation]);
+  }, [selectedOrganisation,organisationsList]);
 
   const handleOnDropDownChange = (data: IDropDown) => {
     if (data.value === selectedOrganisation.value) return;

ui/src/components/MigrationFlowHeader/index.tsx

@@ -13,6 +13,7 @@ import { getProject } from '../../services/api/project.service';
 // Interfaces
 import { DEFAULT_NEW_MIGRATION } from '../../context/app/app.interface';
 import { ModalObj } from '../Modal/modal.interface';
+import { MigrationResponse } from '../../services/api/service.interface';
 
 // CSS
 import './index.scss';
@@ -25,9 +26,10 @@ type MigrationFlowHeaderProps = {
   isLoading: boolean;
   isCompleted: boolean;
   legacyCMSRef: React.MutableRefObject<any>; 
+  projectData:MigrationResponse
 };
 
-const MigrationFlowHeader = ({ handleOnClick, isLoading, isCompleted , legacyCMSRef}: MigrationFlowHeaderProps) => {
+const MigrationFlowHeader = ({projectData, handleOnClick, isLoading, isCompleted , legacyCMSRef}: MigrationFlowHeaderProps) => {
   const [projectName, setProjectName] = useState('');
   const [currentStep, setCurrentStep] = useState<number>(0);
 
@@ -46,16 +48,16 @@ const MigrationFlowHeader = ({ handleOnClick, isLoading, isCompleted , legacyCMS
 
   /******** Function to get project  ********/
   const fetchProject = async () => {
-    const response = await getProject(selectedOrganisation?.value || '', params?.projectId || '');
+    //const response = await getProject(selectedOrganisation?.value || '', params?.projectId || '');
 
-    if (response?.status === 200) {
-      setProjectName(response?.data?.name);
-      setCurrentStep(response?.data?.current_step);
+    //if (response?.status === 200) {
+      setProjectName(projectData?.name);
+      setCurrentStep(projectData?.current_step);
 
       //Navigate to lastest or active Step
-      const url = `/projects/${params?.projectId}/migration/steps/${response?.data?.current_step}`;
+      const url = `/projects/${params?.projectId}/migration/steps/${projectData.current_step}`;
       navigate(url, { replace: true });
-    }
+   // }
   };
 
   const backNavigation = () => {

ui/src/components/layout/AppLayout/index.tsx

@@ -25,8 +25,7 @@ const AppLayout: FC<IProps> = ({ children }) => {
 
   useEffect(()=>{
     dispatch(getUserDetails());
-
-  },[dispatch]);
+  },[]);
 
   useAuthCheck();
 

ui/src/pages/Login/index.tsx

@@ -3,7 +3,7 @@ import { FC,useEffect, useState } from 'react';
 import { useNavigate, useLocation } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
 
-import { setAuthToken } from '../../store/slice/authSlice';
+import { getUserDetails, setAuthToken } from '../../store/slice/authSlice';
 import {
   Button,
   Field,
@@ -166,6 +166,9 @@ const Login: FC<IProps> = () => {
       dispatch(setAuthToken(authenticationObj));
 
       setLoginStates((prev) => ({ ...prev, submitted: true }));
+
+      dispatch(getUserDetails());
+
       navigate(`/projects`, { replace: true });
     }
   };

ui/src/pages/Migration/index.tsx

@@ -485,12 +485,14 @@ const Migration = () => {
 
 
     <div className='migration-steps-wrapper'>
-      <MigrationFlowHeader handleOnClick={handleOnClickFunctions[curreentStepIndex]} isLoading={isLoading} isCompleted={isCompleted} legacyCMSRef={legacyCMSRef}   />
+      {projectData && 
+      <>
+      <MigrationFlowHeader projectData={projectData} handleOnClick={handleOnClickFunctions[curreentStepIndex]} isLoading={isLoading} isCompleted={isCompleted} legacyCMSRef={legacyCMSRef}   />
       <div className='steps-wrapper'>
-        { projectData && 
           <HorizontalStepper ref={stepperRef} steps={createStepper(projectData, handleClick)} handleSaveCT={saveRef?.current?.handleSaveContentType} changeDropdownState={changeDropdownState } />
-        }     
       </div>
+      </>
+      }
     </div>
 
 

ui/src/pages/Projects/index.tsx

@@ -62,9 +62,9 @@ const Projects = () => {
   const [searchText, setSearchText] = useState(search);
   const [isModalOpen, setIsModalOpen] = useState(false);
 
-  useEffect(()=>{
-    dispatch(getUserDetails());
-  },[]);
+  // useEffect(()=>{
+  //   dispatch(getUserDetails());
+  // },[]);
 
   const fetchProjects = async () => {
        setLoadStatus(true); 
@@ -88,9 +88,9 @@ const Projects = () => {
     });
   };
 
-  useEffect(()=>{
-    dispatch(getUserDetails());
-  },[dispatch]);
+  // useEffect(()=>{
+  //   dispatch(getUserDetails());
+  // },[dispatch]);
 
   useEffect(() => {
     fetchData();