Update TitleShowcase.svelte

Localized the entire component (I hope)

src/lib/components/TitleShowcase/TitleShowcase.svelte

@@ -11,6 +11,7 @@
 	import { fade, fly } from 'svelte/transition';
 	import type { TitleType } from '$lib/types';
 	import { openTitleModal } from '../Modal/Modal';
+	import { _ } from 'svelte-i18n';
 
 	const TRAILER_TIMEOUT = 3000;
 	const TRAILER_LOAD_TIME = 1000;
@@ -123,7 +124,7 @@
 		>
 			<div class="flex gap-4 items-center">
 				<Button size="lg" type="primary" on:click={() => openTitleModal(tmdbId, type)}>
-					<span>Details</span><ChevronRight size={20} />
+					<span>{$_('titleShowcase.details')}</span><ChevronRight size={20} />
 				</Button>
 				{#if trailerId}
 					<Button
@@ -134,7 +135,7 @@
 						on:mouseover={() => (focusTrailer = true)}
 						on:mouseleave={() => (focusTrailer = false)}
 					>
-						<span>Watch Trailer</span><ChevronRight size={20} />
+						<span>{$_('titleShowcase.watchTrailer')}</span><ChevronRight size={20} />
 					</Button>
 				{/if}
 			</div>
@@ -142,8 +143,11 @@
 		<div class="hidden lg:flex items-end justify-end col-start-4 row-start-3 col-span-3">
 			<div class="flex gap-6 items-center">
 				<div>
-					<p class="text-zinc-400 text-sm font-medium">Release Date</p>
+					<p class="text-zinc-400 text-sm font-medium">
+						{$_('titleShowcase.releaseDate')}
+					</p>
 					<h2 class="font-semibold">
+						<!-- We need to format dates -->
 						{releaseDate.toLocaleDateString('en-US', {
 							year: 'numeric',
 							month: 'long',
@@ -153,7 +157,9 @@
 				</div>
 				{#if director}
 					<div>
-						<p class="text-zinc-400 text-sm font-medium">Directed By</p>
+						<p class="text-zinc-400 text-sm font-medium">
+							{$_('titleShowcase.directedBy')}
+						</p>
 						<h2 class="font-semibold">{director}</h2>
 					</div>
 				{/if}