The update product API in "import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'

// Define a service using a base URL and expected endpoints

export const productApi = createApi({
  reducerPath: 'productApi',
  baseQuery: fetchBaseQuery({ baseUrl: 'http://127.0.0.1:8000/' }),
  endpoints: (builder) => ({
    postProduct: builder.mutation({
      query: (formData) => {
        return {
          url: 'product/add/',
          method: 'POST',
          body: formData,
        }
      }
    }),
    addImages: builder.mutation({
      query: (formData) => {
        return {
          url: 'product/image/add/',
          method: 'POST',
          body: formData,
        }
      }
    }),
    getAllProduct: builder.query({
      query: () => {
        return {
          url: 'product/getAllproduct/',
          method: 'GET', 
          headers: {
            'Content-type': 'application/json',
          }
        }
      }
    }),
    updateProduct: builder.mutation({
      query:({ formData, id }) => {
        return {
          url: `product/update/${id}`,
          method: 'PUT',
          body: formData,
        }
      }
    }),
    detailedProduct: builder.query({
      query: (id) => {
        console.log( 'api',id);
        return {
          url: `product/getDetailedProduct/${id}`,
          method: 'GET',
          headers: {
            'Content-type': 'application/json',
          }
        }}
    }),
    deleteProduct: builder.mutation({
      query:(product) => {
        return {
          url: `product/delete/${product}`,
          method: 'DELETE',
          body:product,
          headers: {
            'Content-type': 'application/json',
          }
        }
      }
    }),
  }),
})

export const { useAddImagesMutation ,usePostProductMutation,useGetAllProductQuery, useUpdateProductMutation ,useDeleteProductMutation,
  useDetailedProductQuery} = productApi" is working fine. but it's not working in "import axios from 'axios';

const BASE_URL = 'http://localhost:8000/product';

export const getAllProducts = async () => {
  try {
    const response = await axios.get(`${BASE_URL}/getAllproduct/`);
    console.log(response.data);
    return response.data;  
  } catch (error) {
    throw new Error(error.response?.data?.message || 'Unable to fetch all product data');
  }
};

export const deleteProduct = async (productId) => {
  try {
    await axios.delete(`${BASE_URL}/delete/${productId}`);
    console.log(`Product with id ${productId} deleted successfully.`);
  } catch (error) {
    throw new Error(error.response?.data?.message || `Unable to delete product with id ${productId}`);
  }
};

export const updateProduct = async (productId, productData) => {
  try {
    console.log(productId)
    console.log(productData)
    const response = await axios.put(`${BASE_URL}/update/${productId}, productData`);
    console.log(`Product with id ${productId} updated successfully.`);
    return response.data;
  } catch (error) {
    throw new Error(error.response?.data?.message || `Unable to update product with id ${productId}`);
  }
};

// export default {
//   getAllProducts,
//   deleteProduct,
//   updateProduct,
// };
" it errored out with 404, what's problem?