'use client'

import { TrendingUp, DollarSign, BarChart3 } from 'lucide-react'

import { Card } from '@/components/ui/card'

import type { ExchangeTabProps } from '../types/exchange.types'

export function ExchangeInvestmentsTab(_props: ExchangeTabProps) {
  return (
    <div className="h-full flex flex-col space-y-4 overflow-hidden">
      {/* Заголовок с иконкой */}
      <div className="flex items-center space-x-3 flex-shrink-0 mb-4">
        <TrendingUp className="h-6 w-6 text-green-400" />
        <div>
          <h3 className="text-lg font-semibold text-white">Инвестиции</h3>
          <p className="text-white/60 text-sm">Инвестиционные возможности и проекты</p>
        </div>
      </div>

      {/* Контент раздела */}
      <div className="flex-1 overflow-auto space-y-4">
        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
          <Card className="bg-white/5 backdrop-blur border-white/10 p-6">
            <div className="flex items-center space-x-3 mb-4">
              <DollarSign className="h-8 w-8 text-green-400" />
              <h4 className="text-lg font-semibold text-white">Инвестиционные проекты</h4>
            </div>
            <p className="text-white/60 text-sm">
              Поиск и анализ перспективных инвестиционных проектов в сфере логистики и e-commerce
            </p>
          </Card>

          <Card className="bg-white/5 backdrop-blur border-white/10 p-6">
            <div className="flex items-center space-x-3 mb-4">
              <BarChart3 className="h-8 w-8 text-blue-400" />
              <h4 className="text-lg font-semibold text-white">Аналитика рынка</h4>
            </div>
            <p className="text-white/60 text-sm">
              Исследования и аналитические отчёты для принятия инвестиционных решений
            </p>
          </Card>

          <Card className="bg-white/5 backdrop-blur border-white/10 p-6">
            <div className="flex items-center space-x-3 mb-4">
              <TrendingUp className="h-8 w-8 text-purple-400" />
              <h4 className="text-lg font-semibold text-white">Доходность</h4>
            </div>
            <p className="text-white/60 text-sm">Отслеживание доходности инвестиций и планирование бюджета</p>
          </Card>
        </div>

        <div className="text-center py-8">
          <div className="w-16 h-16 bg-white/10 rounded-full flex items-center justify-center mx-auto mb-4">
            <TrendingUp className="h-8 w-8 text-white/40" />
          </div>
          <p className="text-white/60 text-lg mb-2">Раздел в разработке</p>
          <p className="text-white/40 text-sm">Функционал инвестиций будет доступен в ближайших обновлениях</p>
        </div>
      </div>
    </div>
  )
}