import React from 'react';
import { Welcome, Prompts } from '@ant-design/x';

const examplePrompts = [
  { key: '1', label: '总结当前工作区', description: '分析项目结构和代码' },
  { key: '2', label: '帮我写一个测试', description: '为指定模块生成测试用例' },
  { key: '3', label: '查找 Bug', description: '检查代码中的潜在问题' },
];

interface WelcomeScreenProps {
  onSelect: (prompt: string) => void;
}

const WelcomeScreen: React.FC<WelcomeScreenProps> = ({ onSelect }) => {
  return (
    <div style={{
      flex: 1,
      display: 'flex',
      flexDirection: 'column',
      alignItems: 'center',
      justifyContent: 'center',
      padding: 48,
    }}>
      <Welcome
        icon="🐾"
        title="Claw Code"
        description="本地编码助手，连接你的 Claw Server"
        style={{ marginBottom: 32 }}
      />
      <Prompts
        title="试试这些"
        items={examplePrompts}
        onItemClick={(info) => {
          onSelect(String(info.data.label));
        }}
      />
    </div>
  );
};

export default WelcomeScreen;