diff --git a/src/react/account/AccountCreate.tsx b/src/react/account/AccountCreate.tsx index af43ffd12..ac1f4cff5 100644 --- a/src/react/account/AccountCreate.tsx +++ b/src/react/account/AccountCreate.tsx @@ -21,14 +21,15 @@ import { useInstanceId } from '../next-architecture/ui/AuthProvider'; const regexpEmailAddress = /^\S+@\S+.\S+$/; const regexpName = /^[\w+=,.@ -]+$/; +export const accountNameValidationSchema = Joi.string() + .label('Name') + .required() + .min(2) + .max(64) + .regex(regexpName) + .message('Invalid Name'); const schema = Joi.object({ - name: Joi.string() - .label('Name') - .required() - .min(2) - .max(64) - .regex(regexpName) - .message('Invalid Name'), + name: accountNameValidationSchema, email: Joi.string() .label('Root Account Email') .required() diff --git a/src/react/ui-elements/Veeam/VeeamConfiguration.tsx b/src/react/ui-elements/Veeam/VeeamConfiguration.tsx index cd9acbfbc..9d2e4f417 100644 --- a/src/react/ui-elements/Veeam/VeeamConfiguration.tsx +++ b/src/react/ui-elements/Veeam/VeeamConfiguration.tsx @@ -11,7 +11,7 @@ import { } from '@scality/core-ui'; import { useStepper } from '@scality/core-ui/dist/components/steppers/Stepper.component'; import { Button, Input, Select } from '@scality/core-ui/dist/next'; -import { useRef, useState } from 'react'; +import { useEffect, useMemo, useRef, useState } from 'react'; import { Controller, FormProvider, useForm } from 'react-hook-form'; import { useHistory } from 'react-router-dom'; import { @@ -34,8 +34,11 @@ import { VEEAM_STEPS, VeeamStepsIndexes } from './VeeamSteps'; import { ListItem } from './VeeamTable'; import { getCapacityBytes } from './useCapacityUnit'; import { bucketNameValidationSchema } from '../../databrowser/buckets/BucketCreate'; +import { accountNameValidationSchema } from '../../../react/account/AccountCreate'; +import { useAccounts } from '../../../react/utils/hooks'; const schema = Joi.object({ + accountName: accountNameValidationSchema, bucketName: bucketNameValidationSchema, application: Joi.string().required(), capacity: Joi.when('application', { @@ -52,6 +55,7 @@ const schema = Joi.object({ }); type VeeamConfiguration = { + accountName: string; bucketName: string; application: string; capacity: string; @@ -112,6 +116,7 @@ const Configuration = () => { mode: 'all', resolver: joiResolver(schema), defaultValues: { + accountName: '', bucketName: '', application: VEEAM_BACKUP_REPLICATION_XML_VALUE, capacity: '0', @@ -125,12 +130,29 @@ const Configuration = () => { control, register, watch, + setValue, formState: { errors, isValid }, } = methods; const history = useHistory(); + const { accounts, status } = useAccounts(); + + useEffect(() => { + if (status === 'success' && accounts.length === 0) { + setValue('accountName', VEEAM_DEFAULT_ACCOUNT_NAME); + } + }, [status]); const { next } = useStepper(VeeamStepsIndexes.Configuration, VEEAM_STEPS); const application = watch('application'); + const accountName = watch('accountName'); + + const isAccountExist = useMemo(() => { + return ( + status === 'success' && + accounts.some((account) => account.Name === accountName) + ); + }, [accountName, status]); + const onSubmit = ({ capacity, capacityUnit, @@ -146,8 +168,7 @@ const Configuration = () => { application === VEEAM_BACKUP_REPLICATION_XML_VALUE ? enableImmutableBackup : false, - // Add advanced configuration to set the account name, for the moment we use the default account name. - accountName: VEEAM_DEFAULT_ACCOUNT_NAME, + accountName, }); }; @@ -201,6 +222,30 @@ const Configuration = () => { } > + + } + /> { id="bucketName" type="text" autoComplete="off" - placeholder="Veeam bucket name" + placeholder="veeam-bucket-name" {...register('bucketName')} /> } diff --git a/src/react/ui-elements/Veeam/VeeamSummary.tsx b/src/react/ui-elements/Veeam/VeeamSummary.tsx index b9f25dedd..d3aa38643 100644 --- a/src/react/ui-elements/Veeam/VeeamSummary.tsx +++ b/src/react/ui-elements/Veeam/VeeamSummary.tsx @@ -14,10 +14,10 @@ import styled from 'styled-components'; import { CertificateDownloadButton } from '../../next-architecture/ui/CertificateDownloadButton'; import { useAuthGroups } from '../../utils/hooks'; import { HideCredential } from '../Hide'; -import { VEEAM_DEFAULT_ACCOUNT_NAME } from './VeeamConstants'; import { useGetS3ServicePoint } from './useGetS3ServicePoint'; type VeeamSummaryProps = { + accountName: string; bucketName: string; enableImmutableBackup: boolean; accessKey: string; @@ -58,6 +58,7 @@ const Separator = styled.div` `; export const VeeamSummary = ({ + accountName, bucketName, enableImmutableBackup, accessKey, @@ -79,9 +80,7 @@ export const VeeamSummary = ({ variant="primary" label="Exit" onClick={() => { - history.push( - `/accounts/${VEEAM_DEFAULT_ACCOUNT_NAME}/buckets/${bucketName}`, - ); + history.push(`/accounts/${accountName}/buckets/${bucketName}`); }} /> } diff --git a/src/react/ui-elements/Veeam/VeeamTable.tsx b/src/react/ui-elements/Veeam/VeeamTable.tsx index 49630ae74..892e8dac8 100644 --- a/src/react/ui-elements/Veeam/VeeamTable.tsx +++ b/src/react/ui-elements/Veeam/VeeamTable.tsx @@ -32,7 +32,7 @@ export default function VeeamTable(propsConfiguration: VeeamTableProps) { const history = useHistory(); const queryClient = useQueryClient(); const { next } = useStepper(VeeamStepsIndexes.Table, VEEAM_STEPS); - const { bucketName, enableImmutableBackup } = propsConfiguration; + const { bucketName, enableImmutableBackup, accountName } = propsConfiguration; const { data, accessKey, secretKey } = useMutationTableData({ propsConfiguration, }); @@ -139,6 +139,7 @@ export default function VeeamTable(propsConfiguration: VeeamTableProps) { onClick={() => { queryClient.invalidateQueries(['WebIdentityRoles']); next({ + accountName, bucketName, enableImmutableBackup, accessKey,