setting default team to view as when user is first loaded

src/app/UserWrapper.tsx

@@ -73,7 +73,7 @@ export default function UserWrapper(props: Props) {
       setGlobal({
         user: resp.data.user ? User.create(resp.data.user) : User.create(),
         team: resp.data.team ? Team.create(resp.data.team) : Team.create(),
-        as: "",
+        as: resp.data.user?.settings?.useTeam === true ? resp.data.user.settings.defaultTeam : "",
         showErrors: false,
         userTeamPermissions: [],
         backgroundTasksComplete: false,

src/teams/TeamList.tsx

@@ -43,12 +43,13 @@ const useStyles = makeStyles((theme: Theme) => ({
     width: theme.spacing(6),
     height: theme.spacing(6),
     marginTop: "auto",
-    marginBottom: "auto"
+    marginBottom: "auto",
   },
   titleBox: {
     display: "flex",
     alignItems: "center",
     marginLeft: theme.spacing(1),
+    width: "100%"
   }
 }))
 

src/user/UserMenu.tsx

@@ -5,7 +5,6 @@ import { makeStyles } from "@mui/styles";
 import { LockOpen, Person, Lock, Settings, SupervisedUserCircle as TeamIcon, ExitToApp, PersonAdd } from "@mui/icons-material";
 import { useState } from "react";
 import UserTeamName from "./UserTeamName";
-import React from "react";
 import ThemeIcon from "../common/ThemeIcon";
 import { useAuth0 } from "@auth0/auth0-react";
 import UserSettings from "./UserSettings";
@@ -150,7 +149,7 @@ export default function UserMenu(props: Props) {
 
   const unauthenticatedUserMenu = () => {
     return (
-      <React.Fragment>
+      <>
         <Button
           variant="outlined"
           aria-label="Sign In"
@@ -171,7 +170,7 @@ export default function UserMenu(props: Props) {
         <IconButton onClick={toggleTheme} className={classes.rightIcon} aria-label="Toggle Theme">
           <ThemeIcon />
         </IconButton>
-      </React.Fragment>
+      </>
     );
   };