@extends('layouts.mobile')

@section('title', 'Entrando…')
@section('screen-label', 'Google')
@section('bare', '1')
@section('screen-class', 'fm-screen--dark')

@section('content')
{{-- Pantalla puente del login con Google: lee el código de un solo uso del
     fragmento (#code=…, nunca viaja al servidor), lo canjea en el API por un
     token Sanctum y sigue a donde se iba (fm_google_next) o a Inicio. --}}
<div style="flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:40px 28px;color:var(--text-on-dark);text-align:center;"
     x-data="googleVolver()" x-init="canjear()">
    <img src="{{ asset('img/brand/fermenty-mark-light.svg') }}" alt="Fermenty" width="72" height="72">
    <template x-if="!error">
        <div style="font:500 15px/1.5 var(--font-sans);color:rgba(234,240,228,.85);">Entrando con Google…</div>
    </template>
    <template x-if="error">
        <div style="display:flex;flex-direction:column;gap:14px;align-items:center;">
            <p x-text="error" style="margin:0;font:500 14px/1.5 var(--font-sans);color:rgba(234,240,228,.85);"></p>
            <a href="{{ route('login') }}" class="fm-btn fm-btn--gold">Volver a intentarlo</a>
        </div>
    </template>
</div>
@endsection

@push('scripts')
<script>
function googleVolver() {
    return {
        error: '',
        async canjear() {
            const code = new URLSearchParams(location.hash.slice(1)).get('code');
            // Borra el código de la barra y del historial cuanto antes.
            history.replaceState(null, '', location.pathname);
            if (!code) { this.error = 'El enlace de Google ha caducado. Vuelve a intentarlo.'; return; }
            try {
                const data = await window.fmApi.post('/google-exchange', { code: code, device_name: 'app-google' });
                window.fmLogin(data.token, data.user);
                let next = null;
                try {
                    next = localStorage.getItem('fm_google_next');
                    localStorage.removeItem('fm_google_next');
                    localStorage.setItem('fm_onboarded', '1');
                } catch (e) {}
                window.location.replace(next || window.FM_ROUTES.home);
            } catch (e) {
                this.error = (e.data && e.data.message) || 'No se pudo completar la entrada con Google.';
            }
        },
    };
}
</script>
@endpush