Commit ddb7b99c authored by Egor Kremnev's avatar Egor Kremnev

rename TextInput component to FormElement

parent 19ad45b3
import {Route, Routes} from "react-router-dom"; import {Route, Routes} from "react-router-dom";
import {LOGIN, PRODUCT_ADD, PRODUCT_LIST, PRODUCT_VIEW, REGISTER} from "./constants/routes"; import {LOGIN, PRODUCT_ADD, PRODUCT_LIST, PRODUCT_VIEW, REGISTER} from "./constants/routes";
import Layout from "./components/Layout/Layout"; import Layout from "./components/Layout/Layout";
......
import {useState} from "react"; import {useState} from "react";
import {Button, Grid, TextField} from "@mui/material"; import {Button, Grid, TextField} from "@mui/material";
import FileInput from "../../UI/Form/FormElement/FileInput/FileInput"; import FileInput from "../../UI/Form/FileInput/FileInput";
const ProductForm = ({createProductHandler}) => { const ProductForm = ({createProductHandler}) => {
const [state, setState] = useState({ const [state, setState] = useState({
......
import {Grid, TextField} from "@mui/material"; import {Grid, TextField} from "@mui/material";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
const TextInput = ({name, label, value, onChange, required, error, type}) => { const FomElement = ({name, label, value, onChange, required, error, type}) => {
return <Grid item xs={12}> return <Grid item xs={12}>
<TextField <TextField
fullWidth fullWidth
...@@ -19,7 +19,7 @@ const TextInput = ({name, label, value, onChange, required, error, type}) => { ...@@ -19,7 +19,7 @@ const TextInput = ({name, label, value, onChange, required, error, type}) => {
</Grid>; </Grid>;
}; };
TextInput.propTypes = { FomElement.propTypes = {
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
label: PropTypes.string.isRequired, label: PropTypes.string.isRequired,
value: PropTypes.string.isRequired, value: PropTypes.string.isRequired,
...@@ -29,4 +29,4 @@ TextInput.propTypes = { ...@@ -29,4 +29,4 @@ TextInput.propTypes = {
onChange: PropTypes.func.isRequired onChange: PropTypes.func.isRequired
}; };
export default TextInput; export default FomElement;
...@@ -6,7 +6,7 @@ import {Link as RouterLink, useLocation, useNavigate} from 'react-router-dom'; ...@@ -6,7 +6,7 @@ import {Link as RouterLink, useLocation, useNavigate} from 'react-router-dom';
import {REGISTER} from "../../../constants/routes"; import {REGISTER} from "../../../constants/routes";
import {useDispatch, useSelector} from "react-redux"; import {useDispatch, useSelector} from "react-redux";
import {loginUser} from "../../../store/actions/usersActions"; import {loginUser} from "../../../store/actions/usersActions";
import TextInput from "../../../components/UI/Form/FormElement/TextInput/TextInput"; import FomElement from "../../../components/UI/Form/FormElement/FomElement";
import {setLoginError} from "../../../store/services/usersSlice"; import {setLoginError} from "../../../store/services/usersSlice";
const theme = createTheme(); const theme = createTheme();
...@@ -63,14 +63,14 @@ const Login = () => { ...@@ -63,14 +63,14 @@ const Login = () => {
{error && <Alert severity="error">{error.error}</Alert>} {error && <Alert severity="error">{error.error}</Alert>}
<Box component="form" noValidate onSubmit={handleSubmit} sx={{ mt: 3 }}> <Box component="form" noValidate onSubmit={handleSubmit} sx={{ mt: 3 }}>
<Grid container spacing={2}> <Grid container spacing={2}>
<TextInput <FomElement
required={true} required={true}
label="Username" label="Username"
name="username" name="username"
onChange={inputChangeHandler} onChange={inputChangeHandler}
value={state.username} value={state.username}
/> />
<TextInput <FomElement
required={true} required={true}
name="password" name="password"
label="Password" label="Password"
......
...@@ -6,7 +6,7 @@ import {Link as RouterLink, useLocation, useNavigate} from 'react-router-dom'; ...@@ -6,7 +6,7 @@ import {Link as RouterLink, useLocation, useNavigate} from 'react-router-dom';
import {LOGIN} from "../../../constants/routes"; import {LOGIN} from "../../../constants/routes";
import {useDispatch, useSelector} from "react-redux"; import {useDispatch, useSelector} from "react-redux";
import {registerUser} from "../../../store/actions/usersActions"; import {registerUser} from "../../../store/actions/usersActions";
import TextInput from "../../../components/UI/Form/FormElement/TextInput/TextInput"; import FomElement from "../../../components/UI/Form/FormElement/FomElement";
import {setRegisterError} from "../../../store/services/usersSlice"; import {setRegisterError} from "../../../store/services/usersSlice";
const theme = createTheme(); const theme = createTheme();
...@@ -66,7 +66,7 @@ const Register = () => { ...@@ -66,7 +66,7 @@ const Register = () => {
</Typography> </Typography>
<Box component="form" noValidate onSubmit={handleSubmit} sx={{ mt: 3 }}> <Box component="form" noValidate onSubmit={handleSubmit} sx={{ mt: 3 }}>
<Grid container spacing={2}> <Grid container spacing={2}>
<TextInput <FomElement
required={true} required={true}
label="Username" label="Username"
name="username" name="username"
...@@ -74,7 +74,7 @@ const Register = () => { ...@@ -74,7 +74,7 @@ const Register = () => {
value={state.username} value={state.username}
error={getFieldError('username')} error={getFieldError('username')}
/> />
<TextInput <FomElement
required={true} required={true}
name="password" name="password"
label="Password" label="Password"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment