Built a complete Netflix-style streaming interface for IndeeHub's decentralized media platform with real film content. Features: - Vue 3 + TypeScript + Vite setup with hot module reloading - Netflix-inspired UI with hero section and horizontal scrolling content rows - Glass morphism design system with custom Tailwind configuration - 20+ real IndeeHub films organized into 6 categories (Bitcoin, Documentaries, Drama, etc.) - Full-featured video player component with custom controls - Mobile-responsive design with bottom navigation - Nostr integration ready (nostr-tools, relay pool, NIP-71 support) - Pinia state management for content - MCP tools configured (Filesystem, Memory, Nostr, Puppeteer) Components: - Browse.vue: Main streaming interface with hero and content rows - ContentRow.vue: Horizontal scrolling film cards with navigation arrows - VideoPlayer.vue: Custom video player with play/pause, seek, volume, fullscreen - MobileNav.vue: Bottom tab navigation for mobile devices Tech Stack: - Frontend: Vue 3 (Composition API), TypeScript - Build: Vite 7 - Styling: Tailwind CSS with custom theme - State: Pinia 3 - Router: Vue Router 4.6 - Protocol: Nostr (nostr-tools 2.22) Design: - 4px grid spacing system - Glass morphism UI components - Netflix-style hero section with featured content - Smooth animations and hover effects - Mobile-first responsive breakpoints - Dark theme with custom color palette Content: - 20+ IndeeHub films with titles, descriptions, categories - Bitcoin documentaries: God Bless Bitcoin, Dirty Coin, Searching for Satoshi - Independent films and documentaries - Working Unsplash CDN images for thumbnails and backdrops Ready for deployment to Umbrel, Start9, and Archy nodes. Co-authored-by: Cursor <cursoragent@cursor.com>
152 lines
3.3 KiB
Markdown
152 lines
3.3 KiB
Markdown
# MCP Tools Setup for Cursor IDE
|
|
|
|
## ✅ Configuration Complete!
|
|
|
|
I've created the MCP configuration file for Cursor IDE at:
|
|
```
|
|
/Users/dorian/Projects/Indeedhub Prototype/.cursor/mcp.json
|
|
```
|
|
|
|
## 🎯 Configured MCP Servers
|
|
|
|
All 8 requested servers are now configured:
|
|
|
|
1. ✅ **Filesystem MCP** - Read/write files in your projects
|
|
2. ✅ **Memory MCP** - Persistent context across sessions
|
|
3. ⚠️ **Nostr MCP** - Nostr integration (needs API key)
|
|
4. ✅ **Playwright MCP** - Browser automation for testing
|
|
5. ⚠️ **PostgreSQL MCP** - Database management (check connection string)
|
|
6. ✅ **Docker MCP** - Container management
|
|
7. ⚠️ **Brave Search MCP** - Web research (needs API key)
|
|
8. ✅ **Fetch MCP** - Web content extraction
|
|
|
|
## 🔑 Required: Add Your API Keys
|
|
|
|
### 1. Nostr Private Key
|
|
Edit `.cursor/mcp.json` and replace:
|
|
```json
|
|
"NOSTR_NSEC_KEY": "YOUR_NOSTR_PRIVATE_KEY_HERE"
|
|
```
|
|
|
|
### 2. Brave Search API Key
|
|
Get your free API key at: https://brave.com/search/api/
|
|
Then replace:
|
|
```json
|
|
"BRAVE_API_KEY": "YOUR_BRAVE_API_KEY_HERE"
|
|
```
|
|
|
|
### 3. PostgreSQL Connection (Optional)
|
|
Update if you have a different database:
|
|
```json
|
|
"postgresql://username:password@host:port/database"
|
|
```
|
|
|
|
## 🚀 How to Activate
|
|
|
|
1. **Edit the config file:**
|
|
```bash
|
|
code .cursor/mcp.json
|
|
```
|
|
|
|
2. **Add your API keys** (see above)
|
|
|
|
3. **Reload Cursor IDE:**
|
|
- Press `Cmd+Shift+P` (Mac) or `Ctrl+Shift+P` (Windows/Linux)
|
|
- Type "Reload Window"
|
|
- Or just restart Cursor
|
|
|
|
4. **Verify installation:**
|
|
- The MCP tools panel should show your connected servers
|
|
- Servers will auto-install on first use via npx
|
|
|
|
## 🧪 Test Your Setup
|
|
|
|
Try these commands in Cursor's AI chat:
|
|
|
|
```
|
|
"List all files in my project"
|
|
"Remember that this is a Vue 3 project with Tailwind CSS"
|
|
"Take a screenshot of github.com"
|
|
"Fetch the content from vuejs.org"
|
|
"List my Docker containers"
|
|
```
|
|
|
|
## 📦 What Each Server Does
|
|
|
|
### Filesystem MCP ✅
|
|
- Read/write files in `/Users/dorian/Projects`
|
|
- Navigate directories
|
|
- Safe file operations
|
|
|
|
### Memory MCP ✅
|
|
- Store facts and context
|
|
- Remember across sessions
|
|
- Knowledge graph queries
|
|
|
|
### Nostr MCP ⚠️ (Needs Key)
|
|
- Post to Nostr network
|
|
- Read from relays
|
|
- Lightning integration
|
|
|
|
### Playwright MCP ✅
|
|
- Browser automation
|
|
- Web testing
|
|
- Screenshots
|
|
|
|
### PostgreSQL MCP ⚠️ (Check Connection)
|
|
- Query databases
|
|
- Schema inspection
|
|
- Secure by default
|
|
|
|
### Docker MCP ✅
|
|
- Manage containers
|
|
- Image operations
|
|
- Network/volume control
|
|
|
|
### Brave Search MCP ⚠️ (Needs Key)
|
|
- Web search
|
|
- Real-time info
|
|
- Research queries
|
|
|
|
### Fetch MCP ✅
|
|
- Fetch web pages
|
|
- Convert to markdown
|
|
- Extract content
|
|
|
|
## 🐛 Troubleshooting
|
|
|
|
### MCP tools not appearing?
|
|
- Check the `.cursor/mcp.json` file syntax (must be valid JSON)
|
|
- Reload Cursor window
|
|
- Check Cursor's output panel for errors
|
|
|
|
### NPX installation issues?
|
|
```bash
|
|
# Ensure Node.js is installed
|
|
node --version
|
|
npm --version
|
|
|
|
# Update if needed
|
|
nvm install --lts
|
|
```
|
|
|
|
### Docker not connecting?
|
|
```bash
|
|
# Start Docker Desktop
|
|
open -a Docker
|
|
|
|
# Verify it's running
|
|
docker ps
|
|
```
|
|
|
|
## 🎉 You're Ready!
|
|
|
|
Once you've:
|
|
1. Added your Nostr private key
|
|
2. Added your Brave Search API key
|
|
3. Reloaded Cursor
|
|
|
|
All 8 MCP servers will be available in your Cursor IDE! 🚀
|
|
|
|
The servers will automatically install when first used (via npx), so no manual installation needed.
|