Develop verify for mrm #359
Conversation
…alg if dropdown value has verified selected in it and some layout issue
|
|
||
| const Component = ({ fields, values, locale, displayName, index, collapsedFieldValues, mode }) => { | ||
| const currentValues = values[index]; | ||
| const [selectedIndex, setSelectedIndex] = useState(null); |
There was a problem hiding this comment.
Group the useState vars together
| ); | ||
| close(); | ||
| }; | ||
| const i18n = useI18n(); |
There was a problem hiding this comment.
Move this hook towards the top of component with other hooks
|
|
||
| const Component = ({ fields, values, locale, displayName, index, collapsedFieldValues, mode }) => { | ||
| const currentValues = values[index]; | ||
| const [selectedIndex, setSelectedIndex] = useState(null); |
There was a problem hiding this comment.
Group the useState vars together
| @@ -26,7 +108,57 @@ const Component = ({ fields, values, locale, displayName, index, collapsedFieldV | |||
| </div> | |||
| } | |||
| > | |||
| {canVerify && mode.isShow ? ( | |||
| <Button | |||
| onClick={event => handleOpenVerifyModal(index, event)} | |||
There was a problem hiding this comment.
Props that are objects, calculated, functions should be in a var and referenced as the value of the prop. Leaving an object in a prop causes unnecessary re-renders. Need to change in a number of places
| <VerifySelect selectedValue={verificationValue} setSelectedValue={setVeficationValue} /> | ||
| {verificationValue === "verified" ? | ||
| <MuiPickersUtilsProvider utils={DateFnsUtils}> | ||
| <div style={{ display: "flex", justifyContent: "space-between" }}> |
There was a problem hiding this comment.
Example of what should be var
| value={selectedDate} | ||
| onChange={handleDropdownDate} | ||
| error={!!validationError} | ||
| maxDate={new Date()} // Disable future dates |
| value={selectedValue} | ||
| onChange={handleChange} | ||
| onSel | ||
| MenuProps={{ |
| // Define MuiPickersUtilsProvider component | ||
| const MuiPickersUtilsProviderComponent = ( | ||
| <MuiPickersUtilsProvider utils={DateFnsUtils}> | ||
| <div style={{ display: "flex", justifyContent: "space-between" }}> |
There was a problem hiding this comment.
Still have some props that are objects. Styles like this can be move into a css file and referenced with the className prop.
| onChange={handleDropdownDate} | ||
| error={!!validationError} | ||
| maxDate={new Date()} // Disable future dates | ||
| InputProps={{ |
There was a problem hiding this comment.
Was this made a variable? Its hard for me to tell
| value={selectedValue} | ||
| onChange={handleChange} | ||
| onSel | ||
| MenuProps={{ |
|
|
||
| return ( | ||
| <Box sx={{ minWidth: 150 }} > | ||
| <FormControl fullWidth classes={{ |
There was a problem hiding this comment.
Make value of classes a var
| horizontal: 'left' | ||
| } | ||
| }} | ||
| classes={{ |
| } | ||
| }; | ||
|
|
||
| const handleOpenVerifyModal = (index, event) => { |
There was a problem hiding this comment.
Don't need index argument here since its declared above. Its causing lint errors
| {canVerify && mode.isShow ? ( | ||
| <Button | ||
| onClick={(event) => handleOpenVerifyModal(index, event)} | ||
| id={`verify-button-${name}-${index}`} |
There was a problem hiding this comment.
Is name defined somewhere? There is a lint error related to name somewhere
No description provided.