70 lines
1.5 KiB
TypeScript
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;
|
||
|
|
}
|