frontend/src/api.js

import axios from 'axios';

// Function to get the CSRF token from the cookie
function getCookie(name) {
  let cookieValue = null;
  if (document.cookie && document.cookie !== '') {
    const cookies = document.cookie.split(';');
    for (let i = 0; i < cookies.length; i++) {
      const cookie = cookies[i].trim();
      // Does this cookie string begin with the name we want?
      if (cookie.substring(0, name.length + 1) === (name + '=')) {
        cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
        break;
      }
    }
  }
  return cookieValue;
}

const runtimeDefaultBase = (typeof window !== 'undefined' && window.location && window.location.port === '3000')
  ? 'http://127.0.0.1:8000/api'
  : '/api';
const API_BASE_URL = process.env.REACT_APP_API_BASE_URL || runtimeDefaultBase;

const api = axios.create({
  baseURL: API_BASE_URL,
  withCredentials: true, // This is crucial for sending session cookies
});

// Add a request interceptor to include both CSRF token and Huggingface token
api.interceptors.request.use(
  (config) => {
    // Add CSRF token
    const csrfToken = getCookie('csrftoken');
    if (csrfToken) {
      config.headers['X-CSRFToken'] = csrfToken;
    }
    
    // Add Huggingface token if available
    const hfToken = localStorage.getItem('huggingfaceToken');
    if (hfToken) {
      config.headers['Authorization'] = `Bearer ${hfToken}`;
    }
    
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

export default api;