Index: frontend/src/utils/error.ts
===================================================================
--- frontend/src/utils/error.ts	(revision db5fb23a9c7d281ecb48c2ebf32e7ff4d9a24c38)
+++ frontend/src/utils/error.ts	(revision ce45c7a7871379455b3a3c55a48f767ca2e0e739)
@@ -1,3 +1,3 @@
-export const handleError = (err: any) => {
+export const getErrorMessage = (err: any) => {
   const errorMessage = err.response?.data?.error || "Failed to fetch user";
   return errorMessage;
Index: frontend/src/utils/types.ts
===================================================================
--- frontend/src/utils/types.ts	(revision db5fb23a9c7d281ecb48c2ebf32e7ff4d9a24c38)
+++ frontend/src/utils/types.ts	(revision ce45c7a7871379455b3a3c55a48f767ca2e0e739)
@@ -1,62 +1,63 @@
 export interface User {
-	username: string;
-	fullName: string;
-	email?: string;
-	profilePhoto?: string | null;
-	isAdmin: boolean;
-	isArtist: boolean;
+  username: string;
+  fullName: string;
+  email?: string;
+  profilePhoto?: string | null;
+  isAdmin: boolean;
+  isArtist: boolean;
 }
 
 export interface ArtistContribution {
-	id: number;
-	title: string;
-	genre: string;
-	role: string;
-	entityType: string;
-	isLikedByCurrentUser: boolean;
-	cover?: string | null;
-	link?: string | null;
+  id: number;
+  title: string;
+  genre: string;
+  role: string;
+  entityType: string;
+  isLikedByCurrentUser: boolean;
+  cover?: string | null;
+  link?: string | null;
 }
 
 export interface MusicalEntity {
-	id: number;
-	title: string;
-	genre: string;
-	type: string;
-	releasedBy: string;
-	artistUsername?: string;
-	cover?: string | null;
-	isLikedByCurrentUser?: boolean;
+  id: number;
+  title: string;
+  genre: string;
+  type: string;
+  releasedBy: string;
+  artistUsername?: string;
+  cover?: string | null;
+  isLikedByCurrentUser?: boolean;
 }
 
 export interface Song extends MusicalEntity {
-	type: "SONG";
-	album?: string;
-	albumId?: number;
-	link?: string;
+  type: "SONG";
+  album?: string;
+  albumId?: number;
+  link?: string;
 }
 
 export interface Album extends MusicalEntity {
-	type: "ALBUM";
-	songs: Song[];
+  type: "ALBUM";
+  songs: Song[];
 }
 
 export interface Playlist {
-	id: number;
-	name: string;
-	cover: string;
-	creatorName: string;
-	songsInPlaylist: Song[];
-	isSavedByCurrentUser: boolean;
+  id: number;
+  name: string;
+  cover: string;
+  creatorName: string;
+  creatorUsername: string;
+  songsInPlaylist: Song[];
+  isSavedByCurrentUser: boolean;
 }
 
 export interface BaseNonAdminUser {
-	username: string;
-	fullName: string;
-	userType: string;
-	profilePhoto: string;
-	followers: number;
-	following: number;
-	isFollowedByCurrentUser: boolean;
+  username: string;
+  fullName: string;
+  userType: string;
+  profilePhoto: string;
+  followers: number;
+  following: number;
+  isFollowedByCurrentUser: boolean;
 }
 
@@ -66,74 +67,80 @@
 
 export interface SidebarProps {
-	isOpen: boolean;
-	onClose: () => void;
+  isOpen: boolean;
+  onClose: () => void;
+}
+
+export interface CreatePlaylistModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+  onSubmit: (playlistName: string) => void;
 }
 
 export interface SongContribution {
-	artistName: string;
-	role: string;
+  artistName: string;
+  role: string;
 }
 
 export interface SongReview {
-	id: {
-		listenerId: number;
-		musicalEntityId: number;
-	};
-	author: string;
-	authorUsername: string;
-	grade: number;
-	comment: string;
+  id: {
+    listenerId: number;
+    musicalEntityId: number;
+  };
+  author: string;
+  authorUsername: string;
+  grade: number;
+  comment: string;
 }
 
 export interface SongDetail extends MusicalEntity {
-	type: "SONG";
-	album?: string | null;
-	link?: string | null;
-	contributions: SongContribution[];
-	reviews: SongReview[];
+  type: "SONG";
+  album?: string | null;
+  link?: string | null;
+  contributions: SongContribution[];
+  reviews: SongReview[];
 }
 
 export interface BasicSong {
-	id: number;
-	title: string;
-	artist: string;
-	artistUsername?: string;
-	cover?: string;
-	link?: string;
-	album?: string;
-	albumId?: number;
+  id: number;
+  title: string;
+  artist: string;
+  artistUsername?: string;
+  cover?: string;
+  link?: string;
+  album?: string;
+  albumId?: number;
 }
 
 export interface BasicPlaylist {
-	id: number;
-	name: string;
-	songCount: number;
+  id: number;
+  name: string;
+  songCount: number;
 }
 
 export interface CatalogItem {
-	id: number;
-	title: string;
-	genre: string;
-	cover: string | null;
-	type: "SONG" | "ALBUM";
-	releaseDate: string;
+  id: number;
+  title: string;
+  genre: string;
+  cover: string | null;
+  type: "SONG" | "ALBUM";
+  releaseDate: string;
 }
 
 export interface Contributor {
-	id: number;
-	fullName: string;
-	role: string;
+  id: number;
+  fullName: string;
+  role: string;
 }
 
 export interface ArtistSearchResult {
-	id: number;
-	username: string;
-	fullName: string;
-	profilePhoto?: string;
+  id: number;
+  username: string;
+  fullName: string;
+  profilePhoto?: string;
 }
 
 export interface SongEntry {
-	title: string;
-	link: string;
-	contributors: Contributor[];
+  title: string;
+  link: string;
+  contributors: Contributor[];
 }