From 6a3f93009476ecd3e1a3598d20bec1f2cf44260b Mon Sep 17 00:00:00 2001
From: Vinicius Gabriel Machado <vgm18@inf.ufpr.br>
Date: Mon, 27 Sep 2021 19:45:13 -0300
Subject: [PATCH] Implementing contrast in admin

---
 .../Components/Inputs/CreateInstitution.js    | 16 ++++++++-------
 .../Components/Inputs/CreateLanguage.js       | 16 ++++++++-------
 .../Components/Inputs/CreateQuestion.js       | 14 +++++++------
 .../Components/Inputs/CreateRating.js         | 16 ++++++++-------
 .../Components/Inputs/CreateRole.js           | 16 ++++++++-------
 .../Components/Inputs/EditCollection.js       | 16 ++++++++-------
 .../Components/Inputs/EditLanguage.js         | 20 ++++++++++---------
 .../Components/Components/Inputs/EditRoles.js | 20 ++++++++++---------
 .../Components/Inputs/IntitutionsInputs.js    | 19 ++++++++++--------
 .../Components/Inputs/NoteVarInputs.js        | 18 +++++++++--------
 src/Components/FormInput.js                   |  2 ++
 11 files changed, 98 insertions(+), 75 deletions(-)

diff --git a/src/Admin/Components/Components/Inputs/CreateInstitution.js b/src/Admin/Components/Components/Inputs/CreateInstitution.js
index 9fb01a1d..2ff90b68 100644
--- a/src/Admin/Components/Components/Inputs/CreateInstitution.js
+++ b/src/Admin/Components/Components/Inputs/CreateInstitution.js
@@ -20,7 +20,7 @@ import React, { useState, useContext } from 'react';
 //imports material ui componets
 import CardContent from "@material-ui/core/CardContent";
 import CardAction from '@material-ui/core/CardActions';
-import { Typography, TextField, Button, Grid } from '@material-ui/core';
+import { Typography, Button, Grid } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import AddRoundedIcon from '@material-ui/icons/AddRounded';
 import ListRoundedIcon from '@material-ui/icons/ListRounded';
@@ -29,6 +29,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //router
 import { Link } from 'react-router-dom';
 
@@ -225,17 +226,18 @@ const CreateInstitution = (props) => {
 
                 <form style={{ display: 'flex', flexDirection: 'column' }}>
                     {fields.map((field, index) => (
-                        <TextField
+                        <FormInput
+                            contrast={state.contrast}
                             key={index}
                             required={field.required}
                             error={field.error}
-                            helperText={field.error ? field.errorMessage : ''}
+                            help={field.error ? field.errorMessage : ''}
                             style={{ width: '250px', marginBottom: '1em' }}
-                            label={field.label}
+                            placeholder={field.label}
                             value={field.value}
-                            onChange={field.onChange}
-                            type="search"
-                            multiline={true}
+                            handleChange={field.onChange}
+                            inputType="search"
+                            multi={true}
                         />
                     ))}
                 </form>
diff --git a/src/Admin/Components/Components/Inputs/CreateLanguage.js b/src/Admin/Components/Components/Inputs/CreateLanguage.js
index 22fedb52..45764323 100644
--- a/src/Admin/Components/Components/Inputs/CreateLanguage.js
+++ b/src/Admin/Components/Components/Inputs/CreateLanguage.js
@@ -20,7 +20,7 @@ import React, { useState, useContext } from 'react';
 //imports material ui componets
 import CardContent from "@material-ui/core/CardContent";
 import CardAction from '@material-ui/core/CardActions';
-import { Typography, TextField, Button, Grid } from '@material-ui/core';
+import { Typography, Button, Grid } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import AddRoundedIcon from '@material-ui/icons/AddRounded';
 import ListRoundedIcon from '@material-ui/icons/ListRounded';
@@ -29,6 +29,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //router
 import { Link } from 'react-router-dom';
 
@@ -202,17 +203,18 @@ const CreateLanguage = (props) => {
 
                 <form style={{ display: 'flex', flexDirection: 'column' }}>
                     {fields.map((field, index) => (
-                        <TextField
+                        <FormInput
+                            contrast={state.contrast}
                             key={index}
                             required={field.required}
                             error={field.error}
-                            helperText={field.error ? field.errorMessage : ''}
+                            help={field.error ? field.errorMessage : ''}
                             style={{ width: '250px', marginBottom: '1em' }}
-                            label={field.label}
+                            placeholder={field.label}
                             value={field.value}
-                            onChange={field.onChange}
-                            type="search"
-                            multiline={true}
+                            handleChange={field.onChange}
+                            inputType="search"
+                            multi={true}
                         />
                     ))}
                 </form>
diff --git a/src/Admin/Components/Components/Inputs/CreateQuestion.js b/src/Admin/Components/Components/Inputs/CreateQuestion.js
index 30de7158..6bd5b688 100644
--- a/src/Admin/Components/Components/Inputs/CreateQuestion.js
+++ b/src/Admin/Components/Components/Inputs/CreateQuestion.js
@@ -30,6 +30,7 @@ import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConf
 import SnackBar from '../../../../Components/SnackbarComponent';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //router
 import { Link } from 'react-router-dom';
 
@@ -207,17 +208,18 @@ const CreateQuestion = (props) => {
                             ))}
                         </TextField>
                         {fields.map((field, index) => (
-                            <TextField
+                            <FormInput
+                                contrast={state.contrast}
                                 key={index}
                                 required={field.required}
                                 error={field.error}
-                                helperText={field.error ? field.errorMessage : ''}
+                                help={field.error ? field.errorMessage : ''}
                                 style={{ width: '250px', marginBottom: '1em' }}
-                                label={field.label}
+                                placeholder={field.label}
                                 value={field.value}
-                                onChange={field.onChange}
-                                type="search"
-                                multiline={true}
+                                handleChange={field.onChange}
+                                inputType="search"
+                                multi={true}
                             />
                         ))}
                     </>
diff --git a/src/Admin/Components/Components/Inputs/CreateRating.js b/src/Admin/Components/Components/Inputs/CreateRating.js
index e0c2b7de..0b068c76 100644
--- a/src/Admin/Components/Components/Inputs/CreateRating.js
+++ b/src/Admin/Components/Components/Inputs/CreateRating.js
@@ -20,7 +20,7 @@ import React, { useState, useContext } from 'react';
 //imports material ui componets
 import CardContent from "@material-ui/core/CardContent";
 import CardAction from '@material-ui/core/CardActions';
-import { Typography, TextField, Button, Grid } from '@material-ui/core';
+import { Typography, Button, Grid } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import AddRoundedIcon from '@material-ui/icons/AddRounded';
 import ListRoundedIcon from '@material-ui/icons/ListRounded';
@@ -28,6 +28,7 @@ import ListRoundedIcon from '@material-ui/icons/ListRounded';
 import SnackBar from '../../../../Components/SnackbarComponent';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //imports services 
 import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 //router
@@ -199,17 +200,18 @@ const CreateRating = (props) => {
 
                 <form style={{ display: 'flex', flexDirection: 'column' }}>
                     {fields.map((field, index) => (
-                        <TextField
+                        <FormInput
+                            contrast={state.contrast}
                             key={index}
                             required={field.required}
                             error={field.error}
-                            helperText={field.error ? field.errorMessage : ''}
+                            help={field.error ? field.errorMessage : ''}
                             style={{ width: '250px', marginBottom: '1em' }}
-                            label={field.label}
+                            placeholder={field.label}
                             value={field.value}
-                            onChange={field.onChange}
-                            type="search"
-                            multiline={true}
+                            handleChange={field.onChange}
+                            inputType="search"
+                            multi={true}
                         />
                     ))}
                 </form>
diff --git a/src/Admin/Components/Components/Inputs/CreateRole.js b/src/Admin/Components/Components/Inputs/CreateRole.js
index 61a54e8f..8af5f8ad 100644
--- a/src/Admin/Components/Components/Inputs/CreateRole.js
+++ b/src/Admin/Components/Components/Inputs/CreateRole.js
@@ -20,7 +20,7 @@ import React, { useState, useContext } from 'react';
 //imports material ui componets
 import CardContent from "@material-ui/core/CardContent";
 import CardAction from '@material-ui/core/CardActions';
-import { Typography, TextField, Button, Grid } from '@material-ui/core';
+import { Typography, Button, Grid } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import AddRoundedIcon from '@material-ui/icons/AddRounded';
 import ListRoundedIcon from '@material-ui/icons/ListRounded';
@@ -29,6 +29,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //router
 import { Link } from 'react-router-dom';
 
@@ -192,17 +193,18 @@ const CreateRole = (props) => {
 
                 <form style={{ display: 'flex', flexDirection: 'column' }}>
                     {fields.map((field, index) => (
-                        <TextField
+                        <FormInput
+                            contrast={state.contrast}
                             key={index}
                             required={field.required}
                             error={field.error}
-                            helperText={field.error ? field.errorMessage : ''}
+                            help={field.error ? field.errorMessage : ''}
                             style={{ width: '250px', marginBottom: '1em' }}
-                            label={field.label}
+                            placeholder={field.label}
                             value={field.value}
-                            onChange={field.onChange}
-                            type="search"
-                            multiline={true}
+                            handleChange={field.onChange}
+                            inputType="search"
+                            multi={true}
                         />
                     ))}
                 </form>
diff --git a/src/Admin/Components/Components/Inputs/EditCollection.js b/src/Admin/Components/Components/Inputs/EditCollection.js
index 86a8f980..26999ce2 100644
--- a/src/Admin/Components/Components/Inputs/EditCollection.js
+++ b/src/Admin/Components/Components/Inputs/EditCollection.js
@@ -32,6 +32,7 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
 import { EditFilter, GetAData } from '../../../Filters';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //routers
 import { Link } from 'react-router-dom';
 import ClassicEditor from "@ckeditor/ckeditor5-build-classic"
@@ -209,18 +210,19 @@ const EditCollection = () => {
 
                     <form style={{ display: 'flex', flexDirection: 'column' }}>
                         {fields.map((field, index) => (
-                            <TextField
+                            <FormInput
+                                contrast={state.contrast}
                                 key={index}
                                 required={field.required}
-                                disabled={field.default}
+                                disableField={field.default}
                                 error={field.error}
-                                helperText={field.error ? field.errorMessage : ''}
+                                help={field.error ? field.errorMessage : ''}
                                 style={{ marginBottom: '1em' }}
-                                label={field.label}
+                                placeholder={field.label}
                                 value={field.value}
-                                onChange={field.onChange}
-                                type="search"
-                                multiline={true}
+                                handleChange={field.onChange}
+                                inputType="search"
+                                multi={true}
                             />
                         ))}
                         <TextField
diff --git a/src/Admin/Components/Components/Inputs/EditLanguage.js b/src/Admin/Components/Components/Inputs/EditLanguage.js
index 84963ec5..d3d48eef 100644
--- a/src/Admin/Components/Components/Inputs/EditLanguage.js
+++ b/src/Admin/Components/Components/Inputs/EditLanguage.js
@@ -18,7 +18,7 @@ along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>
 
 import React, { useState, useEffect, useContext } from 'react';
 //imports material ui components
-import { Typography, TextField, Button, Grid, ButtonGroup } from '@material-ui/core';
+import { Typography, Button, Grid, ButtonGroup } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import CardContent from "@material-ui/core/CardContent";
 import CardAction from '@material-ui/core/CardActions';
@@ -29,6 +29,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import LoadingSpinner from '../../../../Components/LoadingSpinner';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //imports services 
 import { getRequest, putRequest, deleteRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { EditFilter, GetAData, DeleteFilter } from '../../../Filters';
@@ -261,18 +262,19 @@ const EditLanguage = () => {
 
                     <form style={{ display: 'flex', flexDirection: 'column' }}>
                         {fields.map((field, index) => (
-                            <TextField
+                            <FormInput
+                                contrast={state.contrast}
                                 key={index}
                                 required={field.required}
-                                disabled={field.default}
+                                disableField={field.default}
                                 error={field.error}
-                                helperText={field.error ? field.errorMessage : ''}
-                                style={{ width: '250px', marginBottom: '1em' }}
-                                label={field.label}
+                                help={field.error ? field.errorMessage : ''}
+                                style={{ marginBottom: '1em' }}
+                                placeholder={field.label}
                                 value={field.value}
-                                onChange={field.onChange}
-                                type="search"
-                                multiline={true}
+                                handleChange={field.onChange}
+                                inputType="search"
+                                multi={true}
                             />
                         ))}
                     </form>
diff --git a/src/Admin/Components/Components/Inputs/EditRoles.js b/src/Admin/Components/Components/Inputs/EditRoles.js
index b1d4114e..be2e1688 100644
--- a/src/Admin/Components/Components/Inputs/EditRoles.js
+++ b/src/Admin/Components/Components/Inputs/EditRoles.js
@@ -18,7 +18,7 @@ along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>
 
 import React, { useState, useEffect, useContext } from 'react';
 //imports material ui components
-import { Typography, TextField, Button, Grid } from '@material-ui/core';
+import { Typography, Button, Grid } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import CardContent from "@material-ui/core/CardContent";
 import CardAction from '@material-ui/core/CardActions';
@@ -31,6 +31,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import LoadingSpinner from '../../../../Components/LoadingSpinner';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //imports services 
 import { getRequest, putRequest, deleteRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { EditFilter, GetAData, DeleteFilter } from '../../../Filters';
@@ -255,18 +256,19 @@ const EditLanguage = () => {
 
                     <form style={{ display: 'flex', flexDirection: 'column' }}>
                         {fields.map((field, index) => (
-                            <TextField
+                            <FormInput
+                                contrast={state.contrast}
                                 key={index}
                                 required={field.required}
-                                disabled={field.default}
+                                disableField={field.default}
                                 error={field.error}
-                                helperText={field.error ? field.errorMessage : ''}
-                                style={{ width: '250px', marginBottom: '1em' }}
-                                label={field.label}
+                                help={field.error ? field.errorMessage : ''}
+                                style={{ marginBottom: '1em' }}
+                                placeholder={field.label}
                                 value={field.value}
-                                onChange={field.onChange}
-                                type="search"
-                                multiline={true}
+                                handleChange={field.onChange}
+                                inputType="search"
+                                multi={true}
                             />
                         ))}
                     </form>
diff --git a/src/Admin/Components/Components/Inputs/IntitutionsInputs.js b/src/Admin/Components/Components/Inputs/IntitutionsInputs.js
index 078e4345..a94c6f70 100644
--- a/src/Admin/Components/Components/Inputs/IntitutionsInputs.js
+++ b/src/Admin/Components/Components/Inputs/IntitutionsInputs.js
@@ -18,7 +18,7 @@ along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>
 
 import React, { useState, useEffect, useContext } from 'react';
 //imports material ui components
-import { TextField, Button } from '@material-ui/core';
+import { Button } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import SaveIcon from '@material-ui/icons/Save';
 import CardContent from "@material-ui/core/CardContent";
@@ -30,6 +30,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import LoadingSpinner from '../../../../Components/LoadingSpinner';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //imports services 
 import { putRequest, getRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { EditFilter, GetAData } from '../../../Filters';
@@ -263,17 +264,19 @@ const EditInstitution = () => {
                         <div>
                             <form style={{ display: 'flex', flexDirection: 'column' }}>
                                 {fields.map((field, index) => (
-                                    <TextField
+                                    <FormInput
+                                        contrast={state.contrast}
                                         key={index}
                                         required={field.required}
+                                        disableField={field.default}
                                         error={field.error}
-                                        helperText={field.error ? field.errorMessage : ''}
-                                        style={{ width: '250px', marginBottom: '1em' }}
-                                        label={field.label}
+                                        help={field.error ? field.errorMessage : ''}
+                                        style={{ marginBottom: '1em' }}
+                                        placeholder={field.label}
                                         value={field.value}
-                                        onChange={field.onChange}
-                                        type="search"
-                                        multiline={true}
+                                        handleChange={field.onChange}
+                                        inputType="search"
+                                        multi={true}
                                     />
                                 ))}
                             </form>
diff --git a/src/Admin/Components/Components/Inputs/NoteVarInputs.js b/src/Admin/Components/Components/Inputs/NoteVarInputs.js
index 2437fe36..1f608305 100644
--- a/src/Admin/Components/Components/Inputs/NoteVarInputs.js
+++ b/src/Admin/Components/Components/Inputs/NoteVarInputs.js
@@ -18,7 +18,7 @@ along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>
 
 import React, { useState, useEffect, useContext } from 'react';
 //imports material ui components
-import { TextField, Button } from '@material-ui/core';
+import { Button } from '@material-ui/core';
 import CircularProgress from '@material-ui/core/CircularProgress';
 import SaveIcon from '@material-ui/icons/Save';
 import CardContent from "@material-ui/core/CardContent";
@@ -30,6 +30,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
 import LoadingSpinner from '../../../../Components/LoadingSpinner';
 import { StyledCard } from "../../../Components/Styles/DataCard";
 import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
 //imports services 
 import { getRequest, putRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
 import { EditFilter, GetAData } from '../../../Filters';
@@ -266,17 +267,18 @@ const NoteVarInputs = () => {
 
                     <form style={{ display: 'flex', flexDirection: 'column' }}>
                         {fields.map((field, index) => (
-                            <TextField
+                            <FormInput
+                                contrast={state.contrast}
                                 key={index}
+                                disableField={field.default}
                                 error={field.error}
-                                disabled={field.default}
-                                helperText={field.error ? field.errorMessage : ''}
+                                help={field.error ? field.errorMessage : ''}
                                 style={{ width: '250px', marginBottom: '1em' }}
-                                label={field.label}
+                                placeholder={field.label}
                                 value={field.value}
-                                onChange={field.onChange}
-                                type={field.type}
-                                multiline={true}
+                                handleChange={field.onChange}
+                                inputType={field.type}
+                                multi={true}
                             />
                         ))}
                     </form>
diff --git a/src/Components/FormInput.js b/src/Components/FormInput.js
index 8ebbbe5f..45e38a05 100644
--- a/src/Components/FormInput.js
+++ b/src/Components/FormInput.js
@@ -113,7 +113,9 @@ export default function FormInput(props) {
     return (
         <StyledTextField
             contrast={props.contrast}
+            key={props.key}
             label={props.placeholder}
+            disabled={props.disableField}
             margin="normal"
             id={props.id}
             name={props.name}
-- 
GitLab