From 8d08ebe44ddae8d72f37eb8a12096625995d0e01 Mon Sep 17 00:00:00 2001 From: Sayali Joshi Date: Tue, 30 Apr 2024 12:09:08 +0530 Subject: [PATCH 1/4] [CMG-84], [CMG-85] --- .../ContentMapper/contentMapper.interface.ts | 3 +- ui/src/components/ContentMapper/index.tsx | 33 +++++++++++++----- .../LegacyCms/Actions/LoadSelectCms.tsx | 2 +- ui/src/components/LegacyCms/index.tsx | 1 - ui/src/pages/Home/index.tsx | 20 +++++------ ui/src/pages/Login/index.tsx | 34 +++++++++++++------ ui/src/pages/Login/login.interface.ts | 7 ++++ ui/src/pages/RegionalLogin/index.tsx | 15 ++++---- ui/src/utilities/constants.ts | 3 +- ui/src/utilities/functions.ts | 11 +++--- 10 files changed, 83 insertions(+), 46 deletions(-) diff --git a/ui/src/components/ContentMapper/contentMapper.interface.ts b/ui/src/components/ContentMapper/contentMapper.interface.ts index f6766980..0a85ad55 100644 --- a/ui/src/components/ContentMapper/contentMapper.interface.ts +++ b/ui/src/components/ContentMapper/contentMapper.interface.ts @@ -55,7 +55,8 @@ export interface FieldMapType { otherCmsType: string; uid: string; id: string; - _invalid?: boolean; + _canFreezeCheckbox?: boolean; + _canSelect?: boolean; } export interface ItemStatus { diff --git a/ui/src/components/ContentMapper/index.tsx b/ui/src/components/ContentMapper/index.tsx index f278bdca..f6ba4129 100644 --- a/ui/src/components/ContentMapper/index.tsx +++ b/ui/src/components/ContentMapper/index.tsx @@ -143,8 +143,8 @@ const ContentMapper = () => { stackStatus(); tableData?.forEach((field) => { - if (field?.otherCmsField === 'title' || field?.otherCmsField === 'url') { - field._invalid = true; + if (field?.otherCmsField === 'title') { + field._canFreezeCheckbox = true; } }); }, []); @@ -400,6 +400,7 @@ const ContentMapper = () => { maxWidth="290px" isClearable={false} options={option} + isDisabled={data?.otherCmsField === 'title' || data?.otherCmsField === 'url'} /> { if (!IsEmptyStack) { columns?.push({ disableSortBy: true, - Header: `Contentstack: ${newMigrationData?.destination_stack?.selectedStack?.label}`, + Header: `Contentstack: ${OtherContentType?.label ?? ''}`, // accessor: 'ct_field', accessor: SelectAccessorOfColumn, id: 'contentstack_field', @@ -664,7 +665,23 @@ const ContentMapper = () => { value: item?.title })); - // console.log("==============", contentTypesList); + const [SelectedAssets, updateSelectedAssets] = useState({}) + const [resetRowSelection, updateResetRowSelection] = useState(false) + + const getSelectedRow = (singleSelectedRowIds: any, selectedData: any) => { + console.log("singleSelectedRowIds, selectedData", singleSelectedRowIds, selectedData); + + } + + const onRowSelectProp = [ + { + label: 'Log selected Items', + cb: (data: any) => { + console.log('selected data', data) + updateResetRowSelection(true) + } + } + ] return (
@@ -750,6 +767,7 @@ const ContentMapper = () => { columnSelector={false} initialRowSelectedData={tableData} initialSelectedRowIds={rowIds} + // getSelectedRow={getSelectedRow} withExportCta={{ component: (
@@ -771,10 +789,9 @@ const ContentMapper = () => { ), showExportCta: true }} - rowDisableProp={{ - key: '_invalid', - value: true - }} + // onRowSelectProp={onRowSelectProp} + // rowSelectCheckboxProp={{ key: '_canSelect', value: true }} + v2Features={{ key: 'canFreezeCheckbox', value: true }} />
diff --git a/ui/src/components/LegacyCms/Actions/LoadSelectCms.tsx b/ui/src/components/LegacyCms/Actions/LoadSelectCms.tsx index a1be998e..48fa0877 100644 --- a/ui/src/components/LegacyCms/Actions/LoadSelectCms.tsx +++ b/ui/src/components/LegacyCms/Actions/LoadSelectCms.tsx @@ -159,7 +159,7 @@ const LoadSelectCms = (props: LoadSelectCmsProps) => { { const { cta, description, heading } = data; return ( -
-
- {heading && } - {description &&

{parse(description)}

} - - {cta && cta?.title && ( - - - - )} -
+
+ {heading && } + {description &&

{parse(description)}

} + + {cta && cta?.title && ( + + + + )}
); }; diff --git a/ui/src/pages/Login/index.tsx b/ui/src/pages/Login/index.tsx index ea9ead7a..dd8abd53 100644 --- a/ui/src/pages/Login/index.tsx +++ b/ui/src/pages/Login/index.tsx @@ -9,12 +9,13 @@ import { Heading, ValidationMessage, Paragraph, - Link + Link, + Notification } from '@contentstack/venus-components'; import { Field as FinalField, Form as FinalForm } from 'react-final-form'; // Utilities -import { LOGIN_SUCCESSFUL_MESSAGE, TFA_MESSAGE, CS_ENTRIES } from '../../utilities/constants'; +import { LOGIN_SUCCESSFUL_MESSAGE, TFA_MESSAGE, TFA_VIA_SMS_MESSAGE, CS_ENTRIES } from '../../utilities/constants'; import { failtureNotification, clearMarks, @@ -85,7 +86,7 @@ const Login: FC = (props: any) => { }, []); // ************* send SMS token ************ - const sendSMS = async (): Promise => { + const sendSMS = async () => { const userAuth = { user: { email: loginStates?.user?.email, @@ -94,14 +95,25 @@ const Login: FC = (props: any) => { } }; - requestSMSToken(userAuth?.user) - .then((res: UserRes) => { - if (res?.message === LOGIN_SUCCESSFUL_MESSAGE) { - setLoginStates((prev) => ({ ...prev, submitted: true })); - } - }) - .catch((err: string) => console.error(err)); - }; + await requestSMSToken(userAuth?.user) + .then((res: UserRes) => { + if (res?.status === 200 && res?.data?.notice === TFA_VIA_SMS_MESSAGE) { + Notification({ + notificationContent: { text: res?.data?.notice }, + type: 'success' + }); + } + + if (res?.message === LOGIN_SUCCESSFUL_MESSAGE) { + setLoginStates((prev) => ({ ...prev, submitted: true })); + } + + if (res?.status === 422) { + failtureNotification(res?.data?.error_message as string); + } + }) + .catch((err: string) => console.error(err)); + }; // ************* Login submit ************ const onSubmit = async (values: User) => { diff --git a/ui/src/pages/Login/login.interface.ts b/ui/src/pages/Login/login.interface.ts index ed2f2bfd..42e6b240 100644 --- a/ui/src/pages/Login/login.interface.ts +++ b/ui/src/pages/Login/login.interface.ts @@ -78,6 +78,13 @@ export interface User { export interface UserRes { message?: string; + status?: number; + data?: Response; +} + +interface Response { + notice?: string; + error_message?: string; } export interface SmsToken { diff --git a/ui/src/pages/RegionalLogin/index.tsx b/ui/src/pages/RegionalLogin/index.tsx index 5703eb59..ad41b173 100644 --- a/ui/src/pages/RegionalLogin/index.tsx +++ b/ui/src/pages/RegionalLogin/index.tsx @@ -59,18 +59,17 @@ const RegionalLogin = () => { const { description, heading, regions } = data; return ( - <> -
-
+
+
+
{heading && } {description && description != '' && (
{parse(description as string)}
)}
-
-
+
-
+
{regions && validateArray(regions) && regions?.map((region, index) => ( @@ -115,7 +114,9 @@ const RegionalLogin = () => {
- + + +
); }; diff --git a/ui/src/utilities/constants.ts b/ui/src/utilities/constants.ts index c79765de..75b739fa 100644 --- a/ui/src/utilities/constants.ts +++ b/ui/src/utilities/constants.ts @@ -1,4 +1,4 @@ -export const BASE_API_URL = 'http://localhost:5000/'; +export const BASE_API_URL = 'http://localhost:5001/'; export const assetsRelativeUrl = 'v3/assets'; export const WEBSITE_BASE_URL = process.env.REACT_APP_WEBSITE_BASE_URL; export const TOKEN_KEY = 'access_token'; @@ -10,6 +10,7 @@ export const AUTH_ROUTES = `${API_VERSION}/auth`; export const LOGIN_SUCCESSFUL_MESSAGE = 'Login Successful.'; export const TFA_MESSAGE = 'Please login using the Two-Factor verification Token'; +export const TFA_VIA_SMS_MESSAGE = 'Two-Factor Authentication Token sent via SMS.'; export const API_METHOD = { GET: 'GET', diff --git a/ui/src/utilities/functions.ts b/ui/src/utilities/functions.ts index aed3e202..7035f1e3 100644 --- a/ui/src/utilities/functions.ts +++ b/ui/src/utilities/functions.ts @@ -1,4 +1,5 @@ import { Notification } from '@contentstack/venus-components'; +import { WEBSITE_BASE_URL } from './constants'; export const Locales = { en: 'en-us', @@ -28,17 +29,17 @@ export const validateImage = (image: any) => image && image?.url; export const validateLink = (link: any) => link && link?.url; export const imageWithSiteDomainUrl = (url: string) => { - if (process?.env?.WEBSITE_BASE_URL && url?.indexOf('https://images.contentstack.io') > -1) { - return url.replace('https://images.contentstack.io', process.env.WEBSITE_BASE_URL); + if (WEBSITE_BASE_URL && url?.indexOf('https://images.contentstack.io') > -1) { + return url.replace('https://images.contentstack.io', WEBSITE_BASE_URL); } - if (process?.env?.WEBSITE_BASE_URL && url?.indexOf('https://assets.contentstack.io/') > -1) { - return url.replace('https://assets.contentstack.io', process.env.WEBSITE_BASE_URL); + if (WEBSITE_BASE_URL && url?.indexOf('https://assets.contentstack.io/') > -1) { + return url.replace('https://assets.contentstack.io', WEBSITE_BASE_URL); } return url; }; export const addDomainInPath = (path: string) => { - return `${process.env.REACT_APP_WEBSITE_BASE_URL}${path}`; + return `${WEBSITE_BASE_URL}${path}`; }; export const failtureNotification = (errorMessage: string) => { From 39e3da7c6d6eb596971053cc81861e9cd8b220bf Mon Sep 17 00:00:00 2001 From: Sayali Joshi Date: Tue, 30 Apr 2024 12:46:20 +0530 Subject: [PATCH 2/4] Refactor: PR comments resolved --- ui/src/components/ContentMapper/index.tsx | 13 ++----------- ui/src/utilities/constants.ts | 2 +- 2 files changed, 3 insertions(+), 12 deletions(-) diff --git a/ui/src/components/ContentMapper/index.tsx b/ui/src/components/ContentMapper/index.tsx index f6ba4129..554d2fcd 100644 --- a/ui/src/components/ContentMapper/index.tsx +++ b/ui/src/components/ContentMapper/index.tsx @@ -665,19 +665,13 @@ const ContentMapper = () => { value: item?.title })); - const [SelectedAssets, updateSelectedAssets] = useState({}) - const [resetRowSelection, updateResetRowSelection] = useState(false) - - const getSelectedRow = (singleSelectedRowIds: any, selectedData: any) => { - console.log("singleSelectedRowIds, selectedData", singleSelectedRowIds, selectedData); - - } + const [SelectedAssets, updateSelectedAssets] = useState({}); + const [resetRowSelection, updateResetRowSelection] = useState(false); const onRowSelectProp = [ { label: 'Log selected Items', cb: (data: any) => { - console.log('selected data', data) updateResetRowSelection(true) } } @@ -767,7 +761,6 @@ const ContentMapper = () => { columnSelector={false} initialRowSelectedData={tableData} initialSelectedRowIds={rowIds} - // getSelectedRow={getSelectedRow} withExportCta={{ component: (
@@ -789,8 +782,6 @@ const ContentMapper = () => { ), showExportCta: true }} - // onRowSelectProp={onRowSelectProp} - // rowSelectCheckboxProp={{ key: '_canSelect', value: true }} v2Features={{ key: 'canFreezeCheckbox', value: true }} />
diff --git a/ui/src/utilities/constants.ts b/ui/src/utilities/constants.ts index 75b739fa..cff090a1 100644 --- a/ui/src/utilities/constants.ts +++ b/ui/src/utilities/constants.ts @@ -1,4 +1,4 @@ -export const BASE_API_URL = 'http://localhost:5001/'; +export const BASE_API_URL = process.env.REACT_APP_BASE_API_URL; export const assetsRelativeUrl = 'v3/assets'; export const WEBSITE_BASE_URL = process.env.REACT_APP_WEBSITE_BASE_URL; export const TOKEN_KEY = 'access_token'; From 805b9ce703ef71c747cda64f6c1f06b8d47bb6aa Mon Sep 17 00:00:00 2001 From: Sayali Joshi Date: Tue, 30 Apr 2024 13:17:32 +0530 Subject: [PATCH 3/4] Revert 'refactor: Removed unwanted Venus Components' This reverts commit 355e81d527aa8668494a6371693da2a14aacef9d. --- ui/src/App.tsx | 4 +- .../components/Common/AddStack/addStack.tsx | 342 +++++++++--------- ui/src/components/Common/FileUpload/index.tsx | 40 +- ui/src/components/DestinationStack/index.tsx | 68 ++-- ui/src/components/LegacyCms/index.tsx | 86 +++-- 5 files changed, 291 insertions(+), 249 deletions(-) diff --git a/ui/src/App.tsx b/ui/src/App.tsx index a8e4d256..6e841111 100644 --- a/ui/src/App.tsx +++ b/ui/src/App.tsx @@ -12,9 +12,7 @@ import './scss/App.scss'; function App() { return ( - - {/* }> */} - + }> diff --git a/ui/src/components/Common/AddStack/addStack.tsx b/ui/src/components/Common/AddStack/addStack.tsx index 2f3b9a15..fbf2310d 100644 --- a/ui/src/components/Common/AddStack/addStack.tsx +++ b/ui/src/components/Common/AddStack/addStack.tsx @@ -80,172 +80,182 @@ const AddStack = (props: any): JSX.Element => { }, []); return ( - { - const errors: any = {}; - if (!values.name || values.name.trim().lenght < 1) { - errors.name = 'Stack name required'; - } - if (!values.locale || values.locale === '') { - errors.locale = 'Required'; - } - return errors; - }} - initialValues={{ - locale: { label: 'English - United States', value: 'en-us' } - }} - render={({ handleSubmit }): JSX.Element => { - return ( - <> -
-
- - - - - {({ input, meta }): JSX.Element => { - return ( - <> - - {addStackCMSData.stack_name} - - { - input.onChange(event); - }} - name="name" - autoComplete="off" - type="text" - placeholder={addStackCMSData.stack_name_placeholder} - error={(meta.error || meta.submitError) && meta.touched} - /> - {meta.error && meta.touched && ( - - {meta.error} - - )} - - ); - }} - - - - - {({ input }): any => { - return ( -
- - - {addStackCMSData.stack_description} - -