<template>
  <UButton
    color="neutral"
    size="xl"
    class="flex cursor-pointer items-center justify-center gap-3 overflow-hidden"
    @click="login(provider.name)"
  >
    Continue with {{ provider.displayName }}
  </UButton>
</template>

<script lang="ts" setup>
import type { AuthProviderInfo } from 'pocketbase';

const { login } = useAuth();
const { provider } = defineProps<{ provider: AuthProviderInfo }>();
</script>
