use CompanyDropdown component in registration form (#4548)

Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>
This commit is contained in:
Jeremy Letto 2022-01-30 19:47:10 -06:00 committed by GitHub
parent 1d780058c8
commit febe029ed4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 3 deletions

View file

@ -7,9 +7,11 @@ import { Images } from 'images/Images';
import './CountryDropdown.css'; import './CountryDropdown.css';
import { CountryLabel } from 'types'; import { CountryLabel } from 'types';
const CountryDropdown = ({ onChange }) => { const CountryDropdown = ({ input: { onChange } }) => {
const [state, setState] = useState(''); const [state, setState] = useState('');
useEffect(() => onChange(state), [state]);
return ( return (
<FormControl variant='outlined' className='CountryDropdown'> <FormControl variant='outlined' className='CountryDropdown'>
<InputLabel id='CountryDropdown-select'>Country</InputLabel> <InputLabel id='CountryDropdown-select'>Country</InputLabel>

View file

@ -8,7 +8,7 @@ import setFieldTouched from 'final-form-set-field-touched'
import Button from '@material-ui/core/Button'; import Button from '@material-ui/core/Button';
import Typography from '@material-ui/core/Typography'; import Typography from '@material-ui/core/Typography';
import { InputField, KnownHosts } from 'components'; import { CountryDropdown, InputField, KnownHosts } from 'components';
import { useReduxEffect } from 'hooks'; import { useReduxEffect } from 'hooks';
import { ServerTypes } from 'store'; import { ServerTypes } from 'store';
import { FormKey } from 'types'; import { FormKey } from 'types';
@ -131,7 +131,7 @@ const RegisterForm = ({ onSubmit }: RegisterFormProps) => {
<OnChange name="email">{onEmailChange}</OnChange> <OnChange name="email">{onEmailChange}</OnChange>
</div> </div>
<div className="RegisterForm-item"> <div className="RegisterForm-item">
<Field label="Country" name="country" component={InputField} /> <Field label="Country" name="country" component={CountryDropdown} />
</div> </div>
<Button className="RegisterForm-submit tall" color="primary" variant="contained" type="submit"> <Button className="RegisterForm-submit tall" color="primary" variant="contained" type="submit">
Register Register

View file

@ -97,6 +97,13 @@ export const materialTheme = createTheme({
fontSize: 12, fontSize: 12,
fontWeight: 'bold', fontWeight: 'bold',
color: palette.primary.main, color: palette.primary.main,
},
},
MuiInputLabel: {
outlined: {
transform: 'translate(1em, 1em) scale(1)',
}, },
}, },