russ_react/src/hooks/useGallery.ts

95 lines
3.0 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { useState, useEffect } from 'react';
import { GalleryImage } from '../types';
import { galleryService } from '../services/galleryService';
export function useGallery(articleId: string) {
const [images, setImages] = useState<GalleryImage[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => {
if (!articleId) return; // Если articleId пустой, не загружаем галерею
loadGallery();
}, [articleId]);
const loadGallery = async () => {
try {
setLoading(true);
const galleryImages = await galleryService.getArticleGallery(articleId);
setImages(galleryImages);
setError(null);
} catch (error) {
setError('Ошибка загрузки фото галереи');
console.error('Ошибка загрузки фото галереи:', error);
} finally {
setLoading(false);
}
};
const addImage = async (imageData: {
url: string;
caption: string;
alt: string;
width: number;
height: number;
size: number;
format: string;
}) => {
try {
const galleryImage = await galleryService.createImage(articleId, imageData);
setImages([...images, galleryImage]);
return galleryImage;
} catch (err) {
console.error('Ошибка добавления изображения:', err);
throw err;
}
};
const updateImage = async (id: string, updates: Partial<GalleryImage>) => {
try {
console.log('Обновляем изображение с ID:', id, 'Обновления:', updates);
const updatedImage = await galleryService.updateImage(id, updates);
console.log('Изображение успешно обновлено:', updatedImage);
setImages(images.map(img => (img.id === id ? updatedImage : img)));
return updatedImage;
} catch (err) {
console.error('Ошибка изменения изображения:', err);
setError('Не удалось обновить изображение');
throw err;
}
};
const deleteImage = async (id: string) => {
try {
await galleryService.deleteImage(id);
setImages(images.filter(img => img.id !== id));
} catch (err) {
console.error('Ошибка удаления изображения:', err);
setError('Не удалось удалить изображение');
throw err;
}
};
const reorderImages = async (imageIds: string[]) => {
try {
await galleryService.reorderImages(articleId, imageIds);
const reorderedImages = imageIds.map(id => images.find(img => img.id === id)!);
setImages(reorderedImages);
} catch (err) {
console.error('Ошибка реорганизации изображений:', err);
setError('Не удалось изменить порядок изображений');
throw err;
}
};
return {
images,
loading,
error,
addImage,
updateImage,
deleteImage,
reorderImages,
refresh: loadGallery,
};
}