Updated README and cleaned up.

README.md

@@ -32,15 +32,15 @@ It supports the following features:
 - Song queueing
   - https://github.com/Raymo111/cs348/blob/main/website/components/appstateprovider.tsx
 - Song favouriting
-  - To be implemented
+  - https://github.com/Raymo111/cs348/blob/main/website/app/collection/favourites
 
 ---
 
 The production data is at: https://drive.google.com/file/d/1bCoon3Nj-6nh-_RE9vNY4kQnDKoq9Fye/view?usp=sharing
 
 The testing data is at: https://drive.google.com/file/d/11nd32AImDeLA856__QpqkyL5lRC_An66/view?usp=drive_link
 
-In order to load the data into the web application, please use the **`Upload`` tab** and batch-upload all the song files to be imported into the database.
+In order to load the data into the web application, please use the **`Upload` tab** and batch-upload all the song files to be imported into the database.
 
 ---
 

website/app/collection/favourites/page.tsx

@@ -1,11 +1,10 @@
 'use client'
 
 import { useEffect, useState } from "react";
-import { apiGetCollectionFavourites, apiGetCollectionTracks, apiGetCollectionTracksSearch } from "@/components/apiclient";
+import { apiGetCollectionFavourites } from "@/components/apiclient";
 import { useAppStateContext } from "@/components/appstateprovider";
 import { APITrack } from "@/util/models/track";
-import {Grid, TextField, Typography, InputAdornment, CssBaseline} from "@mui/material";
-import { Search } from "@mui/icons-material";
+import {Grid, Typography, CssBaseline} from "@mui/material";
 import { useRouter } from "next/navigation";
 import { useLoginStateContext } from "@/components/loginstateprovider";
 import AlertComponent, { AlertEntry } from "@/components/alerts";

website/app/collection/genres/[genreId]/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { useLoginStateContext } from "@/components/loginstateprovider";
 import { APIGenre } from "@/util/models/genre";
-import { Box, Button, Grid, Typography } from "@mui/material";
+import { Box, Button, Typography } from "@mui/material";
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 import { AlertEntry } from "@/components/alerts";

website/app/collection/playlists/[playlistId]/page.tsx

@@ -6,7 +6,7 @@ import { Box, Typography, Button, TextField, Modal } from "@mui/material";
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 import { AlertEntry } from "@/components/alerts";
-import { apiGetPlaylist, apiGetPlaylistTracks, apiPostCreatePlaylist } from "@/components/apiclient";
+import { apiGetPlaylist, apiGetPlaylistTracks } from "@/components/apiclient";
 import { APITrack } from "@/util/models/track";
 import TrackTable from "@/components/trackTable";
 import PlayArrowIcon from '@mui/icons-material/PlayArrow';

website/app/collection/playlists/page.tsx

@@ -1,12 +1,12 @@
 'use client'
 
-import { use, useEffect, useState } from "react";
-import { apiGetCollectionPlaylists, apiPostCreatePlaylist } from "@/components/apiclient";
+import { useEffect, useState } from "react";
+import { apiGetCollectionPlaylists } from "@/components/apiclient";
 import { useLoginStateContext } from "@/components/loginstateprovider";
 import { useRouter } from "next/navigation";
 import { APIPlaylist } from "@/util/models/playlist";
 import AlertComponent, { AlertEntry } from "@/components/alerts";
-import { Typography, Grid, Modal, TextField, Button, Dialog, DialogTitle, DialogContent, DialogActions } from "@mui/material";
+import { Typography, Grid, Button } from "@mui/material";
 import PlaylistCard from "@/components/playlistCard";
 import CreatePlaylistDialog from "@/components/createPlaylistDialog";
 import { useAppStateContext } from "@/components/appstateprovider";

website/components/appstateprovider.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import { APITrack } from "@/util/models/track";
-import { createContext, useContext, useEffect, useReducer, useState } from "react";
+import { createContext, useContext, useReducer } from "react";
 
 export enum RepeatType {
   OFF,

website/components/genreCard.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import { APIArtist } from "@/util/models/artist";
 import { Typography, Card, CardActionArea, CardContent, CardMedia } from "@mui/material";
 import { useRouter } from "next/navigation";
 import { useAppStateContext } from "./appstateprovider";

website/components/mediaplayer.tsx

@@ -5,7 +5,6 @@ import { useAppStateContext } from "./appstateprovider";
 import { useRef, useState, useEffect } from "react";
 import AudioPlayer from 'react-h5-audio-player';
 
-
 import '@/components/mediaplayer.css';
 import { 
   PauseOutlined,