webapp/src/components/AuthModal/SocialProviders/SocialProviders.tsx
2024-07-21 05:17:42 +03:00

32 lines
909 B
TypeScript

import { For } from 'solid-js'
import { useLocalize } from '~/context/localize'
import { useSession } from '~/context/session'
import { Icon } from '../../_shared/Icon'
import styles from './SocialProviders.module.scss'
export const PROVIDERS = ['facebook', 'google', 'github'] // 'vk' | 'telegram'
export const SocialProviders = () => {
const { t } = useLocalize()
const { oauth } = useSession()
return (
<div class={styles.container}>
<div class={styles.text}>{t('or sign in with social networks')}</div>
<div class={styles.social}>
<For each={PROVIDERS}>
{(provider) => (
<button
type="button"
class={styles[provider as keyof typeof styles]}
onClick={(_e) => oauth(provider)}
>
<Icon name={provider} />
</button>
)}
</For>
</div>
</div>
)
}