From 149957d3428b7e8a379dd54818133012bf3b72e2 Mon Sep 17 00:00:00 2001
From: Phelra <raphael.bidault@gmail.com>
Date: Wed, 28 Aug 2024 16:53:43 +0200
Subject: [PATCH 1/5] feat: Add multi-languages support

---
 src/lib/apis/tmdb/tmdb-api.ts                 |  17 +-
 .../LibraryItemContextItems.svelte            |  13 +-
 .../components/Dialog/ConfirmDialog.svelte    |   5 +-
 src/lib/components/Ghosts/ButtonGhost.svelte  |   3 +-
 .../Integrations/JellyfinIntegration.svelte   |   7 +-
 .../Integrations/RadarrIntegration.svelte     |   5 +-
 .../Integrations/SonarrIntegration.svelte     |   5 +-
 src/lib/components/Lang/I18n.svelte           |   6 +-
 src/lib/components/LanguageSettings.svelte    |  55 +++++
 src/lib/components/Login.svelte               |  17 +-
 .../MMAddToRadarrDialog.svelte                |  25 +-
 .../MMAddToSonarrDialog.svelte                |  15 +-
 .../components/SeriesPage/SeriesPage.svelte   |  33 +--
 src/lib/components/Sidebar/Sidebar.svelte     |  11 +-
 src/lib/lang/de.json                          | 207 ++++++++++-------
 src/lib/lang/en.json                          | 211 ++++++++++-------
 src/lib/lang/es.json                          | 199 +++++++++-------
 src/lib/lang/fr.json                          | 213 +++++++++++-------
 src/lib/lang/it.json                          | 207 ++++++++++-------
 src/lib/pages/EpisodePage.svelte              |  29 +--
 src/lib/pages/ManagePage.svelte               |  44 ++--
 src/lib/pages/MoviePage.svelte                |  37 +--
 src/lib/pages/MoviesHomePage.svelte           |  11 +-
 src/lib/pages/PersonPage.svelte               |   3 +-
 src/lib/pages/SearchPage.svelte               |   3 +-
 src/lib/pages/SeriesHomePage.svelte           |  11 +-
 src/lib/stores/localstorage.store.ts          |   4 +-
 27 files changed, 860 insertions(+), 536 deletions(-)
 create mode 100644 src/lib/components/LanguageSettings.svelte

diff --git a/src/lib/apis/tmdb/tmdb-api.ts b/src/lib/apis/tmdb/tmdb-api.ts
index 6a6a3aeb..9f35fef5 100644
--- a/src/lib/apis/tmdb/tmdb-api.ts
+++ b/src/lib/apis/tmdb/tmdb-api.ts
@@ -7,6 +7,7 @@ import { settings } from '../../stores/settings.store';
 import type { TitleType } from '../../types';
 import type { Api } from '../api.interface';
 import { user } from '../../stores/user.store';
+import { localSettings } from '../../stores/localstorage.store';
 
 const CACHE_ONE_DAY = 'max-age=86400';
 const CACHE_FOUR_DAYS = 'max-age=345600';
@@ -113,8 +114,9 @@ export class TmdbApi implements Api<paths> {
 						movie_id: tmdbId
 					},
 					query: {
+						language: get(localSettings)?.language,
 						append_to_response: 'videos,credits,external_ids,images',
-						...({ include_image_language: get(settings)?.language + ',en,null' } as any)
+						...({ include_image_language: get(localSettings)?.language + ',en,null' } as any)
 					}
 				}
 			})
@@ -126,7 +128,7 @@ export class TmdbApi implements Api<paths> {
 			?.GET('/3/movie/popular', {
 				params: {
 					query: {
-						language: get(settings)?.language,
+						language: get(localSettings)?.language,
 						region: get(settings)?.discover.region
 					}
 				}
@@ -168,7 +170,7 @@ export class TmdbApi implements Api<paths> {
 					},
 					query: {
 						append_to_response: 'videos,aggregate_credits,external_ids,images',
-						...({ include_image_language: get(settings)?.language + ',en,null' } as any)
+						...({ include_image_language: get(localSettings)?.language + ',en,null' } as any)
 					}
 				},
 				headers: {
@@ -213,7 +215,7 @@ export class TmdbApi implements Api<paths> {
 			.GET('/3/tv/popular', {
 				params: {
 					query: {
-						language: get(settings)?.language
+						language: get(localSettings)?.language
 					}
 				}
 			})
@@ -280,6 +282,7 @@ export class TmdbApi implements Api<paths> {
 						person_id: person_id
 					},
 					query: {
+						language: get(localSettings)?.language,
 						append_to_response: 'images,movie_credits,tv_credits,external_ids'
 					}
 				}
@@ -536,7 +539,7 @@ export const getTmdbMovie = async (tmdbId: number) =>
 			},
 			query: {
 				append_to_response: 'videos,credits,external_ids,images',
-				...({ include_image_language: get(settings)?.language + ',en,null' } as any)
+				...({ include_image_language: get(localSettings)?.language + ',en,null' } as any)
 			}
 		}
 	}).then((res) => res.data as TmdbMovieFull2 | undefined);
@@ -643,7 +646,7 @@ export const getTmdbMovieBackdrop = async (tmdbId: number) =>
 			.then(
 				(r) =>
 					(
-						r?.backdrops?.find((b) => b.iso_639_1 === get(settings)?.language) ||
+						r?.backdrops?.find((b) => b.iso_639_1 === get(localSettings)?.language) ||
 						r?.backdrops?.find((b) => b.iso_639_1 === 'en') ||
 						r?.backdrops?.find((b) => b.iso_639_1) ||
 						r?.backdrops?.[0]
@@ -735,7 +738,7 @@ export const getTmdbItemBackdrop = (item: {
 	images: { backdrops: { file_path: string; iso_639_1: string }[] };
 }) =>
 	(
-		item?.images?.backdrops?.find((b) => b.iso_639_1 === get(settings)?.language) ||
+		item?.images?.backdrops?.find((b) => b.iso_639_1 === get(localSettings)?.language) ||
 		item?.images?.backdrops?.find((b) => b.iso_639_1 === 'en') ||
 		item?.images?.backdrops?.find((b) => b.iso_639_1) ||
 		item?.images?.backdrops?.[0]
diff --git a/src/lib/components/ContextMenu/LibraryItemContextItems.svelte b/src/lib/components/ContextMenu/LibraryItemContextItems.svelte
index 90f8d715..3f87c385 100644
--- a/src/lib/components/ContextMenu/LibraryItemContextItems.svelte
+++ b/src/lib/components/ContextMenu/LibraryItemContextItems.svelte
@@ -11,6 +11,7 @@
 	import type { TitleType } from '../../types';
 	import ContextMenuDivider from './ContextMenuDivider.svelte';
 	import ContextMenuItem from './ContextMenuItem.svelte';
+	import { _ } from 'svelte-i18n';
 
 	export let jellyfinItem: JellyfinItem | undefined = undefined;
 	export let sonarrSeries: SonarrSeries | undefined = undefined;
@@ -42,30 +43,30 @@
 </script>
 
 <ContextMenuItem on:click={handleSetWatched} disabled={!jellyfinItem?.Id || watched}>
-	Mark as watched
+	{_('contextMenu.markAsWatched')}
 </ContextMenuItem>
 <ContextMenuItem on:click={handleSetUnwatched} disabled={!jellyfinItem?.Id || !watched}>
-	Mark as unwatched
+	{_('contextMenu.markAsUnwatched')}
 </ContextMenuItem>
 <ContextMenuDivider />
 <ContextMenuItem disabled={!jellyfinItem?.Id} on:click={handleOpenInJellyfin}>
-	Open in Jellyfin
+	{_('contextMenu.openInJellyfin')}
 </ContextMenuItem>
 {#if type === 'movie'}
 	<ContextMenuItem
 		disabled={!radarrMovie}
 		on:click={() => window.open($settings.radarr.baseUrl + '/movie/' + radarrMovie?.tmdbId)}
 	>
-		Open in Radarr
+	{_('contextMenu.openInRadarr')}
 	</ContextMenuItem>
 {:else}
 	<ContextMenuItem
 		disabled={!sonarrSeries}
 		on:click={() => window.open($settings.sonarr.baseUrl + '/series/' + sonarrSeries?.titleSlug)}
 	>
-		Open in Sonarr
+	{_('contextMenu.openInSonarr')}
 	</ContextMenuItem>
 {/if}
 <ContextMenuItem on:click={() => window.open(`https://www.themoviedb.org/${type}/${tmdbId}`)}>
-	Open in TMDB
+	{_('contextMenu.openInTMDB')}
 </ContextMenuItem>
diff --git a/src/lib/components/Dialog/ConfirmDialog.svelte b/src/lib/components/Dialog/ConfirmDialog.svelte
index 8e6fa8b7..c9777e1f 100644
--- a/src/lib/components/Dialog/ConfirmDialog.svelte
+++ b/src/lib/components/Dialog/ConfirmDialog.svelte
@@ -3,6 +3,7 @@
 	import Button from '../Button.svelte';
 	import { modalStack } from '../Modal/modal.store';
 	import Dialog from './Dialog.svelte';
+	import { _ } from 'svelte-i18n';
 
 	type ActionFn = (() => Promise<any>) | (() => any);
 
@@ -38,10 +39,10 @@
 	</div>
 	<Container class="flex flex-col space-y-4">
 		<Button type="secondary" disabled={fetching} on:clickOrSelect={() => handleAction(confirm)}>
-			Confirm
+			{$_('confirmDialogs.confirm')}
 		</Button>
 		<Button type="secondary" disabled={fetching} on:clickOrSelect={() => handleAction(cancel)}
-			>Cancel</Button
+			>{$_('confirmDialogs.cancel')}</Button
 		>
 	</Container>
 </Dialog>
diff --git a/src/lib/components/Ghosts/ButtonGhost.svelte b/src/lib/components/Ghosts/ButtonGhost.svelte
index 4fff89a7..f51cb579 100644
--- a/src/lib/components/Ghosts/ButtonGhost.svelte
+++ b/src/lib/components/Ghosts/ButtonGhost.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
 	import Container from '../../../Container.svelte';
+	import { _ } from 'svelte-i18n';
 </script>
 
 <Container
 	class="px-6 py-2 rounded-lg font-medium tracking-wide flex items-center bg-stone-600/50 animate-pulse"
 >
 	<div class="opacity-0">
-		<slot>Loading...</slot>
+		<slot>{$_('navbar.loading')}</slot>
 	</div>
 </Container>
diff --git a/src/lib/components/Integrations/JellyfinIntegration.svelte b/src/lib/components/Integrations/JellyfinIntegration.svelte
index 888c491c..de16296e 100644
--- a/src/lib/components/Integrations/JellyfinIntegration.svelte
+++ b/src/lib/components/Integrations/JellyfinIntegration.svelte
@@ -5,6 +5,7 @@
 	import SelectField from '../SelectField.svelte';
 	import { jellyfinApi, type JellyfinUser } from '../../apis/jellyfin/jellyfin-api';
 	import { derived, get } from 'svelte/store';
+	import { _ } from 'svelte-i18n';
 
 	const dispatch = createEventDispatcher<{
 		'click-user': {
@@ -108,14 +109,14 @@
 		isValid={jellyfinUsers?.then((u) => !!u?.length)}
 		on:change={handleChange}
 	>
-		Base Url
+	{$_('settings.integrations.baseUrl')}
 	</TextField>
 	<TextField
 		bind:value={apiKey}
 		isValid={jellyfinUsers?.then((u) => !!u?.length)}
 		on:change={handleChange}
 	>
-		API Key
+	{$_('settings.integrations.apiKey')}
 	</TextField>
 </div>
 
@@ -127,7 +128,7 @@
 				dispatch('click-user', { user: jellyfinUser, users, setJellyfinUser })}
 			class="mb-4"
 		>
-			User
+			{$_('settings.integrations.user')}
 		</SelectField>
 	{/if}
 {/await}
diff --git a/src/lib/components/Integrations/RadarrIntegration.svelte b/src/lib/components/Integrations/RadarrIntegration.svelte
index 079a79e5..4accfba4 100644
--- a/src/lib/components/Integrations/RadarrIntegration.svelte
+++ b/src/lib/components/Integrations/RadarrIntegration.svelte
@@ -4,6 +4,7 @@
 	import { radarrApi } from '../../apis/radarr/radarr-api';
 	import { user } from '../../stores/user.store';
 	import { derived, get } from 'svelte/store';
+	import { _ } from 'svelte-i18n';
 
 	let baseUrl = get(user)?.settings.radarr.baseUrl || '';
 	let apiKey = get(user)?.settings.radarr.apiKey || '';
@@ -85,9 +86,9 @@
 
 <div class="space-y-4 mb-4">
 	<TextField bind:value={baseUrl} isValid={healthCheck} on:change={handleChange}>
-		Base Url
+		{$_('settings.integrations.baseUrl')}
 	</TextField>
-	<TextField bind:value={apiKey} isValid={healthCheck} on:change={handleChange}>API Key</TextField>
+	<TextField bind:value={apiKey} isValid={healthCheck} on:change={handleChange}>{$_('settings.integrations.apiKey')}</TextField>
 </div>
 
 {#if error}
diff --git a/src/lib/components/Integrations/SonarrIntegration.svelte b/src/lib/components/Integrations/SonarrIntegration.svelte
index 446e5874..b9fc0b3f 100644
--- a/src/lib/components/Integrations/SonarrIntegration.svelte
+++ b/src/lib/components/Integrations/SonarrIntegration.svelte
@@ -4,6 +4,7 @@
 	import { createEventDispatcher } from 'svelte';
 	import { user } from '../../stores/user.store';
 	import { derived, get } from 'svelte/store';
+	import { _ } from 'svelte-i18n';
 
 	let baseUrl = get(user)?.settings.sonarr.baseUrl || '';
 	let apiKey = get(user)?.settings.sonarr.apiKey || '';
@@ -85,9 +86,9 @@
 
 <div class="space-y-4 mb-4">
 	<TextField bind:value={baseUrl} isValid={healthCheck} on:change={handleChange}>
-		Base Url
+		{$_('settings.integrations.baseUrl')}
 	</TextField>
-	<TextField bind:value={apiKey} isValid={healthCheck} on:change={handleChange}>API Key</TextField>
+	<TextField bind:value={apiKey} isValid={healthCheck} on:change={handleChange}>{$_('settings.integrations.apiKey')}</TextField>
 </div>
 
 {#if error}
diff --git a/src/lib/components/Lang/I18n.svelte b/src/lib/components/Lang/I18n.svelte
index 340772e2..899aacb4 100644
--- a/src/lib/components/Lang/I18n.svelte
+++ b/src/lib/components/Lang/I18n.svelte
@@ -1,5 +1,7 @@
 <script lang="ts">
 	import { addMessages, init, locale } from 'svelte-i18n';
+	import { localSettings } from '../../stores/localstorage.store';
+
 
 	import de from '../../lang/de.json';
 	import en from '../../lang/en.json';
@@ -14,7 +16,7 @@
 	addMessages('fr', fr);
 	addMessages('it', it);
 
-	settings.subscribe((value) => {
+	localSettings.subscribe((value) => {
 		if (value.language) {
 			locale.set(value.language);
 		} else {
@@ -23,7 +25,7 @@
 	});
 
 	init({
-		initialLocale: $settings.language,
+		initialLocale: localSettings.get().language || 'en',
 		fallbackLocale: 'en'
 	});
 </script>
diff --git a/src/lib/components/LanguageSettings.svelte b/src/lib/components/LanguageSettings.svelte
new file mode 100644
index 00000000..1a8d3601
--- /dev/null
+++ b/src/lib/components/LanguageSettings.svelte
@@ -0,0 +1,55 @@
+<script lang="ts">
+	import { createEventDispatcher } from 'svelte';
+	import SelectField from '../components/SelectField.svelte';
+	import Dialog from '../components/Dialog/Dialog.svelte';
+	import SelectItem from '../components/SelectItem.svelte';
+	import { localSettings } from '../stores/localstorage.store';
+  
+	const dispatch = createEventDispatcher();
+  
+	const AVAILABLE_LANGUAGES = {
+		en: { name: "English", nativeName: "English" },
+		fr: { name: "French", nativeName: "Français" },
+		de: { name: "German", nativeName: "Deutsch" },
+		it: { name: "Italian", nativeName: "Italiano" },
+		es: { name: "Spanish", nativeName: "Español" }
+	};
+  
+	let selectedLanguage: keyof typeof AVAILABLE_LANGUAGES = 'en';
+	let showLanguageDialog = false;
+  
+	localSettings.subscribe(value => {
+	  selectedLanguage = (value.language && value.language in AVAILABLE_LANGUAGES ? value.language : 'en') as keyof typeof AVAILABLE_LANGUAGES;
+	});
+  
+	function openLanguageDialog() {
+	  showLanguageDialog = true;
+	}
+  
+	function handleSelectLanguage(language: string) {
+	  if (language in AVAILABLE_LANGUAGES) {
+		localSettings.update(settings => ({ ...settings, language }));
+		selectedLanguage = language as keyof typeof AVAILABLE_LANGUAGES;
+		showLanguageDialog = false;
+		dispatch('change', { language: selectedLanguage });
+	  }
+	}
+  </script>
+
+  <SelectField
+	value={AVAILABLE_LANGUAGES[selectedLanguage]?.name || 'Select Language'}
+	on:clickOrSelect={openLanguageDialog}
+	tabindex="0"
+  />
+
+  {#if showLanguageDialog}
+	<Dialog on:close={() => (showLanguageDialog = false)}>
+	  {#each Object.entries(AVAILABLE_LANGUAGES) as [code, language]}
+		<SelectItem 
+		  selected={code === selectedLanguage} 
+		  on:clickOrSelect={() => handleSelectLanguage(code)}		>
+		  {language.name}
+		</SelectItem>
+	  {/each}
+	</Dialog>
+  {/if}
diff --git a/src/lib/components/Login.svelte b/src/lib/components/Login.svelte
index 84456d65..1ceba9c4 100644
--- a/src/lib/components/Login.svelte
+++ b/src/lib/components/Login.svelte
@@ -5,6 +5,7 @@
 	import { createLocalStorageStore } from '../stores/localstorage.store';
 	import { sessions } from '../stores/session.store';
 	import { createEventDispatcher } from 'svelte';
+	import { _ } from 'svelte-i18n';
 
 	const dispatch = createEventDispatcher<{ login: null }>();
 
@@ -23,9 +24,9 @@
 			.then((res) => {
 				console.log('res', res);
 				if (res?.request?.status === 401) {
-					error = 'Invalid credentials. Please try again.';
+					error = $_('login.invalidCredentials');
 				} else if (res?.request.status !== 200) {
-					error = 'Error occurred: ' + res.request.statusText;
+					error = $_('login.errorOccurred') + ': ' + res.request.statusText;
 				} else {
 					dispatch('login');
 				}
@@ -40,22 +41,22 @@
 </script>
 
 <Container class="flex flex-col" focusOnMount>
-	<h1 class="header2 w-full mb-2">Login to Reiverr</h1>
+	<h1 class="header2 w-full mb-2">{$_('login.title')}</h1>
 	<div class="body mb-4">
-		If this is your first time logging in, a new account will be created based on your credentials.
+		{$_('login.firstTime')}
 	</div>
 
 	<TextField value={$baseUrl} on:change={(e) => baseUrl.set(e.detail)} class="mb-4 w-full">
-		Server
+		{$_('login.server')}
 	</TextField>
 
 	<TextField value={$name} on:change={({ detail }) => name.set(detail)} class="mb-4 w-full">
-		Name
+		{$_('login.name')}
 	</TextField>
-	<TextField bind:value={password} type="password" class="mb-8 w-full">Password</TextField>
+	<TextField bind:value={password} type="password" class="mb-8 w-full">{$_('login.password')}</TextField>
 
 	<Button type="primary-dark" disabled={loading} on:clickOrSelect={handleLogin} class="mb-4 w-full"
-		>Submit</Button
+		>{$_('login.submit')}</Button
 	>
 
 	{#if error}
diff --git a/src/lib/components/MediaManagerModal/MMAddToRadarrDialog.svelte b/src/lib/components/MediaManagerModal/MMAddToRadarrDialog.svelte
index 9baf4b74..ef0a6521 100644
--- a/src/lib/components/MediaManagerModal/MMAddToRadarrDialog.svelte
+++ b/src/lib/components/MediaManagerModal/MMAddToRadarrDialog.svelte
@@ -15,6 +15,7 @@
 	import { capitalize, formatSize } from '../../utils';
 	import { ArrowRight, Check, Plus } from 'radix-icons-svelte';
 	import Button from '../Button.svelte';
+	import { _ } from 'svelte-i18n';
 
 	type AddOptionsStore = {
 		rootFolderPath: string | null;
@@ -126,9 +127,9 @@
 			>
 				<div class="z-10 mb-8">
 					<div class="h-24" />
-					<h1 class="header2">Add {title} to Sonarr?</h1>
+					<h1 class="header2">{$_('dialogs.add')} {title} {$_('dialogs.toRadarr')}</h1>
 					<div class="font-medium text-secondary-300 mb-8">
-						Before you can fetch episodes, you need to add this series to Sonarr.
+						{$_('dialogs.addToRadarrMessage')}
 					</div>
 					<Container
 						class={listItemClass}
@@ -136,9 +137,9 @@
 						let:hasFocus
 					>
 						<div>
-							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">Root Folder</h1>
+							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">{$_('dialogs.rootFolder')}</h1>
 							{selectedRootFolder?.path}
-							({formatSize(selectedRootFolder?.freeSpace || 0)} left)
+							({formatSize(selectedRootFolder?.freeSpace || 0)} {$_('dialogs.left')})
 						</div>
 						<ArrowRight class={scaledArrowClas(hasFocus)} size={24} />
 					</Container>
@@ -150,7 +151,7 @@
 					>
 						<div>
 							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">
-								Quality Profile
+								{$_('dialogs.qualityProfile')}
 							</h1>
 							<span>
 								{selectedQualityProfile?.name}
@@ -166,7 +167,7 @@
 					>
 						<div>
 							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">
-								Minimum Availability
+								{$_('dialogs.minimumAvailability')}
 							</h1>
 							<span>
 								{capitalize($addOptionsStore.minimumAvailability || 'released')}
@@ -187,10 +188,10 @@
 				<Container class="flex flex-col space-y-4">
 					<Button type="primary-dark" action={handleAddToSonarr} focusOnMount>
 						<Plus size={19} slot="icon" />
-						Add to Radarr
+						{$_('dialogs.addToRadarr')}
 					</Button>
 					<Button type="primary-dark" on:clickOrSelect={() => modalStack.close(modalId)}>
-						Cancel
+						{$_('confirmDialogs.cancel')}
 					</Button>
 				</Container>
 			</Container>
@@ -200,7 +201,7 @@
 				class={tabClasses(tab === 'root-folders', true)}
 				bind:selectable={rootFoldersTab}
 			>
-				<h1 class="text-xl text-secondary-100 font-medium mb-4">Root Folder</h1>
+				<h1 class="text-xl text-secondary-100 font-medium mb-4">{$_('dialogs.rootFolder')}</h1>
 				<div class="min-h-0 overflow-y-auto scrollbar-hide">
 					{#each rootFolders as rootFolder}
 						<Container
@@ -212,7 +213,7 @@
 							focusOnMount={$addOptionsStore.rootFolderPath === rootFolder.path}
 						>
 							<div>
-								{rootFolder.path} ({formatSize(rootFolder.freeSpace || 0)} left)
+								{rootFolder.path} ({formatSize(rootFolder.freeSpace || 0)} {$_('dialogs.left')})
 							</div>
 							{#if selectedRootFolder?.id === rootFolder.id}
 								<Check size={24} />
@@ -227,7 +228,7 @@
 				class={tabClasses(tab === 'quality-profiles', true)}
 				bind:selectable={qualityProfilesTab}
 			>
-				<h1 class="text-xl text-secondary-100 font-medium mb-4">Quality Profile</h1>
+				<h1 class="text-xl text-secondary-100 font-medium mb-4">{$_('dialogs.qualityProfile')}</h1>
 				<div class="min-h-0 overflow-y-auto scrollbar-hide">
 					{#each qualityProfiles as qualityProfile}
 						<Container
@@ -255,7 +256,7 @@
 				class={tabClasses(tab === 'monitor-settings', true)}
 				bind:selectable={monitorSettingsTab}
 			>
-				<h1 class="text-xl text-secondary-100 font-medium mb-4">Monitor Episodes</h1>
+				<h1 class="text-xl text-secondary-100 font-medium mb-4">{$_('dialogs.monitorEpisodes')}</h1>
 				<div class="min-h-0 overflow-y-auto scrollbar-hide">
 					{#each movieAvailabilities as availibility}
 						<Container
diff --git a/src/lib/components/MediaManagerModal/MMAddToSonarrDialog.svelte b/src/lib/components/MediaManagerModal/MMAddToSonarrDialog.svelte
index 73fedd27..50b41ed6 100644
--- a/src/lib/components/MediaManagerModal/MMAddToSonarrDialog.svelte
+++ b/src/lib/components/MediaManagerModal/MMAddToSonarrDialog.svelte
@@ -16,6 +16,7 @@
 	import { createLocalStorageStore } from '../../stores/localstorage.store';
 	import { formatSize } from '../../utils';
 	import { capitalize } from '../../utils.js';
+	import { _ } from 'svelte-i18n';
 
 	type AddOptionsStore = {
 		rootFolderPath: string | null;
@@ -129,7 +130,7 @@
 					<div class="h-24" />
 					<h1 class="header2">Add {title} to Sonarr?</h1>
 					<div class="font-medium text-secondary-300 mb-8">
-						Before you can fetch episodes, you need to add this series to Sonarr.
+						{$_('dialogs.addToSonarrMessage')}
 					</div>
 					<Container
 						class={listItemClass}
@@ -137,9 +138,9 @@
 						let:hasFocus
 					>
 						<div>
-							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">Root Folder</h1>
+							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">{$_('dialogs.rootFolder')}</h1>
 							{selectedRootFolder?.path}
-							({formatSize(selectedRootFolder?.freeSpace || 0)} left)
+							({formatSize(selectedRootFolder?.freeSpace || 0)} {$_('dialogs.left')})
 						</div>
 						<ArrowRight class={scaledArrowClas(hasFocus)} size={24} />
 					</Container>
@@ -151,7 +152,7 @@
 					>
 						<div>
 							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">
-								Quality Profile
+								{$_('dialogs.qualityProfile')}
 							</h1>
 							<span>
 								{selectedQualityProfile?.name}
@@ -167,7 +168,7 @@
 					>
 						<div>
 							<h1 class="text-secondary-300 font-semibold tracking-wide text-sm">
-								Monitor Strategy
+								{$_('dialogs.monitorStrategy')}
 							</h1>
 							<span>
 								{capitalize($addOptionsStore.monitorOptions || 'none')}
@@ -228,7 +229,7 @@
 				class={tabClasses(tab === 'quality-profiles', true)}
 				bind:selectable={qualityProfilesTab}
 			>
-				<h1 class="text-xl text-secondary-100 font-medium mb-4">Quality Profile</h1>
+				<h1 class="text-xl text-secondary-100 font-medium mb-4">{$_('dialogs.qualityProfile')}</h1>
 				<div class="min-h-0 overflow-y-auto scrollbar-hide">
 					{#each qualityProfiles as qualityProfile}
 						<Container
@@ -256,7 +257,7 @@
 				class={tabClasses(tab === 'monitor-settings', true)}
 				bind:selectable={monitorSettingsTab}
 			>
-				<h1 class="text-xl text-secondary-100 font-medium mb-4">Monitor Episodes</h1>
+				<h1 class="text-xl text-secondary-100 font-medium mb-4">{$_('dialogs.monitorEpisodes')}</h1>
 				<div class="min-h-0 overflow-y-auto scrollbar-hide">
 					{#each sonarrMonitorOptions as monitorOption}
 						<Container
diff --git a/src/lib/components/SeriesPage/SeriesPage.svelte b/src/lib/components/SeriesPage/SeriesPage.svelte
index e5de0ac0..fd103096 100644
--- a/src/lib/components/SeriesPage/SeriesPage.svelte
+++ b/src/lib/components/SeriesPage/SeriesPage.svelte
@@ -29,6 +29,7 @@
 	import MMAddToSonarrDialog from '../MediaManagerModal/MMAddToSonarrDialog.svelte';
 	import ConfirmDialog from '../Dialog/ConfirmDialog.svelte';
 	import DownloadDetailsDialog from './DownloadDetailsDialog.svelte';
+	import { _ } from 'svelte-i18n';
 
 	export let id: string;
 
@@ -185,9 +186,9 @@
 							>
 								<p class="flex-shrink-0">
 									{#if series.status !== 'Ended'}
-										Since {new Date(series.first_air_date || Date.now())?.getFullYear()}
+									{$_('library.content.since')} {new Date(series.first_air_date || Date.now())?.getFullYear()}
 									{:else}
-										Ended {new Date(series.last_air_date || Date.now())?.getFullYear()}
+									{$_('library.content.ended')} {new Date(series.last_air_date || Date.now())?.getFullYear()}
 									{/if}
 								</p>
 								<!-- <DotFilled />
@@ -220,24 +221,24 @@
 									on:clickOrSelect={() =>
 										nextJellyfinEpisode?.Id && playerState.streamJellyfinId(nextJellyfinEpisode.Id)}
 								>
-									Play Season {nextJellyfinEpisode?.ParentIndexNumber} Episode
+								{$_('library.LibraryItemContext.playSeason')}  {nextJellyfinEpisode?.ParentIndexNumber} Episode
 									{nextJellyfinEpisode?.IndexNumber}
 									<Play size={19} slot="icon" />
 								</Button>
 							{:else}
 								<Button class="mr-4" action={() => handleRequestSeason(1)}>
-									Request
+									{$_('library.content.requestContent')}
 									<Plus size={19} slot="icon" />
 								</Button>
 							{/if}
 
 							{#if PLATFORM_WEB}
 								<Button class="mr-4">
-									Open In TMDB
+									{$_('library.LibraryItemContext.openTMDB')}
 									<ExternalLink size={19} slot="icon-after" />
 								</Button>
 								<Button class="mr-4">
-									Open In Jellyfin
+									{$_('library.LibraryItemContext.openJellyfin')}
 									<ExternalLink size={19} slot="icon-after" />
 								</Button>
 							{/if}
@@ -263,7 +264,7 @@
 			<Container on:enter={scrollIntoView({ top: 0 })} class="pt-8">
 				{#await $tmdbSeries then series}
 					<Carousel scrollClass="px-32" class="mb-8">
-						<div slot="header">Show Cast</div>
+						<div slot="header">{$_('library.content.castAndCrew')}</div>
 						{#each series?.aggregate_credits?.cast?.slice(0, 15) || [] as credit}
 							<TmdbPersonCard on:enter={scrollIntoView({ horizontal: 128 })} tmdbCredit={credit} />
 						{/each}
@@ -271,7 +272,7 @@
 				{/await}
 				{#await $recommendations then recommendations}
 					<Carousel scrollClass="px-32" class="mb-8">
-						<div slot="header">Recommendations</div>
+						<div slot="header">{$_('library.content.recommendations')}</div>
 						{#each recommendations || [] as recommendation}
 							<TmdbCard item={recommendation} on:enter={scrollIntoView({ horizontal: 128 })} />
 						{/each}
@@ -280,27 +281,27 @@
 			</Container>
 			{#await $tmdbSeries then series}
 				<Container class="flex-1 bg-secondary-950 pt-8 px-32" on:enter={scrollIntoView({ top: 0 })}>
-					<h1 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">More Information</h1>
+					<h1 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">{$_('library.content.moreInformations')}</h1>
 					<div class="text-zinc-300 font-medium text-lg flex flex-wrap">
 						<div class="flex-1">
 							<div class="mb-8">
-								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Created By</h2>
+								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.directedBy')}</h2>
 								{#each series?.created_by || [] as creator}
 									<div>{creator.name}</div>
 								{/each}
 							</div>
 							<div class="mb-8">
-								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Network</h2>
+								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.networks')}</h2>
 								<div>{series?.networks?.[0]?.name}</div>
 							</div>
 						</div>
 						<div class="flex-1">
 							<div class="mb-8">
-								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Language</h2>
+								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.languages')}</h2>
 								<div>{series?.spoken_languages?.[0]?.name}</div>
 							</div>
 							<div class="mb-8">
-								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Last Air Date</h2>
+								<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.lastAirDate')}</h2>
 								<div>{series?.last_air_date}</div>
 							</div>
 						</div>
@@ -323,7 +324,7 @@
 								<div>
 									<div class="flex justify-between">
 										<h2 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">
-											Season {season} Files
+											{$_('library.content.filesSeason')} {season}
 										</h2>
 									</div>
 
@@ -406,7 +407,7 @@
 										{#if seasonFiles?.length}
 											<Button on:clickOrSelect={() => createConfirmDeleteSeasonDialog(seasonFiles)}>
 												<Trash size={19} slot="icon" />
-												Delete Season Files
+												{$_('library.content.deleteFilesSeason')}
 											</Button>
 										{/if}
 										{#if seasonDownloads?.length}
@@ -414,7 +415,7 @@
 												on:clickOrSelect={() => createConfirmCancelDownloadsDialog(seasonDownloads)}
 											>
 												<Cross1 size={19} slot="icon" />
-												Cancel Season Downloads
+												{$_('library.content.cancelFilesSeason')}
 											</Button>
 										{/if}
 									</Container>
diff --git a/src/lib/components/Sidebar/Sidebar.svelte b/src/lib/components/Sidebar/Sidebar.svelte
index 7c8113ae..4f3bc95e 100644
--- a/src/lib/components/Sidebar/Sidebar.svelte
+++ b/src/lib/components/Sidebar/Sidebar.svelte
@@ -17,6 +17,7 @@
 	import { useTabs } from '../Tab/Tab';
 	import { user } from '../../stores/user.store';
 	import { sessions } from '../../stores/session.store';
+	import { _ } from 'svelte-i18n';
 
 	enum Tabs {
 		Users,
@@ -188,7 +189,7 @@
 						}
 					)}
 				>
-					Series
+				{$_('navbar.series')}
 				</span>
 			</div>
 		</Container>
@@ -220,7 +221,7 @@
 						}
 					)}
 				>
-					Movies
+				{$_('navbar.movies')}
 				</span>
 			</div>
 		</Container>
@@ -252,7 +253,7 @@
 						}
 					)}
 				>
-					Library
+				{$_('navbar.library')}
 				</span>
 			</div>
 		</Container>
@@ -284,7 +285,7 @@
 						}
 					)}
 				>
-					Search
+				{$_('navbar.search')}
 				</span>
 			</div>
 		</Container>
@@ -323,7 +324,7 @@
 					}
 				)}
 			>
-				Manage
+			{$_('navbar.settings')}
 			</span>
 		</div>
 	</Container>
diff --git a/src/lib/lang/de.json b/src/lib/lang/de.json
index f4a184ee..f7a203fb 100644
--- a/src/lib/lang/de.json
+++ b/src/lib/lang/de.json
@@ -1,102 +1,149 @@
 {
 	"appName": "Reiverr",
 	"setupRequiredTitle": "Willkommen zu",
-	"setupRequiredDescription": "Es scheint das einige Umgebungsvariables zur fehlerfreien Ausführung fehlen. Bitte gib die folgenden Umgebungsvariablen an:",
+	"setupRequiredDescription": "Es scheint das einige Umgebungsvariables zur fehlerfreien Ausführung fehlen.",
 	"navbar": {
-		"home": "Start",
-		"discover": "Entdecken",
+		"series": "Serie",
+		"movies": "Film",
+		"search": "Suche",
 		"library": "Bibliothek",
-		"sources": "Quellen",
-		"settings": "Einstellungen"
+		"settings": "Einstellungen",
+		"loading": "Lädt"
 	},
-	"search": {
-		"placeHolder": "Suche nach Filmen und Serien",
-		"noRecentSearches": "Kein Suchverlauf",
-		"noResults": "Keine Suchergebnisse"
+	"contextMenu": {
+		"markAsWatched": "Als geschaut markieren",
+		"markAsUnwatched": "Als ungesehen markieren",
+		"openInJellyfin": "In Jellyfin öffnen",
+		"openInRadarr": "In Radarr öffnen",
+		"openInSonarr": "In Sonarr öffnen",
+		"openInTMDB": "In TMDB öffnen"
 	},
-	"discover": {
-		"trending": "Aufsteigend",
-		"popularPeople": "Beliebte Personen",
-		"upcomingMovies": "Bald verfügbare Filme",
-		"upcomingSeries": "Bald verfügbare Serien",
-		"genres": "Genres",
-		"newDigitalReleases": "Neue Digitale Veröffentlichungen",
-		"streamingNow": "Aktuell im Stream",
-		"TVNetworks": "Anbieter"
+	"confirmDialogs": {
+		"confirm": "Bestätigen",
+		"cancel": "Abbrechen"
 	},
-	"library": {
-		"missingConfiguration": "Konfiguriere Radarr, Sonarr und Jellyfin, zum Verwalten und Abspielen der Bibliothek",
-		"available": "Verfügbar",
-		"watched": "Geschaut",
-		"unavailable": "Nicht verfügbar",
-		"sort": {
-			"byTitle": "Nach Titel"
-		},
-		"content": {
-			"movie": "Film",
-			"show": "Serie",
-			"requestContent": "Anfrage",
-			"directedBy": "Regie von",
-			"releaseDate": "Veröffentlichung",
-			"budget": "Budget",
-			"status": "Status",
-			"runtime": "Spielzeit",
-			"castAndCrew": "Cast & Crew",
-			"recommendations": "Empfehlungen",
-			"similarTitles": "Ähnliche Titel"
-		}
+	"dialogs": {
+		"addToRadarrMessage": "Bevor Sie Episoden abrufen können, müssen Sie diese Serie zu Radarr hinzufügen.",
+		"addToSonarrMessage": "Bevor Sie Episoden abrufen können, müssen Sie diese Serie zu Sonarr hinzufügen.",
+		"rootFolder": "Hauptordner",
+		"qualityProfile": "Qualitätsprofil",
+		"minimumAvailability": "Minimale Verfügbarkeit",
+		"left": "übrig",
+		"addToRadarr": "Zu Radarr hinzufügen",
+		"addToSonarr": "Zu Sonarr hinzufügen",
+		"deleteSeasonFilesHeader": "Staffel Dateien löschen?",
+		"deleteSeasonFilesBody": "Sind Sie sicher, dass Sie alle ",
+		"deleteFilesCount": "Datei(en) löschen möchten?",
+		"confirmDeleteSeasonHeader": "Staffel Dateien löschen?",
+		"confirmDeleteSeasonBody": "Sind Sie sicher, dass Sie alle ",
+		"confirmCancelDownloadsHeader": "Staffel Downloads abbrechen?",
+		"confirmCancelDownloadsBody": "Sind Sie sicher, dass Sie alle ",
+		"cancelAllDownloads": "Alle Downloads abbrechen",
+		"add": "Hinzufügen",
+		"toRadarr": "zu Radarr?",
+		"toSonarr": "zu Sonarr?",
+		"monitorStrategy": "Überwachungsstrategie",
+		"monitorEpisodes": "Episoden überwachen"
 	},
-	"sources": {},
-	"titleShowcase": {
-		"details": "Details",
-		"watchTrailer": "Trailer abspielen",
-		"releaseDate": "Veröffentlichung",
-		"directedBy": "Regie von"
+	"login": {
+		"title": "Anmelden bei Reiverr",
+		"firstTime": "Wenn dies Ihr erstes Login ist, wird ein neues Konto basierend auf Ihren Anmeldedaten erstellt.",
+		"server": "Server",
+		"name": "Name",
+		"password": "Passwort",
+		"submit": "Einreichen",
+		"invalidCredentials": "Ungültige Anmeldeinformationen. Bitte versuchen Sie es erneut.",
+		"errorOccurred": "Ein Fehler ist aufgetreten"
 	},
 	"settings": {
-		"navbar": {
-			"settings": "Konfiguration",
-			"general": "Allgemein",
-			"integrations": "Integrationen"
-		},
 		"general": {
 			"userInterface": {
-				"userInterface": "Benutzeroberfläche",
-				"language": "Sprache",
-				"autoplayTrailers": "Trailer automatisch abspielen",
-				"animationDuration": "Animationsdauer"
-			},
-			"discovery": {
-				"discovery": "Entdecken",
-				"none": "Keine",
-				"region": "Region",
-				"excludeLibraryItemsFromDiscovery": "Schließe Bibliothekeinträge von 'Entdecken' aus",
-				"includedLanguages": "Enthaltene Sprachen",
-				"includedLanguagesDescription": "Filter Resultate nach gesprochener Sprache. Trage ISO 639-1 Sprachcodes kommasepariert ein. Freilassen zum deaktivieren."
+				"animateScrolling": "Scrollen animieren",
+				"useCssTransitions": "CSS-Übergänge verwenden",
+				"checkForUpdates": "Nach Updates suchen",
+				"language": "Sprache"
 			}
 		},
 		"integrations": {
-			"integrations": "Integrationen",
-			"integrationsNote": "Anmerkungen: Basis URLs müssen vom Browser aus erreichbar sein. Interne Docker Adressen funktionieren nicht. API Schlüssel <span class='font-medium underline'>sind Sichtbar</span> in den Browseranfragen.",
 			"baseUrl": "Basis URL",
 			"apiKey": "API Schlüssel",
-			"testConnection": "Verbindung testen",
-			"status": {
-				"connected": "Verbunden",
-				"disconnected": "Getrennt"
+			"save": "Speichern",
+			"tmdbAccount": "Tmdb Konto",
+			"connectedTo": "Verbunden mit",
+			"tmdb": {
+				"connect": "Verbinden"
 			},
-			"options": {
-				"options": "Optionen",
-				"rootFolder": "Hauptordner",
-				"qualityProfile": "Qualitätsprofil",
-				"languageProfile": "Sprachprofil",
-				"jellyfinUser": "Jellyfin Benutzer"
-			}
+			"user": "Benutzer"
+		},
+		"navbar": {
+			"general": "Allgemein",
+			"integrations": "Integrationen",
+			"about": "Über",
+			"serie": "Serie",
+			"movies": "Film",
+			"library": "Bibliothek",
+			"search": "Suche",
+			"settings": "Einstellungen"
+		},
+		"about": {
+			"userAgent": "User agent",
+			"lastKeyCode": "Letzter Schlüsselcode",
+			"lastKey": "Letzter Schlüssel",
+			"tizenMediaKey": "Tizen Media Key",
+			"logOut": "Ausloggen"
+		}
+	},
+	"discover": {
+		"continueWatching": "Weiter ansehen",
+		"recentlyAdded": "Kürzlich hinzugefügt",
+		"trending": "Aufsteigend",
+		"newDigitalReleases": "Neue Digitale Veröffentlichungen",
+		"upcomingMovies": "Bald verfügbare Filme",
+		"streamingNow": "Aktuell im Stream",
+		"upcomingSeries": "Bald verfügbare Serien"
+	},
+	"library": {
+		"content": {
+			"since": "Seit",
+			"ended": "Beendet",
+			"directedBy": "Regie von",
+			"writtenBy": "Geschrieben von",
+			"languages": "Sprachen",
+			"releaseDate": "Veröffentlichung",
+			"localFiles": "Lokale Dateien",
+			"deleteAllFiles": "Alle Dateien löschen",
+			"cancelAllDownloads": "Alle Downloads abbrechen",
+			"openInTMDB": "In TMDB öffnen",
+			"openInJellyfin": "In Jellyfin öffnen",
+			"requestContent": "Anfrage",
+			"season": "Staffel",
+			"episode": "Episode",
+			"moreInformation": "Mehr Informationen",
+			"filesSeason": "Dateien Staffel",
+			"deleteFilesSeason": "Staffel Dateien löschen",
+			"cancelFilesSeason": "Staffel Downloads abbrechen",
+			"minLeft": "Minuten übrig",
+			"played": "Gespielt",
+			"castAndCrew": "Cast & Crew",
+			"recommendations": "Empfehlungen",
+			"networks": "Anbieter",
+			"lastAirDate": "Letztes Sendedatum",
+			"moreInformations": "Mehr Informationen",
+			"play": "Abspielen"
 		},
-		"misc": {
-			"saveChanges": "Änderungen speichern",
-			"resetToDefaults": "Auf Standard zurücksetzen ",
-			"changelog": "Änderungen"
+		"LibraryItemContext": {
+			"markWatched": "Als geschaut markieren",
+			"markUnwatched": "Als ungesehen markieren",
+			"openTMDB": "In TMDB öffnen",
+			"openJellyfin": "In Jellyfin öffnen",
+			"playSeason": "Staffel abspielen",
+			"episode": "Episode"
 		}
+	},
+	"search": {
+		"placeHolder": "Suche nach Filmen und Serien"
+	},
+	"personPage": {
+		"born": "Geboren"
 	}
-}
+}
\ No newline at end of file
diff --git a/src/lib/lang/en.json b/src/lib/lang/en.json
index 39ea8747..a2804246 100644
--- a/src/lib/lang/en.json
+++ b/src/lib/lang/en.json
@@ -1,102 +1,151 @@
 {
 	"appName": "Reiverr",
 	"setupRequiredTitle": "Welcome to",
-	"setupRequiredDescription": "It seems like the application is missing some environment variables that are necessary for the application to function. Please provide the following environment variables:",
+	"setupRequiredDescription": "It seems like the application is missing some environment variables that are necessary for the application to function.",
 	"navbar": {
-		"home": "Home",
-		"discover": "Discover",
+		"series": "Series",
+		"movies": "Movies",
+		"search": "Search",
 		"library": "Library",
-		"sources": "Sources",
-		"settings": "Settings"
+		"settings": "Manage",
+		"loading": "loading"
 	},
-	"search": {
-		"placeHolder": "Search for Movies and TV Shows",
-		"noRecentSearches": "No recent searches",
-		"noResults": "No search results"
+	"contextMenu": {
+		"markAsWatched": "Mark as watched",
+		"markAsUnwatched": "Mark as unwatched",
+		"openInJellyfin": "Open in Jellyfin",
+		"openInRadarr": "Open in Radarr",
+		"openInSonarr": "Open in Sonarr",
+		"openInTMDB": "Open in TMDB"
 	},
-	"discover": {
-		"trending": "Trending",
-		"popularPeople": "Popular People",
-		"upcomingMovies": "Upcoming Movies",
-		"upcomingSeries": "Upcoming Series",
-		"genres": "Genres",
-		"newDigitalReleases": "New Digital Releases",
-		"streamingNow": "Streaming Now",
-		"TVNetworks": "TV Networks"
+	"confirmDialogs": {
+		"confirm": "Confirm",
+		"cancel": "Cancel"
 	},
-	"library": {
-		"missingConfiguration": "Configure Radarr, Sonarr and Jellyfin to watch and manage your library",
-		"available": "Available",
-		"watched": "Watched",
-		"unavailable": "Unavailable",
-		"sort": {
-			"byTitle": "By Title"
-		},
-		"content": {
-			"movie": "Movie",
-			"show": "Show",
-			"requestContent": "Request",
-			"directedBy": "Directed By",
-			"releaseDate": "Release Date",
-			"budget": "Budget",
-			"status": "Status",
-			"runtime": "Runtime",
-			"castAndCrew": "Cast & Crew",
-			"recommendations": "Recommendations",
-			"similarTitles": "Similar Titles"
-		}
+	"dialogs": {
+		"addToRadarrMessage": "Before you can fetch episodes, you need to add this series to Radarr.",
+		"addToSonarrMessage": "Before you can fetch episodes, you need to add this series to Sonarr.",
+		"rootFolder": "Root Folder",
+		"qualityProfile": "Quality Profile",
+		"minimumAvailability": "Minimum Availability",
+		"left": "left",
+		"addToRadarr": "Add to Radarr",
+		"addToSonarr": "Add to Sonarr",
+		"deleteSeasonFilesHeader": "Delete Season Files?",
+		"deleteSeasonFilesBody": "Are you sure you want to delete all ",
+		"deleteFilesCount": "file(s)?",
+		"confirmDeleteSeasonHeader": "Delete Season Files?",
+		"confirmDeleteSeasonBody": "Are you sure you want to delete all ",
+		"confirmCancelDownloadsHeader": "Cancel Season Downloads?",
+		"confirmCancelDownloadsBody": "Are you sure you want to cancel all ",
+		"cancelAllDownloads": "Cancel All Downloads",
+		"add":"Add",
+		"toRadarr":"to Radarr?",
+		"toSonarr":"to Sonarr?",
+		"monitorStrategy":"Monitor Strategy",
+		"monitorEpisodes":"Monitor Episodes"
+
 	},
-	"sources": {},
-	"titleShowcase": {
-		"details": "Details",
-		"watchTrailer": "Watch Trailer",
-		"releaseDate": "Release Date",
-		"directedBy": "Directed By"
+	"login": {
+		"title": "Login to Reiverr",
+		"firstTime": "If this is your first time logging in, a new account will be created based on your credentials.",
+		"server": "Server",
+		"name": "Name",
+		"password": "Password",
+		"submit": "Submit",
+		"invalidCredentials": "Invalid credentials. Please try again.",
+		"errorOccurred": "Error occurred"
 	},
 	"settings": {
-		"navbar": {
-			"settings": "Configuration",
-			"general": "General",
-			"integrations": "Integrations"
-		},
 		"general": {
 			"userInterface": {
-				"userInterface": "User Interface",
-				"language": "Language",
-				"autoplayTrailers": "Autoplay Trailers",
-				"animationDuration": "Animation Duration"
-			},
-			"discovery": {
-				"discovery": "Discovery",
-				"none": "None",
-				"region": "Region",
-				"excludeLibraryItemsFromDiscovery": "Exclude library items from Discovery",
-				"includedLanguages": "Included languages",
-				"includedLanguagesDescription": "Filter results based on spoken language. Takes ISO 639-1 language codes separated with commas. Leave empty to disable."
+				"animateScrolling": "Animate scrolling",
+				"useCssTransitions": "Use CSS Transitions",
+				"checkForUpdates": "Check for Updates",
+				"language": "Language"
 			}
 		},
 		"integrations": {
-			"integrations": "Integrations",
-			"integrationsNote": "Note: Base urls must be accessible from the browser, meaning that internal docker addresses won't work, for example. API Keys <span class='font-medium underline'>will be exposed</span> to the browser.",
-			"baseUrl": "Base URL",
+			"baseUrl": "Base Url",
 			"apiKey": "API Key",
-			"testConnection": "Test Connection",
-			"status": {
-				"connected": "Connected",
-				"disconnected": "Disconnected"
+			"save": "Save",
+			"tmdbAccount": "Tmdb Account",
+			"connectedTo": "Connected to",
+			"tmdb": {
+				"connect": "Connect"
 			},
-			"options": {
-				"options": "Options",
-				"rootFolder": "Root Folder",
-				"qualityProfile": "Quality Profile",
-				"languageProfile": "Language Profile",
-				"jellyfinUser": "Jellyfin User"
-			}
+			"user":"User"
+		},
+		"navbar": {
+			"general": "General",
+			"integrations": "Integrations",
+			"about": "About",
+			"serie": "Series",
+			"movies": "Movies",
+			"library": "Library",
+			"search": "Search",
+			"settings": "Manage"
 		},
-		"misc": {
-			"saveChanges": "Save Changes",
-			"resetToDefaults": "Reset to Defaults ",
-			"changelog": "Changelog"
+		"about": {
+			"userAgent": "User agent",
+			"lastKeyCode": "Last key code",
+			"lastKey": "Last key",
+			"tizenMediaKey": "Tizen media key",
+			"logOut": "Log Out"
 		}
+	},
+	"discover": {
+		"continueWatching": "Continue Watching",
+		"recentlyAdded": "Recently Added",
+		"trending": "Trending",
+		"newDigitalReleases": "New Digital Releases",
+		"upcomingMovies": "Upcoming Movies",
+		"streamingNow": "Now Streaming",
+		"upcomingSeries": "Upcoming Series"
+	},
+	"library": {
+		"content": {
+			"since": "Since",
+			"ended": "Ended",
+			"directedBy": "Directed By",
+			"writtenBy": "Written By",
+			"languages": "Languages",
+			"releaseDate": "Release Date",
+			"localFiles": "Local Files",
+			"deleteAllFiles": "Delete All Files",
+			"cancelAllDownloads": "Cancel All Downloads",
+			"openInTMDB": "Open In TMDB",
+			"openInJellyfin": "Open In Jellyfin",
+			"requestContent": "Request",
+			"season": "Season",
+			"episode": "Episode",
+			"moreInformation": "More Information",
+			"filesSeason": "Files Season",
+			"deleteFilesSeason": "Delete Season Files",
+			"cancelFilesSeason": "Cancel Season Downloads",
+			"minLeft": "Minutes",
+			"played": "Played",
+			"castAndCrew":"Cast and Crew",
+			"recommendations":"Recommandations",
+			"networks":"Networks",
+			"lastAirDate":"Last Air Date",
+			"moreInformations":"More informations",
+			"play":"Play"
+
+		},
+		"LibraryItemContext": {
+			"markWatched": "Mark as Watched",
+			"markUnwatched": "Mark as Unwatched",
+			"openTMDB": "Open In TMDB",
+			"openJellyfin": "Open In Jellyfin",
+			"playSeason":"Play Season",
+			"episode":"Episode"
+		}
+	},
+	"search": {
+		"placeHolder": "Search titles..."
+	},
+	"personPage": {
+		"born": "Born"
 	}
-}
+}
\ No newline at end of file
diff --git a/src/lib/lang/es.json b/src/lib/lang/es.json
index c79781b8..6e0be3f6 100644
--- a/src/lib/lang/es.json
+++ b/src/lib/lang/es.json
@@ -1,102 +1,141 @@
 {
 	"appName": "Reiverr",
 	"setupRequiredTitle": "Bienvenido a",
-	"setupRequiredDescription": "Parece que la aplicación no tiene algunas variables de entorno necesarias para que la aplicación funcione. Por favor, proporciona las siguientes variables de entorno:",
+	"setupRequiredDescription": "Parece que la aplicación no tiene algunas variables de entorno necesarias para que la aplicación funcione.",
 	"navbar": {
-		"home": "Inicio",
-		"discover": "Descubrir",
+		"series": "Series",
+		"movies": "Películas",
+		"search": "Buscar",
 		"library": "Biblioteca",
-		"sources": "Fuentes",
-		"settings": "Configuración"
+		"settings": "Configuración",
+		"loading": "Cargando"
 	},
-	"search": {
-		"placeHolder": "Busca entre películas y series",
-		"noRecentSearches": "Sin búsquedas recientes",
-		"noResults": "Sin resultados"
-	},
-	"discover": {
-		"trending": "Tendencia",
-		"popularPeople": "Personas Populares",
-		"upcomingMovies": "Próximas Películas",
-		"upcomingSeries": "Próximas Series",
-		"genres": "Géneros",
-		"newDigitalReleases": "Nuevos Lanzamientos Digitales",
-		"streamingNow": "En Streaming ahora",
-		"TVNetworks": "Cadenas de TV"
+	"contextMenu": {
+		"markAsWatched": "Marcar como visto",
+		"markAsUnwatched": "Marcar como no visto",
+		"openInJellyfin": "Abrir en Jellyfin",
+		"openInRadarr": "Abrir en Radarr",
+		"openInSonarr": "Abrir en Sonarr",
+		"openInTMDB": "Abrir en TMDB"
 	},
-	"library": {
-		"missingConfiguration": "Configura Radarr, Sonarr y Jellyfin para ver y administrar tu biblioteca",
-		"available": "Disponible",
-		"watched": "Visto",
-		"unavailable": "No disponible",
-		"sort": {
-			"byTitle": "Por Título"
+	"dialogs": {
+		"confirmDialogs": {
+			"confirm": "Confirmar",
+			"cancel": "Cancelar"
 		},
-		"content": {
-			"movie": "Película",
-			"show": "Show",
-			"requestContent": "Solicitar",
-			"directedBy": "Dirigido por",
-			"releaseDate": "Fecha de Lanzamiento",
-			"budget": "Presupuesto",
-			"status": "Estado",
-			"runtime": "Duración",
-			"castAndCrew": "Reparto y Equipo",
-			"recommendations": "Recomendaciones",
-			"similarTitles": "Títulos Similares"
-		}
+		"addToSonarrMessage": "Antes de poder obtener episodios, necesitas agregar esta serie a Sonarr.",
+		"rootFolder": "Carpeta Raíz",
+		"qualityProfile": "Perfil de Calidad",
+		"minimumAvailability": "Disponibilidad Mínima",
+		"left": "izquierda",
+		"addToRadarr": "Agregar a Radarr",
+		"deleteSeasonFilesHeader": "¿Eliminar archivos de la temporada?",
+		"deleteSeasonFilesBody": "¿Estás seguro de que quieres eliminar todos ",
+		"deleteFilesCount": "archivo(s)?",
+		"confirmDeleteSeasonHeader": "¿Eliminar archivos de la temporada?",
+		"confirmDeleteSeasonBody": "¿Estás seguro de que quieres eliminar todos ",
+		"confirmCancelDownloadsHeader": "¿Cancelar descargas de la temporada?",
+		"confirmCancelDownloadsBody": "¿Estás seguro de que quieres cancelar todos ",
+		"cancelAllDownloads": "Cancelar todas las descargas"
 	},
-	"sources": {},
-	"titleShowcase": {
-		"details": "Detalles",
-		"watchTrailer": "Ver Trailer",
-		"releaseDate": "Fecha de Lanzamiento",
-		"directedBy": "Dirigido por"
+	"login": {
+		"title": "Iniciar sesión en Reiverr",
+		"firstTime": "Si es la primera vez que inicias sesión, se creará una nueva cuenta basada en tus credenciales.",
+		"server": "Servidor",
+		"name": "Nombre",
+		"password": "Contraseña",
+		"submit": "Enviar",
+		"invalidCredentials": "Credenciales inválidas. Por favor, inténtalo de nuevo.",
+		"errorOccurred": "Ocurrió un error"
 	},
 	"settings": {
-		"navbar": {
-			"settings": "Configuración",
-			"general": "General",
-			"integrations": "Integraciones"
-		},
 		"general": {
 			"userInterface": {
-				"userInterface": "Interfaz de Usuario",
-				"language": "Lenguaje",
-				"autoplayTrailers": "Auto-Reproducción de Trailers",
-				"animationDuration": "Duración de la Animación"
-			},
-			"discovery": {
-				"discovery": "Descubrir",
-				"none": "Ninguna",
-				"region": "Región",
-				"excludeLibraryItemsFromDiscovery": "Excluir elementos de la Biblioteca en Descubrir",
-				"includedLanguages": "Lenguajes Incluidos",
-				"includedLanguagesDescription": "Filtrar resultados basado en el lenguaje hablado. Acepta códigos de lenguaje ISO 639-1 separados por comas. Dejálo en blanco para deshabilitar"
+				"animateScrolling": "Animar desplazamiento",
+				"useCssTransitions": "Usar transiciones CSS",
+				"checkForUpdates": "Buscar actualizaciones",
+				"language": "Lenguaje"
 			}
 		},
 		"integrations": {
-			"integrations": "Integraciones",
-			"integrationsNote": "Nota: Las urls base deben ser accesibles desde el navegador, lo que significa que las direcciones internas de Docker no funcionarán, por ejemplo. Las llaves API <span class='font-medium underline'>quedarán expuestas</span> al navegador",
 			"baseUrl": "URL Base",
 			"apiKey": "Llave API",
-			"testConnection": "Probar Conexion",
-			"status": {
-				"connected": "Conectado",
-				"disconnected": "Desconectado"
+			"save": "Guardar",
+			"tmdbAccount": "Cuenta de TMDB",
+			"connectedTo": "Conectado a",
+			"tmdb": {
+				"connect": "Conectar"
 			},
-			"options": {
-				"options": "Opciones",
-				"rootFolder": "Carpeta Raíz",
-				"qualityProfile": "Perfil de Calidad",
-				"languageProfile": "Perfil de Lenguaje",
-				"jellyfinUser": "Usuario de Jellyfin"
-			}
+			"user":"Usuario"
+		},
+		"navbar": {
+			"general": "General",
+			"integrations": "Integraciones",
+			"about": "Acerca de",
+			"serie": "Series",
+			"movies": "Películas",
+			"library": "Biblioteca",
+			"search": "Buscar",
+			"settings": "Configuración"
+		},
+		"about": {
+			"userAgent": "Agente de usuario",
+			"lastKeyCode": "Último código de tecla",
+			"lastKey": "Última tecla",
+			"tizenMediaKey": "Tecla de medios Tizen",
+			"logOut": "Cerrar sesión"
+		}
+	},
+	"discover": {
+		"continueWatching": "Seguir viendo",
+		"recentlyAdded": "Recientemente añadido",
+		"trending": "Tendencia",
+		"newDigitalReleases": "Nuevos lanzamientos digitales",
+		"upcomingMovies": "Próximas películas",
+		"streamingNow": "En streaming ahora",
+		"upcomingSeries": "Próximas series"
+	},
+	"library": {
+		"content": {
+			"since": "Desde",
+			"ended": "Finalizado",
+			"directedBy": "Dirigido por",
+			"writtenBy": "Escrito por",
+			"languages": "Idiomas",
+			"releaseDate": "Fecha de lanzamiento",
+			"localFiles": "Archivos locales",
+			"deleteAllFiles": "Eliminar todos los archivos",
+			"cancelAllDownloads": "Cancelar todas las descargas",
+			"openInTMDB": "Abrir en TMDB",
+			"openInJellyfin": "Abrir en Jellyfin",
+			"requestContent": "Solicitar",
+			"season": "Temporada",
+			"episode": "Episodio",
+			"moreInformation": "Más información",
+			"filesSeason": "Archivos de la temporada",
+			"deleteFilesSeason": "Eliminar archivos de la temporada",
+			"cancelFilesSeason": "Cancelar descargas de la temporada",
+			"minLeft": "Minutos",
+			"played": "Visto",
+			"castAndCrew":"Reparto y equipo",
+			"recommendations":"Recomendaciones",
+			"networks":"Cadenas de TV",
+			"lastAirDate":"Última fecha de emisión",
+			"moreInformations":"Más información"
 		},
-		"misc": {
-			"saveChanges": "Guardar Cambios",
-			"resetToDefaults": "Restablecer Ajustes ",
-			"changelog": "Historial de Cambios"
+		"LibraryItemContext": {
+			"markWatched": "Marcar como visto",
+			"markUnwatched": "Marcar como no visto",
+			"openTMDB": "Abrir en TMDB",
+			"openJellyfin": "Abrir en Jellyfin",
+			"playSeason":"Reproducir temporada",
+			"episode":"Episodio"
 		}
+	},
+	"search": {
+		"placeHolder": "Buscar títulos..."
+	},
+	"personPage": {
+		"born": "Nacido"
 	}
-}
+}
\ No newline at end of file
diff --git a/src/lib/lang/fr.json b/src/lib/lang/fr.json
index 71cfb2e8..09b4afa8 100644
--- a/src/lib/lang/fr.json
+++ b/src/lib/lang/fr.json
@@ -1,102 +1,151 @@
 {
 	"appName": "Reiverr",
 	"setupRequiredTitle": "Bienvenue à",
-	"setupRequiredDescription": "Il semble que l'application manque de certaines variables d'environnement nécessaires au fonctionnement de l'application. ",
+	"setupRequiredDescription": "Il semble que l'application manque de certaines variables d'environnement nécessaires au fonctionnement de l'application.",
 	"navbar": {
-		"home": "Accueil",
-		"discover": "Découvrir",
-		"library": "Bibliothèque",
-		"sources": "Sources",
-		"settings": "Paramètres"
+		"series": "Séries",
+		"movies": "Films",
+		"search": "Recherche",
+		"library": "Librairie",
+		"settings": "Paramètres",
+		"loading": "Chargement"
 	},
-	"search": {
-		"placeHolder": "Rechercher des films et des émissions de télévision",
-		"noRecentSearches": "Aucune recherche récente",
-		"noResults": "Aucun résultat trouvé"
+	"contextMenu": {
+		"markAsWatched": "Marquer comme vu",
+		"markAsUnwatched": "Marquer comme non-vu",
+		"openInJellyfin": "Ouvrir dans Jellyfin",
+		"openInRadarr": "Ouvrir dans Radarr",
+		"openInSonarr": "Ouvrir dans Sonarr",
+		"openInTMDB": "Ouvrir dans TMDB"
 	},
-	"discover": {
-		"trending": "Tendance",
-		"popularPeople": "Personnes populaires",
-		"upcomingMovies": "Films à venir",
-		"upcomingSeries": "Série à venir",
-		"genres": "Genres",
-		"newDigitalReleases": "Nouvelles versions numériques",
-		"streamingNow": "En streaming maintenant",
-		"TVNetworks": "Réseaux de télévision"
+	"confirmDialogs": {
+		"confirm": "Confirmer",
+		"cancel": "Annuler"
 	},
-	"library": {
-		"missingConfiguration": "Configurez Radarr, Sonarr et Jellyfin pour surveiller et gérer votre bibliothèque",
-		"available": "Disponible",
-		"watched": "Regardé",
-		"unavailable": "Indisponible",
-		"sort": {
-			"byTitle": "Par titre"
-		},
-		"content": {
-			"movie": "Film",
-			"show": "Voir",
-			"requestContent": "Demander",
-			"directedBy": "Dirigé par",
-			"releaseDate": "Date de sortie",
-			"budget": "Budget",
-			"status": "Statut",
-			"runtime": "Durée",
-			"castAndCrew": "Casting",
-			"recommendations": "Recommandations",
-			"similarTitles": "Titres similaires"
-		}
+	"dialogs": {
+		"addToRadarrMessage": "Avant de pouvoir récupérer des épisodes, vous devez ajouter cette série à Radarr.",
+		"addToSonarrMessage": "Avant de pouvoir récupérer des épisodes, vous devez ajouter cette série à Sonarr.",
+
+		"rootFolder": "Dossier Racine",
+		"qualityProfile": "Profil de Qualité",
+		"minimumAvailability": "Disponibilité Minimale",
+		"left": "restants",
+		"addToRadarr": "Ajouter à Radarr",
+		"addToSonarr": "Ajouter à Sonarr",
+		"deleteSeasonFilesHeader": "Supprimer les fichiers de la saison?",
+		"deleteSeasonFilesBody": "Êtes-vous sûr de vouloir supprimer tous ",
+		"deleteFilesCount": "fichier(s)?",
+		"confirmDeleteSeasonHeader": "Supprimer les fichiers de la saison?",
+		"confirmDeleteSeasonBody": "Êtes-vous sûr de vouloir supprimer tous ",
+		"confirmCancelDownloadsHeader": "Annuler les téléchargements de la saison?",
+		"confirmCancelDownloadsBody": "Êtes-vous sûr de vouloir annuler tous ",
+		"cancelAllDownloads": "Annuler tous les téléchargements",
+		"add":"Ajouter",
+		"toRadarr":"à Radarr?",
+		"toSonarr":"à Sonarr?",
+		"monitorStrategy":"Stratégie de surveillance",
+		"monitorEpisodes":"Surveillance des épisodes"
 	},
-	"sources": {},
-	"titleShowcase": {
-		"details": "Détails",
-		"watchTrailer": "Regarde la bande-annonce",
-		"releaseDate": "Date de sortie",
-		"directedBy": "Dirigé par"
+	"login": {
+		"title": "Connexion à Reiverr",
+		"firstTime": "Si c'est votre première connexion, un nouveau compte sera créé en fonction de vos identifiants.",
+		"server": "Serveur",
+		"name": "Nom d'utilisateur",
+		"password": "Mot de passe",
+		"submit": "Connexion",
+		"invalidCredentials": "Identifiants invalides. Veuillez réessayer.",
+		"errorOccurred": "Une erreur s'est produite"
 	},
 	"settings": {
-		"navbar": {
-			"settings": "Configuration",
-			"general": "Général",
-			"integrations": "Intégrations"
-		},
 		"general": {
 			"userInterface": {
-				"userInterface": "Interface utilisateur",
-				"language": "Langue",
-				"autoplayTrailers": "Bandes-annonces à lecture automatique",
-				"animationDuration": "Durée de l'animation"
-			},
-			"discovery": {
-				"discovery": "Découverte",
-				"none": "Aucun",
-				"region": "Région",
-				"excludeLibraryItemsFromDiscovery": "Exclure les éléments de bibliothèque de Discovery",
-				"includedLanguages": "Langues incluses",
-				"includedLanguagesDescription": "Filtrez les résultats en fonction de la langue parlée. "
+				"animateScrolling": "Animer le défilement",
+				"useCssTransitions": "Utiliser les transitions CSS",
+				"checkForUpdates": "Vérifier les mises à jour",
+				"language": "Langue"
 			}
 		},
 		"integrations": {
-			"integrations": "Intégrations",
-			"integrationsNote": "Remarque: Les URL de base doivent être accessibles depuis le navigateur, ce qui signifie que les adresses Docker internes ne fonctionneront pas, par exemple. <span class='font-medium underline'>sera exposé</span> au navigateur.",
 			"baseUrl": "URL de base",
-			"apiKey": "clé API",
-			"testConnection": "Tester la connexion",
-			"status": {
-				"connected": "Connecté",
-				"disconnected": "Déconnecté"
+			"apiKey": "Clé API",
+			"save": "Sauvegarder",
+			"tmdbAccount": "Compte TMDB",
+			"connectedTo": "Connecté à",
+			"tmdb": {
+				"connect": "Connecter"
 			},
-			"options": {
-				"options": "Options",
-				"rootFolder": "Dossier racine",
-				"qualityProfile": "Profil de qualité",
-				"languageProfile": "Profil linguistique",
-				"jellyfinUser": "Utilisateur de Jellyfin"
-			}
+			"user": "Utilisateur"
+		},
+		"navbar": {
+			"general": "Général",
+			"integrations": "Intégrations",
+			"about": "À propos",
+			"serie": "Séries",
+			"movies": "Films",
+			"library": "Librairie",
+			"search": "Recherche",
+			"settings": "Paramètres"
+		},
+		"about": {
+			"userAgent": "User agent",
+			"lastKeyCode": "Dernier code de touche",
+			"lastKey": "Dernière touche",
+			"tizenMediaKey": "Touche média Tizen",
+			"logOut": "Déconnexion"
+		}
+	},
+	"discover": {
+		"continueWatching": "Continuer à regarder",
+		"recentlyAdded": "Récemment ajouté",
+		"trending": "Tendances",
+		"newDigitalReleases": "Nouvelles sorties numériques",
+		"upcomingMovies": "Films à venir",
+		"streamingNow": "En streaming",
+		"upcomingSeries": "Séries à venir"
+	},
+	"library": {
+		"content": {
+			"since": "Depuis",
+			"ended": "Terminé",
+			"directedBy": "Dirigé par",
+			"writtenBy": "Écrit par",
+			"languages": "Langues",
+			"releaseDate": "Date de sortie",
+			"localFiles": "Fichiers locaux",
+			"deleteAllFiles": "Supprimer tous les fichiers",
+			"cancelAllDownloads": "Annuler tous les téléchargements",
+			"openInTMDB": "Ouvrir dans TMDB",
+			"openInJellyfin": "Ouvrir dans Jellyfin",
+			"requestContent": "Demander",
+			"season": "Saison",
+			"episode": "Épisode",
+			"moreInformation": "Plus d'informations",
+			"filesSeason": "Fichiers de la saison",
+			"deleteFilesSeason": "Supprimer les fichiers de la saison",
+			"cancelFilesSeason": "Annuler les fichiers de la saison",
+			"minLeft": "mins restantes",
+			"played": "Regardé",
+			"castAndCrew": "Distribution et équipe",
+			"recommendations": "Recommandations",
+			"networks": "Plateformes de diffusion",
+			"lastAirDate": "Date du dernier épisode",
+			"moreInformations": "Plus d'informations",
+			"play":"Lecture"
+			
 		},
-		"misc": {
-			"saveChanges": "Sauvegarder les modifications",
-			"resetToDefaults": "Réinitialiser les paramètres par défaut ",
-			"changelog": "Journal des modifications"
+		"LibraryItemContext": {
+			"markWatched": "Marquer comme vu",
+			"markUnwatched": "Marquer comme non-vu",
+			"openTMDB": "Ouvrir dans TMDB",
+			"openJellyfin": "Ouvrir dans Jellyfin",
+			"playSeason": "Lire la saison",
+			"episode": "Épisode"
 		}
+	},
+	"search": {
+		"placeHolder": "Rechercher des titres"
+	},
+	"personPage": {
+		"born": "Né(e)"
 	}
-}
+}
\ No newline at end of file
diff --git a/src/lib/lang/it.json b/src/lib/lang/it.json
index ba4d76e3..2cd7c7ef 100644
--- a/src/lib/lang/it.json
+++ b/src/lib/lang/it.json
@@ -1,102 +1,149 @@
 {
 	"appName": "Reiverr",
 	"setupRequiredTitle": "Benvenuti in",
-	"setupRequiredDescription": "Sembra che alcune variabili di ambiente necessarie per il funzionamento dell'applicazione siano mancanti. Per favore, inserisci le seguenti variabili d'ambiente:",
+	"setupRequiredDescription": "Sembra che alcune variabili di ambiente necessarie per il funzionamento dell'applicazione siano mancanti.",
 	"navbar": {
-		"home": "Home",
-		"discover": "Esplora",
+		"series": "Serie",
+		"movies": "Film",
+		"search": "Cerca",
 		"library": "Libreria",
-		"sources": "Fonti",
-		"settings": "Impostazioni"
+		"settings": "Impostazioni",
+		"loading": "caricamento"
 	},
-	"search": {
-		"placeHolder": "Cerca Film o Serie TV",
-		"noRecentSearches": "Nessuna ricerca recente",
-		"noResults": "Nessun risultato"
+	"contextMenu": {
+		"markAsWatched": "Segna come visto",
+		"markAsUnwatched": "Segna come non visto",
+		"openInJellyfin": "Apri in Jellyfin",
+		"openInRadarr": "Apri in Radarr",
+		"openInSonarr": "Apri in Sonarr",
+		"openInTMDB": "Apri in TMDB"
 	},
-	"discover": {
-		"trending": "In tendenza",
-		"popularPeople": "Personaggi in tendenza",
-		"upcomingMovies": "Film in uscita",
-		"upcomingSeries": "Serie TV in uscita",
-		"genres": "Generi",
-		"newDigitalReleases": "Nuove uscite in digitale",
-		"streamingNow": "In streaming adesso",
-		"TVNetworks": "Network TV"
+	"confirmDialogs": {
+		"confirm": "Conferma",
+		"cancel": "Annulla"
 	},
-	"library": {
-		"missingConfiguration": "Configura Radarr, Sonarr e Jellyfin per guardare e gestire la tua libreria",
-		"available": "Disponibile",
-		"watched": "Guardato",
-		"unavailable": "Non disponibile",
-		"sort": {
-			"byTitle": "Per Titolo"
-		},
-		"content": {
-			"movie": "Film",
-			"show": "Serie TV",
-			"requestContent": "Richiedi",
-			"directedBy": "Diretto da",
-			"releaseDate": "Data di uscita",
-			"budget": "Budget",
-			"status": "Stato",
-			"runtime": "Durata",
-			"castAndCrew": "Cast e Crew",
-			"recommendations": "Suggerimenti",
-			"similarTitles": "Titoli simili"
-		}
+	"dialogs": {
+		"addToRadarrMessage": "Prima di poter recuperare gli episodi, devi aggiungere questa serie a Radarr.",
+		"addToSonarrMessage": "Prima di poter recuperare gli episodi, devi aggiungere questa serie a Sonarr.",
+		"rootFolder": "Cartella principale",
+		"qualityProfile": "Profilo di qualità",
+		"minimumAvailability": "Disponibilità minima",
+		"left": "rimasto",
+		"addToRadarr": "Aggiungi a Radarr",
+		"addToSonarr": "Aggiungi a Sonarr",
+		"deleteSeasonFilesHeader": "Eliminare i file della stagione?",
+		"deleteSeasonFilesBody": "Sei sicuro di voler eliminare tutti i ",
+		"deleteFilesCount": "file?",
+		"confirmDeleteSeasonHeader": "Eliminare i file della stagione?",
+		"confirmDeleteSeasonBody": "Sei sicuro di voler eliminare tutti i ",
+		"confirmCancelDownloadsHeader": "Annullare i download della stagione?",
+		"confirmCancelDownloadsBody": "Sei sicuro di voler annullare tutti i ",
+		"cancelAllDownloads": "Annulla tutti i download",
+		"add": "Aggiungi",
+		"toRadarr": "a Radarr?",
+		"toSonarr": "a Sonarr?",
+		"monitorStrategy": "Strategia di monitoraggio",
+		"monitorEpisodes": "Monitora episodi"
 	},
-	"sources": {},
-	"titleShowcase": {
-		"details": "Dettagli",
-		"watchTrailer": "Guarda il trailer",
-		"releaseDate": "Data di uscita",
-		"directedBy": "Diretto da"
+	"login": {
+		"title": "Accedi a Reiverr",
+		"firstTime": "Se è la prima volta che accedi, verrà creato un nuovo account basato sulle tue credenziali.",
+		"server": "Server",
+		"name": "Nome",
+		"password": "Password",
+		"submit": "Invia",
+		"invalidCredentials": "Credenziali non valide. Per favore, riprova.",
+		"errorOccurred": "Si è verificato un errore"
 	},
 	"settings": {
-		"navbar": {
-			"settings": "Configurazione",
-			"general": "Generale",
-			"integrations": "Integrazioni"
-		},
 		"general": {
 			"userInterface": {
-				"userInterface": "Interfaccia utente",
-				"language": "Lingua",
-				"autoplayTrailers": "Riproduci automaticamente i trailer",
-				"animationDuration": "Durata dell'animazione"
-			},
-			"discovery": {
-				"discovery": "Esplora",
-				"none": "Niente",
-				"region": "Paese",
-				"excludeLibraryItemsFromDiscovery": "Escludi i media presenti nella libreria dalla sezione Esplora",
-				"includedLanguages": "Lingue disponibili",
-				"includedLanguagesDescription": "Filtra i risultati in base alla lingua dell'audio. Inserisci i codici della lingua in formato ISO 639-1 separati da virgola. Lascia vuoto per disabilitare."
+				"animateScrolling": "Anima lo scorrimento",
+				"useCssTransitions": "Usa transizioni CSS",
+				"checkForUpdates": "Controlla aggiornamenti",
+				"language": "Lingua"
 			}
 		},
 		"integrations": {
-			"integrations": "Integrazioni",
-			"integrationsNote": "Nota bene: L'indirizzo (URL) deve essere accessibile dal browser, questo vuol dire che indirizzi come quello interno di docker non funzioneranno. Le chiavi API <span class='font-medium underline'>saranno rese disponibili</span> al browser.",
 			"baseUrl": "Indirizzo (URL)",
 			"apiKey": "Chiave API",
-			"testConnection": "Testa la connessione",
-			"status": {
-				"connected": "Connesso",
-				"disconnected": "Disconnesso"
+			"save": "Salva",
+			"tmdbAccount": "Account TMDB",
+			"connectedTo": "Connesso a",
+			"tmdb": {
+				"connect": "Connetti"
 			},
-			"options": {
-				"options": "Opzioni",
-				"rootFolder": "Percorso",
-				"qualityProfile": "Profilo di qualità",
-				"languageProfile": "Profilo della lingua",
-				"jellyfinUser": "Utente Jellyfin"
-			}
+			"user": "Utente"
+		},
+		"navbar": {
+			"general": "Generale",
+			"integrations": "Integrazioni",
+			"about": "Informazioni",
+			"serie": "Serie",
+			"movies": "Film",
+			"library": "Libreria",
+			"search": "Cerca",
+			"settings": "Impostazioni"
+		},
+		"about": {
+			"userAgent": "User agent",
+			"lastKeyCode": "Ultimo codice tasto",
+			"lastKey": "Ultimo tasto",
+			"tizenMediaKey": "Tasto media Tizen",
+			"logOut": "Disconnetti"
+		}
+	},
+	"discover": {
+		"continueWatching": "Continua a guardare",
+		"recentlyAdded": "Aggiunti di recente",
+		"trending": "In tendenza",
+		"newDigitalReleases": "Nuove uscite in digitale",
+		"upcomingMovies": "Film in uscita",
+		"streamingNow": "In streaming adesso",
+		"upcomingSeries": "Serie TV in uscita"
+	},
+	"library": {
+		"content": {
+			"since": "Da",
+			"ended": "Terminato",
+			"directedBy": "Diretto da",
+			"writtenBy": "Scritto da",
+			"languages": "Lingue",
+			"releaseDate": "Data di uscita",
+			"localFiles": "File locali",
+			"deleteAllFiles": "Elimina tutti i file",
+			"cancelAllDownloads": "Annulla tutti i download",
+			"openInTMDB": "Apri in TMDB",
+			"openInJellyfin": "Apri in Jellyfin",
+			"requestContent": "Richiedi",
+			"season": "Stagione",
+			"episode": "Episodio",
+			"moreInformation": "Maggiori informazioni",
+			"filesSeason": "File della stagione",
+			"deleteFilesSeason": "Elimina file della stagione",
+			"cancelFilesSeason": "Annulla download della stagione",
+			"minLeft": "Minuti rimasti",
+			"played": "Riprodotto",
+			"castAndCrew": "Cast e Crew",
+			"recommendations": "Suggerimenti",
+			"networks": "Network",
+			"lastAirDate": "Ultima data di trasmissione",
+			"moreInformations": "Maggiori informazioni",
+			"play": "Riproduci"
 		},
-		"misc": {
-			"saveChanges": "Salva",
-			"resetToDefaults": "Impostazioni predefinite",
-			"changelog": "Note di rilascio"
+		"LibraryItemContext": {
+			"markWatched": "Segna come visto",
+			"markUnwatched": "Segna come non visto",
+			"openTMDB": "Apri in TMDB",
+			"openJellyfin": "Apri in Jellyfin",
+			"playSeason": "Riproduci stagione",
+			"episode": "Episodio"
 		}
+	},
+	"search": {
+		"placeHolder": "Cerca titoli..."
+	},
+	"personPage": {
+		"born": "Nato"
 	}
-}
+}
\ No newline at end of file
diff --git a/src/lib/pages/EpisodePage.svelte b/src/lib/pages/EpisodePage.svelte
index 5d003846..8ddd94b4 100644
--- a/src/lib/pages/EpisodePage.svelte
+++ b/src/lib/pages/EpisodePage.svelte
@@ -22,6 +22,7 @@
 	import SonarrMediaManagerModal from '../components/MediaManagerModal/SonarrMediaManagerModal.svelte';
 	import ConfirmDialog from '../components/Dialog/ConfirmDialog.svelte';
 	import { tick } from 'svelte';
+	import { _ } from 'svelte-i18n';
 
 	export let id: string; // Series ID
 	export let season: string;
@@ -99,8 +100,8 @@
 
 	function createConfirmDeleteFiles(files: EpisodeFileResource[]) {
 		createModal(ConfirmDialog, {
-			header: 'Delete Season Files?',
-			body: `Are you sure you want to delete all ${files.length} file(s)?`,
+			header: $_('dialogs.deleteSeasonFilesHeader'),
+			body: `${$_('dialogs.deleteSeasonFilesBody')} ${files.length} ${$_('dialogs.deleteFilesCount')} ${files[0]?.seasonNumber}?`,
 			confirm: () =>
 				sonarrApi
 					.deleteSonarrEpisodes(files.map((f) => f.id || -1))
@@ -141,7 +142,7 @@
 			class="h-screen flex flex-col justify-end mx-32 py-16"
 		>
 			<div class="mt-2 text-zinc-200 font-medium text-lg tracking-wider">
-				Season {tmdbEpisode?.season_number} Episode {tmdbEpisode?.episode_number}
+				{$_('library.content.season')} {tmdbEpisode?.season_number} {$_('library.content.episode')} {tmdbEpisode?.episode_number}
 			</div>
 			<HeroInfoTitle title={tmdbEpisode?.name} />
 			<div
@@ -161,7 +162,7 @@
 					</a>
 				</p>
 				<DotFilled />
-				<p class="flex-shrink-0">{tmdbEpisode?.runtime} Minutes</p>
+				<p class="flex-shrink-0">{tmdbEpisode?.runtime} {$_('library.content.minLeft')}</p>
 
 				{#await jellyfinEpisode then episode}
 					{#if episode?.MediaSources?.[0]?.Size}
@@ -181,29 +182,29 @@
 			</div>
 			<Container direction="horizontal" class="flex mt-8 space-x-4">
 				{#await Promise.all([jellyfinEpisode, sonarrEpisode])}
-					<ButtonGhost>Play</ButtonGhost>
-					<ButtonGhost>Manage Media</ButtonGhost>
-					<ButtonGhost>Delete Files</ButtonGhost>
+					<ButtonGhost>{$_('library.content.play')}</ButtonGhost>
+					<ButtonGhost>{$_('library.content.manage')}</ButtonGhost>
+					<ButtonGhost>{$_('library.content.deleteFiles')}</ButtonGhost>
 				{:then [jellyfinEpisode]}
 					{#if jellyfinEpisode?.MediaSources?.length}
 						<Button
 							on:clickOrSelect={() =>
 								jellyfinEpisode?.Id && playerState.streamJellyfinId(jellyfinEpisode.Id)}
 						>
-							Play
+						{$_('library.content.play')}
 							<Play size={19} slot="icon" />
 						</Button>
 						<Button disabled={$markAsLoading} on:clickOrSelect={toggleMarkAs}>
 							{#if isWatched}
-								Mark as Unwatched
+							{$_('library.LibraryItemContext.markUnwatched')}
 							{:else}
-								Mark as Watched
+							{$_('library.LibraryItemContext.markWatched')}
 							{/if}
 							<Check slot="icon" size={19} />
 						</Button>
 					{:else}
 						<Button action={handleRequestEpisode}>
-							Request
+							{$_('library.content.requestContent')}
 							<Plus size={19} slot="icon" />
 						</Button>
 					{/if}
@@ -216,18 +217,18 @@
 				{#await sonarrFiles then files}
 					{#if files?.length}
 						<Button on:clickOrSelect={() => createConfirmDeleteFiles(files)}
-							>Delete Files <Trash slot="icon" size={19} /></Button
+							>{$_('library.content.deleteFiles')} <Trash slot="icon" size={19} /></Button
 						>
 					{/if}
 				{/await}
 
 				{#if PLATFORM_WEB}
 					<Button>
-						Open In TMDB
+						{$_('library.LibraryItemContext.openTMDB')}
 						<ExternalLink size={19} slot="icon-after" />
 					</Button>
 					<Button>
-						Open In Jellyfin
+						{$_('library.LibraryItemContext.openJellyfin')}
 						<ExternalLink size={19} slot="icon-after" />
 					</Button>
 				{/if}
diff --git a/src/lib/pages/ManagePage.svelte b/src/lib/pages/ManagePage.svelte
index 6e2665ac..c554e316 100644
--- a/src/lib/pages/ManagePage.svelte
+++ b/src/lib/pages/ManagePage.svelte
@@ -23,6 +23,8 @@
 	import { scrollIntoView } from '../selectable';
 	import { reiverrApi } from '../apis/reiverr/reiverr-api';
 	import TmdbIntegration from '../components/Integrations/TmdbIntegration.svelte';
+	import { _ } from 'svelte-i18n';
+	import LanguageSettings from '../components/LanguageSettings.svelte';
 
 	enum Tabs {
 		Interface,
@@ -116,7 +118,7 @@
 					'text-primary-500': hasFocus
 				})}
 			>
-				About
+			{$_('settings.navbar.about')}
 			</span>
 		</Container>
 	</Container>
@@ -124,7 +126,7 @@
 	<Container class="flex-1 grid w-full overflow-y-auto scrollbar-hide relative pb-16 px-32">
 		<Tab {...tab} tab={Tabs.Interface} class="w-full">
 			<div class="flex items-center justify-between text-lg font-medium text-secondary-100 py-2">
-				<label class="mr-2">Animate scrolling</label>
+				<label class="mr-2">{$_('settings.general.userInterface.animateScrolling')}</label>
 				<Toggle
 					checked={$localSettings.animateScrolling}
 					on:change={({ detail }) =>
@@ -132,7 +134,7 @@
 				/>
 			</div>
 			<div class="flex items-center justify-between text-lg font-medium text-secondary-100 py-2">
-				<label class="mr-2">Use CSS Transitions</label>
+				<label class="mr-2">{$_('settings.general.userInterface.useCssTransitions')}</label>
 				<Toggle
 					checked={$localSettings.useCssTransitions}
 					on:change={({ detail }) =>
@@ -140,13 +142,25 @@
 				/>
 			</div>
 			<div class="flex items-center justify-between text-lg font-medium text-secondary-100 py-2">
-				<label class="mr-2">Check for Updates</label>
+				<label class="mr-2">{$_('settings.general.userInterface.checkForUpdates')}</label>
 				<Toggle
 					checked={$localSettings.checkForUpdates}
 					on:change={({ detail }) =>
 						localSettings.update((p) => ({ ...p, checkForUpdates: detail }))}
 				/>
 			</div>
+
+
+			<div class="flex items-center justify-between text-lg font-medium text-secondary-100 py-2">
+				<label class="mr-2">{$_('settings.general.userInterface.language')}</label>
+				<LanguageSettings 
+					on:change={({ detail }) => {
+					console.log('Language changed to:', detail.language);
+					}}
+				/>
+			</div>
+
+
 		</Tab>
 
 		<Tab {...tab} tab={Tabs.Account} class="space-y-16">
@@ -216,7 +230,7 @@
 			</div>
 
 			<div>
-				<h1 class="font-semibold text-2xl text-secondary-100 mb-8">Integrations</h1>
+				<h1 class="font-semibold text-2xl text-secondary-100 mb-8">{$_('settings.navbar.integrations')}</h1>
 				<Container direction="horizontal" class="gap-16 grid grid-cols-2">
 					<Container class="flex flex-col space-y-16">
 						<Container
@@ -225,7 +239,7 @@
 						>
 							<h1 class="mb-4 header1">Sonarr</h1>
 							<SonarrIntegration let:stale let:handleSave>
-								<Button disabled={!stale} type="primary-dark" action={handleSave}>Save</Button>
+								<Button disabled={!stale} type="primary-dark" action={handleSave}>{$_('settings.integrations.save')}</Button>
 							</SonarrIntegration>
 						</Container>
 
@@ -235,7 +249,7 @@
 						>
 							<h1 class="mb-4 header1">Radarr</h1>
 							<RadarrIntegration let:stale let:handleSave>
-								<Button disabled={!stale} type="primary-dark" action={handleSave}>Save</Button>
+								<Button disabled={!stale} type="primary-dark" action={handleSave}>{$_('settings.integrations.save')}</Button>
 							</RadarrIntegration>
 						</Container>
 					</Container>
@@ -245,7 +259,7 @@
 							class="bg-primary-800 rounded-xl p-8"
 							on:enter={scrollIntoView({ vertical: 64 })}
 						>
-							<h1 class="mb-4 header1">Tmdb Account</h1>
+							<h1 class="mb-4 header1">{$_('settings.integrations.tmdbAccount')}</h1>
 							<TmdbIntegration let:connected>
 								{#if !connected}
 									<div class="flex space-x-4 mt-4">
@@ -254,7 +268,7 @@
 											iconAfter={ArrowRight}
 											on:clickOrSelect={() => createModal(TmdbIntegrationConnectDialog, {})}
 										>
-											Connect
+										{$_('settings.integrations.tmdb.connect')}
 										</Button>
 									</div>
 								{/if}
@@ -304,7 +318,7 @@
 								let:handleSave
 								let:stale
 							>
-								<Button disabled={!stale} type="primary-dark" action={handleSave}>Save</Button>
+								<Button disabled={!stale} type="primary-dark" action={handleSave}>{$_('settings.integrations.save')}</Button>
 							</JellyfinIntegration>
 						</Container>
 					</Container>
@@ -322,14 +336,14 @@
 			<div>
 				meta.env: {JSON.stringify(import.meta.env)}
 			</div>
-			User agent: {window?.navigator?.userAgent}
-			<div>Last key code: {lastKeyCode}</div>
-			<div>Last key: {lastKey}</div>
+			{$_('settings.about.userAgent')} {window?.navigator?.userAgent}
+			<div>{$_('settings.about.lastKeyCode')} {lastKeyCode}</div>
+			<div>{$_('settings.about.lastKey')} {lastKey}</div>
 			{#if tizenMediaKey}
-				<div>Tizen media key: {tizenMediaKey}</div>
+				<div>{$_('settings.about.tizenMediaKey')} {tizenMediaKey}</div>
 			{/if}
 			<div class="flex space-x-4 mt-4">
-				<Button on:clickOrSelect={handleLogOut} class="hover:bg-red-500">Log Out</Button>
+				<Button on:clickOrSelect={handleLogOut} class="hover:bg-red-500">{$_('settings.about.logOut')}</Button>
 			</div>
 		</Tab>
 	</Container>
diff --git a/src/lib/pages/MoviePage.svelte b/src/lib/pages/MoviePage.svelte
index aee1cda2..042738c1 100644
--- a/src/lib/pages/MoviePage.svelte
+++ b/src/lib/pages/MoviePage.svelte
@@ -32,6 +32,7 @@
 	import { capitalize, formatSize } from '../utils';
 	import ConfirmDialog from '../components/Dialog/ConfirmDialog.svelte';
 	import { TMDB_BACKDROP_SMALL } from '../constants.js';
+	import { _ } from 'svelte-i18n';
 
 	export let id: string;
 	const tmdbId = Number(id);
@@ -91,8 +92,8 @@
 
 	function createConfirmDeleteSeasonDialog(files: MovieFileResource[]) {
 		createModal(ConfirmDialog, {
-			header: 'Delete Season Files?',
-			body: `Are you sure you want to delete all ${files.length} file(s)?`, // TODO: These messages  could be better, for series too
+			header: $_('library.content.confirmDeleteSeasonHeader'),
+			body: $_('library.content.confirmDeleteSeasonBody', { count: files.length }), // TODO: These messages  could be better, for series too
 			confirm: () =>
 				radarrApi
 					.deleteFiles(files.map((f) => f.id || -1))
@@ -102,8 +103,8 @@
 
 	function createConfirmCancelDownloadsDialog(downloads: MovieDownload[]) {
 		createModal(ConfirmDialog, {
-			header: 'Cancel Season Downloads?',
-			body: `Are you sure you want to cancel all ${downloads.length} download(s)?`, // TODO: These messages  could be better, for series too
+			header: $_('library.content.confirmCancelDownloadsHeader'),
+			body: $_('library.content.confirmCancelDownloadsBody', { count: downloads.length }), // TODO: These messages  could be better, for series too
 			confirm: () =>
 				radarrApi
 					.cancelDownloads(downloads.map((f) => f.id || -1))
@@ -176,12 +177,12 @@
 									on:clickOrSelect={() =>
 										jellyfinItem.Id && playerState.streamJellyfinId(jellyfinItem.Id)}
 								>
-									Play
+								{$_('library.content.play')}
 									<Play size={19} slot="icon" />
 								</Button>
 							{/if}
 							<Button class="mr-4" action={handleRequest}>
-								Request
+								{$_('library.content.requestContent')}
 								<Plus size={19} slot="icon" />
 							</Button>
 							<!--{#if radarrItem}-->
@@ -205,11 +206,11 @@
 							<!--{/if}-->
 							{#if PLATFORM_WEB}
 								<Button class="mr-4">
-									Open In TMDB
+									{$_('library.content.openInTMDB')}
 									<ExternalLink size={19} slot="icon-after" />
 								</Button>
 								<Button class="mr-4">
-									Open In Jellyfin
+									{$_('library.content.openInJellyfin')}
 									<ExternalLink size={19} slot="icon-after" />
 								</Button>
 							{/if}
@@ -221,7 +222,7 @@
 		<Container on:enter={scrollIntoView({ top: 0 })} class="">
 			{#await tmdbMovie then movie}
 				<Carousel scrollClass="px-32" class="mb-8">
-					<div slot="header">Show Cast</div>
+					<div slot="header">{$_('library.content.castAndCrew')}</div>
 					{#each movie?.credits?.cast?.slice(0, 15) || [] as credit}
 						<TmdbPersonCard on:enter={scrollIntoView({ horizontal: 128 })} tmdbCredit={credit} />
 					{/each}
@@ -229,7 +230,7 @@
 			{/await}
 			{#await recommendations then recommendations}
 				<Carousel scrollClass="px-32" class="mb-8">
-					<div slot="header">Recommendations</div>
+					<div slot="header">{$_('library.content.recommendations')}</div>
 					{#each recommendations || [] as recommendation}
 						<TmdbCard item={recommendation} on:enter={scrollIntoView({ horizontal: 128 })} />
 					{/each}
@@ -238,11 +239,11 @@
 		</Container>
 		{#await tmdbMovie then movie}
 			<Container class="flex-1 bg-secondary-950 pt-8 px-32" on:enter={scrollIntoView({ top: 0 })}>
-				<h1 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">More Information</h1>
+				<h1 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">{$_('library.content.moreInformation')}</h1>
 				<div class="text-zinc-300 font-medium text-lg flex flex-wrap">
 					<div class="flex-1">
 						<div class="mb-8">
-							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Directed By</h2>
+							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.directedBy')}</h2>
 							<div>
 								{movie?.credits.crew
 									?.filter((c) => c.job === 'Director')
@@ -251,7 +252,7 @@
 							</div>
 						</div>
 						<div class="mb-8">
-							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Written By</h2>
+							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.writtenBy')}</h2>
 							<div>
 								{movie?.credits.crew
 									?.filter((c) => c.job === 'Writer')
@@ -262,13 +263,13 @@
 					</div>
 					<div class="flex-1">
 						<div class="mb-8">
-							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Languages</h2>
+							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.languages')}</h2>
 							<div>
 								{movie?.spoken_languages?.map((language) => language.name).join(', ')}
 							</div>
 						</div>
 						<div class="mb-8">
-							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">Release Date</h2>
+							<h2 class="uppercase text-sm font-semibold text-zinc-500 mb-0.5">{$_('library.content.releaseDate')}</h2>
 							<div>
 								{new Date(movie?.release_date || 0).toLocaleDateString('en-US', {
 									year: 'numeric',
@@ -287,7 +288,7 @@
 					class="flex-1 bg-secondary-950 pt-8 pb-16 px-32 flex flex-col"
 					on:enter={scrollIntoView({ top: 32 })}
 				>
-					<h1 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">Local Files</h1>
+					<h1 class="font-medium tracking-wide text-2xl text-zinc-300 mb-8">{$_('library.content.localFiles')}</h1>
 					<div class="space-y-8">
 						<Container direction="grid" gridCols={2} class="grid grid-cols-2 gap-8">
 							{#each downloads as download}
@@ -377,13 +378,13 @@
 							{#if files?.length}
 								<Button on:clickOrSelect={() => createConfirmDeleteSeasonDialog(files)}>
 									<Trash size={19} slot="icon" />
-									Delete All Files
+									{$_('library.content.deleteAllFiles')}
 								</Button>
 							{/if}
 							{#if downloads?.length}
 								<Button on:clickOrSelect={() => createConfirmCancelDownloadsDialog(downloads)}>
 									<Cross1 size={19} slot="icon" />
-									Cancel All Downloads
+									{$_('library.content.cancelAllDownloads')}
 								</Button>
 							{/if}
 						</Container>
diff --git a/src/lib/pages/MoviesHomePage.svelte b/src/lib/pages/MoviesHomePage.svelte
index 0fd16860..3046781b 100644
--- a/src/lib/pages/MoviesHomePage.svelte
+++ b/src/lib/pages/MoviesHomePage.svelte
@@ -11,6 +11,7 @@
 	import TmdbCard from '../components/Card/TmdbCard.svelte';
 	import { navigate } from '../components/StackRouter/StackRouter';
 	import DetachedPage from '../components/DetachedPage/DetachedPage.svelte';
+	import { _ } from 'svelte-i18n';
 
 	const continueWatching = jellyfinApi.getContinueWatching('movie');
 	const recentlyAdded = jellyfinApi.getRecentlyAdded('movie');
@@ -72,7 +73,7 @@
 		{#await continueWatching then continueWatching}
 			{#if continueWatching?.length}
 				<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-					<span slot="header">Continue Watching</span>
+					<span slot="header">{$_('discover.continueWatching')}</span>
 					{#each continueWatching as item (item.Id)}
 						<JellyfinCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 					{/each}
@@ -81,7 +82,7 @@
 				{#await recentlyAdded then recentlyAdded}
 					{#if recentlyAdded?.length}
 						<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-							<span slot="header">Recently Added</span>
+							<span slot="header">{$_('discover.recentlyAdded')}</span>
 							{#each recentlyAdded as item (item.Id)}
 								<JellyfinCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 							{/each}
@@ -93,7 +94,7 @@
 
 		{#await popularMovies then popularMovies}
 			<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-				<span slot="header">Popular</span>
+				<span slot="header">{$_('discover.trending')}</span>
 				{#each popularMovies as item}
 					<TmdbCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 				{/each}
@@ -115,7 +116,7 @@
 
 		{#await newDigitalReleases then nowStreaming}
 			<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-				<span slot="header">New Digital Releases</span>
+				<span slot="header">{$_('discover.newDigitalReleases')}</span>
 				{#each nowStreaming as item}
 					<TmdbCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 				{/each}
@@ -137,7 +138,7 @@
 
 		{#await upcomingMovies then upcomingSeries}
 			<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-				<span slot="header">Upcoming Movies</span>
+				<span slot="header">{$_('discover.upcomingMovies')}</span>
 				{#each upcomingSeries as item}
 					<TmdbCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 				{/each}
diff --git a/src/lib/pages/PersonPage.svelte b/src/lib/pages/PersonPage.svelte
index 5aafe5b2..abbf73d0 100644
--- a/src/lib/pages/PersonPage.svelte
+++ b/src/lib/pages/PersonPage.svelte
@@ -8,6 +8,7 @@
 	import TmdbCard from '../components/Card/TmdbCard.svelte';
 	import Container from '../../Container.svelte';
 	import { scrollIntoView } from '../selectable';
+	import { _ } from 'svelte-i18n';
 
 	export let id: string;
 	$: person = tmdbApi.getPerson(Number(id));
@@ -63,7 +64,7 @@
 						class="flex items-center gap-1 uppercase text-zinc-300 font-semibold tracking-wider mt-2 text-lg"
 					>
 						<p class="flex-shrink-0">
-							Born {new Date(person.birthday || 0).toLocaleDateString('en-US', {
+							{$_('personPage.born')} {new Date(person.birthday || 0).toLocaleDateString('en-US', {
 								year: 'numeric',
 								month: 'long',
 								day: 'numeric'
diff --git a/src/lib/pages/SearchPage.svelte b/src/lib/pages/SearchPage.svelte
index 77729cb9..1dc1ff71 100644
--- a/src/lib/pages/SearchPage.svelte
+++ b/src/lib/pages/SearchPage.svelte
@@ -10,6 +10,7 @@
 	import AnimateScale from '../components/AnimateScale.svelte';
 	import type { Readable } from 'svelte/store';
 	import DetachedPage from '../components/DetachedPage/DetachedPage.svelte';
+	import { _ } from 'svelte-i18n';
 
 	let searchQuery = '';
 	let typingTimeout: ReturnType<typeof setTimeout> | undefined = undefined;
@@ -65,7 +66,7 @@
 				class="bg-transparent outline-none placeholder:text-secondary-400"
 				bind:value={searchQuery}
 				on:input={() => handleInput(searchQuery)}
-				placeholder="Search titles..."
+				placeholder={$_('search.placeHolder')}
 				bind:this={searchInput}
 			/>
 		</Container>
diff --git a/src/lib/pages/SeriesHomePage.svelte b/src/lib/pages/SeriesHomePage.svelte
index 07492302..bb668e14 100644
--- a/src/lib/pages/SeriesHomePage.svelte
+++ b/src/lib/pages/SeriesHomePage.svelte
@@ -12,6 +12,7 @@
 	import { navigate } from '../components/StackRouter/StackRouter';
 	import { TMDB_SERIES_GENRES } from '../apis/tmdb/tmdb-api.js';
 	import DetachedPage from '../components/DetachedPage/DetachedPage.svelte';
+	import { _ } from 'svelte-i18n';
 
 	const continueWatching = jellyfinApi.getContinueWatchingSeries();
 	const recentlyAdded = jellyfinApi.getRecentlyAdded('series');
@@ -65,7 +66,7 @@
 		{#await continueWatching then continueWatching}
 			{#if continueWatching?.length}
 				<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-					<span slot="header">Continue Watching</span>
+					<span slot="header">{$_('discover.continueWatching')}</span>
 					{#each continueWatching as item (item.Id)}
 						<JellyfinCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 					{/each}
@@ -74,7 +75,7 @@
 				{#await recentlyAdded then recentlyAdded}
 					{#if recentlyAdded?.length}
 						<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-							<span slot="header">Recently Added</span>
+							<span slot="header">{$_('discover.recentlyAdded')}</span>
 							{#each recentlyAdded as item (item.Id)}
 								<JellyfinCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 							{/each}
@@ -86,7 +87,7 @@
 
 		{#await popular then popular}
 			<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-				<span slot="header">Popular</span>
+				<span slot="header">{$_('discover.trending')}</span>
 				{#each popular as item}
 					<TmdbCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 				{/each}
@@ -108,7 +109,7 @@
 
 		{#await nowStreaming then nowStreaming}
 			<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-				<span slot="header">Now Streaming</span>
+				<span slot="header">{$_('discover.streamingNow')}</span>
 				{#each nowStreaming as item}
 					<TmdbCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 				{/each}
@@ -130,7 +131,7 @@
 
 		{#await upcomingSeries then upcomingSeries}
 			<Carousel scrollClass="px-32" on:enter={scrollIntoView({ vertical: 128 })}>
-				<span slot="header">Upcoming Series</span>
+				<span slot="header">{$_('discover.upcomingSeries')}</span>
 				{#each upcomingSeries as item}
 					<TmdbCard on:enter={scrollIntoView({ horizontal: 128 })} size="lg" {item} />
 				{/each}
diff --git a/src/lib/stores/localstorage.store.ts b/src/lib/stores/localstorage.store.ts
index 95af4a16..67cd86a7 100644
--- a/src/lib/stores/localstorage.store.ts
+++ b/src/lib/stores/localstorage.store.ts
@@ -35,9 +35,11 @@ export const localSettings = createLocalStorageStore<{
 	useCssTransitions: boolean;
 	checkForUpdates: boolean;
 	skippedVersion: string;
+	language: string;
 }>('settings', {
 	animateScrolling: true,
 	useCssTransitions: true,
 	checkForUpdates: true,
-	skippedVersion: ''
+	skippedVersion: '',
+	language: 'en'
 });

From d5731268e78df437e2f323464d777860050e92c8 Mon Sep 17 00:00:00 2001
From: Phelra <40712317+Phelra@users.noreply.github.com>
Date: Wed, 28 Aug 2024 17:13:03 +0200
Subject: [PATCH 2/5] feat: Implement infinite scroll in LibraryPage

---
 src/lib/pages/LibraryPage.svelte | 59 +++++++++++++++++++++++++++++---
 1 file changed, 55 insertions(+), 4 deletions(-)

diff --git a/src/lib/pages/LibraryPage.svelte b/src/lib/pages/LibraryPage.svelte
index 3ccd0f2e..a23018b9 100644
--- a/src/lib/pages/LibraryPage.svelte
+++ b/src/lib/pages/LibraryPage.svelte
@@ -13,6 +13,8 @@
 	import type { ComponentProps } from 'svelte';
 	import TmdbCard from '../components/Card/TmdbCard.svelte';
 	import { tmdbApi, type TmdbMovie2, type TmdbSeries2 } from '../apis/tmdb/tmdb-api';
+	import { writable } from 'svelte/store';
+	import { onMount } from 'svelte';
 
 	const libraryItemsP = jellyfinApi.getLibraryItems();
 	const sonarrDownloads: Promise<TmdbSeries2[]> = sonarrApi
@@ -44,6 +46,53 @@
 			userId: import.meta.env.VITE_JELLYFIN_USER_ID
 		}
 	}));
+
+	const displayedItems = writable([]);
+	let currentIndex = 0;
+	let allItems = [];
+
+	const ITEMS_PER_ROW = 3;
+	const ITEMS_PER_COLUMN = 4;
+	const ITEMS_PER_PAGE = ITEMS_PER_ROW * ITEMS_PER_COLUMN;
+
+	const loadMoreItems = () => {
+		const nextIndex = currentIndex + ITEMS_PER_PAGE;
+		const newItems = allItems.slice(currentIndex, nextIndex);
+		if (newItems.length > 0) {
+			displayedItems.update(curr => [...curr, ...newItems]);
+			currentIndex = nextIndex;
+		}
+	};
+
+	const observerCallback = (entries) => {
+		entries.forEach(entry => {
+			if (entry.isIntersecting) {
+				loadMoreItems();
+			}
+		});
+	};
+
+	onMount(() => {
+		const observer = new IntersectionObserver(observerCallback, {
+			root: null,
+			rootMargin: '0px',
+			threshold: 1.0
+		});
+		const sentinel = document.querySelector('#sentinel');
+		if (sentinel) {
+			observer.observe(sentinel);
+		}
+		return () => {
+			if (sentinel) {
+				observer.unobserve(sentinel);
+			}
+		};
+	});
+
+	libraryItemsP.then(items => {
+		allItems = items;
+		loadMoreItems();
+	});
 </script>
 
 <DetachedPage class="py-16 space-y-8">
@@ -66,10 +115,10 @@
 			<div class="header2">Library</div>
 		</div>
 		<CardGrid>
-			{#await libraryItemsP}
+			{#if $displayedItems.length === 0}
 				<CarouselPlaceholderItems />
-			{:then items}
-				{#each items as item}
+			{:else}
+				{#each $displayedItems as item}
 					<JellyfinCard
 						{item}
 						on:enter={scrollIntoView({ all: 64 })}
@@ -77,7 +126,9 @@
 						navigateWithType
 					/>
 				{/each}
-			{/await}
+			{/if}
 		</CardGrid>
+		<!-- Sentinel div for intersection observer -->
+		<div id="sentinel" style="height: 1px;"></div>
 	</div>
 </DetachedPage>

From 262c12f5c5778bdfbee5409723ecb9fd8226ddf1 Mon Sep 17 00:00:00 2001
From: Phelra <raphael.bidault@gmail.com>
Date: Fri, 30 Aug 2024 20:50:24 +0200
Subject: [PATCH 3/5] add: new translations

---
 .../Dialog/CreateOrEditProfileModal.svelte    | 23 +++++++-------
 src/lib/lang/de.json                          | 28 +++++++++++++++--
 src/lib/lang/en.json                          | 31 ++++++++++++++++---
 src/lib/lang/es.json                          | 28 +++++++++++++++--
 src/lib/lang/fr.json                          | 27 ++++++++++++++--
 src/lib/lang/it.json                          | 28 +++++++++++++++--
 src/lib/pages/ManagePage.svelte               | 17 +++++-----
 src/lib/pages/UsersPage.svelte                |  5 +--
 8 files changed, 154 insertions(+), 33 deletions(-)

diff --git a/src/lib/components/Dialog/CreateOrEditProfileModal.svelte b/src/lib/components/Dialog/CreateOrEditProfileModal.svelte
index bac0bcb1..86fd009b 100644
--- a/src/lib/components/Dialog/CreateOrEditProfileModal.svelte
+++ b/src/lib/components/Dialog/CreateOrEditProfileModal.svelte
@@ -18,6 +18,7 @@
 	import { navigate } from '../StackRouter/StackRouter';
 	import Toggle from '../Toggle.svelte';
 	import { get } from 'svelte/store';
+	import { _ } from 'svelte-i18n';
 
 	enum Tabs {
 		EditProfile,
@@ -166,11 +167,11 @@
 <Dialog class="grid" size={'dynamic'}>
 	<Tab {...tab} tab={Tabs.EditProfile} class="space-y-4 max-w-lg">
 		<h1 class="header2">
-			{createNew ? 'Create Account' : 'Edit Profile'}
-		</h1>
-		<TextField bind:value={name}>name</TextField>
+			{createNew ? $_('settings.profile.createProfile') : $_('settings.profile.editProfile')}
+		</h1>		
+		<TextField bind:value={name}>{$_('settings.profile.name')}</TextField>
 		<SelectField value={profilePictureTitle} on:clickOrSelect={() => tab.set(Tabs.ProfilePictures)}>
-			Profile Picture
+			{$_('settings.profile.profilePicture')}
 		</SelectField>
 		{#if !createNew}
 			<Container direction="horizontal" class="flex space-x-4 items-end">
@@ -179,7 +180,7 @@
 					bind:value={oldPassword}
 					type={oldPasswordVisible ? 'text' : 'password'}
 				>
-					Old Password
+				{$_('settings.profile.oldPassword')}
 				</TextField>
 				<IconToggle
 					on:clickOrSelect={() => (oldPasswordVisible = !oldPasswordVisible)}
@@ -193,7 +194,7 @@
 				bind:value={newPassword}
 				type={newPasswordVisible ? 'text' : 'password'}
 			>
-				New Password
+			{$_('settings.profile.newPassword')}
 			</TextField>
 			<IconToggle
 				on:clickOrSelect={() => (newPasswordVisible = !newPasswordVisible)}
@@ -202,7 +203,7 @@
 		</Container>
 		{#if isAdmin || admin}
 			<div class="flex justify-between">
-				<label>Admin</label>
+				<label>{$_('settings.profile.admin')}</label>
 				<Toggle bind:checked={isAdmin}>Admin</Toggle>
 			</div>
 		{/if}
@@ -211,7 +212,7 @@
 		{/if}
 		<Container direction="horizontal" class="flex space-x-4 pt-4 *:flex-1">
 			{#if !createNew}
-				<Button type="primary-dark" disabled={!stale} action={save}>Save</Button>
+				<Button type="primary-dark" disabled={!stale} action={save}>{$_('settings.profile.save')}</Button>
 				<Button
 					type="primary-dark"
 					icon={Trash}
@@ -220,10 +221,10 @@
 							header: 'Delete Account',
 							body: 'Are you sure you want to delete your account?',
 							confirm: handleDeleteAccount
-						})}>Delete Account</Button
+						})}>{$_('settings.profile.deleteAccount')}</Button
 				>
 			{:else}
-				<Button type="primary-dark" disabled={!complete} action={create}>Create</Button>
+				<Button type="primary-dark" disabled={!complete} action={create}>{$_('settings.accounts.create')}</Button>
 			{/if}
 		</Container>
 	</Tab>
@@ -236,7 +237,7 @@
 			detail.stopPropagation();
 		}}
 	>
-		<h1 class="header2 mb-6">Select Profile Picture</h1>
+		<h1 class="header2 mb-6">{$_('settings.profile.profilePicture')}</h1>
 		<Container direction="grid" gridCols={3} class="grid grid-cols-3 gap-4 w-max">
 			<ProfileIcon
 				url={profilePictures.ana}
diff --git a/src/lib/lang/de.json b/src/lib/lang/de.json
index f7a203fb..1422ed2b 100644
--- a/src/lib/lang/de.json
+++ b/src/lib/lang/de.json
@@ -53,7 +53,9 @@
 		"password": "Passwort",
 		"submit": "Einreichen",
 		"invalidCredentials": "Ungültige Anmeldeinformationen. Bitte versuchen Sie es erneut.",
-		"errorOccurred": "Ein Fehler ist aufgetreten"
+		"errorOccurred": "Ein Fehler ist aufgetreten",
+		"whoIsWatching": "Wer schaut?",
+		"removeAllAccounts": "Alle Konten entfernen"
 	},
 	"settings": {
 		"general": {
@@ -91,7 +93,29 @@
 			"lastKey": "Letzter Schlüssel",
 			"tizenMediaKey": "Tizen Media Key",
 			"logOut": "Ausloggen"
-		}
+		},
+		"accounts": {
+			"accounts": "Konten",
+			"myprofile": "Mein Profil",
+			"loginAs": "Angemeldet als",
+			"logOut": "Abmelden",
+			"create": "Erstellen",
+			"newaccount": "Neues Konto",
+			"serverAccounts": "Serverkonten"
+		},
+		"profile": {
+				"createProfile": "Ein Konto erstellen",
+				"editProfile": "Profil Bearbeiten",
+				"name": "Name",
+				"profilePicture": "Profilbild",
+				"custom": "Benutzerdefiniert",
+				"oldPassword": "Altes Passwort",
+				"newPassword": "Neues Passwort",
+				"admin": "Administrator",
+				"save": "Speichern",
+				"deleteAccount": "Konto Löschen"
+			}
+
 	},
 	"discover": {
 		"continueWatching": "Weiter ansehen",
diff --git a/src/lib/lang/en.json b/src/lib/lang/en.json
index a2804246..6ea2bff8 100644
--- a/src/lib/lang/en.json
+++ b/src/lib/lang/en.json
@@ -54,7 +54,9 @@
 		"password": "Password",
 		"submit": "Submit",
 		"invalidCredentials": "Invalid credentials. Please try again.",
-		"errorOccurred": "Error occurred"
+		"errorOccurred": "Error occurred",
+		"whoIsWatching": "Who is watching ?",
+		"removeAllAccounts": "Remove all accounts"
 	},
 	"settings": {
 		"general": {
@@ -90,9 +92,30 @@
 			"userAgent": "User agent",
 			"lastKeyCode": "Last key code",
 			"lastKey": "Last key",
-			"tizenMediaKey": "Tizen media key",
-			"logOut": "Log Out"
-		}
+			"tizenMediaKey": "Tizen media key"
+		},
+		"accounts": {
+			"accounts": "Accounts",
+			"myprofile": "My Profile",
+			"loginAs": "Logged in as",
+			"logOut": "Log Out",
+			"create": "Create",
+			"newaccount": "New account",
+			"serverAccounts": "Serveur Accounts"
+			
+		},
+			"profile": {
+				"createProfile": "Create an account",
+				"editProfile": "Edit Profile",
+				"name": "Name",
+				"profilePicture": "Profile Picture",
+				"custom": "Custom",
+				"oldPassword": "Old Password",
+				"newPassword": "New Password",
+				"admin": "Admin",
+				"save": "Save",
+				"deleteAccount": "Delete Account"
+			}
 	},
 	"discover": {
 		"continueWatching": "Continue Watching",
diff --git a/src/lib/lang/es.json b/src/lib/lang/es.json
index 6e0be3f6..5a7d7d52 100644
--- a/src/lib/lang/es.json
+++ b/src/lib/lang/es.json
@@ -46,7 +46,9 @@
 		"password": "Contraseña",
 		"submit": "Enviar",
 		"invalidCredentials": "Credenciales inválidas. Por favor, inténtalo de nuevo.",
-		"errorOccurred": "Ocurrió un error"
+		"errorOccurred": "Ocurrió un error",
+		"whoIsWatching": "¿Quién está viendo?",
+		"removeAllAccounts": "Eliminar todas las cuentas"
 	},
 	"settings": {
 		"general": {
@@ -84,7 +86,29 @@
 			"lastKey": "Última tecla",
 			"tizenMediaKey": "Tecla de medios Tizen",
 			"logOut": "Cerrar sesión"
-		}
+		},
+		"accounts": {
+			"accounts": "Cuentas",
+			"myprofile": "Mi Perfil",
+			"loginAs": "Conectado como",
+			"logOut": "Cerrar sesión",
+			"create": "Crear",
+			"newaccount": "Nueva cuenta",
+			"serverAccounts": "Cuentas del Servidor"
+		},
+		"profile": {
+				"createProfile": "Crear una cuenta",
+				"editProfile": "Editar Perfil",
+				"name": "Nombre",
+				"profilePicture": "Foto de Perfil",
+				"custom": "Personalizado",
+				"oldPassword": "Contraseña Antigua",
+				"newPassword": "Nueva Contraseña",
+				"admin": "Administrador",
+				"save": "Guardar",
+				"deleteAccount": "Eliminar Cuenta"
+			}
+
 	},
 	"discover": {
 		"continueWatching": "Seguir viendo",
diff --git a/src/lib/lang/fr.json b/src/lib/lang/fr.json
index 09b4afa8..6cae91d5 100644
--- a/src/lib/lang/fr.json
+++ b/src/lib/lang/fr.json
@@ -54,7 +54,9 @@
 		"password": "Mot de passe",
 		"submit": "Connexion",
 		"invalidCredentials": "Identifiants invalides. Veuillez réessayer.",
-		"errorOccurred": "Une erreur s'est produite"
+		"errorOccurred": "Une erreur s'est produite",
+		"whoIsWatching": "Qui regarde ?",
+		"removeAllAccounts": "Supprimer tous les comptes"
 	},
 	"settings": {
 		"general": {
@@ -92,7 +94,28 @@
 			"lastKey": "Dernière touche",
 			"tizenMediaKey": "Touche média Tizen",
 			"logOut": "Déconnexion"
-		}
+		},
+		"accounts": {
+			"accounts": "Comptes",
+			"myprofile": "Mon Profil",
+			"loginAs": "Connecté en tant que",
+			"logOut": "Déconnexion",
+			"create": "Créer",
+			"newaccount": "Nouveau compte",
+			"serverAccounts": "Gestion des comptes"
+		},
+		"profile": {
+			"createProfile": "Créer un compte",
+				"editProfile": "Modifier le profil",
+				"name": "Nom",
+				"profilePicture": "Photo de profil",
+				"custom": "Personnalisé",
+				"oldPassword": "Ancien mot de passe",
+				"newPassword": "Nouveau mot de passe",
+				"admin": "Administrateur",
+				"save": "Enregistrer",
+				"deleteAccount": "Supprimer le compte"
+			}
 	},
 	"discover": {
 		"continueWatching": "Continuer à regarder",
diff --git a/src/lib/lang/it.json b/src/lib/lang/it.json
index 2cd7c7ef..5d895102 100644
--- a/src/lib/lang/it.json
+++ b/src/lib/lang/it.json
@@ -53,7 +53,9 @@
 		"password": "Password",
 		"submit": "Invia",
 		"invalidCredentials": "Credenziali non valide. Per favore, riprova.",
-		"errorOccurred": "Si è verificato un errore"
+		"errorOccurred": "Si è verificato un errore",
+		"whoIsWatching": "Chi sta guardando?",
+		"removeAllAccounts": "Rimuovi tutti gli account"
 	},
 	"settings": {
 		"general": {
@@ -91,7 +93,29 @@
 			"lastKey": "Ultimo tasto",
 			"tizenMediaKey": "Tasto media Tizen",
 			"logOut": "Disconnetti"
-		}
+		},
+		"accounts": {
+			"accounts": "Conti",
+			"myprofile": "Il Mio Profilo",
+			"loginAs": "Connesso come",
+			"logOut": "Disconnettersi",
+			"create": "Creare",
+			"newaccount": "Nuovo account",
+			"serverAccounts": "Conti del Server"
+		},
+		"profile": {
+				"createProfile": "Creare un account",
+				"editProfile": "Modifica Profilo",
+				"name": "Nome",
+				"profilePicture": "Immagine del Profilo",
+				"custom": "Personalizzato",
+				"oldPassword": "Vecchia Password",
+				"newPassword": "Nuova Password",
+				"admin": "Amministratore",
+				"save": "Salva",
+				"deleteAccount": "Elimina Account"
+			}
+
 	},
 	"discover": {
 		"continueWatching": "Continua a guardare",
diff --git a/src/lib/pages/ManagePage.svelte b/src/lib/pages/ManagePage.svelte
index c554e316..25d77a86 100644
--- a/src/lib/pages/ManagePage.svelte
+++ b/src/lib/pages/ManagePage.svelte
@@ -103,7 +103,7 @@
 					'text-primary-500': hasFocus
 				})}
 			>
-				Accounts
+			{$_('settings.accounts.accounts')}
 			</span>
 		</Container>
 		<Container
@@ -166,7 +166,7 @@
 		<Tab {...tab} tab={Tabs.Account} class="space-y-16">
 			<div>
 				<Container class="bg-primary-800 rounded-xl p-8" on:enter={scrollIntoView({ top: 9999 })}>
-					<h1 class="header1 mb-4">My Profile</h1>
+					<h1 class="header1 mb-4">{$_('settings.accounts.myprofile')}</h1>
 					<SelectField
 						class="mb-4"
 						value={$user?.name || ''}
@@ -178,16 +178,17 @@
 								});
 						}}
 					>
-						Logged in as
+					{$_('settings.accounts.loginAs')}
 						<Pencil2 slot="icon" let:size let:iconClass {size} class={classNames(iconClass)} />
 					</SelectField>
 					<Container direction="horizontal" class="flex space-x-4">
-						<Button type="primary-dark" icon={Exit} on:clickOrSelect={handleLogOut}>Log Out</Button>
+						<Button type="primary-dark" icon={Exit} on:clickOrSelect={handleLogOut}>{$_('settings.accounts.logOut')}</Button>
 					</Container>
 					{#await users then usersR}
 						{#if usersR?.length}
 							<div class="mt-8">
-								<h1 class="header1 mb-4">Server Accounts</h1>
+								<h1 class="header1 mb-4">{$_('settings.accounts.serverAccounts')}
+								</h1>
 								<Container class="grid grid-cols-2 gap-4" direction="grid" gridCols={2}>
 									{#each usersR.filter((u) => u.id !== $user?.id) as user}
 										<SelectField
@@ -211,7 +212,7 @@
 										</SelectField>
 									{/each}
 									<SelectField
-										value="New Account"
+										value="{$_('settings.accounts.newaccount')}"
 										on:clickOrSelect={() => {
 											createModal(EditProfileModal, {
 												createNew: true,
@@ -219,7 +220,7 @@
 											});
 										}}
 									>
-										Create
+									{$_('settings.accounts.create')}
 										<Plus slot="icon" let:size let:iconClass {size} class={classNames(iconClass)} />
 									</SelectField>
 								</Container>
@@ -259,7 +260,7 @@
 							class="bg-primary-800 rounded-xl p-8"
 							on:enter={scrollIntoView({ vertical: 64 })}
 						>
-							<h1 class="mb-4 header1">{$_('settings.integrations.tmdbAccount')}</h1>
+							<h1 class="mb-4 header1">{$_('settings.accounts.newaccount')}</h1>
 							<TmdbIntegration let:connected>
 								{#if !connected}
 									<div class="flex space-x-4 mt-4">
diff --git a/src/lib/pages/UsersPage.svelte b/src/lib/pages/UsersPage.svelte
index 8852a763..b25801b3 100644
--- a/src/lib/pages/UsersPage.svelte
+++ b/src/lib/pages/UsersPage.svelte
@@ -12,6 +12,7 @@
 	import { Plus, Trash } from 'radix-icons-svelte';
 	import ProfileIcon from '../components/ProfileIcon.svelte';
 	import { profilePictures } from '../profile-pictures';
+	import { _ } from 'svelte-i18n';
 
 	$: users = getUsers($sessions.sessions);
 
@@ -35,7 +36,7 @@
 <DetachedPage sidebar={false} class="px-32 py-16 h-full flex flex-col items-center justify-center">
 	{#await users then users}
 		{#if users?.length}
-			<h1 class="header4 mb-16">Who is watching?</h1>
+			<h1 class="header4 mb-16">{$_('login.whoIsWatching')}</h1>
 			<Container direction="grid" gridCols={4} class="flex space-x-8 mb-16">
 				{#each users as item}
 					{@const user = item.user}
@@ -66,7 +67,7 @@
 					}}
 					icon={Trash}
 				>
-					Remove all Accounts
+				{$_('login.removeAllAccounts')}
 				</Button>
 			</Container>
 		{:else}

From dc03d244cfb1ad6baf8a0525830b1662167befcc Mon Sep 17 00:00:00 2001
From: Phelra <raphael.bidault@gmail.com>
Date: Fri, 30 Aug 2024 23:52:05 +0200
Subject: [PATCH 4/5] fix: bugs and missing translations

---
 src/lib/apis/tmdb/tmdb-api.ts                 | 12 +++++--
 .../Dialog/CreateOrEditProfileModal.svelte    | 23 ++++++------
 .../TmdbIntegrationConnect.svelte             |  9 ++---
 src/lib/lang/de.json                          | 32 +++++++++++++++--
 src/lib/lang/en.json                          | 35 ++++++++++++++++---
 src/lib/lang/es.json                          | 32 +++++++++++++++--
 src/lib/lang/fr.json                          | 31 ++++++++++++++--
 src/lib/lang/it.json                          | 32 +++++++++++++++--
 src/lib/pages/ManagePage.svelte               | 15 ++++----
 src/lib/pages/MoviesHomePage.svelte           |  8 +++--
 src/lib/pages/UsersPage.svelte                |  5 +--
 11 files changed, 193 insertions(+), 41 deletions(-)

diff --git a/src/lib/apis/tmdb/tmdb-api.ts b/src/lib/apis/tmdb/tmdb-api.ts
index 9f35fef5..4d8656dd 100644
--- a/src/lib/apis/tmdb/tmdb-api.ts
+++ b/src/lib/apis/tmdb/tmdb-api.ts
@@ -145,6 +145,7 @@ export class TmdbApi implements Api<paths> {
 						external_id: tvdbId
 					},
 					query: {
+						
 						external_source: 'tvdb_id'
 					}
 				},
@@ -169,8 +170,9 @@ export class TmdbApi implements Api<paths> {
 						series_id: tmdbId
 					},
 					query: {
+						language: get(localSettings)?.language,
 						append_to_response: 'videos,aggregate_credits,external_ids,images',
-						...({ include_image_language: get(localSettings)?.language + ',en,null' } as any)
+						...({ include_image_language: get(localSettings)?.language + ',en,null' } as any)  
 					}
 				},
 				headers: {
@@ -257,6 +259,7 @@ export class TmdbApi implements Api<paths> {
 						episode_number: episode
 					},
 					query: {
+						language: get(localSettings)?.language,  // Spécifiez la langue ici
 						append_to_response: 'credits,external_ids,images'
 					}
 				}
@@ -341,6 +344,7 @@ export class TmdbApi implements Api<paths> {
 								account_object_id: userId
 							},
 							query: {
+								language: get(localSettings)?.language,
 								page: i + 1
 							}
 						}
@@ -416,6 +420,7 @@ export class TmdbApi implements Api<paths> {
 								account_object_id: userId
 							},
 							query: {
+								language: get(localSettings)?.language,
 								page: i + 1
 							}
 						}
@@ -551,7 +556,8 @@ export const getTmdbSeriesFromTvdbId = async (tvdbId: string) =>
 				external_id: tvdbId
 			},
 			query: {
-				external_source: 'tvdb_id'
+				external_source: 'tvdb_id',
+				language: get(localSettings)?.language
 			}
 		},
 		headers: {
@@ -574,7 +580,7 @@ export const getTmdbSeries = async (tmdbId: number): Promise<TmdbSeriesFull2 | u
 			},
 			query: {
 				append_to_response: 'videos,aggregate_credits,external_ids,images',
-				...({ include_image_language: get(settings)?.language + ',en,null' } as any)
+				language: get(localSettings)?.language
 			}
 		},
 		headers: {
diff --git a/src/lib/components/Dialog/CreateOrEditProfileModal.svelte b/src/lib/components/Dialog/CreateOrEditProfileModal.svelte
index bac0bcb1..86fd009b 100644
--- a/src/lib/components/Dialog/CreateOrEditProfileModal.svelte
+++ b/src/lib/components/Dialog/CreateOrEditProfileModal.svelte
@@ -18,6 +18,7 @@
 	import { navigate } from '../StackRouter/StackRouter';
 	import Toggle from '../Toggle.svelte';
 	import { get } from 'svelte/store';
+	import { _ } from 'svelte-i18n';
 
 	enum Tabs {
 		EditProfile,
@@ -166,11 +167,11 @@
 <Dialog class="grid" size={'dynamic'}>
 	<Tab {...tab} tab={Tabs.EditProfile} class="space-y-4 max-w-lg">
 		<h1 class="header2">
-			{createNew ? 'Create Account' : 'Edit Profile'}
-		</h1>
-		<TextField bind:value={name}>name</TextField>
+			{createNew ? $_('settings.profile.createProfile') : $_('settings.profile.editProfile')}
+		</h1>		
+		<TextField bind:value={name}>{$_('settings.profile.name')}</TextField>
 		<SelectField value={profilePictureTitle} on:clickOrSelect={() => tab.set(Tabs.ProfilePictures)}>
-			Profile Picture
+			{$_('settings.profile.profilePicture')}
 		</SelectField>
 		{#if !createNew}
 			<Container direction="horizontal" class="flex space-x-4 items-end">
@@ -179,7 +180,7 @@
 					bind:value={oldPassword}
 					type={oldPasswordVisible ? 'text' : 'password'}
 				>
-					Old Password
+				{$_('settings.profile.oldPassword')}
 				</TextField>
 				<IconToggle
 					on:clickOrSelect={() => (oldPasswordVisible = !oldPasswordVisible)}
@@ -193,7 +194,7 @@
 				bind:value={newPassword}
 				type={newPasswordVisible ? 'text' : 'password'}
 			>
-				New Password
+			{$_('settings.profile.newPassword')}
 			</TextField>
 			<IconToggle
 				on:clickOrSelect={() => (newPasswordVisible = !newPasswordVisible)}
@@ -202,7 +203,7 @@
 		</Container>
 		{#if isAdmin || admin}
 			<div class="flex justify-between">
-				<label>Admin</label>
+				<label>{$_('settings.profile.admin')}</label>
 				<Toggle bind:checked={isAdmin}>Admin</Toggle>
 			</div>
 		{/if}
@@ -211,7 +212,7 @@
 		{/if}
 		<Container direction="horizontal" class="flex space-x-4 pt-4 *:flex-1">
 			{#if !createNew}
-				<Button type="primary-dark" disabled={!stale} action={save}>Save</Button>
+				<Button type="primary-dark" disabled={!stale} action={save}>{$_('settings.profile.save')}</Button>
 				<Button
 					type="primary-dark"
 					icon={Trash}
@@ -220,10 +221,10 @@
 							header: 'Delete Account',
 							body: 'Are you sure you want to delete your account?',
 							confirm: handleDeleteAccount
-						})}>Delete Account</Button
+						})}>{$_('settings.profile.deleteAccount')}</Button
 				>
 			{:else}
-				<Button type="primary-dark" disabled={!complete} action={create}>Create</Button>
+				<Button type="primary-dark" disabled={!complete} action={create}>{$_('settings.accounts.create')}</Button>
 			{/if}
 		</Container>
 	</Tab>
@@ -236,7 +237,7 @@
 			detail.stopPropagation();
 		}}
 	>
-		<h1 class="header2 mb-6">Select Profile Picture</h1>
+		<h1 class="header2 mb-6">{$_('settings.profile.profilePicture')}</h1>
 		<Container direction="grid" gridCols={3} class="grid grid-cols-3 gap-4 w-max">
 			<ProfileIcon
 				url={profilePictures.ana}
diff --git a/src/lib/components/Integrations/TmdbIntegrationConnect.svelte b/src/lib/components/Integrations/TmdbIntegrationConnect.svelte
index 0e41e635..19222e1b 100644
--- a/src/lib/components/Integrations/TmdbIntegrationConnect.svelte
+++ b/src/lib/components/Integrations/TmdbIntegrationConnect.svelte
@@ -5,6 +5,7 @@
 	import { createEventDispatcher, onMount } from 'svelte';
 	import { ExternalLink } from 'radix-icons-svelte';
 	import { user } from '../../stores/user.store';
+	import { _ } from 'svelte-i18n';
 
 	const dispatch = createEventDispatcher<{ connected: null }>();
 
@@ -51,9 +52,9 @@
 	}
 </script>
 
-<h1 class="header2 mb-2">Connect a TMDB Account</h1>
+<h1 class="header2 mb-2">{$_('settings.integrations.connectTmdb')}</h1>
 <div class="body mb-8">
-	To connect your TMDB account, log in via the link below and then click "Complete Connection".
+	{$_('settings.integrations.tmdbText')}
 </div>
 
 {#if tmdbConnectQrCode}
@@ -71,9 +72,9 @@
 	<!--{#if !tmdbConnectRequestToken}-->
 	<!--	<Button type="primary-dark" action={handleGenerateTMDBLink}>Generate Link</Button>-->
 	{#if tmdbConnectLink}
-		<Button type="primary-dark" action={completeTMDBConnect}>Complete Connection</Button>
+		<Button type="primary-dark" action={completeTMDBConnect}>{$_('settings.integrations.completeConnectionTmdb')}</Button>
 		<Button type="primary-dark" on:clickOrSelect={() => window.open(tmdbConnectLink)}>
-			Open Link
+			{$_('settings.integrations.tmdbOpenLink')}
 			<ExternalLink size={19} slot="icon-after" />
 		</Button>
 	{/if}
diff --git a/src/lib/lang/de.json b/src/lib/lang/de.json
index f7a203fb..3e8b73db 100644
--- a/src/lib/lang/de.json
+++ b/src/lib/lang/de.json
@@ -53,7 +53,9 @@
 		"password": "Passwort",
 		"submit": "Einreichen",
 		"invalidCredentials": "Ungültige Anmeldeinformationen. Bitte versuchen Sie es erneut.",
-		"errorOccurred": "Ein Fehler ist aufgetreten"
+		"errorOccurred": "Ein Fehler ist aufgetreten",
+		"whoIsWatching": "Wer schaut?",
+		"removeAllAccounts": "Alle Konten entfernen"
 	},
 	"settings": {
 		"general": {
@@ -69,7 +71,11 @@
 			"apiKey": "API Schlüssel",
 			"save": "Speichern",
 			"tmdbAccount": "Tmdb Konto",
+			"tmdbText": "Um Ihr TMDB-Konto zu verbinden, melden Sie sich über den untenstehenden Link an und klicken Sie dann auf 'Verbindung abschließen'.",
+			"connectTmdb": "Ein TMDB-Konto verbinden",
 			"connectedTo": "Verbunden mit",
+			"completeConnectionTmdb": "Verbindung abschließen",
+			"tmdbOpenLink": "Link öffnen",
 			"tmdb": {
 				"connect": "Verbinden"
 			},
@@ -91,7 +97,29 @@
 			"lastKey": "Letzter Schlüssel",
 			"tizenMediaKey": "Tizen Media Key",
 			"logOut": "Ausloggen"
-		}
+		},
+		"accounts": {
+			"accounts": "Konten",
+			"myprofile": "Mein Profil",
+			"loginAs": "Angemeldet als",
+			"logOut": "Abmelden",
+			"create": "Erstellen",
+			"newaccount": "Neues Konto",
+			"serverAccounts": "Serverkonten"
+		},
+		"profile": {
+				"createProfile": "Ein Konto erstellen",
+				"editProfile": "Profil Bearbeiten",
+				"name": "Name",
+				"profilePicture": "Profilbild",
+				"custom": "Benutzerdefiniert",
+				"oldPassword": "Altes Passwort",
+				"newPassword": "Neues Passwort",
+				"admin": "Administrator",
+				"save": "Speichern",
+				"deleteAccount": "Konto Löschen"
+			}
+
 	},
 	"discover": {
 		"continueWatching": "Weiter ansehen",
diff --git a/src/lib/lang/en.json b/src/lib/lang/en.json
index a2804246..41ed08e2 100644
--- a/src/lib/lang/en.json
+++ b/src/lib/lang/en.json
@@ -54,7 +54,9 @@
 		"password": "Password",
 		"submit": "Submit",
 		"invalidCredentials": "Invalid credentials. Please try again.",
-		"errorOccurred": "Error occurred"
+		"errorOccurred": "Error occurred",
+		"whoIsWatching": "Who is watching ?",
+		"removeAllAccounts": "Remove all accounts"
 	},
 	"settings": {
 		"general": {
@@ -70,6 +72,10 @@
 			"apiKey": "API Key",
 			"save": "Save",
 			"tmdbAccount": "Tmdb Account",
+			"tmdbText": "To connect your TMDB account, log in via the link below and then click 'Complete Connection'.",
+			"connectTmdb": "Connect a TMDB Account",
+			"completeConnectionTmdb": "Complete connection",
+			"tmdbOpenLink": "Open Link",
 			"connectedTo": "Connected to",
 			"tmdb": {
 				"connect": "Connect"
@@ -90,9 +96,30 @@
 			"userAgent": "User agent",
 			"lastKeyCode": "Last key code",
 			"lastKey": "Last key",
-			"tizenMediaKey": "Tizen media key",
-			"logOut": "Log Out"
-		}
+			"tizenMediaKey": "Tizen media key"
+		},
+		"accounts": {
+			"accounts": "Accounts",
+			"myprofile": "My Profile",
+			"loginAs": "Logged in as",
+			"logOut": "Log Out",
+			"create": "Create",
+			"newaccount": "New account",
+			"serverAccounts": "Serveur Accounts"
+			
+		},
+			"profile": {
+				"createProfile": "Create an account",
+				"editProfile": "Edit Profile",
+				"name": "Name",
+				"profilePicture": "Profile Picture",
+				"custom": "Custom",
+				"oldPassword": "Old Password",
+				"newPassword": "New Password",
+				"admin": "Admin",
+				"save": "Save",
+				"deleteAccount": "Delete Account"
+			}
 	},
 	"discover": {
 		"continueWatching": "Continue Watching",
diff --git a/src/lib/lang/es.json b/src/lib/lang/es.json
index 6e0be3f6..2d29e284 100644
--- a/src/lib/lang/es.json
+++ b/src/lib/lang/es.json
@@ -46,7 +46,9 @@
 		"password": "Contraseña",
 		"submit": "Enviar",
 		"invalidCredentials": "Credenciales inválidas. Por favor, inténtalo de nuevo.",
-		"errorOccurred": "Ocurrió un error"
+		"errorOccurred": "Ocurrió un error",
+		"whoIsWatching": "¿Quién está viendo?",
+		"removeAllAccounts": "Eliminar todas las cuentas"
 	},
 	"settings": {
 		"general": {
@@ -62,7 +64,11 @@
 			"apiKey": "Llave API",
 			"save": "Guardar",
 			"tmdbAccount": "Cuenta de TMDB",
+			"tmdbText": "Para conectar tu cuenta de TMDB, inicia sesión a través del enlace de abajo y luego haz clic en 'Completar Conexión'.",
+			"connectTmdb": "Conectar una cuenta de TMDB",
 			"connectedTo": "Conectado a",
+			"completeConnectionTmdb": "Completar Conexión",
+			"tmdbOpenLink": "Abrir enlace",
 			"tmdb": {
 				"connect": "Conectar"
 			},
@@ -84,7 +90,29 @@
 			"lastKey": "Última tecla",
 			"tizenMediaKey": "Tecla de medios Tizen",
 			"logOut": "Cerrar sesión"
-		}
+		},
+		"accounts": {
+			"accounts": "Cuentas",
+			"myprofile": "Mi Perfil",
+			"loginAs": "Conectado como",
+			"logOut": "Cerrar sesión",
+			"create": "Crear",
+			"newaccount": "Nueva cuenta",
+			"serverAccounts": "Cuentas del Servidor"
+		},
+		"profile": {
+				"createProfile": "Crear una cuenta",
+				"editProfile": "Editar Perfil",
+				"name": "Nombre",
+				"profilePicture": "Foto de Perfil",
+				"custom": "Personalizado",
+				"oldPassword": "Contraseña Antigua",
+				"newPassword": "Nueva Contraseña",
+				"admin": "Administrador",
+				"save": "Guardar",
+				"deleteAccount": "Eliminar Cuenta"
+			}
+
 	},
 	"discover": {
 		"continueWatching": "Seguir viendo",
diff --git a/src/lib/lang/fr.json b/src/lib/lang/fr.json
index 09b4afa8..6a876b04 100644
--- a/src/lib/lang/fr.json
+++ b/src/lib/lang/fr.json
@@ -54,7 +54,9 @@
 		"password": "Mot de passe",
 		"submit": "Connexion",
 		"invalidCredentials": "Identifiants invalides. Veuillez réessayer.",
-		"errorOccurred": "Une erreur s'est produite"
+		"errorOccurred": "Une erreur s'est produite",
+		"whoIsWatching": "Qui regarde ?",
+		"removeAllAccounts": "Supprimer tous les comptes"
 	},
 	"settings": {
 		"general": {
@@ -70,7 +72,11 @@
 			"apiKey": "Clé API",
 			"save": "Sauvegarder",
 			"tmdbAccount": "Compte TMDB",
+			"tmdbText": "Pour connecter votre compte TMDB, connectez-vous via le lien ci-dessous, puis cliquez sur 'Compléter la connexion'.",
+			"connectTmdb": "Connecter un compte TMDB",
 			"connectedTo": "Connecté à",
+			"completeConnectionTmdb": "Compléter la connexion",
+			"tmdbOpenLink": "Ouvrir le lien",
 			"tmdb": {
 				"connect": "Connecter"
 			},
@@ -92,7 +98,28 @@
 			"lastKey": "Dernière touche",
 			"tizenMediaKey": "Touche média Tizen",
 			"logOut": "Déconnexion"
-		}
+		},
+		"accounts": {
+			"accounts": "Comptes",
+			"myprofile": "Mon Profil",
+			"loginAs": "Connecté en tant que",
+			"logOut": "Déconnexion",
+			"create": "Créer",
+			"newaccount": "Nouveau compte",
+			"serverAccounts": "Gestion des comptes"
+		},
+		"profile": {
+			"createProfile": "Créer un compte",
+				"editProfile": "Modifier le profil",
+				"name": "Nom",
+				"profilePicture": "Photo de profil",
+				"custom": "Personnalisé",
+				"oldPassword": "Ancien mot de passe",
+				"newPassword": "Nouveau mot de passe",
+				"admin": "Administrateur",
+				"save": "Enregistrer",
+				"deleteAccount": "Supprimer le compte"
+			}
 	},
 	"discover": {
 		"continueWatching": "Continuer à regarder",
diff --git a/src/lib/lang/it.json b/src/lib/lang/it.json
index 2cd7c7ef..e3751a4d 100644
--- a/src/lib/lang/it.json
+++ b/src/lib/lang/it.json
@@ -53,7 +53,9 @@
 		"password": "Password",
 		"submit": "Invia",
 		"invalidCredentials": "Credenziali non valide. Per favore, riprova.",
-		"errorOccurred": "Si è verificato un errore"
+		"errorOccurred": "Si è verificato un errore",
+		"whoIsWatching": "Chi sta guardando?",
+		"removeAllAccounts": "Rimuovi tutti gli account"
 	},
 	"settings": {
 		"general": {
@@ -70,6 +72,10 @@
 			"save": "Salva",
 			"tmdbAccount": "Account TMDB",
 			"connectedTo": "Connesso a",
+			"tmdbText": "Per connettere il tuo account TMDB, accedi tramite il link sottostante e poi clicca su 'Completa Connessione'.",
+			"connectTmdb": "Connetti un account TMDB",
+			"completeConnectionTmdb": "Completa Connessione",
+			"tmdbOpenLink": "Apri link",
 			"tmdb": {
 				"connect": "Connetti"
 			},
@@ -91,7 +97,29 @@
 			"lastKey": "Ultimo tasto",
 			"tizenMediaKey": "Tasto media Tizen",
 			"logOut": "Disconnetti"
-		}
+		},
+		"accounts": {
+			"accounts": "Conti",
+			"myprofile": "Il Mio Profilo",
+			"loginAs": "Connesso come",
+			"logOut": "Disconnettersi",
+			"create": "Creare",
+			"newaccount": "Nuovo account",
+			"serverAccounts": "Conti del Server"
+		},
+		"profile": {
+				"createProfile": "Creare un account",
+				"editProfile": "Modifica Profilo",
+				"name": "Nome",
+				"profilePicture": "Immagine del Profilo",
+				"custom": "Personalizzato",
+				"oldPassword": "Vecchia Password",
+				"newPassword": "Nuova Password",
+				"admin": "Amministratore",
+				"save": "Salva",
+				"deleteAccount": "Elimina Account"
+			}
+
 	},
 	"discover": {
 		"continueWatching": "Continua a guardare",
diff --git a/src/lib/pages/ManagePage.svelte b/src/lib/pages/ManagePage.svelte
index c554e316..5f7f7f58 100644
--- a/src/lib/pages/ManagePage.svelte
+++ b/src/lib/pages/ManagePage.svelte
@@ -103,7 +103,7 @@
 					'text-primary-500': hasFocus
 				})}
 			>
-				Accounts
+			{$_('settings.accounts.accounts')}
 			</span>
 		</Container>
 		<Container
@@ -166,7 +166,7 @@
 		<Tab {...tab} tab={Tabs.Account} class="space-y-16">
 			<div>
 				<Container class="bg-primary-800 rounded-xl p-8" on:enter={scrollIntoView({ top: 9999 })}>
-					<h1 class="header1 mb-4">My Profile</h1>
+					<h1 class="header1 mb-4">{$_('settings.accounts.myprofile')}</h1>
 					<SelectField
 						class="mb-4"
 						value={$user?.name || ''}
@@ -178,16 +178,17 @@
 								});
 						}}
 					>
-						Logged in as
+					{$_('settings.accounts.loginAs')}
 						<Pencil2 slot="icon" let:size let:iconClass {size} class={classNames(iconClass)} />
 					</SelectField>
 					<Container direction="horizontal" class="flex space-x-4">
-						<Button type="primary-dark" icon={Exit} on:clickOrSelect={handleLogOut}>Log Out</Button>
+						<Button type="primary-dark" icon={Exit} on:clickOrSelect={handleLogOut}>{$_('settings.accounts.logOut')}</Button>
 					</Container>
 					{#await users then usersR}
 						{#if usersR?.length}
 							<div class="mt-8">
-								<h1 class="header1 mb-4">Server Accounts</h1>
+								<h1 class="header1 mb-4">{$_('settings.accounts.serverAccounts')}
+								</h1>
 								<Container class="grid grid-cols-2 gap-4" direction="grid" gridCols={2}>
 									{#each usersR.filter((u) => u.id !== $user?.id) as user}
 										<SelectField
@@ -211,7 +212,7 @@
 										</SelectField>
 									{/each}
 									<SelectField
-										value="New Account"
+										value="{$_('settings.accounts.newaccount')}"
 										on:clickOrSelect={() => {
 											createModal(EditProfileModal, {
 												createNew: true,
@@ -219,7 +220,7 @@
 											});
 										}}
 									>
-										Create
+									{$_('settings.accounts.create')}
 										<Plus slot="icon" let:size let:iconClass {size} class={classNames(iconClass)} />
 									</SelectField>
 								</Container>
diff --git a/src/lib/pages/MoviesHomePage.svelte b/src/lib/pages/MoviesHomePage.svelte
index 3046781b..4ebdc8d1 100644
--- a/src/lib/pages/MoviesHomePage.svelte
+++ b/src/lib/pages/MoviesHomePage.svelte
@@ -13,8 +13,12 @@
 	import DetachedPage from '../components/DetachedPage/DetachedPage.svelte';
 	import { _ } from 'svelte-i18n';
 
-	const continueWatching = jellyfinApi.getContinueWatching('movie');
-	const recentlyAdded = jellyfinApi.getRecentlyAdded('movie');
+	const continueWatching = jellyfinApi.getContinueWatching('movie').then(items => {
+		return items.filter(item => item.Type === 'Movie');
+	});
+	const recentlyAdded = jellyfinApi.getRecentlyAdded('movie').then(items => {
+		return items.filter(item => item.Type === 'Movie');
+	});
 
 	const popularMovies = tmdbApi.getPopularMovies();
 
diff --git a/src/lib/pages/UsersPage.svelte b/src/lib/pages/UsersPage.svelte
index 8852a763..b25801b3 100644
--- a/src/lib/pages/UsersPage.svelte
+++ b/src/lib/pages/UsersPage.svelte
@@ -12,6 +12,7 @@
 	import { Plus, Trash } from 'radix-icons-svelte';
 	import ProfileIcon from '../components/ProfileIcon.svelte';
 	import { profilePictures } from '../profile-pictures';
+	import { _ } from 'svelte-i18n';
 
 	$: users = getUsers($sessions.sessions);
 
@@ -35,7 +36,7 @@
 <DetachedPage sidebar={false} class="px-32 py-16 h-full flex flex-col items-center justify-center">
 	{#await users then users}
 		{#if users?.length}
-			<h1 class="header4 mb-16">Who is watching?</h1>
+			<h1 class="header4 mb-16">{$_('login.whoIsWatching')}</h1>
 			<Container direction="grid" gridCols={4} class="flex space-x-8 mb-16">
 				{#each users as item}
 					{@const user = item.user}
@@ -66,7 +67,7 @@
 					}}
 					icon={Trash}
 				>
-					Remove all Accounts
+				{$_('login.removeAllAccounts')}
 				</Button>
 			</Container>
 		{:else}

From 06091cdbea8fbea77a63fd3a49f15fd7516856d3 Mon Sep 17 00:00:00 2001
From: Phelra <raphael.bidault@gmail.com>
Date: Sat, 7 Sep 2024 12:47:35 +0200
Subject: [PATCH 5/5] Fix: LanguageSettings

---
 src/lib/components/LanguageSettings.svelte | 18 ++++++++++--------
 src/lib/pages/LibraryPage.svelte           |  3 ++-
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/lib/components/LanguageSettings.svelte b/src/lib/components/LanguageSettings.svelte
index 1a8d3601..b81e64aa 100644
--- a/src/lib/components/LanguageSettings.svelte
+++ b/src/lib/components/LanguageSettings.svelte
@@ -44,12 +44,14 @@
 
   {#if showLanguageDialog}
 	<Dialog on:close={() => (showLanguageDialog = false)}>
-	  {#each Object.entries(AVAILABLE_LANGUAGES) as [code, language]}
-		<SelectItem 
-		  selected={code === selectedLanguage} 
-		  on:clickOrSelect={() => handleSelectLanguage(code)}		>
-		  {language.name}
-		</SelectItem>
-	  {/each}
-	</Dialog>
+		<div class="space-y-4">
+		{#each Object.entries(AVAILABLE_LANGUAGES) as [code, language]}
+			<SelectItem 
+			selected={code === selectedLanguage} 
+			on:clickOrSelect={() => handleSelectLanguage(code)}>
+			{language.name}
+			</SelectItem>
+		{/each}
+		</div>
+	</Dialog> 
   {/if}
diff --git a/src/lib/pages/LibraryPage.svelte b/src/lib/pages/LibraryPage.svelte
index a23018b9..47a5c6c9 100644
--- a/src/lib/pages/LibraryPage.svelte
+++ b/src/lib/pages/LibraryPage.svelte
@@ -15,6 +15,7 @@
 	import { tmdbApi, type TmdbMovie2, type TmdbSeries2 } from '../apis/tmdb/tmdb-api';
 	import { writable } from 'svelte/store';
 	import { onMount } from 'svelte';
+	import { _ } from 'svelte-i18n';
 
 	const libraryItemsP = jellyfinApi.getLibraryItems();
 	const sonarrDownloads: Promise<TmdbSeries2[]> = sonarrApi
@@ -112,7 +113,7 @@
 	{/await}
 	<div class="px-32">
 		<div class="mb-6">
-			<div class="header2">Library</div>
+			<div class="header2">{$_('navbar.library')}</div>
 		</div>
 		<CardGrid>
 			{#if $displayedItems.length === 0}