diff --git a/src/react/endpoint/EndpointCreate.tsx b/src/react/endpoint/EndpointCreate.tsx index bcc17b491..aa3840fde 100644 --- a/src/react/endpoint/EndpointCreate.tsx +++ b/src/react/endpoint/EndpointCreate.tsx @@ -7,11 +7,13 @@ import { FormSection, Icon, Stack, + spacing, } from '@scality/core-ui'; -import { Button, Input, Select } from '@scality/core-ui/dist/next'; +import { Box, Button, Input, Select } from '@scality/core-ui/dist/next'; import { useMemo } from 'react'; import { Controller, useForm } from 'react-hook-form'; import { useHistory } from 'react-router-dom'; +import styled from 'styled-components'; import { useCreateEndpointMutation, useWaitForRunningConfigurationVersionToBeUpdated, @@ -21,6 +23,14 @@ import { useAccountsLocationsAndEndpoints } from '../next-architecture/domain/bu import { useAccountsLocationsEndpointsAdapter } from '../next-architecture/ui/AccountsLocationsEndpointsAdapterProvider'; import { useInstanceId } from '../next-architecture/ui/AuthProvider'; +const BannerMessageList = styled.ul` + margin: ${spacing.r8} 0; + padding-left: ${spacing.r16}; + li { + margin-bottom: ${spacing.r8}; + } +`; + const schema = Joi.object({ hostname: Joi.string().label('Hostname').required().min(3), locationName: Joi.string().required(), @@ -100,7 +110,7 @@ function EndpointCreate() { return (
@@ -133,15 +143,39 @@ function EndpointCreate() { } banner={ - createEndpointMutation.isError && ( + } - title="Error" - variant="danger" + icon={ + + + + } + variant="warning" > - {createEndpointMutation.error?.message} + +
  • Expect some delay—creating a new Data Service takes time.
  • +
  • + Creating a new Data Service will regenerate all Certificates + related to Data Services. If these Certificates were already + replaced by ones issued by your Authority, they will have to be + replaced again. Contact your Platform admin if needed. +
  • +
    - ) + {createEndpointMutation.isError ? ( + } + title="Error" + variant="danger" + > + {createEndpointMutation.error?.message} + + ) : null} +
    } > @@ -151,6 +185,7 @@ function EndpointCreate() { labelHelpTooltip="Cannot be modified after creation." direction="vertical" error={errors.hostname?.message ?? ''} + required content={ Loading locations... diff --git a/src/react/endpoint/__tests__/EndpointCreate.test.tsx b/src/react/endpoint/__tests__/EndpointCreate.test.tsx index 821bf48f7..024c3a5a9 100644 --- a/src/react/endpoint/__tests__/EndpointCreate.test.tsx +++ b/src/react/endpoint/__tests__/EndpointCreate.test.tsx @@ -44,11 +44,49 @@ describe('EndpointCreate', () => { ); await selectClick( - screen.getByRole('textbox', { name: 'Storage Location' }), + screen.getByRole('textbox', { name: /Storage Location/i }), ); //V expect( screen.queryByRole('option', { name: new RegExp(coldLocation, 'i') }), ).toHaveAttribute('aria-disabled', 'true'); }); + + it('should always render the warning message', async () => { + const coldLocation = 'europe25-myroom-cold'; + //E + await renderWithRouterMatch(, undefined, { + configuration: { + latest: { + locations: { + [coldLocation]: { + locationType: 'location-dmf-v1', + name: coldLocation, + isCold: true, + details: { + endpoint: 'ws://tape.myroom.europe25.cnes:8181', + repoId: ['repoId'], + nsId: 'nsId', + username: 'username', + password: 'password', + }, + }, + }, + }, + }, + }); + + await waitForElementToBeRemoved(() => + screen.getByText('Loading locations...'), + ); + + const warningMessages = [ + `Expect some delay—creating a new Data Service takes time.`, + `Creating a new Data Service will regenerate all Certificates related to Data Services. If these Certificates were already replaced by ones issued by your Authority, they will have to be replaced again. Contact your Platform admin if needed.`, + ]; + + warningMessages.forEach((message) => { + expect(screen.getByText(message)).toBeInTheDocument(); + }); + }); });