migrateMUI next: Restructure component definitions

src/components/User/Login.js

@@ -10,15 +10,15 @@ import Snackbar from "../Snackbar";
 import Alert from "../Alert";
 import Breadcrumbs from "../Breadcrumbs";
 
-import Button from "@material-ui/core/Button";
-import IconButton from "@material-ui/core/IconButton";
+import Button from "@mui/material/Button";
+import IconButton from "@mui/material/IconButton";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faEye, faEyeSlash } from "@fortawesome/free-solid-svg-icons";
-import TextField from "@material-ui/core/TextField";
-import Divider from "@material-ui/core/Divider";
-import InputAdornment from "@material-ui/core/InputAdornment";
-import CircularProgress from "@material-ui/core/CircularProgress";
-import Link from "@material-ui/core/Link";
+import TextField from "@mui/material/TextField";
+import Divider from "@mui/material/Divider";
+import InputAdornment from "@mui/material/InputAdornment";
+import CircularProgress from "@mui/material/CircularProgress";
+import Link from "@mui/material/Link";
 import * as Blockly from "blockly";
 
 export class Login extends Component {
@@ -125,7 +125,7 @@ export class Login extends Component {
               rel="noreferrer"
               target="_blank"
               href={"https://opensensemap.org/"}
-            >
+              underline="hover">
               openSenseMap
             </Link>{" "}
             {Blockly.Msg.login_osem_account_02}.
@@ -138,6 +138,7 @@ export class Login extends Component {
           />
           <form onSubmit={this.onSubmit}>
             <TextField
+              variant="standard"
               style={{ marginBottom: "10px" }}
               // variant='outlined'
               type="text"
@@ -145,9 +146,9 @@ export class Login extends Component {
               name="email"
               value={this.state.email}
               onChange={this.onChange}
-              fullWidth={true}
-            />
+              fullWidth={true} />
             <TextField
+              variant="standard"
               // variant='outlined'
               type={this.state.showPassword ? "text" : "password"}
               label={Blockly.Msg.labels_password}
@@ -160,7 +161,7 @@ export class Login extends Component {
                       onClick={this.handleClickShowPassword}
                       onMouseDown={this.handleMouseDownPassword}
                       edge="end"
-                    >
+                      size="large">
                       <FontAwesomeIcon
                         size="xs"
                         icon={this.state.showPassword ? faEyeSlash : faEye}
@@ -170,8 +171,7 @@ export class Login extends Component {
                 ),
               }}
               onChange={this.onChange}
-              fullWidth={true}
-            />
+              fullWidth={true} />
             <p>
               <Button
                 color="primary"
@@ -195,7 +195,7 @@ export class Login extends Component {
               target="_blank"
               href={"https://opensensemap.org/"}
               color="primary"
-            >
+              underline="hover">
               {Blockly.Msg.login_lostpassword}
             </Link>
           </p>
@@ -212,7 +212,7 @@ export class Login extends Component {
               rel="noreferrer"
               target="_blank"
               href={"https://opensensemap.org/"}
-            >
+              underline="hover">
               openSenseMap
             </Link>
             .