feat(import): refactor bookmark import to handle file content directly

Signed-off-by: Robert Goniszewski <[email protected]>

src/lib/components/BulkList/BulkList.svelte

@@ -11,19 +11,9 @@ const selectAllItems = ({ target }: Event) => {
 		importBookmarkStore.setSelectStatusForAll(target.checked);
 	}
 };
-
-const removeSelectedItems = () => {
-	importBookmarkStore.removeSelected();
-};
 </script>
 
-<div class="flex max-w-4xl flex-col gap-2">
-	<div class="mb-2 flex w-full items-end justify-end">
-		<button
-			class="btn btn-primary"
-			disabled={!importBookmarkStore.isAnySelected}
-			on:click={removeSelectedItems}>DELETE</button>
-	</div>
+<div class="flex flex-col gap-2">
 	<div class="max-h-[calc(100vh-16rem)] overflow-x-auto">
 		<table class="table table-pin-rows table-pin-cols table-xs">
 			<!-- head -->

src/lib/components/Pagination/Pagination.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
 import type { Readable } from 'svelte/store';
-import { get } from 'svelte/store';
 
 export let page: number = 1;
 export let limit: number = 20;
@@ -11,11 +10,12 @@ let itemsCount: number;
 
 $: {
 	// NOTE: We need to subscribe to the changes so it stays reactive
-	itemsCount = typeof items === 'number' ? items : get(items);
 	if (typeof items === 'object' && 'subscribe' in items) {
 		items.subscribe((value) => {
 			itemsCount = value;
 		});
+	} else {
+		itemsCount = items;
 	}
 }
 

src/lib/stores/import-bookmarks.store.ts

@@ -1,4 +1,4 @@
-import { derived, writable } from 'svelte/store';
+import { derived, get, writable } from 'svelte/store';
 
 import type { BulkListItem } from '$lib/types/common/BulkList.type';
 
@@ -24,5 +24,7 @@ export const importBookmarkStore = {
 	setSelectStatusForAll: (selected: boolean) =>
 		update((items) => items.map((item) => ({ ...item, selected }))),
 	removeSelected: () => update((items) => items.filter((item) => !item.selected)),
+	clear: () => set([]),
+	importedCategories: get(derived(store, (items) => items.map((item) => item.category))),
 	length: derived(store, (items) => items.length)
 };

src/lib/types/BookmarkImport.type.ts

@@ -2,6 +2,7 @@ import type { Bookmark } from './Bookmark.type';
 import type { Category } from './Category.type';
 
 export type ImportedBookmark = Pick<Bookmark, 'title' | 'url' | 'description'> & {
+	categorySlug?: string;
 	createdAt?: Date;
 	icon?: string;
 };

src/lib/types/common/BulkList.type.ts

@@ -2,7 +2,7 @@ import type { Metadata } from '../Metadata.type';
 
 export type BulkListItem = Partial<Metadata> & {
 	id: number;
-	icon: string;
+	icon: string | null;
 	url: string;
 	title: string;
 	category: string;

src/lib/utils/bookmark-import/netscape.importer.ts

@@ -1,5 +1,3 @@
-import type { Bookmark } from '$lib/types/Bookmark.type';
-import type { Category } from '$lib/types/Category.type';
 import parse from 'node-parse-bookmarks';
 
 import { createSlug } from '../create-slug';
@@ -11,21 +9,10 @@ import type {
 	ImportResult
 } from '$lib/types/BookmarkImport.type';
 
-async function importNetscapeBackupFile(filePath: string): Promise<ParserBookmark[]> {
+async function parseNetscapeBackupFile(content: string): Promise<ParserBookmark[]> {
 	try {
-		const bookmarks: ParserBookmark[] = await new Promise((resolve, reject) => {
-			parse(
-				filePath,
-				{},
-				(res: ParserBookmark[]) => {
-					resolve(res);
-				},
-				(err: Error | null) => {
-					if (err) {
-						reject(err);
-					}
-				}
-			);
+		const bookmarks: ParserBookmark[] = await new Promise((resolve, _reject) => {
+			resolve(parse(content));
 		});
 		return bookmarks;
 	} catch (error) {
@@ -58,7 +45,8 @@ function translateNetscapeBookmarks(bookmarks: ParserBookmark[]): ImportResult {
 				url: item.url!,
 				description: item.description || '',
 				createdAt: item.addDate ? new Date(item.addDate) : undefined,
-				icon: item.icon || undefined
+				icon: item.icon || undefined,
+				categorySlug: parentSlug
 			};
 			result.bookmarks.push(bookmark);
 		}
@@ -69,7 +57,8 @@ function translateNetscapeBookmarks(bookmarks: ParserBookmark[]): ImportResult {
 	return result;
 }
 
-export async function importNetscapeBackup(filePath: string): Promise<ImportResult> {
-	const bookmarks = await importNetscapeBackupFile(filePath);
+export async function importNetscapeBackup(content: string): Promise<ImportResult> {
+	const bookmarks = await parseNetscapeBackupFile(content);
+
 	return translateNetscapeBookmarks(bookmarks);
 }

src/lib/utils/import-bookmarks.ts

@@ -2,16 +2,16 @@ import type { ImportResult } from '$lib/types/BookmarkImport.type';
 import { importNetscapeBackup } from './bookmark-import/netscape.importer';
 
 type ImportProviders = {
-	netscape: (filePath: string) => Promise<ImportResult>;
+	netscape: (content: string) => Promise<ImportResult>;
 };
 
 export async function importBookmarks(
-	filePath: string,
+	content: string,
 	provider: keyof ImportProviders
 ): Promise<ImportResult> {
 	const providers: ImportProviders = {
 		netscape: importNetscapeBackup
 	};
 
-	return providers[provider](filePath);
+	return providers[provider](content);
 }