Esta refatoração unifica todo o sistema de login e logout da aplicação, resolvendo inconsistências e eliminando código duplicado.
Problema Anterior:
- A lógica de login estava espalhada por múltiplos componentes e páginas (`/doctor/login`, `/patient/login`, etc.).
- Cada layout de área restrita (`DoctorLayout`, `PatientLayout`, etc.) tinha sua própria lógica de verificação de segurança e logout, resultando em bugs (ex: uso de Cookies vs. localStorage).
Solução Aplicada:
- Foi criado um componente `LoginForm` unificado e inteligente, responsável por toda a interação de login.
- Toda a lógica de comunicação com a API de autenticação foi centralizada no serviço `api.mjs`, incluindo uma nova função `api.logout()`.
- Todos os layouts de áreas restritas (`DoctorLayout`, `PatientLayout`, etc.) foram padronizados para usar `localStorage.getItem('token')` para verificação e para chamar `api.logout()` ao sair.
- As páginas de login específicas de cada perfil foram atualizadas para usar o novo `LoginForm` genérico.
92 lines
3.2 KiB
JavaScript
92 lines
3.2 KiB
JavaScript
// Caminho: [seu-caminho]/services/api.mjs
|
|
|
|
const BASE_URL = "https://yuanqfswhberkoevtmfr.supabase.co";
|
|
const API_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Inl1YW5xZnN3aGJlcmtvZXZ0bWZyIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NTQ5NTQzNjksImV4cCI6MjA3MDUzMDM2OX0.g8Fm4XAvtX46zifBZnYVH4tVuQkqUH6Ia9CXQj4DztQ";
|
|
|
|
export async function loginWithEmailAndPassword(email, password) {
|
|
const response = await fetch(`${BASE_URL}/auth/v1/token?grant_type=password`, {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
"apikey": API_KEY,
|
|
},
|
|
body: JSON.stringify({ email, password }),
|
|
});
|
|
|
|
const data = await response.json();
|
|
|
|
if (!response.ok) {
|
|
throw new Error(data.error_description || "Credenciais inválidas.");
|
|
}
|
|
|
|
if (data.access_token && typeof window !== 'undefined') {
|
|
// Padronizando para salvar o token no localStorage
|
|
localStorage.setItem("token", data.access_token);
|
|
}
|
|
|
|
return data;
|
|
}
|
|
|
|
// --- NOVA FUNÇÃO DE LOGOUT CENTRALIZADA ---
|
|
async function logout() {
|
|
const token = localStorage.getItem("token");
|
|
if (!token) return; // Se não há token, não há o que fazer
|
|
|
|
try {
|
|
await fetch(`${BASE_URL}/auth/v1/logout`, {
|
|
method: "POST",
|
|
headers: {
|
|
"apikey": API_KEY,
|
|
"Authorization": `Bearer ${token}`,
|
|
},
|
|
});
|
|
} catch (error) {
|
|
// Mesmo que a chamada falhe, o logout no cliente deve continuar.
|
|
// O token pode já ter expirado no servidor, por exemplo.
|
|
console.error("Falha ao invalidar token no servidor (isso pode ser normal se o token já expirou):", error);
|
|
}
|
|
}
|
|
|
|
async function request(endpoint, options = {}) {
|
|
const token = typeof window !== 'undefined' ? localStorage.getItem("token") : null;
|
|
|
|
const headers = {
|
|
"Content-Type": "application/json",
|
|
"apikey": API_KEY,
|
|
...(token ? { "Authorization": `Bearer ${token}` } : {}),
|
|
...options.headers,
|
|
};
|
|
|
|
try {
|
|
const response = await fetch(`${BASE_URL}${endpoint}`, {
|
|
...options,
|
|
headers,
|
|
});
|
|
|
|
if (!response.ok) {
|
|
let errorBody;
|
|
try {
|
|
errorBody = await response.json();
|
|
} catch (e) {
|
|
errorBody = await response.text();
|
|
}
|
|
throw new Error(`Erro HTTP: ${response.status} - ${JSON.stringify(errorBody)}`);
|
|
}
|
|
|
|
if (response.status === 204) return {};
|
|
return await response.json();
|
|
|
|
} catch (error) {
|
|
console.error("Erro na requisição:", error);
|
|
throw error;
|
|
}
|
|
}
|
|
|
|
// Adicionamos a função de logout ao nosso objeto de API exportado
|
|
export const api = {
|
|
get: (endpoint, options) => request(endpoint, { method: "GET", ...options }),
|
|
post: (endpoint, data, options) => request(endpoint, { method: "POST", body: JSON.stringify(data), ...options }),
|
|
patch: (endpoint, data, options) => request(endpoint, { method: "PATCH", body: JSON.stringify(data), ...options }),
|
|
delete: (endpoint, options) => request(endpoint, { method: "DELETE", ...options }),
|
|
logout: logout, // <-- EXPORTANDO A NOVA FUNÇÃO
|
|
}; |