"use client"

import { useState } from 'react'
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
import { Card } from '@/components/ui/card'
import { Sidebar } from '@/components/dashboard/sidebar'
import { MarketProducts } from './market-products'
import { MarketCategories } from './market-categories'
import { MarketRequests } from './market-requests'
import { MarketInvestments } from './market-investments'
import { MarketBusiness } from './market-business'
import { FavoritesDashboard } from '../favorites/favorites-dashboard'

export function MarketDashboard() {
  const [productsView, setProductsView] = useState<'categories' | 'products' | 'cart' | 'favorites'>('categories')
  const [selectedCategory, setSelectedCategory] = useState<{ id: string; name: string } | null>(null)

  const handleSelectCategory = (categoryId: string, categoryName: string) => {
    setSelectedCategory({ id: categoryId, name: categoryName })
    setProductsView('products')
  }

  const handleBackToCategories = () => {
    setProductsView('categories')
    setSelectedCategory(null)
  }

  const handleShowCart = () => {
    setProductsView('cart')
    setSelectedCategory(null)
  }

  const handleShowFavorites = () => {
    setProductsView('favorites')
    setSelectedCategory(null)
  }

  return (
    <div className="h-screen flex overflow-hidden">
      <Sidebar />
      <main className="flex-1 ml-56 px-6 py-4 overflow-hidden">
        <div className="h-full w-full flex flex-col">
          {/* Основной контент с табами */}
          <div className="flex-1 overflow-hidden">
            <Tabs 
              defaultValue="investments" 
              className="h-full flex flex-col"
              onValueChange={(value) => {
                if (value === 'products') {
                  // Сбрасываем состояние когда переходим на вкладку товаров
                  setProductsView('categories')
                  setSelectedCategory(null)
                }
              }}
            >
              <TabsList className="grid w-full grid-cols-4 bg-white/5 backdrop-blur border-white/10 flex-shrink-0">
                <TabsTrigger 
                  value="investments" 
                  className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
                >
                  Инвестиции
                </TabsTrigger>
                <TabsTrigger 
                  value="business" 
                  className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
                >
                  Бизнес
                </TabsTrigger>
                <TabsTrigger 
                  value="products" 
                  className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
                >
                  Товары
                </TabsTrigger>
                <TabsTrigger 
                  value="requests" 
                  className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70"
                >
                  Заявки
                </TabsTrigger>
              </TabsList>

              <TabsContent value="investments" className="flex-1 overflow-hidden mt-6">
                <Card className="glass-card h-full overflow-hidden p-6">
                  <MarketInvestments />
                </Card>
              </TabsContent>

              <TabsContent value="business" className="flex-1 overflow-hidden mt-6">
                <Card className="glass-card h-full overflow-hidden p-6">
                  <MarketBusiness />
                </Card>
              </TabsContent>

              <TabsContent value="requests" className="flex-1 overflow-hidden mt-6">
                <Card className="glass-card h-full overflow-hidden p-6">
                  <MarketRequests />
                </Card>
              </TabsContent>

              <TabsContent value="products" className="flex-1 overflow-hidden mt-6">
                <Card className="glass-card h-full overflow-hidden p-0">
                  {productsView === 'categories' ? (
                    <MarketCategories onSelectCategory={handleSelectCategory} onShowCart={handleShowCart} onShowFavorites={handleShowFavorites} />
                  ) : productsView === 'products' ? (
                    <MarketProducts 
                      selectedCategoryId={selectedCategory?.id}
                      selectedCategoryName={selectedCategory?.name}
                      onBackToCategories={handleBackToCategories}
                    />
                  ) : productsView === 'cart' ? (
                    <MarketRequests onBackToCategories={handleBackToCategories} />
                  ) : (
                    <FavoritesDashboard onBackToCategories={handleBackToCategories} />
                  )}
                </Card>
              </TabsContent>
            </Tabs>
          </div>
        </div>
      </main>
    </div>
  )
}