feat: perfect stripe redirect flow and ux
This commit is contained in:
parent
37e9f199f4
commit
f5e0d81d43
2 changed files with 19 additions and 6 deletions
19
src/App.tsx
19
src/App.tsx
|
|
@ -76,6 +76,7 @@ const AppContent: React.FC = () => {
|
||||||
|
|
||||||
const handleOpenRegister = (plan: string = 'starter') => {
|
const handleOpenRegister = (plan: string = 'starter') => {
|
||||||
setSelectedPlan(plan);
|
setSelectedPlan(plan);
|
||||||
|
localStorage.removeItem('intended_plan'); // Segurança contra redirecionamentos não desejados
|
||||||
setAuthMode('register');
|
setAuthMode('register');
|
||||||
setIsModalOpen(true);
|
setIsModalOpen(true);
|
||||||
};
|
};
|
||||||
|
|
@ -86,20 +87,25 @@ const AppContent: React.FC = () => {
|
||||||
} else {
|
} else {
|
||||||
localStorage.setItem('login_intent', 'user');
|
localStorage.setItem('login_intent', 'user');
|
||||||
}
|
}
|
||||||
|
localStorage.removeItem('intended_plan'); // Segurança contra redirecionamentos não desejados
|
||||||
setAuthMode('login');
|
setAuthMode('login');
|
||||||
setIsModalOpen(true);
|
setIsModalOpen(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleAuthSuccess = async () => {
|
const handleAuthSuccess = async () => {
|
||||||
setIsModalOpen(false);
|
|
||||||
await refreshProfile();
|
|
||||||
|
|
||||||
// Recupera a intenção de plano caso tenha recarregado a página (ex: Login via Google)
|
// Recupera a intenção de plano caso tenha recarregado a página (ex: Login via Google)
|
||||||
const savedPlan = localStorage.getItem('intended_plan');
|
const savedPlan = localStorage.getItem('intended_plan');
|
||||||
const finalPlan = selectedPlan === 'monthly' ? 'monthly' : savedPlan;
|
const finalPlan = selectedPlan === 'monthly' ? 'monthly' : savedPlan;
|
||||||
|
const isRedirecting = (authMode === 'register' || isCompletingProfile) && finalPlan === 'monthly';
|
||||||
|
|
||||||
|
if (!isRedirecting) {
|
||||||
|
setIsModalOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
await refreshProfile();
|
||||||
|
|
||||||
// Se acabou de fazer o cadastro clicando em um plano pago (monthly), leva direto pro Stripe!
|
// Se acabou de fazer o cadastro clicando em um plano pago (monthly), leva direto pro Stripe!
|
||||||
if ((authMode === 'register' || isCompletingProfile) && finalPlan === 'monthly') {
|
if (isRedirecting) {
|
||||||
try {
|
try {
|
||||||
const { data: { session } } = await supabase.auth.getSession();
|
const { data: { session } } = await supabase.auth.getSession();
|
||||||
if (session) {
|
if (session) {
|
||||||
|
|
@ -113,16 +119,19 @@ const AppContent: React.FC = () => {
|
||||||
});
|
});
|
||||||
const { url, error } = await res.json();
|
const { url, error } = await res.json();
|
||||||
if (error) {
|
if (error) {
|
||||||
|
setIsModalOpen(false);
|
||||||
alert('Falha interna ao inicializar carrinho: ' + JSON.stringify(error));
|
alert('Falha interna ao inicializar carrinho: ' + JSON.stringify(error));
|
||||||
} else if (url) {
|
} else if (url) {
|
||||||
localStorage.removeItem('intended_plan');
|
localStorage.removeItem('intended_plan');
|
||||||
window.location.href = url; // Redireciona pro Checkout
|
window.location.href = url; // Redireciona pro Checkout magicamente
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
|
setIsModalOpen(false);
|
||||||
alert('Sessão não encontrada para redirecionamento. Verifique se precisa confirmar o email.');
|
alert('Sessão não encontrada para redirecionamento. Verifique se precisa confirmar o email.');
|
||||||
}
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
setIsModalOpen(false);
|
||||||
console.error("Falha ao redirecionar para o checkout:", e);
|
console.error("Falha ao redirecionar para o checkout:", e);
|
||||||
alert('Erro ao comunicar com o servidor: ' + e);
|
alert('Erro ao comunicar com o servidor: ' + e);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -179,7 +179,11 @@ const RegistrationModal: React.FC<RegistrationModalProps> = ({
|
||||||
|
|
||||||
if (rpcError) throw rpcError;
|
if (rpcError) throw rpcError;
|
||||||
|
|
||||||
setSuccessMsg(t.auth.successRegister);
|
if (plan === 'monthly') {
|
||||||
|
setSuccessMsg("Conta criada com sucesso! Redirecionando para o pagamento seguro...");
|
||||||
|
} else {
|
||||||
|
setSuccessMsg(t.auth.successRegister);
|
||||||
|
}
|
||||||
setTimeout(() => onSuccess(), 1500);
|
setTimeout(() => onSuccess(), 1500);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue