import { route } from '@/constants/routes' import { useModelProvider } from '@/hooks/useModelProvider' import { cn, getProviderLogo, getProviderTitle } from '@/lib/utils' import { useNavigate, useMatches, Link } from '@tanstack/react-router' import { IconArrowLeft } from '@tabler/icons-react' const ProvidersMenu = () => { const { providers } = useModelProvider() const navigate = useNavigate() const matches = useMatches() return (
Back
{providers.map((provider, index) => { const isActive = matches.some( (match) => match.routeId === '/settings/providers/$providerName' && 'providerName' in match.params && match.params.providerName === provider.provider ) return (
navigate({ to: route.settings.providers, params: { providerName: provider.provider }, }) } > {`${provider.provider} {getProviderTitle(provider.provider)}
) })}
) } export default ProvidersMenu