* feat: added themes system * feat: smart sidebar auto-hide for files/diff tabs + lower files sidebar threshold * feat: added Checkbox component and update theming - Add reusable Checkbox component for toggles across UI - Replace several inputs with Checkbox in settings and commands panels - Add DiffIcon and apply surface/border theming to key UI areas * feat: Add convert-vscode-theme.cjs to convert VS Code themes to OpenChamber format * refactor: remove unused permission logic from ChatInput - Remove unused permission rules parsing logic from ChatInput - Memoize renderTheme in DiffWorkerProvider to avoid unnecessary recalculations - Remove forceOpaque helper in vscode theme adapter * fix: guard VSCode theme loading in MarkdownRenderer * feat: add custom user themes loading and reload - Load user themes from ~/.config/openchamber/themes at runtime - Expose /api/config/themes to fetch custom themes - Allow theme reloading from Settings → Theme → Reload themes in the UI
49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import React from 'react';
|
|
|
|
import { OpenChamberLogo } from '@/components/ui/OpenChamberLogo';
|
|
import { TextLoop } from '@/components/ui/TextLoop';
|
|
import { useThemeSystem } from '@/contexts/useThemeSystem';
|
|
|
|
const phrases = [
|
|
"Fix the failing tests",
|
|
"Refactor this to be more readable",
|
|
"Add form validation",
|
|
"Optimize this function",
|
|
"Write tests for this",
|
|
"Explain how this works",
|
|
"Add a new feature",
|
|
"Help me debug this",
|
|
"Review my code",
|
|
"Simplify this logic",
|
|
"Add error handling",
|
|
"Create a new component",
|
|
"Update the documentation",
|
|
"Find the bug here",
|
|
"Improve performance",
|
|
"Add type definitions",
|
|
];
|
|
|
|
const ChatEmptyState: React.FC = () => {
|
|
const { currentTheme } = useThemeSystem();
|
|
|
|
// Use theme's muted foreground for secondary text
|
|
const textColor = currentTheme?.colors?.surface?.mutedForeground || 'var(--muted-foreground)';
|
|
|
|
return (
|
|
<div className="flex flex-col items-center justify-center min-h-full w-full gap-6">
|
|
<OpenChamberLogo width={140} height={140} className="opacity-20" isAnimated />
|
|
<TextLoop
|
|
className="text-body-md"
|
|
interval={4}
|
|
transition={{ duration: 0.5 }}
|
|
>
|
|
{phrases.map((phrase) => (
|
|
<span key={phrase} style={{ color: textColor }}>"{phrase}…"</span>
|
|
))}
|
|
</TextLoop>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default React.memo(ChatEmptyState);
|