diff --git a/ui/public/index.html b/ui/public/index.html index ff2a7cd3d..9eb09bff4 100644 --- a/ui/public/index.html +++ b/ui/public/index.html @@ -65,7 +65,7 @@ - Skip to main content + Skip to main content
diff --git a/ui/src/components/AccountPage/index.scss b/ui/src/components/AccountPage/index.scss index 712968411..830efa2a3 100644 --- a/ui/src/components/AccountPage/index.scss +++ b/ui/src/components/AccountPage/index.scss @@ -143,9 +143,8 @@ .copyright_text { bottom: 1.5rem; color: $color-font-base; - font-size: .75rem; - letter-spacing: .02em; + font-size: 0.75rem; + letter-spacing: 0.02em; left: 2.5rem; position: absolute; } - diff --git a/ui/src/components/AccountPage/index.tsx b/ui/src/components/AccountPage/index.tsx index 5cb8a7460..655113ec4 100644 --- a/ui/src/components/AccountPage/index.tsx +++ b/ui/src/components/AccountPage/index.tsx @@ -36,7 +36,7 @@ const AccountPage = (props: AccountObj): JSX.Element => {
{props?.children}
-

{`© ${previousYear}-${currentYear} ${copyrightText}`}

+

{`© ${previousYear}-${currentYear} ${copyrightText}`}

); diff --git a/ui/src/components/AdvancePropertise/index.tsx b/ui/src/components/AdvancePropertise/index.tsx index 6248e3e6b..58b52f25d 100644 --- a/ui/src/components/AdvancePropertise/index.tsx +++ b/ui/src/components/AdvancePropertise/index.tsx @@ -11,19 +11,16 @@ import { import './index.scss'; - export interface SchemaProps { fieldtype: string; value: any; rowId: string; - updateFieldSettings:(rowId:string, value:any, checkBoxChanged:boolean)=> void; - isLocalised:boolean; + updateFieldSettings: (rowId: string, value: any, checkBoxChanged: boolean) => void; + isLocalised: boolean; closeModal: () => void; - data:any + data: any; } -const AdvancePropertise = (props: SchemaProps) => { - - +const AdvancePropertise = (props: SchemaProps) => { const [toggleStates, setToggleStates] = useState({ validationRegex: props?.value?.ValidationRegex, mandatory: props?.value?.Mandatory, @@ -33,26 +30,31 @@ const AdvancePropertise = (props: SchemaProps) => { }); const handleToggleChange = (field: string, value: boolean, checkBoxChanged: boolean) => { - - setToggleStates(prevStates => ({ + setToggleStates((prevStates) => ({ ...prevStates, [field]: value - })); - - props?.updateFieldSettings(props?.rowId, {[field?.charAt(0)?.toUpperCase() + field?.slice(1)]: value}, checkBoxChanged); -}; + })); - const handleOnChange = ( field: string, event: any, checkBoxChanged: boolean) => { - setToggleStates(prevStates => ({ + props?.updateFieldSettings( + props?.rowId, + { [field?.charAt(0)?.toUpperCase() + field?.slice(1)]: value }, + checkBoxChanged + ); + }; + + const handleOnChange = (field: string, event: any, checkBoxChanged: boolean) => { + setToggleStates((prevStates) => ({ ...prevStates, [field]: event?.target?.value - })); - - props?.updateFieldSettings(props?.rowId, {[field?.charAt(0)?.toUpperCase() + field?.slice(1)]: event?.target?.value}, checkBoxChanged); + })); - } + props?.updateFieldSettings( + props?.rowId, + { [field?.charAt(0)?.toUpperCase() + field?.slice(1)]: event?.target?.value }, + checkBoxChanged + ); + }; - return ( <> @@ -66,7 +68,7 @@ const AdvancePropertise = (props: SchemaProps) => { value={toggleStates?.validationRegex} placeholder="Enter value" version="v2" - onChange={(e:any)=> handleOnChange("validationRegex",e, true)} + onChange={(e: any) => handleOnChange('validationRegex', e, true)} /> Options @@ -77,33 +79,36 @@ const AdvancePropertise = (props: SchemaProps) => { labelColor="primary" labelPosition="right" checked={toggleStates?.mandatory} - onChange={(e:any) => handleToggleChange("mandatory" , e?.target?.checked, true)} + onChange={(e: any) => handleToggleChange('mandatory', e?.target?.checked, true)} /> handleToggleChange("multiple" ,e?.target?.checked, true)} + onChange={(e: any) => handleToggleChange('multiple', e?.target?.checked, true)} /> handleToggleChange("unique" , e?.target?.checked,true)} + onChange={(e: any) => handleToggleChange('unique', e?.target?.checked, true)} /> - - handleToggleChange("nonLocalizable" , e?.target?.checked,true)} - /> - + + handleToggleChange('nonLocalizable', e?.target?.checked, true)} + />

If enabled, editing this field is restricted in localized entries. The field will use diff --git a/ui/src/components/Card/card.scss b/ui/src/components/Card/card.scss index a1f21cbe2..9c596df7b 100644 --- a/ui/src/components/Card/card.scss +++ b/ui/src/components/Card/card.scss @@ -12,11 +12,17 @@ padding: 1.75rem 2rem 0.688rem; } .ProjectCard__title { - color: $color-font-black; - font-size: $size-font-2-xl; - font-weight: $font-weight-extra-bold; - height: 1.563rem; - line-height: $line-height-reset; + color: $color-font-base; + display: -webkit-box; + font-size: $size-font-xl; + font-weight: $font-weight-semi-bold; + height: $px-48; + line-height: $line-height-default; + overflow: hidden; + padding: 0; + white-space: normal; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; } .ProjectCard__footer { display: flex; diff --git a/ui/src/components/Card/index.tsx b/ui/src/components/Card/index.tsx index 9657208c7..43d1e28b1 100644 --- a/ui/src/components/Card/index.tsx +++ b/ui/src/components/Card/index.tsx @@ -43,7 +43,9 @@ const CardList = ({ project }: ProjectType) => {

Project Status - {PROJECT_STATUS?.[project?.status !== undefined ? project?.status : 0]} + + {PROJECT_STATUS?.[project?.status !== undefined ? project?.status : 0]} +
diff --git a/ui/src/components/Common/AddStack/addStack.scss b/ui/src/components/Common/AddStack/addStack.scss index 5eba81072..5a6647c80 100644 --- a/ui/src/components/Common/AddStack/addStack.scss +++ b/ui/src/components/Common/AddStack/addStack.scss @@ -9,4 +9,3 @@ .ReactModal__Overlay .ReactModal__Content .ReactModal__Content__body.selectWrapperBody { overflow: visible; } - diff --git a/ui/src/components/Common/AddStack/addStack.tsx b/ui/src/components/Common/AddStack/addStack.tsx index 9d948f472..86a8f94d0 100644 --- a/ui/src/components/Common/AddStack/addStack.tsx +++ b/ui/src/components/Common/AddStack/addStack.tsx @@ -81,24 +81,26 @@ const AddStack = (props: any): JSX.Element => { setIsLoading(false); }); - //fetch all locales - getAllLocales(props?.selectedOrganisation).then((response:any) => { - const rawMappedLocalesMapped = validateObject(response?.data) && response?.data?.locales - ? Object?.keys(response?.data?.locales)?.map((key) => ({ - uid: key, - label: response?.data?.locales[key], - value: key, - master_locale: key, - locales:[], - created_at: key - })) - : []; + //fetch all locales + getAllLocales(props?.selectedOrganisation) + .then((response: any) => { + const rawMappedLocalesMapped = + validateObject(response?.data) && response?.data?.locales + ? Object?.keys(response?.data?.locales)?.map((key) => ({ + uid: key, + label: response?.data?.locales[key], + value: key, + master_locale: key, + locales: [], + created_at: key + })) + : []; setAllLocales(rawMappedLocalesMapped); }) .catch((err: any) => { console.error(err); }); - //org id will always be there + //org id will always be there }, []); return ( <> diff --git a/ui/src/components/ContentMapper/contentMapper.interface.ts b/ui/src/components/ContentMapper/contentMapper.interface.ts index dbdabf861..80a7662cd 100644 --- a/ui/src/components/ContentMapper/contentMapper.interface.ts +++ b/ui/src/components/ContentMapper/contentMapper.interface.ts @@ -10,11 +10,11 @@ interface mapDataType { projectId: string; } interface Advanced { - ValidationRegex: string, - mandatory:boolean, - multiple:boolean, - unique:boolean, - nonLocalizable:boolean + ValidationRegex: string; + mandatory: boolean; + multiple: boolean; + unique: boolean; + nonLocalizable: boolean; } export interface ContentMapperType { content_types_heading?: string; @@ -64,7 +64,7 @@ export interface FieldMapType { uid: string; id: string; _canSelect?: boolean; - advanced:Advanced + advanced: Advanced; } export interface ItemStatus { diff --git a/ui/src/components/ContentMapper/index.scss b/ui/src/components/ContentMapper/index.scss index fc9d30f37..05a8e229c 100644 --- a/ui/src/components/ContentMapper/index.scss +++ b/ui/src/components/ContentMapper/index.scss @@ -75,7 +75,7 @@ } } .disabled-field { - color: $color-font-disabled; + color: $color-font-disabled; } .action-btn-wrapper { background-color: $color-brand-white-base; diff --git a/ui/src/components/ContentMapper/index.tsx b/ui/src/components/ContentMapper/index.tsx index 3259d7689..e1f96e426 100644 --- a/ui/src/components/ContentMapper/index.tsx +++ b/ui/src/components/ContentMapper/index.tsx @@ -87,8 +87,8 @@ const Fields: Mapping = { }; interface ModalProps { - e:React.MouseEvent; - newIndex:number; + e: React.MouseEvent; + newIndex: number; closeModal: () => void; } const ContentMapper = () => { @@ -142,24 +142,23 @@ const ContentMapper = () => { const [isContentTypeMapped, setisContentTypeMapped] = useState(false); const [isContentTypeSaved, setisContentTypeSaved] = useState(false); const [advancePropertise, setadvancePropertise] = useState({ - validationRegex:'', + validationRegex: '', Mandatory: false, Multiple: false, Unique: false, NonLocalizable: false }); - const [isLocalised, setisLocalised] = useState(newMigrationData?.destination_stack?.selectedStack?.locales?.length > 1 ? true : false); - - + const [isLocalised, setisLocalised] = useState( + newMigrationData?.destination_stack?.selectedStack?.locales?.length > 1 ? true : false + ); const [active, setActive] = useState(null ?? 0); const [searchContentType, setSearchContentType] = useState(''); - const [rowIds, setRowIds] = useState({}) + const [rowIds, setRowIds] = useState({}); const [selectedEntries, setSelectedEntries] = useState([]); - /** ALL HOOKS Here */ const { projectId = '' } = useParams(); const navigate = useNavigate(); @@ -191,7 +190,7 @@ const ContentMapper = () => { field._canSelect = true; } }); - }) + }); useEffect(() => { if (contentTypeMapped && otherCmsTitle) { @@ -223,8 +222,8 @@ const ContentMapper = () => { acc[item?.id] = true; return acc; }, {}); - setRowIds(selectedId) - }, [tableData]) + setRowIds(selectedId); + }, [tableData]); // Method to fetch content types const fetchContentTypes = async (searchText: string) => { @@ -255,10 +254,10 @@ const ContentMapper = () => { // Method to search content types const handleSearch = async (searchCT: string) => { - setSearchContentType(searchCT) - + setSearchContentType(searchCT); + const { data } = await getContentTypes(projectId, 0, 5, searchCT || ''); //org id will always present - + setContentTypes(data?.contentTypes); setSelectedContentType(data?.contentTypes?.[0]); setTotalCounts(data?.contentTypes?.[0]?.fieldMapping?.length); @@ -350,19 +349,17 @@ const ContentMapper = () => { //function to handle previous content type navigation const handlePrevClick = (e: React.MouseEvent) => { const newIndex = currentIndex > 0 ? currentIndex - 1 : 0; - if(isDropDownChanged){ - handleSaveContentTypeModal(e, newIndex) - - }else{ + if (isDropDownChanged) { + handleSaveContentTypeModal(e, newIndex); + } else { setCurrentIndex(newIndex); openContentType(e, newIndex); document.querySelectorAll('.ct-list li').forEach((ctLi, ind) => { if (newIndex === ind) { ctLi?.classList?.add('active-ct'); } - }) - - } + }); + } }; // function to handle next content type navigation @@ -370,24 +367,20 @@ const ContentMapper = () => { if (currentIndex < contentTypes?.length - 1) { const newIndex = currentIndex + 1; - if(isDropDownChanged){ - handleSaveContentTypeModal(e, newIndex) - - }else{ + if (isDropDownChanged) { + handleSaveContentTypeModal(e, newIndex); + } else { setCurrentIndex(newIndex); openContentType(e, newIndex); document.querySelectorAll('.ct-list li').forEach((ctLi, ind) => { if (newIndex === ind) { ctLi?.classList?.add('active-ct'); } - }) - - } - + }); + } } }; - const SaveContentType = (props:ModalProps) => { - + const SaveContentType = (props: ModalProps) => { return ( <> @@ -395,44 +388,48 @@ const ContentMapper = () => {

Hey there! You have unsaved changes on this page.

- - - - - + + + ); - } - const handleSaveContentTypeModal = (e:any, newIndex:number) => { + }; + const handleSaveContentTypeModal = (e: any, newIndex: number) => { return cbModal({ - component: (props: ModalObj) => ( - - ), + component: (props: ModalObj) => , modalProps: { shouldCloseOnOverlayClick: true, size: 'small' } }); - } + }; // Function to get exisiting content types list const fetchExistingContentTypes = async () => { @@ -441,26 +438,23 @@ const ContentMapper = () => { setContentTypesList(data?.contentTypes); } }; - - const updateFieldSettings = (rowId:string, updatedSettings:any, checkBoxChanged:boolean) => { + + const updateFieldSettings = (rowId: string, updatedSettings: any, checkBoxChanged: boolean) => { setisDropDownCHanged(checkBoxChanged); //setadvancePropertise(...updatedSettings); - - const newTableData = tableData?.map(row => { + + const newTableData = tableData?.map((row) => { if (row?.uid === rowId) { - setadvancePropertise({...row?.advanced, ...updatedSettings}); - - return { ...row, advanced: { ...row?.advanced, ...updatedSettings } }; + setadvancePropertise({ ...row?.advanced, ...updatedSettings }); + + return { ...row, advanced: { ...row?.advanced, ...updatedSettings } }; } return row; - }); - - + }); + setTableData(newTableData); }; - - const handleOnClick = (title: string) => { return cbModal({ component: (props: ModalObj) => ( @@ -491,16 +485,16 @@ const ContentMapper = () => { ); }; - + // Function to handle selected fields const handleSelectedEntries = (singleSelectedRowIds: any, selectedData: any) => { - const selectedObj: any = {} + const selectedObj: any = {}; singleSelectedRowIds.forEach((uid: any) => { selectedObj[uid] = true; - }) - setRowIds(selectedObj) - setSelectedEntries(selectedData) - } + }); + setRowIds(selectedObj); + setSelectedEntries(selectedData); + }; // Method for change select value const handleValueChange = (value: FieldTypes, rowIndex: string) => { @@ -520,13 +514,7 @@ const ContentMapper = () => { // fetchFields(contentTypes?.[i]?.id, searchText); }; - const handleAdvancedSetting = ( - fieldtype: string, - fieldvalue: any, - rowId: string, - data: any - ) => { - + const handleAdvancedSetting = (fieldtype: string, fieldvalue: any, rowId: string, data: any) => { return cbModal({ component: (props: ModalObj) => ( { maxWidth="290px" isClearable={false} options={option} - isDisabled={data?.ContentstackFieldType === "group" || data?.otherCmsField === 'title' || data?.otherCmsField === 'url'} + isDisabled={ + data?.ContentstackFieldType === 'group' || + data?.otherCmsField === 'title' || + data?.otherCmsField === 'url' + } /> - + { } /> - ); }; - const handleFieldChange = (selectedValue: FieldTypes, rowIndex: string) => { + const handleFieldChange = (selectedValue: FieldTypes, rowIndex: string) => { setisDropDownCHanged(true); setexsitingField((prevOptions) => ({ ...prevOptions, [rowIndex]: { label: selectedValue?.label, value: selectedValue?.value } })); setadvancePropertise({ - validationRegex: selectedValue?.value?.format, - Mandatory: selectedValue?.value?.mandatory, - Multiple: selectedValue?.value?.multiple, - Unique: selectedValue?.value?.unique, - NonLocalizable: selectedValue?.value?.non_localizable - }); + validationRegex: selectedValue?.value?.format, + Mandatory: selectedValue?.value?.mandatory, + Multiple: selectedValue?.value?.multiple, + Unique: selectedValue?.value?.unique, + NonLocalizable: selectedValue?.value?.non_localizable + }); if (isDropDownChanged && isContentTypeSaved) { setSelectedOptions((prevSelected) => { @@ -630,22 +621,21 @@ const ContentMapper = () => { const updatedRows = tableData.map((row) => { if (row?.uid === rowIndex) { - - return { - ...row, + return { + ...row, contentstackField: selectedValue?.label, - advanced:{ + advanced: { validationRegex: selectedValue?.value?.format, Mandatory: selectedValue?.value?.mandatory, Multiple: selectedValue?.value?.multiple, Unique: selectedValue?.value?.unique, NonLocalizable: selectedValue?.value?.non_localizable } - }; + }; } return row; }); - + setTableData(updatedRows as FieldMapType[]); }; @@ -752,7 +742,7 @@ const ContentMapper = () => { const adjustedOptions = OptionsForRow.map((option: optionsType) => ({ ...option, isDisabled: selectedOptions?.includes(option?.label ?? '') - })); + })); return (
@@ -770,16 +760,16 @@ const ContentMapper = () => { version="v2" icon="Setting" size="small" - onClick={() =>{ - const value ={ + onClick={() => { + const value = { ValidationRegex: data?.advanced?.ValidationRegex, Mandatory: data?.advanced?.mandatory, - Multiple: data?.advanced?.multiple, + Multiple: data?.advanced?.multiple, Unique: data?.advanced?.unique, - NonLocalizable: data?.advanced?.nonLocalizable - } - handleAdvancedSetting(data?.ContentstackFieldType, advancePropertise, data?.uid, data)} - } + NonLocalizable: data?.advanced?.nonLocalizable + }; + handleAdvancedSetting(data?.ContentstackFieldType, advancePropertise, data?.uid, data); + }} />
); @@ -795,7 +785,6 @@ const ContentMapper = () => { selectedContentType?.otherCmsUid && OtherContentType?.label ) { - setcontentTypeMapped((prevSelected) => ({ ...prevSelected, [otherCmsTitle]: OtherContentType?.label @@ -941,7 +930,7 @@ const ContentMapper = () => { const adjustedOption = options.map((option: any) => ({ ...option, isDisabled: contentTypeMapped && Object.values(contentTypeMapped).includes(option?.label) - })); + })); return (
diff --git a/ui/src/components/DestinationStack/Actions/LoadStacks.tsx b/ui/src/components/DestinationStack/Actions/LoadStacks.tsx index 661e866c5..53803041c 100644 --- a/ui/src/components/DestinationStack/Actions/LoadStacks.tsx +++ b/ui/src/components/DestinationStack/Actions/LoadStacks.tsx @@ -38,8 +38,8 @@ const LoadStacks = (props: LoadFileFormatProps) => { label: 'Loading stacks...', value: 'loading', default: false, - master_locale:'', - locales:[], + master_locale: '', + locales: [], created_at: '' } ]; @@ -162,12 +162,12 @@ const LoadStacks = (props: LoadFileFormatProps) => { //Set selected Stack const selectedStackData = validateArray(stackArray) - ? stackArray.find( - (stack: IDropDown) => - stack?.value === newMigrationData?.destination_stack?.selectedStack?.value - ) - : DEFAULT_DROPDOWN; - + ? stackArray.find( + (stack: IDropDown) => + stack?.value === newMigrationData?.destination_stack?.selectedStack?.value + ) + : DEFAULT_DROPDOWN; + setSelectedStack(selectedStackData); const newMigrationDataObj: INewMigration = { @@ -195,7 +195,7 @@ const LoadStacks = (props: LoadFileFormatProps) => { }} onSubmit={handleOnSave} defaultValues={defaultStack} - selectedOrganisation= {selectedOrganisation?.value} + selectedOrganisation={selectedOrganisation?.value} {...props} /> ), diff --git a/ui/src/components/DestinationStack/Summary/StacksSummary.tsx b/ui/src/components/DestinationStack/Summary/StacksSummary.tsx index ebb20d70d..b6c3bac58 100644 --- a/ui/src/components/DestinationStack/Summary/StacksSummary.tsx +++ b/ui/src/components/DestinationStack/Summary/StacksSummary.tsx @@ -2,8 +2,12 @@ import { useContext, useState } from 'react'; import StepIcon from '../../../components/Stepper/FlowStepper/StepIcon'; import { AppContext } from '../../../context/app/app.context'; import { isEmptyString } from '../../../utilities/functions'; -import { DEFAULT_DROPDOWN, IDropDown, INewMigration, IStep } from '../../../context/app/app.interface'; - +import { + DEFAULT_DROPDOWN, + IDropDown, + INewMigration, + IStep +} from '../../../context/app/app.interface'; import './summary.scss'; import { Icon, Select } from '@contentstack/venus-components'; @@ -11,7 +15,6 @@ interface StacksSummaryProps { stepData: IStep; } - const StacksSummary = (props: StacksSummaryProps): JSX.Element => { const { newMigrationData } = useContext(AppContext); const [selectedStack, setSelectedStack] = useState( @@ -26,7 +29,7 @@ const StacksSummary = (props: StacksSummaryProps): JSX.Element => { value: 'loading', default: false, master_locale: '', - locales:[], + locales: [], created_at: '' } ]; @@ -36,7 +39,7 @@ const StacksSummary = (props: StacksSummaryProps): JSX.Element => {
{/* {!isEmptyString(newMigrationData?.destination_stack?.selectedStack?.label) && !isEmptyString(newMigrationData?.destination_stack?.selectedStack?.value) && ( */} -
+
@@ -45,7 +48,9 @@ const StacksSummary = (props: StacksSummaryProps): JSX.Element => { className="stackselect" version={'v2'} options={allStack} - onChange={()=>{return}} + onChange={() => { + return; + }} value={selectedStack} isSearchable={true} isClearable={true} @@ -64,7 +69,12 @@ const StacksSummary = (props: StacksSummaryProps): JSX.Element => {
- {return}}> + { + return; + }} + > Create New Stack diff --git a/ui/src/components/DestinationStack/index.tsx b/ui/src/components/DestinationStack/index.tsx index f08cae353..866eca491 100644 --- a/ui/src/components/DestinationStack/index.tsx +++ b/ui/src/components/DestinationStack/index.tsx @@ -84,7 +84,7 @@ const DestinationStackComponent = ({ value: destination_stack, label: '', master_locale: '', - locales:[], + locales: [], created_at: '' }; @@ -164,10 +164,7 @@ const DestinationStackComponent = ({ //Check for migration Status and lock. // Status where Migration is to be Locked: - setIsMigrationLocked( - projectData?.status === 2 || - projectData?.status === 5 - ); + setIsMigrationLocked(projectData?.status === 2 || projectData?.status === 5); }; fetchCMSData(); }, []); @@ -190,7 +187,10 @@ const DestinationStackComponent = ({ internalActiveStepIndex > -1 && internalActiveStepIndex === migrationData?.destinationStackData?.all_steps?.length - 1 ) { - autoVerticalStepperComponent?.current?.handleDynamicStepChange(internalActiveStepIndex, true); + autoVerticalStepperComponent?.current?.handleDynamicStepChange( + internalActiveStepIndex, + true + ); } } }, [internalActiveStepIndex]); diff --git a/ui/src/components/LegacyCms/Actions/LoadFileFormat.tsx b/ui/src/components/LegacyCms/Actions/LoadFileFormat.tsx index 3c1dec755..3a9f62526 100644 --- a/ui/src/components/LegacyCms/Actions/LoadFileFormat.tsx +++ b/ui/src/components/LegacyCms/Actions/LoadFileFormat.tsx @@ -46,7 +46,7 @@ const LoadFileFormat = (props: LoadFileFormatProps) => { /**** ALL METHODS HERE ****/ - const handleBtnClick = async(e: MouseEvent) => { + const handleBtnClick = async (e: MouseEvent) => { e.preventDefault(); if (!isEmptyString(selectedCard?.fileformat_id) && isCheckedBoxChecked) { updateNewMigrationData({ @@ -59,7 +59,7 @@ const LoadFileFormat = (props: LoadFileFormatProps) => { await updateFileFormatData(selectedOrganisation?.value, projectId, { file_format: selectedCard?.fileformat_id }); - + await fileformatConfirmation(selectedOrganisation?.value, projectId, { fileformat_confirmation: isCheckedBoxChecked }); diff --git a/ui/src/components/LegacyCms/Actions/LoadPrefix.tsx b/ui/src/components/LegacyCms/Actions/LoadPrefix.tsx index 4e5fb5410..b43f73ede 100644 --- a/ui/src/components/LegacyCms/Actions/LoadPrefix.tsx +++ b/ui/src/components/LegacyCms/Actions/LoadPrefix.tsx @@ -43,7 +43,7 @@ const LoadPreFix = (props: LoadSelectCmsProps) => { /**** ALL METHODS HERE ****/ //Handle Prefix Change - const handleOnBlur = async(e: MouseEvent) => { + const handleOnBlur = async (e: MouseEvent) => { e.preventDefault(); if (!isEmptyString(prefix) && !isError && isCheckedBoxChecked) { const newMigrationDataObj: INewMigration = { @@ -128,7 +128,7 @@ const LoadPreFix = (props: LoadSelectCmsProps) => { version="v2" error={isError} /> - {isError &&

Affix should not be more than 5 chars

} + {isError &&

Affix should not be more than 5 chars

}
- - ); }; diff --git a/ui/src/components/LegacyCms/Summary/UploadFileSummary.tsx b/ui/src/components/LegacyCms/Summary/UploadFileSummary.tsx index 04f3a3b21..55d3caf05 100644 --- a/ui/src/components/LegacyCms/Summary/UploadFileSummary.tsx +++ b/ui/src/components/LegacyCms/Summary/UploadFileSummary.tsx @@ -18,16 +18,17 @@ interface Props { const FileComponent: React.FC = ({ fileDetails }) => { return (
- {fileDetails?.isLocalPath ? - (
-

Local Path: {fileDetails?.localPath}

-
) : - (
-

AWS Region: {fileDetails?.awsData?.awsRegion}

-

Bucket Name: {fileDetails?.awsData?.bucketName}

-

Bucket Key: {fileDetails?.awsData?.buketKey}

)} - - + {fileDetails?.isLocalPath ? ( +
+

Local Path: {fileDetails?.localPath}

+
+ ) : ( +
+

AWS Region: {fileDetails?.awsData?.awsRegion}

+

Bucket Name: {fileDetails?.awsData?.bucketName}

+

Bucket Key: {fileDetails?.awsData?.buketKey}

+
+ )}
); }; diff --git a/ui/src/components/LegacyCms/index.tsx b/ui/src/components/LegacyCms/index.tsx index 856a97207..13db987a8 100644 --- a/ui/src/components/LegacyCms/index.tsx +++ b/ui/src/components/LegacyCms/index.tsx @@ -177,10 +177,7 @@ const LegacyCMSComponent = ({ legacyCMSData, projectData }: LegacyCMSComponentPr //Check for migration Status and lock. // Status where Migration is to be Locked: - setIsMigrationLocked( - projectData?.status === 2 || - projectData?.status === 5 - ); + setIsMigrationLocked(projectData?.status === 2 || projectData?.status === 5); }; fetchCMSData(); diff --git a/ui/src/components/LegacyCms/legacyCms.scss b/ui/src/components/LegacyCms/legacyCms.scss index 8d1cc71cb..c3918f41d 100644 --- a/ui/src/components/LegacyCms/legacyCms.scss +++ b/ui/src/components/LegacyCms/legacyCms.scss @@ -1,4 +1,4 @@ -@import '../../scss/variables'; +@import '../../scss/variables'; .service_list { text-align: center; display: flex; diff --git a/ui/src/components/MainHeader/index.scss b/ui/src/components/MainHeader/index.scss index c4903139d..20aea4986 100644 --- a/ui/src/components/MainHeader/index.scss +++ b/ui/src/components/MainHeader/index.scss @@ -23,8 +23,8 @@ display: flex; height: 2.5rem; justify-content: center; - padding: .5rem; - text-decoration: none; + padding: 0.5rem; + text-decoration: none; } a:focus { border-radius: 5px; @@ -49,9 +49,11 @@ color: #475161; max-width: 11.1875rem; width: auto; - overflow: hidden; + // overflow: hidden; } - .Dropdown__menu--primary .Dropdown__menu__list__item, .Dropdown__menu--secondary .Dropdown__menu__list__item, .Dropdown__menu--tertiary .Dropdown__menu__list__item { + .Dropdown__menu--primary .Dropdown__menu__list__item, + .Dropdown__menu--secondary .Dropdown__menu__list__item, + .Dropdown__menu--tertiary .Dropdown__menu__list__item { max-width: 14.5rem; } } @@ -60,6 +62,6 @@ line-height: $line-height-reset; } .Dropdown__header__value { - color: $color-black-222!important; + color: $color-black-222 !important; line-height: $line-height-reset; -} \ No newline at end of file +} diff --git a/ui/src/components/MainHeader/index.tsx b/ui/src/components/MainHeader/index.tsx index c3e6077aa..edbd57c66 100644 --- a/ui/src/components/MainHeader/index.tsx +++ b/ui/src/components/MainHeader/index.tsx @@ -102,7 +102,7 @@ const MainHeader = () => {
- Contentstack Logo + Contentstack Logo
@@ -110,7 +110,7 @@ const MainHeader = () => { '' )} -
+
{ }; const nameValidation = (value: string) => { - - if (value === '') { + if(!value){ + setInputValue(false); + return ; + } + else if (!/^[^\s].+[^\s]$/.test(value)) { setInputValue(false); return 'Please enter project name.'; } else if (value && value?.length > 200) { @@ -56,18 +59,18 @@ const Modal = (props: ProjectModalProps) => { return 'Project Name should not be more than 200 chars'; } else { setInputValue(true); - return ''; } }; const descValidation = (value: string) => { - if (value && value?.length > 255) { + if (value?.length >= 255) { setInputValue(false); return 'Description should not be more than 255 chars'; } else { return ''; } }; + return ( <> { placeholder={namePlaceholder} data-testid="title-input" name="name" + maxLength='200' error={(meta?.error || meta?.submitError) && meta?.touched} /> - {meta?.error && meta?.touched && ( - + {meta?.error && ( + {meta?.error} )} + ); }} @@ -140,6 +149,7 @@ const Modal = (props: ProjectModalProps) => { {({ input, meta }): JSX.Element => { + return ( <> @@ -148,16 +158,19 @@ const Modal = (props: ProjectModalProps) => {