Skip to content

Feature/dropdown field choices #287

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
RohitKini merged 2 commits into from
Sep 20, 2024
Merged

Feature/dropdown field choices #287

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b29e2b0
refactor:content mapper bugs
AishDani Sep 20, 2024
e8d18db
Merge branch 'dev' of github.com:contentstack/migration-v2-node-serve…
AishDani Sep 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
132 changes: 117 additions & 15 deletions ui/src/components/ContentMapper/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -284,6 +284,7 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re
const deletedExstingField : ExistingFieldType= existingField;
const isNewStack = newMigrationData?.stackDetails?.isNewStack;
const [isFieldDeleted, setIsFieldDeleted] = useState<boolean>(false);
const [isContentDeleted, setIsContentDeleted] = useState<boolean>(false);

/** ALL HOOKS Here */
const { projectId = '' } = useParams();
Expand Down Expand Up @@ -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) {
Expand Down Expand Up @@ -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 || '');
Expand All @@ -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);
}
}
};

Expand Down Expand Up @@ -1487,17 +1531,29 @@ 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,
projectID,
selectedContentType?.id ?? '',
dataCs
);

setExistingField({});
setContentTypeSchema([]);
setContentTypeMapped({});

if (status == 200) {
await updateContentMapper(orgId, projectID, {...newstate} );

Notification({
notificationContent: { text: 'Content type reset successfully' },
notificationProps: {
Expand All @@ -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." },
Expand All @@ -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);

Expand All @@ -1532,7 +1634,7 @@ const ContentMapper = forwardRef(({projectData}: ContentMapperComponentProps, re
contentTypesArr[index] = data;
}

setContentTypesList(contentTypesArr);
//setContentTypesList(contentTypesArr);
setContentTypeSchema(data?.schema);
if (status == 201) {
Notification({
Expand Down Expand Up @@ -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({
Expand Down
5 changes: 4 additions & 1 deletion ui/src/context/app/app.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -170,6 +171,7 @@ export interface IContentMapper {
content_type_mapping: ContentTypeMap;
isDropDownChanged?: boolean;
otherCmsTitle?: string;
contentTypeList:ContentTypeList[]
}
export interface INewMigration {
mapperKeys: ContentTypeMap;
Expand Down Expand Up @@ -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 = {
Expand Down