turkmen-expo/hooks/useFetch.ts

70 lines
1.5 KiB
TypeScript

"use client";
import { baseAPI } from "@/lib/API";
import { useAppSelector } from "@/redux/hooks";
import { selectHeader } from "@/redux/slices/headerSlice";
import { useState, useEffect } from "react";
interface FetchState<T> {
data: T | null;
loading: boolean;
error: string | null;
}
export const useFetch = <T>(
url: string,
options?: RequestInit
): FetchState<T> => {
const [state, setState] = useState<FetchState<T>>({
data: null,
loading: true,
error: null,
});
const {
activeLang: { localization },
} = useAppSelector(selectHeader);
useEffect(() => {
const fetchData = async () => {
try {
setState((prev) => ({ ...prev, loading: true, error: null }));
const response = await fetch(baseAPI + url, {
headers: {
"Accept-Language": localization,
},
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const result = (await response.json()) as T;
setState({
data: result,
loading: false,
error: null,
});
} catch (error) {
setState({
data: null,
loading: false,
error: error instanceof Error ? error.message : "Unknown error",
});
}
};
fetchData();
}, [url, localization]); // Добавьте options в зависимости, если они динамические
return state;
};
// Пример использования
interface User {
id: number;
name: string;
}