'use client'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; import { skipOptionalProvidersLink } from "@/ee/features/sso/actions"; import { useRouter } from "next/navigation"; import { useState } from "react"; import { LinkedAccountProviderCard } from "./linkedAccountProviderCard"; import { LinkedAccount } from "@/ee/features/sso/actions"; interface ConnectAccountsCardProps { linkedAccounts: LinkedAccount[] callbackUrl?: string; } export const ConnectAccountsCard = ({ linkedAccounts, callbackUrl }: ConnectAccountsCardProps) => { const router = useRouter(); const [isSkipping, setIsSkipping] = useState(false); const handleSkip = async () => { setIsSkipping(true); try { await skipOptionalProvidersLink(); } catch (error) { console.error("Failed to skip optional providers:", error); } finally { setIsSkipping(false); router.refresh() } }; // Only show account_linking providers in this flow const accountLinkingProviders = linkedAccounts.filter(a => a.isAccountLinkingProvider); const canSkip = !accountLinkingProviders.some(a => a.required && !a.isLinked); return ( Connect Your Accounts Link the following accounts to enable permission syncing and access all features.
You can manage your linked accounts later in Settings → Linked Accounts.

{accountLinkingProviders .sort((a, b) => (b.required ? 1 : 0) - (a.required ? 1 : 0)) .map(account => ( ))}

{canSkip && ( )} ); };