Validation flow seems OK.
This commit is contained in:
parent
04cd163906
commit
24fb46c0fb
|
@ -1,4 +1,11 @@
|
|||
import { Box, Button, TextField } from '@suid/material';
|
||||
import {
|
||||
Alert,
|
||||
Box,
|
||||
Button,
|
||||
Modal,
|
||||
TextField,
|
||||
Typography,
|
||||
} from '@suid/material';
|
||||
import { Component, createEffect, createSignal, Show } from 'solid-js';
|
||||
import Dialog from '../dialog';
|
||||
|
||||
|
@ -50,7 +57,12 @@ const Invitation: Component<props> = (props) => {
|
|||
`${invitation().url.href}/${invitation().code}`
|
||||
);
|
||||
const codeData = await response.json();
|
||||
setInvitation({ ...invitation(), codeData });
|
||||
setInvitation({
|
||||
...invitation(),
|
||||
codeData,
|
||||
failure: codeData.response !== 'OK',
|
||||
success: codeData.response === 'OK',
|
||||
});
|
||||
} catch (error) {}
|
||||
};
|
||||
|
||||
|
@ -58,7 +70,16 @@ const Invitation: Component<props> = (props) => {
|
|||
setInvitation({ ...invitation(), code: event.target.value });
|
||||
};
|
||||
|
||||
const handleModalFailureClose = () => {
|
||||
setInvitation({ ...invitation(), failure: undefined });
|
||||
};
|
||||
|
||||
const handleModalSuccessClose = () => {
|
||||
setInvitation(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Dialog
|
||||
open={!!invitation()}
|
||||
fullScreen={false}
|
||||
|
@ -76,7 +97,8 @@ const Invitation: Component<props> = (props) => {
|
|||
autoComplete='off'
|
||||
>
|
||||
<p>
|
||||
Pour configurer cette application en tant que "{invitation().data.id}
|
||||
Pour configurer cette application en tant que "
|
||||
{invitation().data.id}
|
||||
", copier le code qui vous a été envoyé par mail à l'adresse "
|
||||
{invitation().data.mail}" :{' '}
|
||||
</p>
|
||||
|
@ -91,6 +113,49 @@ const Invitation: Component<props> = (props) => {
|
|||
</Button>
|
||||
</Box>
|
||||
</Dialog>
|
||||
<Modal
|
||||
open={!!invitation().failure}
|
||||
onClose={handleModalFailureClose}
|
||||
aria-labelledby='modal-modal-title'
|
||||
aria-describedby='modal-modal-description'
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
width: 400,
|
||||
border: '2px solid #000',
|
||||
boxShadow: '24px',
|
||||
p: 4,
|
||||
}}
|
||||
>
|
||||
<Alert severity='error'>Le code est erroné !</Alert>
|
||||
</Box>
|
||||
</Modal>{' '}
|
||||
<Modal
|
||||
open={!!invitation().success}
|
||||
onClose={handleModalSuccessClose}
|
||||
aria-labelledby='modal-modal-title'
|
||||
aria-describedby='modal-modal-description'
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
width: 400,
|
||||
border: '2px solid #000',
|
||||
boxShadow: '24px',
|
||||
p: 4,
|
||||
}}
|
||||
>
|
||||
<Alert severity='success'>C'est tout bon !</Alert>
|
||||
</Box>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue