feat(badges): source and designer fields

6 files changed, 31 insertions, 7 deletions

diff --git a/src/lib/Database/userBadges.ts b/src/lib/Database/userBadges.ts
index c6cb4919..36bf7955 100644
--- a/src/lib/Database/userBadges.ts
+++ b/src/lib/Database/userBadges.ts
@@ -9,6 +9,8 @@ export interface Badge {
 	time?: string;
 	category?: string;
 	hidden?: boolean;
+	source: string;
+	designer: string;
 }
 
 export const getUserBadges = async (userId: number): Promise<Badge[]> => {
@@ -25,18 +27,28 @@ export const getUserBadges = async (userId: number): Promise<Badge[]> => {
 };
 
 export const addUserBadge = async (userId: number, badge: Badge) => {
-	const { post, image, description, time, category, hidden } = badge;
+	const { post, image, description, time, category, hidden, source, designer } = badge;
 
 	if (post === undefined || image === undefined) return;
 
 	if (time) {
 		await supabase
 			.from('user_badges')
-			.insert({ user_id: userId, post, image, description, time, category, hidden });
+			.insert({
+				user_id: userId,
+				post,
+				image,
+				description,
+				time,
+				category,
+				hidden,
+				source,
+				designer
+			});
 	} else {
 		await supabase
 			.from('user_badges')
-			.insert({ user_id: userId, post, image, description, category, hidden });
+			.insert({ user_id: userId, post, image, description, category, hidden, source, designer });
 	}
 };
 
@@ -55,7 +67,9 @@ export const updateUserBadge = async (userId: number, id: number, badge: Badge)
 			description: badge.description,
 			category: badge.category,
 			time: badge.time,
-			hidden: badge.hidden
+			hidden: badge.hidden,
+			source: badge.source,
+			designer: badge.designer
 		})
 		.eq('id', id)
 		.eq('user_id', userId);
diff --git a/src/lib/Dropdown.svelte b/src/lib/Dropdown.svelte
index 39d9ecec..dd48af45 100644
--- a/src/lib/Dropdown.svelte
+++ b/src/lib/Dropdown.svelte
@@ -92,6 +92,7 @@
 		transition: opacity $delay ease, transform $delay ease, visibility 0s linear $delay;
 		left: var(--dropdown-left);
 		transform: var(--dropdown-transform);
+		z-index: 1;
 	}
 
 	.dropdown-open {
diff --git a/src/lib/FallbackBadge.svelte b/src/lib/FallbackBadge.svelte
index 470f5d8c..3f87b9f2 100644
--- a/src/lib/FallbackBadge.svelte
+++ b/src/lib/FallbackBadge.svelte
@@ -52,9 +52,12 @@
 		id={`badge-${badge.id}`}
 		class="badge-container badge"
 		title={`${badge.time ? $locale().dateFormatter(databaseTimeToDate(badge.time)) : ''}${
-			badge.description ? `\n${badge.description}` : ''
+			badge.description ? `, ${badge.description}` : ''
+		}${badge.designer ? `\nDesigner: ${badge.designer}` : ''}${
+			badge.source ? `\nSource: ${badge.source}` : ''
 		}`}
 		use:tooltip
+		data-tooltipPin={`badge-${badge.id}`}
 	>
 		<img
 			src={source}
diff --git a/src/lib/Locale/english.ts b/src/lib/Locale/english.ts
index 7400ae82..794a97d5 100644
--- a/src/lib/Locale/english.ts
+++ b/src/lib/Locale/english.ts
@@ -175,7 +175,9 @@ const English: Locale = {
 				add: 'Add',
 				update: 'Update',
 				or: 'or',
-				delete: 'Delete (Click Twice)'
+				delete: 'Delete (Click Twice)',
+				source: 'Source (Recommended)',
+				designer: 'Designer (Recommended)'
 			},
 			importMode: {
 				enable: 'Import from AniList',
diff --git a/src/lib/Locale/japanese.ts b/src/lib/Locale/japanese.ts
index 177acd51..5986395b 100644
--- a/src/lib/Locale/japanese.ts
+++ b/src/lib/Locale/japanese.ts
@@ -176,7 +176,9 @@ const Japanese: Locale = {
 				add: 'バッジを追加',
 				update: 'バッジを更新',
 				or: 'または',
-				delete: 'バッジを削除する（2回クリック）'
+				delete: 'バッジを削除する（2回クリック）',
+				source: 'ソース（推奨）',
+				designer: 'デザイナー（推奨）'
 			},
 			importMode: {
 				enable: 'AniListからインポートする',
diff --git a/src/lib/Locale/layout.ts b/src/lib/Locale/layout.ts
index c1a0df5f..0e1bdecc 100644
--- a/src/lib/Locale/layout.ts
+++ b/src/lib/Locale/layout.ts
@@ -178,6 +178,8 @@ export interface Locale {
 				update: LocaleValue;
 				or: LocaleValue;
 				delete: LocaleValue;
+				source: LocaleValue;
+				designer: LocaleValue;
 			};
 			importMode: {
 				enable: LocaleValue;