---
import Layout from 'layouts/Layout.astro';
import AstroUtils from 'libs/AstroUtils';

const pb = Astro.locals.pb

const oauths = await pb.collection('users').listAuthMethods();

if(pb.authStore.isValid){
    return Astro.redirect("/account")
}

await AstroUtils.wrap(async () => {
    if (Astro.request.method !== 'POST'){
        return
    }
    const form = await Astro.request.formData()
    if(form.get("type") == "userPassword"){
        const request = {
            username: form.get("username") as string,
            name: form.get("name") as string,
            email: form.get("email") as string,
            password: form.get("password") as string,
            passwordConfirm: form.get("passwordConfirm") as string,
        }
        try{
            await pb.collection('users').create(request)
            return Astro.redirect('/account/login')
        }catch(e){
            console.log(e);
        }
    }else if (form.get("type") == "discord2FA") {
        // console.log("pouet")
        // await pb.collection('user').authWithOAuth2({provider: 'discord'})
        // console.log("pouetF");
        
    }else{
        Astro.redirect("/404")
    }
})
---

<Layout title="register">
    <form id="account-creation" method="post" enctype="multipart/form-data">
        <input type="hidden" name="type" value="userPassword">
        <input required name="name" placeholder="Prénom Nom"/>
        <input required name="username" placeholder="Pseudo"/>
        <input required name="email" type="email" placeholder="Renseignez votre email" />
        <input required name="password" type="password" placeholder="Créez un mot de passe" />
        <input required name="passwordConfirm" type="password" placeholder="Confirmer votre mot de passe" />
        <button>Créer un compte</button>
    </form>

    <button id="OauthDiscord">connexion avec discord</button>
    <form method="post" enctype="multipart/form-data">
        <input type="hidden" name="type" value="discord2FA">
    </form>
    <a href={oauths.authProviders[1].authUrl + "https%3A%2F%2Fpb-tweb.cb85.fr%2Fapi%2Foauth2-redirect"}>discord?</a>
</Layout>

<script>
    import 'cross-fetch/polyfill';
    import PocketBase from "pocketbase"
    import type { OAuth2UrlCallback } from "pocketbase"
    const pb = new PocketBase("https://pb-tweb.cb85.fr/")
    const discordBtn = document.querySelector<HTMLButtonElement>("#OauthDiscord")
    
    if (discordBtn) {
        discordBtn.addEventListener('click', async () =>{
            const result = await pb.collection('users').listAuthMethods();
            fetch(result.authProviders[0].authUrl)
            console.log(result);
        })
    }
</script>