Merge pull request #47 from domshyra/welcomeHeader

Added header and loading
domshyra · May 25, 2023 · b231a7f · b231a7f
2 parents 0899fd1 + 21db391
commit b231a7f
Showing 1 changed file with 9 additions and 4 deletions.
diff --git a/Web/src/components/Index.jsx b/Web/src/components/Index.jsx
@@ -1,6 +1,6 @@
+import { Box, Grid, Skeleton, Typography } from "@mui/material";
 import React, { useEffect, useState } from "react";
 
-import { Grid } from "@mui/material";
 import PlaylistCard from "./PlaylistCardSelfFetching";
 import { useGetPlaylistsQuery } from "../redux/services/spotifyApi";
 import { useGetRatingsQuery } from "../redux/services/playlistRatingApi";
@@ -28,9 +28,14 @@ const Index = () => {
 	};
 
 	return (
-		<Grid container>
-			{!isLoading ? cards : null}
-		</Grid>
+		<>
+			<Box sx={{ justifyContent: "center" }}>
+				<Typography variant="h3" gutterBottom>
+					Playlists
+				</Typography>
+			</Box>
+			<Grid container>{!isLoading ? cards : <Skeleton />}</Grid>
+		</>
 	);
 };