// src/views/AgentChat/index.js
// Agent聊天页面

import React from 'react';
import {
  Box,
  Container,
  Heading,
  Text,
  VStack,
  useColorModeValue,
} from '@chakra-ui/react';
import { ChatInterfaceV2 } from '../../components/ChatBot';

/**
 * Agent聊天页面
 * 提供基于MCP的AI助手对话功能
 */
const AgentChat = () => {
  const bgColor = useColorModeValue('gray.50', 'gray.900');
  const cardBg = useColorModeValue('white', 'gray.800');

  return (
    <Box minH="calc(100vh - 200px)" bg={bgColor} py={8}>
      <Container maxW="container.xl" h="100%">
        <VStack spacing={6} align="stretch" h="100%">
          {/* 页面标题 */}
          <Box>
            <Heading size="lg" mb={2}>AI投资助手</Heading>
            <Text color="gray.600" fontSize="sm">
              基于MCP协议的智能投资顾问，支持股票查询、新闻搜索、概念分析等多种功能
            </Text>
          </Box>

          {/* 聊天界面 */}
          <Box
            flex="1"
            bg={cardBg}
            borderRadius="xl"
            boxShadow="xl"
            overflow="hidden"
            h="calc(100vh - 300px)"
            minH="600px"
          >
            <ChatInterfaceV2 />
          </Box>
        </VStack>
      </Container>
    </Box>
  );
};

export default AgentChat;