Cursor Local Workflow

npm install @ewjdev/anyclick-cursor-local

{
  "scripts": {
    "feedback-server": "anyclick-local-server",
    "dev": "concurrently \"npm run feedback-server\" \"next dev\""
  }
}

npm run feedback-server

# Output:
# 🚀 anyclick local server running on http://localhost:3847
# 📁 Feedback files will be saved to: .feedback/
# 🔧 Cursor integration: enabled

'use client';

import { FeedbackProvider, filterMenuItemsByRole } from '@ewjdev/anyclick-react';
import type { FeedbackMenuItem } from '@ewjdev/anyclick-react';
import { createHttpAdapter } from '@ewjdev/anyclick-github';
import { createLocalAdapter } from '@ewjdev/anyclick-cursor-local';
import { Monitor, Cloud, Bug, Lightbulb } from 'lucide-react';

// Production adapter (GitHub)
const githubAdapter = createHttpAdapter({
  endpoint: '/api/feedback',
});

// Development adapter (local Cursor)
const localAdapter = createLocalAdapter({
  serverUrl: 'http://localhost:3847',
  // Path to your project (for Cursor to open)
  projectPath: process.cwd(),
});

// Choose adapter based on environment
const isDev = process.env.NODE_ENV === 'development';

// Menu items with Cursor options
const menuItems: FeedbackMenuItem[] = [
  { type: 'bug', label: 'Report Bug', icon: <Bug className="w-4 h-4" />, showComment: true },
  { type: 'feature', label: 'Suggest Feature', icon: <Lightbulb className="w-4 h-4" />, showComment: true },
  // Cursor options (dev only)
  ...(isDev ? [{
    type: 'cursor_menu' as const,
    label: 'Fix with Cursor',
    children: [
      { 
        type: 'cursor_local' as const, 
        label: 'Fix Locally', 
        icon: <Monitor className="w-4 h-4" />,
        showComment: true,
      },
      { 
        type: 'cursor_cloud' as const, 
        label: 'Fix with Cloud Agent', 
        icon: <Cloud className="w-4 h-4" />,
        showComment: true,
      },
    ],
  }] : []),
];

export function Providers({ children }: { children: React.ReactNode }) {
  return (
    <FeedbackProvider 
      adapter={isDev ? localAdapter : githubAdapter}
      menuItems={menuItems}
    >
      {children}
    </FeedbackProvider>
  );
}

import type { FeedbackAdapter, FeedbackPayload } from '@ewjdev/anyclick-core';

// Create a router adapter
function createRoutingAdapter(config: {
  local: FeedbackAdapter;
  github: FeedbackAdapter;
}): FeedbackAdapter {
  return {
    async submit(payload: FeedbackPayload) {
      // Route Cursor types to local adapter
      if (payload.type === 'cursor_local' || payload.type === 'cursor_cloud') {
        return config.local.submit(payload);
      }
      
      // Route everything else to GitHub
      return config.github.submit(payload);
    },
  };
}

const adapter = createRoutingAdapter({
  local: localAdapter,
  github: githubAdapter,
});

<FeedbackProvider adapter={adapter} menuItems={menuItems}>
  {children}
</FeedbackProvider>

module.exports = {
  // Server port (default: 3847)
  port: 3847,
  
  // Directory to save feedback files
  outputDir: '.feedback',
  
  // Cursor CLI command (if not in PATH)
  cursorPath: '/Applications/Cursor.app/Contents/MacOS/Cursor',
  
  // Custom handler when feedback is received
  onFeedback: async (payload, filePath) => {
    console.log(`Feedback saved to: ${filePath}`);
    
    // Optional: trigger custom actions
    // await sendSlackNotification(payload);
  },
  
  // Format the AI prompt
  formatPrompt: (payload) => {
    return `
Fix the following issue in the codebase:

## Problem
${payload.comment || 'User reported an issue with this element'}

## Element
- Selector: ${payload.element.selector}
- Text: ${payload.element.innerText}

## Location
- URL: ${payload.page.url}

Please analyze the code and propose a fix.
    `;
  },
  
  // CORS configuration
  cors: {
    origin: ['http://localhost:3000', 'http://localhost:3001'],
  },
};

{
  "type": "cursor_local",
  "timestamp": "2024-01-15T10:30:00.000Z",
  "comment": "This button should be disabled when form is invalid",
  "page": {
    "url": "http://localhost:3000/checkout",
    "title": "Checkout - My App",
    "viewportWidth": 1920,
    "viewportHeight": 1080
  },
  "element": {
    "selector": "button[data-testid='submit-btn']",
    "tagName": "button",
    "innerText": "Submit Order",
    "dataAttributes": {
      "testid": "submit-btn"
    }
  },
  "prompt": "Fix the following issue..."
}

---
description: Handle anyclick feedback files
globs:
  - .feedback/*.json
---

# Feedback File Processing

When processing anyclick feedback files:

1. Read the feedback JSON to understand the issue
2. Use the `selector` to locate the relevant component
3. Consider the `comment` as the primary issue description
4. Reference the `page.url` for context about where the issue occurs
5. Look at `element.innerText` and `element.dataAttributes` for identification

Always:
- Keep changes minimal and focused on the reported issue
- Preserve existing functionality
- Add appropriate error handling if relevant
- Update tests if the component has them