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.
## ✨ Core Features
-**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/`).
***⚡ 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.
## 🚀 Setup
***🔄 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.
```bash
***🏷️ Intelligent Tagging**: Tag notes on the fly with a smart, autocomplete-enabled chip interface.
# Install dependencies
npm install
## 🛠️ Tech Stack
# Build extension
***Framework**: React 18
npm run build
***Build Tool**: Vite (optimized for Chrome Extension V3)
5. Click "Save" → Done! Note sẽ được bắn đồng thời về 2 backend.
```bash
npm install
## 🏗️ Structure
```
```
3. **Build the extension:**
extension/
```bash
├── src/
npm run build
│ ├── content/ # Content script (detect text selection)
```
│ ├── popup/ # Popup UI (React)
*This will compile the TypeScript, bundle the React components, and output the final extension files into the `dist/` directory.*
│ ├── components/ # React components
│ ├── background/ # Service worker (Dual write logic here)
### Load into Chrome
│ └── shared/ # Shared code (API client)
├── manifest.json # Extension config
1. Open Google Chrome and navigate to `chrome://extensions/`.
└── vite.config.ts # Build config
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.
## ⚙️ Config
## 🎯 Usage Guide
### Backend URL
Sửa trong `src/shared/api-client.ts`:
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.
```typescript
2. **Highlight & Save**: On any webpage, highlight a block of text.
constDEFAULT_API_BASE_URL='http://160.191.50.138:3001';// Thay đổi URL backend
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.