login

src/routes/login/+page.svelte

@@ -1,6 +1,5 @@
 <script>
     import { goto } from '$app/navigation';
-    import Navbar from '../Navbar.svelte';
     
     let username = '';
     let password = '';
@@ -16,14 +15,38 @@
         isLoading = true;
         error = '';
         
-        // Simulate login request
+        // login request
         try {
-            await new Promise(resolve => setTimeout(resolve, 1000));
-            // Replace with actual login logic
-            // await yourAuthFunction(username, password);
+            const response = await fetch('http://127.0.0.1:8000/api/login', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    username: username,
+                    password: password
+                }),
+                credentials: 'include' // For session/cookie based auth
+            });
+
+            if (!response.ok) {
+                const errorData = await response.json();
+                throw new Error(errorData.message || 'Login failed');
+            }
+
+            const data = await response.json();
+            
+            // Store token if using JWT
+            if (data.access) {
+                localStorage.setItem('accessToken', data.access);
+                if (data.refresh) {
+                    localStorage.setItem('refreshToken', data.refresh);
+                }
+            }
+            
             goto('/'); // Redirect after successful login
         } catch (err) {
-            error = 'Invalid credentials';
+            error = err.message || 'Invalid credentials';
         } finally {
             isLoading = false;
         }

src/services/api.js

@@ -1,40 +0,0 @@
-import { auth } from '../stores/auth';
-
-const API_BASE_URL = 'http://your-django-backend-url'; // Replace with your actual backend URL
-
-async function request(method, endpoint, data = null) {
-    const { token } = get(auth);
-    
-    const headers = {
-        'Content-Type': 'application/json',
-    };
-    
-    if (token) {
-        headers['Authorization'] = `Bearer ${token}`;
-    }
-    
-    const config = {
-        method,
-        headers,
-    };
-    
-    if (data) {
-        config.body = JSON.stringify(data);
-    }
-    
-    const response = await fetch(`${API_BASE_URL}${endpoint}`, config);
-    
-    if (!response.ok) {
-        const error = await response.json();
-        throw new Error(error.detail || 'An error occurred');
-    }
-    
-    return await response.json();
-}
-
-export const api = {
-    get: (endpoint) => request('GET', endpoint),
-    post: (endpoint, data) => request('POST', endpoint, data),
-    put: (endpoint, data) => request('PUT', endpoint, data),
-    delete: (endpoint) => request('DELETE', endpoint),
-};

src/services/auth.js

@@ -1,41 +0,0 @@
-import { api } from './api';
-import { setAuthTokens, clearAuth } from '../stores/auth';
-
-export async function login(username, password) {
-    try {
-        const response = await api.post('/api/token/', {
-            username,
-            password
-        });
-        
-        setAuthTokens(response.access, response.refresh);
-        return true;
-    } catch (error) {
-        clearAuth();
-        throw error;
-    }
-}
-
-export async function logout() {
-    clearAuth();
-}
-
-export async function refreshToken() {
-    const { refreshToken } = get(auth);
-    
-    if (!refreshToken) {
-        throw new Error('No refresh token available');
-    }
-    
-    try {
-        const response = await api.post('/api/token/refresh/', {
-            refresh: refreshToken
-        });
-        
-        setAuthTokens(response.access, refreshToken);
-        return response.access;
-    } catch (error) {
-        clearAuth();
-        throw error;
-    }
-}

src/stores/auth.js

@@ -1,27 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const auth = writable({
-    token: localStorage.getItem('token') || null,
-    refreshToken: localStorage.getItem('refreshToken') || null,
-    isAuthenticated: !!localStorage.getItem('token')
-});
-
-export function setAuthTokens(token, refreshToken) {
-    localStorage.setItem('token', token);
-    localStorage.setItem('refreshToken', refreshToken);
-    auth.set({
-        token,
-        refreshToken,
-        isAuthenticated: true
-    });
-}
-
-export function clearAuth() {
-    localStorage.removeItem('token');
-    localStorage.removeItem('refreshToken');
-    auth.set({
-        token: null,
-        refreshToken: null,
-        isAuthenticated: false
-    });
-}