Set up the complete project foundation for ClawX, a graphical AI assistant: - Electron main process with IPC handlers, menu, tray, and gateway management - React renderer with routing, layout components, and page scaffolding - Zustand state management for gateway, settings, channels, skills, chat, and cron - shadcn/ui components with Tailwind CSS and CSS variable theming - Build tooling with Vite, electron-builder, and TypeScript configuration - Testing setup with Vitest and Playwright - Development configurations (ESLint, Prettier, gitignore, env example)
37 lines
776 B
TypeScript
37 lines
776 B
TypeScript
/**
|
|
* Loading Spinner Component
|
|
* Displays a spinning loader animation
|
|
*/
|
|
import { Loader2 } from 'lucide-react';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
interface LoadingSpinnerProps {
|
|
size?: 'sm' | 'md' | 'lg';
|
|
className?: string;
|
|
}
|
|
|
|
const sizeClasses = {
|
|
sm: 'h-4 w-4',
|
|
md: 'h-8 w-8',
|
|
lg: 'h-12 w-12',
|
|
};
|
|
|
|
export function LoadingSpinner({ size = 'md', className }: LoadingSpinnerProps) {
|
|
return (
|
|
<div className={cn('flex items-center justify-center', className)}>
|
|
<Loader2 className={cn('animate-spin text-primary', sizeClasses[size])} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Full page loading spinner
|
|
*/
|
|
export function PageLoader() {
|
|
return (
|
|
<div className="flex h-full items-center justify-center">
|
|
<LoadingSpinner size="lg" />
|
|
</div>
|
|
);
|
|
}
|