Fixed most of the muiV5 / react 18 version problems

frontend/src/components/OrgHeader.jsx

@@ -2,13 +2,16 @@ import React, { useEffect } from "react";
 import theme from '../theme.jsx';
 import { makeStyles } from "@mui/styles";
 
-import Tooltip from "@material-ui/core/Tooltip";
-import Grid from "@material-ui/core/Grid";
-import Button from "@material-ui/core/Button";
-import TextField from "@material-ui/core/TextField";
-import Typography from "@material-ui/core/Typography";
+import {
+	Tooltip,
+	Grid, 
+	Button, 
+	TextField,
+	Typography, 
+	IconButton,
+} from "@mui/material";
+
 import { useAlert } from "react-alert";
-import IconButton from "@material-ui/core/IconButton";
 
 import {
 	ExpandLess as ExpandLessIcon,
@@ -98,6 +101,7 @@ const OrgHeader = (props) => {
   //console.log("USER: ", userdata)
   const orgSaveButton = (
     <Tooltip title="Save any unsaved data" placement="bottom">
+	  <div>
       <Button
         style={{ width: 150, height: 55, flex: 1 }}
         variant="contained"
@@ -119,6 +123,7 @@ const OrgHeader = (props) => {
       >
         <SaveIcon />
       </Button>
+	  </div>
     </Tooltip>
   );