Forem: Dang Tran

Notion Bookmarks Manager

Dang Tran — Sun, 29 Mar 2026 14:53:58 +0000

This is a submission for the Notion MCP Challenge

What I Built

The web content I browse every day is part of my personal knowledge base — but finding something I read weeks ago is frustratingly hard. I built this Chrome extension to solve that: it saves any page I bookmark directly to Notion, uses AI to generate a summary of the page content, and lets me search across everything I've saved using natural language.

Video Demo

Show us the code

sea2709 / notion-bookmark-manager

Notion Bookmark Manager

A Chrome extension that saves browser tabs to your Notion workspace, with folder organization, notes, AI-generated summaries, and AI-powered search.

Features

Save bookmarks — Save the current tab to a Notion database with a title, URL, and optional notes
Folder tree — Organize bookmarks into nested folders synced from Notion
AI summaries — Optionally generate a page summary using Gemini AI based on a custom prompt
Browse bookmarks — View all your bookmarks grouped by folder in a collapsible tree
Search — Search your Notion bookmarks using natural language via Gemini AI and the Notion MCP

Architecture

Chrome Extension (Manifest V3)
├── popup/          UI for saving, browsing, and searching bookmarks
├── background/     Service worker — routes messages between popup and server
├── shared/         Shared types, constants, and chrome.storage helpers
└── dist/           Built output (load this directory in Chrome)
Local Server (Express)
└── server/         Handles all Notion API

…

View on GitHub

How I Used Notion MCP

MCP (Model Context Protocol) is used only in the searchBookmark function in server/notion-api.ts. It is not used anywhere else — all other Notion operations (create bookmark, fetch folders, etc.) go through the @notionhq/client SDK directly.

How it works

User presses Enter in search
→ popup sends SEARCH_BOOKMARKS message
→ service worker calls POST /call { tool: "search_bookmarks" }
→ server calls searchBookmark()
→ searchBookmark() connects to Notion MCP via npx mcp-remote
→ Gemini AI uses the MCP tools to query Notion
→ AI response text returned to popup

The three components involved (MCP Client, mcpToTool adapter, Gemini)

1.MCP Client (@modelcontextprotocol/sdk)

const notionClient = new McpClient({ name: "notion-client", version: "1.0.0" });
const transport = new StdioClientTransport({
  command: "npx",
  args: ["-y", "mcp-remote", "https://mcp.notion.com/mcp"],
  env: { NOTION_TOKEN: process.env.NOTION_API_KEY },
});
await notionClient.connect(transport);

The MCP client spawns npx mcp-remote as a child process (stdio transport), which acts as a proxy connecting to Notion's official MCP server at https://mcp.notion.com/mcp. This exposes Notion's capabilities (search pages, read content, etc.) as MCP tools.

2.mcpToTool adapter (@google/genai)

config: {
  tools: [mcpToTool(notionClient)],
}

mcpToTool wraps the MCP client so that Gemini can discover and call Notion's MCP tools automatically — Gemini decides which Notion tools to invoke based on the prompt.

3.Gemini as the orchestrator

const prompt = `Search for pages under the database with the ID ${databaseId} mentioning '${keyword}'`;
const response = await ai.models.generateContent({
  model: process.env.GEMINI_MODEL ?? "gemini-2.5-flash",
  contents: prompt,
  config: { tools: [mcpToTool(notionClient)] },
});

Gemini receives the natural language prompt and autonomously calls Notion MCP tools to find relevant pages, then summarizes the results into a text response.

Why MCP for search vs. the SDK for everything else?
The Notion SDK's search() API only matches page titles — it cannot search page body content. Notion's MCP server exposes richer capabilities including content-level search. By routing the query through Gemini + MCP, the search can find bookmarks by their AI-generated summary text, not just the title.

Apparel Shopping - Chatbot

Dang Tran — Mon, 09 Feb 2026 04:08:41 +0000

This is a submission for the Algolia Agent Studio Challenge: Consumer-Facing Conversational Experiences

What I Built

A apparel shopping site with 2 pages (homepage and product details page) and a chatbot assistanting customers looking for products via conversation.

Demo

https://apparel-web.vercel.app/
Source code: https://bitbucket.org/hdang2709/apparel/src/main/

How I Used Algolia Agent Studio

I set up an application in Alogolia, create a new index and use the apparel sample dataset which has 2000 items.

I configure searchable attributes and related facets.

title
description
product_type
color
categories
price
tags

Leverage InstantSearch.js widget to build the UI including a chat widget.

Why Fast Retrieval Matters

The built-in chat widget in InstantSearch.js is very convenient. From the basic coding perspective, all you need are an agent ID and a container element to render to widget to build a chat interface that interacts with a generative AI assistant built with Algolia Agent Studio. And you can focus on constructing constructions and tools for the AI Agent.
Algolia Studio also provides all conversations lists on the site with insights about how the response conducted (Reasoning and Tool used), which is very helpful to configure the Tools and setting up search attributes.

Apparel Shopping

Dang Tran — Mon, 09 Feb 2026 03:09:10 +0000

This is a submission for the Algolia Agent Studio Challenge: Consumer-Facing Non-Conversational Experiences

What I Built

A apparel shopping site with 2 pages (homepage and product details page) and a chatbot assistanting customers looking for products via conversation.

Demo

https://apparel-web.vercel.app/
Source code: https://bitbucket.org/hdang2709/apparel/src/main/

How I Used Algolia Agent Studio

I set up an application in Alogolia, create a new index and use the apparel sample dataset which has 2000 items.

I configure searchable attributes and related facets.

title
description
product_type
color
categories
price
tags

Leverage InstantSearch.js widget to build the UI for list products, refinement, search box, auto complete, chat, etc.

With a traditional shopping site, customers use existing filter widgets to find their products. I added a tweak to let customers using a prompt to filter products by leveraging Generative AI in Algolia Agent Studio. I set up 2 agents, one for the chat and one for the filter functionality. The 2 agents are pretty similar, but the filter agent will not response with follow up questions to clarify some details.

Why Fast Retrieval Matters

Algolia agent can form a query based on the user's prompt or conversation. The query is flexible depending on the indexed data, configurable search attributes.