diff --git a/src/config/strings.ts b/src/config/strings.ts
index 28e148ff..01d5b34e 100644
--- a/src/config/strings.ts
+++ b/src/config/strings.ts
@@ -32,6 +32,10 @@ export const $actions = {
 };
 
 export const $dialog = {
+	add: {
+		title: 'Add Media',
+		buttonLabel: 'Add',
+	},
 	error: {
 		title: 'An error occurred',
 		ignore: 'Ignore',
diff --git a/src/main/media.ts b/src/main/media.ts
index d4da189c..98788e8e 100644
--- a/src/main/media.ts
+++ b/src/main/media.ts
@@ -40,7 +40,6 @@ const parseFileMeta = ({ filename, ext }: MediaType) => {
 
 		case 'parse':
 		default: {
-			// const parsed = ptf(filename, { extra: /.+/ }, { extra: 'boolean' });
 			const parsed = ptf(filename + ext);
 
 			const extWithoutDot = ext.replace('.', '');
@@ -48,6 +47,7 @@ const parseFileMeta = ({ filename, ext }: MediaType) => {
 			if (String(parsed.title).endsWith(extWithoutDot)) {
 				parsed.title = parsed.title.replace(extWithoutDot, '');
 			}
+
 			meta = {
 				...meta,
 				...parsed,
diff --git a/src/renderer/components/media/MediaBrowser.tsx b/src/renderer/components/media/MediaBrowser.tsx
index 86dc1635..840705bf 100644
--- a/src/renderer/components/media/MediaBrowser.tsx
+++ b/src/renderer/components/media/MediaBrowser.tsx
@@ -20,6 +20,7 @@ import { SectionHeader } from '@/renderer/components/ui/SectionHeader';
 import { GridIcon, ListIcon } from '@/renderer/config/icons';
 import { useGlobalContext } from '@/renderer/context/global-context';
 import { MediaType } from '@/types/file';
+import { getUUID } from '@/utils/getUUID';
 
 import { BookmarkIcon } from '@radix-ui/react-icons';
 import React from 'react';
@@ -48,12 +49,12 @@ export function MediaBrowser({
 	};
 	return (
 		<ScrollContainer>
-			{items.length === 0 ? (
+			{items?.length === 0 ? (
 				<>
 					<SectionHeader
 						title={title}
 						tagline={tagline}
-						className="flex items-start flex-col-reverse md:flex-row md:items-center justify-between gap-4"
+						className="flex items-start flex-col-reverse md:flex-row md:items-start justify-between gap-4"
 					>
 						{addMediaButton && <ButtonAddMedia />}
 					</SectionHeader>
@@ -65,7 +66,7 @@ export function MediaBrowser({
 					className="space-y-6 h-full min-h-0 flex flex-col"
 					onValueChange={handleViewChange}
 				>
-					<div className="flex items-start flex-col-reverse md:flex-row md:items-center justify-between gap-4 select-none">
+					<div className="flex items-start flex-col-reverse md:flex-row md:items-start justify-between gap-4 select-none">
 						<TabsList className="grow-0">
 							<TabsTrigger value="grid" className="relative flex gap-2">
 								<GridIcon /> {$ui.view.grid}
@@ -83,9 +84,9 @@ export function MediaBrowser({
 
 					<TabsContent value="grid" className="border-none p-0 outline-none">
 						<div className="flex gap-6 pb-6 flex-wrap">
-							{items.map((media: MediaType) => (
+							{items?.map((media: MediaType) => (
 								<MediaArtwork
-									key={crypto.randomUUID()}
+									key={getUUID()}
 									media={media}
 									className="w-[250px]"
 									aspectRatio="portrait"
@@ -112,7 +113,7 @@ export function MediaBrowser({
 								</TableRow>
 							</TableHeader>
 							<TableBody>
-								{items.map((media: MediaType) => (
+								{items?.map((media: MediaType) => (
 									<TableRow key={media.id}>
 										<TableCell className="font-medium">{media.title}</TableCell>
 										<TableCell>{media.year}</TableCell>
diff --git a/src/renderer/windows/main/pages/Library.tsx b/src/renderer/windows/main/pages/Library.tsx
index 9e77c45c..e4e14f7d 100644
--- a/src/renderer/windows/main/pages/Library.tsx
+++ b/src/renderer/windows/main/pages/Library.tsx
@@ -6,6 +6,7 @@ import { ScrollContainer } from '@/renderer/components/ui/ScrollContainer';
 import { SectionHeader } from '@/renderer/components/ui/SectionHeader';
 import { useLibraryContext } from '@/renderer/context/library-context';
 import { MediaType } from '@/types/file';
+import { getUUID } from '@/utils/getUUID';
 
 type Props = {};
 
@@ -31,7 +32,7 @@ export function Library(_props: Props) {
 							<div className="flex space-x-4 pb-4">
 								{libraryArray.map((media: MediaType) => (
 									<MediaArtwork
-										key={crypto.randomUUID()}
+										key={getUUID()}
 										media={media}
 										className="w-[250px]"
 										aspectRatio="portrait"