Skip to content

Commit 2259dfc

Browse files
Luch76Luch76
committed
2024-11-22 - allow edit of ext-recip
1 parent 5c5a076 commit 2259dfc

File tree

2 files changed

+106
-103
lines changed

2 files changed

+106
-103
lines changed

‎web-ui/src/components/feedback_external_recipient_card/EditRecipientModal.jsx‎

Lines changed: 61 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useState } from 'react';
1+
import React, { useState, useEffect } from 'react';
22
import { Box, Typography, TextField, Button, Modal, Select, MenuItem } from '@mui/material';
33
import PropTypes from 'prop-types';
44

@@ -15,9 +15,10 @@ const modalStyle = {
1515
const EditRecipientModal = ({ open, onClose, profile, onChange, onSubmit }) => {
1616
const [error, setError] = useState('');
1717

18-
const handleSubmit = () => {
18+
const handleSubmit = (event) => {
19+
event.preventDefault();
1920
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
20-
if (!profile.firstName || !profile.lastName || !profile.email || !profile.companyName) {
21+
if (!profile.firstName || !profile.lastName || !profile.email) {
2122
setError('All fields must be filled');
2223
return;
2324
}
@@ -31,71 +32,70 @@ const EditRecipientModal = ({ open, onClose, profile, onChange, onSubmit }) => {
3132

3233
return (
3334
<>
34-
{ profile ? (
35+
{ profile ? (
3536
<Modal open={open} onClose={onClose}>
3637
<Box sx={{ ...modalStyle, width: 400 }}>
3738
<Typography variant="h6" component="h2">
3839
Edit Recipient Profile
3940
</Typography>
40-
<TextField
41-
label="First Name"
42-
name="firstName"
43-
value={profile.firstName}
44-
onChange={onChange}
45-
fullWidth
46-
margin="normal"
47-
error={!!error && !profile.firstName}
48-
helperText={!!error && !profile.firstName ? 'First Name is required' : ''}
49-
/>
50-
<TextField
51-
label="Last Name"
52-
name="lastName"
53-
value={profile.lastName}
54-
onChange={onChange}
55-
fullWidth
56-
margin="normal"
57-
error={!!error && !profile.lastName}
58-
helperText={!!error && !profile.lastName ? 'Last Name is required' : ''}
59-
/>
60-
<TextField
61-
label="Email"
62-
name="email"
63-
value={profile.email}
64-
onChange={onChange}
65-
fullWidth
66-
margin="normal"
67-
error={!!error && (!profile.email || error === 'Invalid email address')}
68-
helperText={!!error && (!profile.email ? 'Email is required' : error === 'Invalid email address' ? 'Invalid email address' : '')}
69-
/>
70-
<TextField
71-
label="Company Name"
72-
name="companyName"
73-
value={profile.companyName}
74-
onChange={onChange}
75-
fullWidth
76-
margin="normal"
77-
error={!!error && !profile.companyName}
78-
helperText={!!error && !profile.companyName ? 'Company Name is required' : ''}
79-
/>
80-
<Select
81-
label="Status"
82-
name="inactive"
83-
value={profile.inactive ? 'Inactive' : 'Active'}
84-
onChange={(e) => onChange({ target: { name: 'inactive', value: e.target.value === 'Inactive' } })}
85-
fullWidth
86-
margin="normal"
87-
>
88-
<MenuItem value="Active">Active</MenuItem>
89-
<MenuItem value="Inactive">Inactive</MenuItem>
90-
</Select>
91-
<Box mt={2} />
92-
<Button onClick={handleSubmit} variant="contained" color="primary">
93-
Save
94-
</Button>
41+
<form onSubmit={handleSubmit}>
42+
<TextField
43+
label="Email"
44+
name="email"
45+
value={profile.email}
46+
onChange={onChange}
47+
fullWidth
48+
margin="normal"
49+
error={!!error && (!profile.email || error === 'Invalid email address')}
50+
helperText={!!error && (!profile.email ? 'Email is required' : error === 'Invalid email address' ? 'Invalid email address' : '')}
51+
/>
52+
<TextField
53+
label="First Name"
54+
name="firstName"
55+
value={profile.firstName}
56+
onChange={onChange}
57+
fullWidth
58+
margin="normal"
59+
error={!!error && !profile.firstName}
60+
helperText={!!error && !profile.firstName ? 'First Name is required' : ''}
61+
/>
62+
<TextField
63+
label="Last Name"
64+
name="lastName"
65+
value={profile.lastName}
66+
onChange={onChange}
67+
fullWidth
68+
margin="normal"
69+
error={!!error && !profile.lastName}
70+
helperText={!!error && !profile.lastName ? 'Last Name is required' : ''}
71+
/>
72+
<TextField
73+
label="Company Name"
74+
name="companyName"
75+
value={profile.companyName}
76+
onChange={onChange}
77+
fullWidth
78+
margin="normal"
79+
/>
80+
<Select
81+
label="Status"
82+
name="inactive"
83+
value={profile.inactive ? 'Inactive' : 'Active'}
84+
onChange={(e) => onChange({ target: { name: 'inactive', value: e.target.value === 'Inactive' } })}
85+
fullWidth
86+
margin="normal"
87+
>
88+
<MenuItem value="Active">Active</MenuItem>
89+
<MenuItem value="Inactive">Inactive</MenuItem>
90+
</Select>
91+
<Box mt={2} />
92+
<Button type="submit" variant="contained" color="primary">
93+
Save
94+
</Button>
95+
</form>
9596
</Box>
9697
</Modal>
97-
) : null
98-
}
98+
) : null }
9999
</>
100100
);
101101
};

‎web-ui/src/components/feedback_external_recipient_selector/NewExternalRecipientModal.jsx‎

Lines changed: 45 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,8 @@ const NewExternalRecipientModal = ({ open, onClose, onSubmit }) => {
2020
}
2121
}, [open]);
2222

23-
const handleSubmit = () => {
23+
const handleSubmit = (event) => {
24+
event.preventDefault();
2425
if (!validateEmail(email)) {
2526
setEmailError('Please enter a valid email address');
2627
return;
@@ -52,47 +53,49 @@ const NewExternalRecipientModal = ({ open, onClose, onSubmit }) => {
5253
<CloseIcon />
5354
</IconButton>
5455
<h2>Create New External Recipient</h2>
55-
<TextField
56-
label="Email"
57-
value={email}
58-
onChange={(e) => {
59-
setEmail(e.target.value);
60-
if (emailError) setEmailError('');
61-
}}
62-
error={!!emailError}
63-
helperText={emailError}
64-
fullWidth
65-
margin="normal"
66-
/>
67-
<TextField
68-
label="First Name"
69-
value={firstName}
70-
onChange={(e) => setFirstName(e.target.value)}
71-
fullWidth
72-
margin="normal"
73-
/>
74-
<TextField
75-
label="Last Name"
76-
value={lastName}
77-
onChange={(e) => setLastName(e.target.value)}
78-
fullWidth
79-
margin="normal"
80-
/>
81-
<TextField
82-
label="Company Name"
83-
value={companyName}
84-
onChange={(e) => setCompanyName(e.target.value)}
85-
fullWidth
86-
margin="normal"
87-
/>
88-
<Button
89-
variant="contained"
90-
color="primary"
91-
onClick={handleSubmit}
92-
disabled={!email || !!emailError}
93-
>
94-
Submit
95-
</Button>
56+
<form onSubmit={handleSubmit}>
57+
<TextField
58+
label="Email"
59+
value={email}
60+
onChange={(e) => {
61+
setEmail(e.target.value);
62+
if (emailError) setEmailError('');
63+
}}
64+
error={!!emailError}
65+
helperText={emailError}
66+
fullWidth
67+
margin="normal"
68+
/>
69+
<TextField
70+
label="First Name"
71+
value={firstName}
72+
onChange={(e) => setFirstName(e.target.value)}
73+
fullWidth
74+
margin="normal"
75+
/>
76+
<TextField
77+
label="Last Name"
78+
value={lastName}
79+
onChange={(e) => setLastName(e.target.value)}
80+
fullWidth
81+
margin="normal"
82+
/>
83+
<TextField
84+
label="Company Name"
85+
value={companyName}
86+
onChange={(e) => setCompanyName(e.target.value)}
87+
fullWidth
88+
margin="normal"
89+
/>
90+
<Button
91+
type="submit"
92+
variant="contained"
93+
color="primary"
94+
disabled={!email || !!emailError}
95+
>
96+
Submit
97+
</Button>
98+
</form>
9699
</Box>
97100
</Modal>
98101
);

0 commit comments

Comments
 (0)