mirror of
https://github.com/leonvanzyl/autocoder.git
synced 2026-02-01 23:13:36 +00:00
Migrate UI component library from custom implementations to shadcn/ui: - Add shadcn/ui primitives (Button, Card, Dialog, Input, etc.) - Replace custom styles with Tailwind CSS v4 theme configuration - Remove custom-theme.css in favor of globals.css with @theme directive Fix scroll overflow issues in multiple components: - ProjectSelector: "New Project" button no longer overlays project list - FolderBrowser: folder list now scrolls properly within modal - AgentCard: log modal content stays within bounds - ConversationHistory: conversation list scrolls correctly - KanbanColumn: feature cards scroll within fixed height - ScheduleModal: schedule form content scrolls properly Key technical changes: - Replace ScrollArea component with native overflow-y-auto divs - Add min-h-0 to flex containers to allow proper shrinking - Restructure dropdown layouts with flex-col for fixed footers New files: - ui/components.json (shadcn/ui configuration) - ui/src/components/ui/* (20 UI primitive components) - ui/src/lib/utils.ts (cn utility for class merging) - ui/tsconfig.app.json (app-specific TypeScript config) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
26 lines
777 B
TypeScript
26 lines
777 B
TypeScript
/**
|
|
* Floating Action Button for toggling the Assistant panel
|
|
*/
|
|
|
|
import { MessageCircle, X } from 'lucide-react'
|
|
import { Button } from '@/components/ui/button'
|
|
|
|
interface AssistantFABProps {
|
|
onClick: () => void
|
|
isOpen: boolean
|
|
}
|
|
|
|
export function AssistantFAB({ onClick, isOpen }: AssistantFABProps) {
|
|
return (
|
|
<Button
|
|
onClick={onClick}
|
|
size="icon"
|
|
className="fixed bottom-6 right-6 z-50 w-14 h-14 rounded-full shadow-lg hover:shadow-xl transition-all duration-200 hover:-translate-y-0.5 active:translate-y-0.5"
|
|
title={isOpen ? 'Close Assistant (Press A)' : 'Open Assistant (Press A)'}
|
|
aria-label={isOpen ? 'Close Assistant' : 'Open Assistant'}
|
|
>
|
|
{isOpen ? <X size={24} /> : <MessageCircle size={24} />}
|
|
</Button>
|
|
)
|
|
}
|