"use client"

import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Button } from "@/components/ui/button"
import { Switch } from "@/components/ui/switch"
import { Plug } from "lucide-react"

interface IntegrationsSettingsProps {
  user: any
}

export function IntegrationsSettings({ user }: IntegrationsSettingsProps) {
  return (
    <Card>
      <CardHeader>
        <CardTitle className="flex items-center gap-2">
          <Plug className="h-5 w-5" />
          External Integrations
        </CardTitle>
        <CardDescription>Connect G7 Astrum with other services</CardDescription>
      </CardHeader>
      <CardContent className="space-y-4">
        <div className="flex items-center justify-between p-4 border rounded-lg">
          <div>
            <h4 className="font-medium">Google Drive</h4>
            <p className="text-sm text-muted-foreground">Access your Google Drive files</p>
          </div>
          <Switch />
        </div>
        <div className="flex items-center justify-between p-4 border rounded-lg">
          <div>
            <h4 className="font-medium">Slack</h4>
            <p className="text-sm text-muted-foreground">Get AI assistance in Slack</p>
          </div>
          <Button variant="outline">Connect</Button>
        </div>
      </CardContent>
    </Card>
  )
}