Using the Chat Panel

┌─────────────────────────────────────┐
│ Model: claude-3.5-sonnet     [▾]   │
├─────────────────────────────────────┤
│                                     │
│  Previous messages appear here      │
│                                     │
├─────────────────────────────────────┤
│ @ Add context...                    │
│ ┌─────────────────────────────────┐ │
│ │ Type your message...            │ │
│ └─────────────────────────────────┘ │
└─────────────────────────────────────┘

You: What's the difference between useMemo and useCallback in React?

AI: Great question! Both are React hooks for optimization, but they serve
    different purposes:

    - useMemo: Memoizes a computed value
    - useCallback: Memoizes a function reference

    [detailed explanation with examples...]

You: [code automatically attached]
     What does this code do?

AI: This function implements a debounce utility. Here's how it works:

    1. It takes a function and delay as parameters
    2. It uses a timeout to delay execution
    3. If called again before the delay, it cancels the previous timeout
    ...

You: I'm getting "undefined is not a function" when I call this method.
     [code attached]
     The error happens on line 15.

AI: I see the issue. On line 15, you're trying to call `user.getProfile()`,
    but `user` might be undefined when this runs. Here's how to fix it:

    [solution with explanation...]

You: @api/users.ts @models/user.ts
     How should I add pagination to the user list endpoint?

You: @UserService @fetchUsers
     Can you explain how these work together?

You: @web What are the latest Next.js 15 features?

You: @Docs React Query
     How do I invalidate queries after a mutation?

You: @Codebase Where is user authentication handled?

You: @Git What changed in the last commit?

You: @Definitions User
     I need to add a new field to this type

┌──────────────────────────────────────────┐
│ ```typescript                            │
│ function validateEmail(email: string) {  │
│   const regex = /^[^\s@]+@[^\s@]+$/      │
│   return regex.test(email)               │
│ }                                        │
│ ```                                      │
│ [Copy] [Apply] [Insert at Cursor]        │
└──────────────────────────────────────────┘

You: I'm building a Next.js e-commerce site with Supabase for the backend.
     @api/products.ts
     How should I implement product search with filtering?

You: Write a TypeScript function that validates credit card numbers.
     - Use the Luhn algorithm
     - Accept Visa, Mastercard, and Amex
     - Return an object with isValid and cardType
     - Include JSDoc comments

You: Can you also add expiration date validation?
You: Now show me how to use this in a React form
You: Add error messages for each validation failure

You: Are there other ways to implement this?
     What are the tradeoffs?

You: Explain this line by line for a junior developer
You: What could go wrong with this approach?
You: Are there any edge cases I'm missing?

You: @src/components/UserProfile.tsx
     Review this component for:
     - Performance issues
     - Accessibility problems
     - Best practices

You: I need to add real-time notifications to my app.
     Should I use WebSockets, Server-Sent Events, or polling?
     Consider that I'm using Vercel for hosting.

You: I'm trying to understand React Suspense.
     Can you explain it step by step with simple examples?
     Then show me a practical use case.

You: I'm getting this error when I run npm build:
     [paste error]
     Here's my package.json: @package.json
     What's wrong?

You: I need help with this function:

     ```typescript
     function process(data) { ... }

### Include Error Messages

Always paste the actual error:

### Specify Your Stack

## Summary

- **Cmd+L** opens the Chat panel
- **@ mentions** add specific context (files, symbols, web, docs)
- **Apply** code blocks directly to your editor
- **Iterate** on responses with follow-up questions
- **Choose the right model** for your task
- **Provide context** for better answers

## Next Steps

Chat is great for one-off questions and explanations. For making changes across multiple files simultaneously, Composer is Cursor's most powerful feature.