AI Context Button - Implementation Spec

# Create Custom AI Context Button for Formatting Toolbar

## Description

Create a custom button for the BlockNote formatting toolbar that allows users to add selected content to the AI context. This button should extract the selected text from the editor and add it to the AI context array using the `addToContext` function.

## Requirements

1. **Create a new component** `AIContextButton.tsx` in `frontend/src/components/`
2. **Follow the pattern** used in `BlueButton.tsx` as a reference
3. **Button functionality:**

- Should appear in the formatting toolbar when text is selected
- On click, extract the selected text content from the editor
- Add the selected text to the AI context using `addToContext` from `useAIContext` hook
- Should only render when text with inline content is selected (similar to BlueButton)

4. **Integration:**

- Add the button to the `FormattingToolbar` in `Editor.tsx`
- Place it in a logical position within the toolbar

5. **Verification:**
- After clicking the button, verify that the selected text appears in the `AIContextDisplay` component below the editor
- Test with various selections (single words, sentences, paragraphs)

## Technical Details

### Reference Files

- **Example component:** `frontend/src/components/BlueButton.tsx`
- **Editor integration:** `frontend/src/components/Editor.tsx`
- **Context hook:** `frontend/src/contexts/AIContext.tsx` - use `useAIContext()` hook
- **Display component:** `frontend/src/components/AIContextDisplay.tsx` - verify content appears here

### BlockNote Hooks to Consider

- `useBlockNoteEditor()` - get the editor instance
- `useSelectedBlocks()` - get currently selected blocks
- `useComponentsContext()` - access formatting toolbar button component
- Check BlockNote documentation for extracting text content from blocks

### Implementation Steps

1. Create `AIContextButton.tsx` component
2. Import necessary hooks from `@blocknote/react`
3. Import `useAIContext` from `@/contexts/AIContext`
4. Implement conditional rendering (only show when text is selected and formatting toolbar pops up)
5. Extract selected text content from blocks
6. Call `addToContext` with the extracted text on button click
7. Add the button to `Editor.tsx` formatting toolbar
8. Test the functionality

## Acceptance Criteria

- [ ] Button appears in formatting toolbar when text is selected
- [ ] Button has appropriate tooltip (e.g., "Add to AI Context")
- [ ] Clicking button extracts selected text correctly
- [ ] Selected text is added to AI context array
- [ ] Added text appears in `AIContextDisplay` component below editor
- [ ] Button follows same styling/pattern as other toolbar buttons
- [ ] Code follows existing code style and patterns

## Notes

- The AI context is already set up and available via `useAIContext()` hook
- The `AIContextDisplay` component will automatically update when context is added
- Consider edge cases: empty selections, multiple blocks selected, etc.
- You may need to convert block content to plain text string format

Feel free to ask!