A modern, privacy-first browser extension designed for seamless, distraction-free note-taking directly from your active web pages. Built specifically for integration with the **Memos** backend infrastructure.
-**Bôi đen & Lưu Nhanh**: Tự động hiện popup khi bôi đen text trên web.
-**Tự Động Sync Auth**: Tự động lấy Clerk JWT session từ các tab OpenNotion đang mở.
-**Dual Write Sync**: Tự động lưu note song song về server chính và server tuỳ chỉnh (hiện tại: `http://172.16.2.210:5230/`).
## ✨ Core Features
## 🚀 Setup
***⚡ Lightning Fast Capture**: Highlight any text on a web page and press `Space` or `Enter` to instantly save it as a note. No context switching required.
***🔗 Smart Source Tracking**: Automatically captures and appends the source URL and page title to your notes.
***🔄 Zero-Click Authentication**: Seamlessly extracts and syncs your `memos.access-token` directly from active Canifa Note/Memos tabs. No secondary login required.
***🎨 Premium UI/UX**: Fully redesigned using the **shadcn/ui** design system, featuring a sleek, dark-first interface with Canifa brand aesthetics.
***🏷️ Intelligent Tagging**: Tag notes on the fly with a smart, autocomplete-enabled chip interface.
```bash
# Install dependencies
npm install
## 🛠️ Tech Stack
# Build extension
npm run build
***Framework**: React 18
***Build Tool**: Vite (optimized for Chrome Extension V3)
5. Click "Save" → Done! Note sẽ được bắn đồng thời về 2 backend.
2. **Install dependencies:**
```bash
npm install
```
## 🏗️ Structure
3. **Build the extension:**
```bash
npm run build
```
*This will compile the TypeScript, bundle the React components, and output the final extension files into the `dist/` directory.*
```
### Load into Chrome
1. Open Google Chrome and navigate to `chrome://extensions/`.
2. Enable **Developer mode**(toggle in the top right corner).
3. Click **Load unpacked**.
4. Select the `dist/` folder that was generated in the build step.
## 🎯 Usage Guide
1. **Log In to Backend**: Open your Canifa Note (Memos) instance at `http://172.16.2.210:5230/` and log in. The extension will automatically detect your session.
2. **Highlight & Save**: On any webpage, highlight a block of text.
3. **Shortcut**: Press `Space` or `Enter`. A success notification ("✓ Đã lưu vào Canifa Note") will appear, confirming your note has been saved to the server.
4. **Manual Entry**: Click the extension icon in your browser toolbar to open the quick-entry popup.
## 🏗️ Project Structure
```text
extension/
├── public/ # Static assets (icons, images)
├── src/
│ ├── content/ # Content script (detect text selection)
│ ├── popup/ # Popup UI (React)
│ ├── components/ # React components
│ ├── background/ # Service worker (Dual write logic here)
│ └── shared/ # Shared code (API client)
├── manifest.json # Extension config
└── vite.config.ts # Build config
│ ├── background/ # Service worker (Token management & API calls)