fix link unreachable error not handled properly

packages/web/src/api.ts

@@ -4,7 +4,7 @@ import { useEffect } from "react"
 
 enum ApiErrorCode {
 	BadRequestBody = "BadRequestBody",
-	WebsiteUnreachable = "WebsiteUnreachable",
+	LinkUnreachable = "LinkUnreachable",
 	UnsupportedWebsite = "UnsupportedWebsite",
 }
 

packages/web/src/app/bookmarks/-bookmark-list.tsx

@@ -339,7 +339,15 @@ function BookmarkTagList({ bookmark }: { bookmark: Bookmark }) {
 		case "pending":
 			return <LoadingSpinner />
 		case "success":
-			return <p className="my-2 text-sm">{tags.map((tag) => `#${tag.name}`).join(" ")}</p>
+			return (
+				<div className="flex flex-row flex-wrap space-x-2">
+					{tags.map((tag) => (
+						<Link key={tag.id} to={`/bookmarks?tags=${tag.name}`}>
+							#{tag.name}
+						</Link>
+					))}
+				</div>
+			)
 		case "error":
 			return null
 	}

packages/web/src/app/bookmarks/-dialogs/add-bookmark-dialog.tsx

@@ -40,7 +40,7 @@ function AddBookmarkDialog() {
 	const getTags = useAtomCallback(
 		useCallback((get) => {
 			const value = get(tagsInputValueAtom)
-			return value.split(" ")
+			return value.trim().split(" ")
 		}, []),
 	)
 
@@ -77,7 +77,7 @@ function AddBookmarkDialog() {
 				await createBookmarkMutation.mutateAsync({ url, tags: getTags(), force: isWebsiteUnreachable })
 				setActiveDialog(ActiveDialog.None)
 			} catch (error) {
-				if (error instanceof BadRequestError && error.code === ApiErrorCode.WebsiteUnreachable) {
+				if (error instanceof BadRequestError && error.code === ApiErrorCode.LinkUnreachable) {
 					setIsWebsiteUnreachable(true)
 				} else {
 					setIsWebsiteUnreachable(false)

packages/web/src/app/bookmarks/index.tsx

@@ -35,9 +35,12 @@ function BookmarkListPane() {
 }
 
 function BookmarkListContainer() {
-	const { data: bookmarks, status } = useAuthenticatedQuery(["bookmarks"], () =>
-		fetchApi("/bookmarks").then((res) => res.json()),
-	)
+	const searchParams = Route.useSearch()
+	const { data: bookmarks, status } = useAuthenticatedQuery(["bookmarks"], () => {
+		const params = new URLSearchParams(searchParams)
+		console.log("params", params)
+		return fetchApi(params.size > 0 ? `/bookmarks?${params.toString()}` : "/bookmarks").then((res) => res.json())
+	})
 	const handleBookmarkListItemAction = useBookmarkPageStore((state) => state.handleBookmarkListItemAction)
 
 	switch (status) {