49 lines
1.8 KiB
TypeScript
49 lines
1.8 KiB
TypeScript
import { useI18n } from '../../i18n';
|
|
|
|
export default function ChatEmptyState() {
|
|
const { t } = useI18n();
|
|
|
|
const suggestions = [
|
|
{
|
|
key: 'task',
|
|
title: t('conversation.emptyState.suggestions.task.title'),
|
|
},
|
|
{
|
|
key: 'continuous',
|
|
title: t('conversation.emptyState.suggestions.continuous.title'),
|
|
},
|
|
{
|
|
key: 'parallel',
|
|
title: t('conversation.emptyState.suggestions.parallel.title'),
|
|
},
|
|
] as const;
|
|
|
|
return (
|
|
<div className="flex min-h-full items-center justify-center">
|
|
<div className="flex w-full max-w-4xl flex-col items-center justify-center text-center">
|
|
<div className="h-[clamp(280px,48vh,520px)] w-full px-6 dark:bg-[radial-gradient(circle_at_top,rgba(49,73,109,0.24)_0%,rgba(24,24,27,0)_60%)]">
|
|
<div className="mx-auto flex h-full max-w-3xl flex-col items-center justify-center">
|
|
<h2
|
|
className="text-[clamp(40px,7vw,72px)] font-medium leading-[1.1] tracking-[-0.05em] text-[#2F3542] dark:text-[#E5E7EB]"
|
|
style={{ fontFamily: 'Georgia, "Songti SC", "STSong", serif' }}
|
|
>
|
|
{t('conversation.emptyState.title')}
|
|
</h2>
|
|
|
|
<div className="mt-9 flex max-w-3xl flex-wrap items-center justify-center gap-3">
|
|
{suggestions.map((suggestion) => (
|
|
<div
|
|
key={suggestion.key}
|
|
className="rounded-full border border-[#D8DEE8] bg-white/78 px-6 py-2 text-[15px] font-semibold text-[#4B5563] shadow-[0_8px_20px_rgba(15,23,42,0.04)] dark:border-[#3a3a40] dark:bg-[#202024] dark:text-gray-300"
|
|
>
|
|
{suggestion.title}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|