"use client"

import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
import { SmsSettingsForm } from "@/components/dashboard/sms-settings-form"
import { AppearanceForm } from "@/components/dashboard/appearance-form"
import { UsersTable } from "@/components/dashboard/users-table"
import { ContentForm } from "@/components/dashboard/content-form"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Button } from "@/components/ui/button"
import { SiteContent } from "@/types/cms"

interface SettingsTabsProps {
    smsSettings: {
        username: string
        header: string
    } | null
    users: Record<string, any>[]
    contents: SiteContent[]
}

export function SettingsTabs({ smsSettings, users, contents }: SettingsTabsProps) {
    return (
        <Tabs defaultValue="content" className="space-y-4">
            <TabsList className="grid w-full grid-cols-2 md:grid-cols-5 h-auto">
                <TabsTrigger value="content">İçerik Yönetimi</TabsTrigger>
                <TabsTrigger value="users">Kullanıcılar</TabsTrigger>
                <TabsTrigger value="sms">SMS / Bildirimler</TabsTrigger>
                <TabsTrigger value="appearance">Görünüm</TabsTrigger>
                <TabsTrigger value="security">Güvenlik</TabsTrigger>
            </TabsList>

            <TabsContent value="content" className="space-y-4">
                <div className="space-y-4">
                    <div>
                        <h3 className="text-lg font-medium">Site İçerik Yönetimi</h3>
                        <p className="text-sm text-muted-foreground">
                            Site genel ayarları, iletişim bilgileri ve logolar.
                        </p>
                    </div>
                    <ContentForm initialContent={contents} />
                </div>
            </TabsContent>

            <TabsContent value="users" className="space-y-4">
                <div className="space-y-4">
                    <div>
                        <h3 className="text-lg font-medium">Kullanıcı Yönetimi</h3>
                        <p className="text-sm text-muted-foreground">
                            Sistemdeki kayıtlı kullanıcıları ve rollerini yönetin.
                        </p>
                    </div>
                    <UsersTable users={users} />
                </div>
            </TabsContent>

            <TabsContent value="sms" className="space-y-4">
                <SmsSettingsForm initialData={smsSettings} />
            </TabsContent>

            <TabsContent value="appearance" className="space-y-4">
                <AppearanceForm />
            </TabsContent>

            <TabsContent value="security" className="space-y-4">
                <Card>
                    <CardHeader>
                        <CardTitle>Hesap Güvenliği</CardTitle>
                        <CardDescription>
                            Şifre ve oturum yönetimi.
                        </CardDescription>
                    </CardHeader>
                    <CardContent className="space-y-4">
                        <Button variant="outline" className="w-full">Şifre Değiştir</Button>
                        <Button variant="destructive" className="w-full">Hesabı Sil</Button>
                    </CardContent>
                </Card>
            </TabsContent>
        </Tabs>
    )
}