Merge pull request #62 from goniszewski/feat/update-api-for-bookmark-ext

Feat/update API for bookmark extension

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "grimoire",
-	"version": "0.2.3",
+	"version": "0.2.5",
 	"description": "Bookmark manager for the wizards 🧙",
 	"author": "Robert Goniszewski <robert@goniszewski.com>",
 	"main": "./build/index.js",

pb_migrations/1709315230_updated_bookmarks.js

@@ -0,0 +1,41 @@
+/// <reference path="../pb_data/types.d.ts" />
+migrate((db) => {
+  const dao = new Dao(db)
+  const collection = dao.findCollectionByNameOrId("mwhpoxiiau7d76n")
+
+  // add
+  collection.schema.addField(new SchemaField({
+    "system": false,
+    "id": "axufosre",
+    "name": "screenshot",
+    "type": "file",
+    "required": false,
+    "presentable": false,
+    "unique": false,
+    "options": {
+      "maxSelect": 1,
+      "maxSize": 307200,
+      "mimeTypes": [
+        "image/png",
+        "image/jpeg",
+        "image/webp",
+        "image/avif"
+      ],
+      "thumbs": [
+        "380x144",
+        "100x100"
+      ],
+      "protected": false
+    }
+  }))
+
+  return dao.saveCollection(collection)
+}, (db) => {
+  const dao = new Dao(db)
+  const collection = dao.findCollectionByNameOrId("mwhpoxiiau7d76n")
+
+  // remove
+  collection.schema.removeField("axufosre")
+
+  return dao.saveCollection(collection)
+})

src/lib/types/Bookmark.type.ts

@@ -27,4 +27,5 @@ export type Bookmark = {
 	owner: User;
 	opened_last: null | Date;
 	opened_times: number;
+	screenshot: string;
 };

src/lib/types/api/Bookmarks.type.ts

@@ -10,12 +10,12 @@ export type AddBookmarkRequestBody = {
 	note?: string;
 	main_image_url?: string;
 	icon_url?: string;
+	icon?: string;
 	importance?: number;
 	flagged?: boolean;
 	category: string;
-	tags?: {
-		name: string;
-	}[];
+	tags?: string[];
+	screenshot?: string;
 };
 
 export type UpdateBookmarkRequestBody = AddBookmarkRequestBody & {

src/lib/utils/get-metadata.ts

@@ -11,7 +11,7 @@ import metascraperTitle from 'metascraper-title';
 import metascraperUrl from 'metascraper-url';
 import sanitize from 'sanitize-html';
 
-import { extract } from '@extractus/article-extractor';
+import { extract, extractFromHtml } from '@extractus/article-extractor';
 
 import type { Metadata } from '$lib/types/Metadata.type';
 
@@ -41,7 +41,19 @@ const metascraperScraper = async (html: string, url: string): Promise<Partial<Me
 };
 
 const articleExtractorScraper = async (html: string, url: string): Promise<Partial<Metadata>> => {
-	const articleExtractorMetadata = await extract(html || url);
+	let articleExtractorMetadata;
+
+	if (html !== '') {
+		articleExtractorMetadata = await extractFromHtml(html, url).catch((error) => {
+			console.error('articleExtractorScraper.extractFromHtml', error);
+			return null;
+		});
+	} else {
+		articleExtractorMetadata = await extract(url).catch((error) => {
+			console.error('articleExtractorScraper.extract', error);
+			return null;
+		});
+	}
 
 	return {
 		url: articleExtractorMetadata?.url,
@@ -128,3 +140,37 @@ export async function getMetadata(url: string) {
 		icon_url: faviconMetadata?.icon_url || ''
 	};
 }
+
+export async function getMetadataFromHtml(html: string, url: string) {
+	const metascraperMetadata = await metascraperScraper(html, url);
+	const articleExtractorMetadata = await articleExtractorScraper(html, url);
+	const faviconMetadata = await faviconScraper(html, url);
+
+	const firstParagraph = faviconMetadata.content_html?.match(/<p[^>]*>(.*?)<\/p>/)?.[1];
+
+	const domain = new URL(url).hostname.replace('www.', '');
+	const content_text = articleExtractorMetadata?.content_html
+		? htmlToText(articleExtractorMetadata.content_html) || htmlToText(html)
+		: '';
+
+	return {
+		url: metascraperMetadata?.url || articleExtractorMetadata?.url || '',
+		domain,
+		title: metascraperMetadata?.title || articleExtractorMetadata?.title || '',
+		description:
+			metascraperMetadata?.description ||
+			articleExtractorMetadata?.description ||
+			firstParagraph ||
+			'',
+		author: metascraperMetadata?.author || articleExtractorMetadata?.author || '',
+		content_text,
+		content_html: articleExtractorMetadata?.content_html || sanitizeHtml(html) || '',
+		content_type: '',
+		content_published_date: metascraperMetadata?.content_published_date || '',
+		main_image: '',
+		main_image_url:
+			metascraperMetadata?.main_image_url || articleExtractorMetadata?.main_image_url || '',
+		icon: '',
+		icon_url: faviconMetadata?.icon_url || ''
+	};
+}

src/lib/utils/url-data-to-blob-converter.ts

@@ -0,0 +1,14 @@
+export const urlDataToBlobConverter = (urlData: string): Blob => {
+	const splittedData = urlData.split(',');
+	const byteCharacters = atob(splittedData[1]);
+	const mimeString = splittedData[0].split(':')[1].split(';')[0];
+	const byteNumbers = new Array(byteCharacters.length);
+	for (let i = 0; i < byteCharacters.length; i++) {
+		byteNumbers[i] = byteCharacters.charCodeAt(i);
+	}
+	const byteArray = new Uint8Array(byteNumbers);
+
+	const convertedBlob = new Blob([byteArray], { type: mimeString });
+
+	return convertedBlob;
+};

src/routes/api/api-schema.json

@@ -529,6 +529,10 @@
 					"owner": {
 						"type": "string",
 						"description": "Bookmark owner ID"
+					},
+					"screenshot": {
+						"type": "string",
+						"description": "Bookmarked page screenshot URL"
 					}
 				}
 			},
@@ -674,6 +678,11 @@
 						"optional": true,
 						"description": "Bookmark icon URL"
 					},
+					"icon": {
+						"type": "string",
+						"optional": true,
+						"description": "Bookmark icon, mainly used by web extension (data URL)"
+					},
 					"main_image_url": {
 						"type": "string",
 						"optional": true,
@@ -699,6 +708,11 @@
 						"items": {
 							"$ref": "#/components/schemas/TagCreateDto"
 						}
+					},
+					"screenshot": {
+						"type": "string",
+						"optional": true,
+						"description": "Screenshot of bookmarked page, mainly used by web extension (data URL, max 300kb)"
 					}
 				}
 			},
@@ -785,6 +799,11 @@
 						"items": {
 							"$ref": "#/components/schemas/TagCreateDto"
 						}
+					},
+					"screenshot": {
+						"type": "string",
+						"optional": true,
+						"description": "Screenshot of bookmarked page, mainly used by web extension (data URL, max 300kb)"
 					}
 				}
 			},
@@ -874,14 +893,8 @@
 				}
 			},
 			"TagCreateDto": {
-				"type": "object",
-				"description": "Bookmark tag",
-				"properties": {
-					"name": {
-						"type": "string",
-						"description": "Tag name"
-					}
-				}
+				"type": "string",
+				"description": "Bookmark tag"
 			}
 		},
 		"responses": {

src/routes/api/auth/+server.ts

@@ -29,9 +29,9 @@ export const POST: RequestHandler = async ({ locals, request }) => {
 	const { login, password } = value;
 
 	try {
-		const authReponse = await locals.pb.collection('users').authWithPassword(login, password);
+		const authResponse = await locals.pb.collection('users').authWithPassword(login, password);
 
-		const { token } = authReponse;
+		const { token } = authResponse;
 
 		return json(
 			{