UseAxios

1'use client';
2 
3import {
4  createContext,
5  useCallback,
6  useContext,
7  useEffect,
8  useRef,
9  useState,
10  type ReactNode,
11} from 'react';
12 
13import axios, {
14  AxiosError,
15  AxiosInstance,
16  AxiosRequestConfig,
17  AxiosResponse,
18} from 'axios';
19 
20// #region Types & Interfaces
21 
22export interface AxiosConfig extends AxiosRequestConfig {
23  retries?: number;
24  retryDelay?: number;
25}
26 
27export interface AxiosOptions extends AxiosRequestConfig {
28  retries?: number;
29  retryDelay?: number;
30  immediate?: boolean;
31}
32 
33export interface AxiosResult<T> {
34  data: T | null;
35  error: AxiosError | null;
36  loading: boolean;
37  refetch: () => Promise<T | null>;
38  abort: () => void;
39  aborted: boolean;
40}
41 
42export interface AxiosContextValue {
43  config: AxiosConfig;
44  updateConfig: (newConfig: Partial<AxiosConfig>) => void;
45  instance: AxiosInstance;
46  request: <T = any>(config: AxiosRequestConfig) => Promise<AxiosResponse<T>>;
47}
48 
49export interface AxiosProviderProps {
50  config?: AxiosConfig;
51  children: ReactNode;
52}
53 
54// #endregion
55 
56const AxiosContext = createContext<AxiosContextValue | null>(null);
57 
58export function AxiosProvider({ config = {}, children }: AxiosProviderProps) {
59  const [currentConfig, setCurrentConfig] = useState<AxiosConfig>(config);
60  const instanceRef = useRef<AxiosInstance | null>(axios.create(config));
61 
62  const updateConfig = useCallback((newConfig: Partial<AxiosConfig>) => {
63    setCurrentConfig((prev) => ({ ...prev, ...newConfig }));
64  }, []);
65 
66  // Create or update axios instance when config changes
67  useEffect(() => {
68    const { retries, retryDelay, ...axiosConfig } = currentConfig;
69 
70    instanceRef.current = axios.create(axiosConfig);
71 
72    // Add request interceptor for retry logic
73    instanceRef.current.interceptors.request.use(
74      (config) => config,
75      (error) => Promise.reject(error),
76    );
77 
78    // Add response interceptor for error handling
79    instanceRef.current.interceptors.response.use(
80      (response) => response,
81      (error) => Promise.reject(error),
82    );
83 
84    return () => {
85      instanceRef.current = null;
86    };
87  }, [currentConfig]);
88 
89  const enhancedRequest = useCallback(
90    async <T = any,>(
91      requestConfig: AxiosRequestConfig,
92    ): Promise<AxiosResponse<T>> => {
93      const {
94        retries = currentConfig.retries ?? 0,
95        retryDelay = currentConfig.retryDelay ?? 1000,
96        ...axiosConfig
97      } = requestConfig as AxiosRequestConfig & {
98        retries?: number;
99        retryDelay?: number;
100      };
101 
102// … truncated