Implement: Clipboard Copy Functionality

[dokterbob]

Objective

Replace Flowbite Clipboard component with native clipboard API implementation.

Component Location

• AIMessageActions.svelte - Copy message to clipboard

Current Implementation

• Uses Flowbite Clipboard component
• Embedded variant for icon buttons
• Shows success state after copy

Implementation Approach

async function copyToClipboard(text: string) {
  await navigator.clipboard.writeText(text);
  // Show success state
  copied = true;
  setTimeout(() => copied = false, 2000);
}

Tasks

• Create clipboard utility function
• Implement copy button with state management
• Add success feedback (icon change or tooltip)
• Handle clipboard API errors
• Test browser compatibility
• Add fallback for older browsers if needed

UI States

1. Default: Copy icon (Clipboard from Lucide)
2. Success: Check icon with timeout
3. Error: Show error tooltip

Acceptance Criteria

• Text copies successfully
• Visual feedback on copy
• Error handling for failed copies
• Works across browsers