Feat: show some session details in frontend

frontend/src/components/SessionInfo/index.js

@@ -5,29 +5,25 @@ import Typography from "@material-ui/core/Typography";
 
 const useStyles = makeStyles({
 	main: {
-		flex: 1,
+		// flex: 1,
 	},
 });
 
 const SessionInfo = ({ session }) => {
+	console.log(session);
 	const classes = useStyles();
 	return (
-		<React.Fragment>
+		<div>
 			<Typography component="h2" variant="h6" color="primary" gutterBottom>
-				Bateria
+				{`Status: ${session.status}`}
 			</Typography>
 			<Typography component="p" variant="h6">
-				{(session && session.baterry) || "Não disponível"}
+				{`Bateria: ${session.battery}%`}
 			</Typography>
-			<Typography color="textSecondary" className={classes.main}>
+			<Typography color="textSecondary">
-				Carregando: {(session && session.plugged) || "Não disponível"}
+				{`Carregando: ${session.plugged} `}
 			</Typography>
-			<div>
+		</div>
-				<Link color="primary" href="#">
-					Verificar bateria
-				</Link>
-			</div>
-		</React.Fragment>
 	);
 };
 

frontend/src/pages/WhatsAuth/WhatsAuth.js

@@ -86,9 +86,9 @@ const WhatsAuth = () => {
 						</Paper>
 					</Grid>
 				) : (
-					<Grid item xs={6}>
+					<Grid item xs={12}>
 						<Paper className={classes.paper}>
-							<SessionInfo sessio={session} />
+							<SessionInfo session={session} />
 						</Paper>
 					</Grid>
 				)}