diff --git a/ui/src/components/ContentMapper/index.tsx b/ui/src/components/ContentMapper/index.tsx index bd0a3b03c..48f2493ec 100644 --- a/ui/src/components/ContentMapper/index.tsx +++ b/ui/src/components/ContentMapper/index.tsx @@ -284,6 +284,7 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re const deletedExstingField : ExistingFieldType= existingField; const isNewStack = newMigrationData?.stackDetails?.isNewStack; const [isFieldDeleted, setIsFieldDeleted] = useState(false); + const [isContentDeleted, setIsContentDeleted] = useState(false); /** ALL HOOKS Here */ const { projectId = '' } = useParams(); @@ -323,13 +324,46 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re },[tableData]); useEffect(() => { - if (contentTypeMapped && otherCmsTitle) { - setOtherContentType({ - label: contentTypeMapped?.[otherCmsTitle] ?? 'Select content type from existing stack', - value: contentTypeMapped?.[otherCmsTitle] ?? 'Select content type from existing stack' - }); + const mappedContentType = contentTypesList && contentTypesList?.find((item)=>item?.title === contentTypeMapped?.[otherCmsTitle]); + + if (contentTypeMapped && otherCmsTitle ) { + + if (mappedContentType?.uid) { + setOtherContentType({ + id: mappedContentType?.uid, + label: contentTypeMapped?.[otherCmsTitle], + value: contentTypeMapped?.[otherCmsTitle], + }); + setIsContentDeleted(false); + } else { + + setOtherContentType({ + label: 'Select content type from existing stack', + value: 'Select content type from existing stack', + }); + + } + + } + + }, [contentTypeMapped, otherCmsTitle,contentTypesList]); + + + + useEffect(()=>{ + if(isContentDeleted){ + setContentTypeMapped((prevState: ContentTypeMap) => { + const { [otherCmsTitle]: removed, ...newState } = prevState; + + return newState; + }); + + setIsFieldDeleted(false); } - }, [contentTypeMapped, otherCmsTitle]); + + + },[isContentDeleted, contentTypesList, otherCmsTitle]) + useEffect(() => { if (contentTypeMapped[otherCmsTitle] === otherContentType?.label) { @@ -567,10 +601,10 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re const otherTitle = contentTypes?.[i]?.otherCmsTitle; setOtherCmsTitle(otherTitle); - setOtherContentType({ - label: contentTypeMapped?.[otherTitle] || 'Select content type from existing stack', - value: contentTypeMapped?.[otherTitle] || 'Select content type from existing stack' - }); + // setOtherContentType({ + // label: contentTypeMapped?.[otherTitle] || 'Select content type from existing stack', + // value: contentTypeMapped?.[otherTitle] || 'Select content type from existing stack' + // }); setContentTypeUid(contentTypes?.[i]?.id ?? ''); fetchFields(contentTypes?.[i]?.id ?? '', searchText || ''); @@ -583,6 +617,16 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re const { data, status } = await getExistingContentTypes(projectId); if (status === 201) { setContentTypesList(data?.contentTypes); + const mappedContentType = data?.contentTypes && data?.contentTypes?.find((item:ContentTypeList)=>item?.title === contentTypeMapped?.[otherCmsTitle]); + + if (mappedContentType?.uid) { + setOtherContentType({ + id: mappedContentType?.uid, + label: contentTypeMapped?.[otherCmsTitle], + value: contentTypeMapped?.[otherCmsTitle], + }); + setIsContentDeleted(false); + } } }; @@ -1487,6 +1531,15 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re fieldMapping: updatedRows } }; + let newstate = {} ; + setContentTypeMapped((prevState: ContentTypeMap) => { + const newState = { ...prevState }; + + delete newState[otherCmsTitle]; + newstate = newState; + + return newState; + }); if (orgId && selectedContentType) { const { status } = await resetToInitialMapping( orgId, @@ -1494,10 +1547,13 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re selectedContentType?.id ?? '', dataCs ); + setExistingField({}); setContentTypeSchema([]); - setContentTypeMapped({}); + if (status == 200) { + await updateContentMapper(orgId, projectID, {...newstate} ); + Notification({ notificationContent: { text: 'Content type reset successfully' }, notificationProps: { @@ -1512,6 +1568,51 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re // Function to fetch single content type const handleFetchContentType = async () => { + const { data , status} = await fetchExistingContentType(projectId,'') ; + // if(status === 201){ + // Notification({ + // notificationContent: { text: "All Content Types fetched successfully" }, + // notificationProps: { + // position: 'bottom-center', + // hideProgressBar: false + // }, + // type: 'success' + // }); + + // } + const contentTypesArr: ContentTypeList[] = contentTypesList; + const index = contentTypesList.findIndex(ct => ct?.uid === data?.uid); + + if(index != -1) { + contentTypesArr[index] = data; + } + + setContentTypesList(data?.contentTypes); + + + const content_type = data?.contentTypes?.find((item:any)=>item?.title === otherContentType?.label); + const contentTypeKey = Object.keys(contentTypeMapped).find(key => contentTypeMapped[key] === otherContentType?.label); + + + if(! content_type && contentTypeKey){ + const updatedState = { ...contentTypeMapped }; + delete updatedState[contentTypeKey]; + + setContentTypeMapped((prevState: ContentTypeMap) => { + const newState = { ...prevState }; + + delete newState[contentTypeKey] + + return newState; + }); + await updateContentMapper(selectedOrganisation?.value, projectId, {... updatedState} ); + setOtherContentType({ + label: 'Select content type from existing stack', + value: 'Select content type from existing stack' + + }); + } + if (otherContentType?.label === "Select Content Type") { Notification({ notificationContent: { text: "Please Select a Content Type to fetch." }, @@ -1521,8 +1622,9 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re }, type: 'error' }); - } else { - const { data , status} = await fetchExistingContentType(projectId, otherContentType?.id ?? ''); + } else if(otherContentType?.id){ + + const { data , status} = await fetchExistingContentType(projectId, otherContentType?.id ?? '') ; const index = contentTypesList.findIndex(ct => ct?.uid === data?.uid); @@ -1532,7 +1634,7 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re contentTypesArr[index] = data; } - setContentTypesList(contentTypesArr); + //setContentTypesList(contentTypesArr); setContentTypeSchema(data?.schema); if (status == 201) { Notification({ @@ -1560,7 +1662,7 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re } ]; - const isOtherContentType = contentTypesList?.some((ct) => ct?.title === otherContentType?.label); + const isOtherContentType = contentTypesList && contentTypesList?.some((ct) => ct?.title === otherContentType?.label); if (!isNewStack) { columns?.push({ diff --git a/ui/src/context/app/app.interface.ts b/ui/src/context/app/app.interface.ts index da29be635..7f82fc8e5 100644 --- a/ui/src/context/app/app.interface.ts +++ b/ui/src/context/app/app.interface.ts @@ -5,6 +5,7 @@ import { import { ICardType, defaultCardType } from '../../components/Common/Card/card.interface'; import { CTA } from '../../types/common.interface'; import { IFilterType } from '../../components/Common/Modal/FilterModal/filterModal.interface'; +import { ContentTypeList } from '../../components/ContentMapper/contentMapper.interface'; export interface ICTA { title: string; href: string; @@ -170,6 +171,7 @@ export interface IContentMapper { content_type_mapping: ContentTypeMap; isDropDownChanged?: boolean; otherCmsTitle?: string; + contentTypeList:ContentTypeList[] } export interface INewMigration { mapperKeys: ContentTypeMap; @@ -307,7 +309,8 @@ export const DEFAULT_DESTINATION_STACK: IDestinationStack = { export const DEFAULT_CONTENT_MAPPER: IContentMapper = { content_type_mapping: {}, isDropDownChanged: false, - otherCmsTitle: '' + otherCmsTitle: '', + contentTypeList: [], }; export const DEFAULT_TEST_MIGRATION: ITestMigration = {