frontend/containers/Profile/ProfileField.tsx (view raw)
1import React from 'react';
2import Typography from '@material-ui/core/Typography';
3import TextField from '@material-ui/core/TextField';
4const ProfileField = ({
5 name,
6 label,
7 value,
8 defaultValue = '',
9 onChange,
10 isEditing,
11 ...inputProps
12}) => {
13 if (isEditing) {
14 return (
15 <TextField
16 label={label}
17 fullWidth
18 margin="dense"
19 value={value}
20 onChange={({target: {value = ''}}) => onChange(value)}
21 id={`Profile${name}`}
22 name={name}
23 {...inputProps}
24 />
25 );
26 }
27 return (
28 <>
29 <Typography variant="h6">{label}</Typography>
30 <Typography variant="body1" gutterBottom>
31 {value || defaultValue}
32 </Typography>
33 </>
34 );
35};
36export default ProfileField;