Copilot Chat

@workspace How is authentication implemented in this project?

@workspace What files handle payment processing?

@workspace Where are API routes defined?

@vscode How do I change the color theme?

@vscode What's the shortcut for multi-cursor editing?

@vscode How do I configure auto-save?

@terminal How do I find all .log files recursively?

@terminal What's the command to show disk usage?

@terminal How do I kill a process on port 3000?

/explain

Copilot: This function implements the Fisher-Yates shuffle algorithm.
It iterates through the array from the end, swapping each element
with a randomly selected element from the unshuffled portion.
Time complexity: O(n), Space complexity: O(1).

/fix This code throws a null pointer exception

Copilot: The issue is that `user` might be null. Here's the fix:

```typescript
// Before
const name = user.name.toLowerCase()

// After
const name = user?.name?.toLowerCase() ?? ''

### /tests

Generate tests for selected code:

describe('calculateDiscount', () => {
  it('applies percentage discount correctly', () => {
    expect(calculateDiscount(100, 10)).toBe(90)
  })

  it('handles zero discount', () => {
    expect(calculateDiscount(100, 0)).toBe(100)
  })

  it('handles 100% discount', () => {
    expect(calculateDiscount(100, 100)).toBe(0)
  })
})

### /doc

Generate documentation:

/**
 * Calculates the total price including tax and discounts.
 *
 * @param items - Array of cart items with price and quantity
 * @param taxRate - Tax rate as a decimal (e.g., 0.08 for 8%)
 * @param discountCode - Optional discount code to apply
 * @returns The total price in cents
 * @throws {InvalidDiscountError} If discount code is invalid
 *
 * @example
 * const total = calculateTotal(cartItems, 0.08, 'SAVE10')
 */

### /simplify

Simplify complex code:

### /new

Start a new conversation:

### /clear

Clear conversation history:

## Contextual Conversations

### Using Selection

Select code before asking:

```python
# Select this function:
def process_orders(orders):
    results = []
    for order in orders:
        if order.status == 'pending':
            result = process_single_order(order)
            results.append(result)
    return results

# Then ask:
"How can I make this more efficient using list comprehension?"

# Copilot responds with context-aware suggestion

You: How do I add rate limiting to my Express API?

Copilot: [Explains express-rate-limit package]

You: Can you show me how to apply different limits per route?

Copilot: [Shows route-specific configuration]

You: How do I store rate limit data in Redis instead of memory?

Copilot: [Shows Redis store configuration]

Looking at #file:src/auth/login.ts and #file:src/middleware/auth.ts,
how can I add JWT refresh token rotation?

Select complex code and ask:

"Explain this regular expression step by step"
"What does this algorithm do?"
"Why is this implementation thread-safe?"

I'm getting this error: [paste error]
Here's the relevant code: [select code]
What's causing this?

Copilot: The error occurs because... Here's the fix:

"How should I structure a microservices authentication system?"
"What's the best way to implement optimistic updates in React?"
"How do I handle file uploads with progress tracking?"

Select code and ask:

"Review this code for potential issues"
"Are there any security vulnerabilities here?"
"How can I improve the performance of this function?"

"How can I refactor this class to use composition instead of inheritance?"
"Convert this callback-based code to async/await"
"Extract the common logic into a reusable hook"

@workspace What design patterns are used in this codebase?

@workspace Show me the data flow from API to UI for user creation

@workspace What are the dependencies between these modules?

What's the difference between these two implementations?
#file:src/v1/handler.ts vs #file:src/v2/handler.ts

Explain like I'm new to TypeScript:
What is a generic type and when should I use one?

Can you explain with a simple example first, then a real-world use case?

Create a React form component that:
- Uses react-hook-form for form state
- Validates with zod
- Handles submission errors
- Shows loading state
- Is accessible (ARIA labels)

Use Tailwind CSS for styling.

❌ "Fix this code"
✅ "Fix the null pointer exception on line 23"

❌ "Make this better"
✅ "Optimize this function for memory usage"

❌ "Add tests"
✅ "Add unit tests covering edge cases for empty arrays and null inputs"

❌ "How do I connect to the database?"
✅ "How do I connect to PostgreSQL using Prisma in this Next.js project? @workspace"

❌ "Why isn't this working?"
✅ "This code returns undefined instead of the user object.
   I expect it to return the user after fetching from /api/users.
   Here's the error from the console: [error]"

Initial: "Create a login form"

Follow-up 1: "Add email validation"

Follow-up 2: "Include a 'remember me' checkbox"

Follow-up 3: "Add social login buttons"

# Quick actions
/explain  - Understand code
/fix      - Fix issues
/tests    - Generate tests
/doc      - Add documentation
/simplify - Reduce complexity

If conversation gets long:
1. Use /new to start fresh
2. Be more concise in questions
3. Reference specific files instead of pasting code
4. Break complex tasks into smaller conversations

{
  // Language for responses
  "github.copilot.chat.localeOverride": "en",

  // Where to show chat
  "github.copilot.chat.defaultLocation": "panel",

  // Response length
  "github.copilot.chat.useProjectTemplates": true
}

# Copilot Instructions

## Code Style
- Use TypeScript strict mode
- Prefer functional components
- Use named exports

## Frameworks
- React 18 with hooks
- Next.js App Router
- Tailwind CSS

## Testing
- Use Vitest for unit tests
- React Testing Library for components
- Playwright for E2E