36 lines
933 B
TypeScript
36 lines
933 B
TypeScript
import React, { useCallback, useMemo } from "react";
|
|
import ImageGallery, { ReactImageGalleryItem } from "react-image-gallery";
|
|
import "react-image-gallery/styles/css/image-gallery.css";
|
|
import { imageGalleryItems } from "../state";
|
|
|
|
|
|
export default function ImageGalleryX()
|
|
{
|
|
const root: string = process.env.REACT_APP_WWW_ROOT!;
|
|
const uploads: string = root + 'uploads/';
|
|
|
|
const items = useMemo(() =>
|
|
{
|
|
return imageGalleryItems.map((item: ReactImageGalleryItem) =>
|
|
{
|
|
const newItem = { ...item };
|
|
newItem.original = uploads + newItem.original;
|
|
newItem.thumbnail = uploads + newItem.thumbnail;
|
|
// newItem.thumbnailClass = {''}
|
|
return newItem;
|
|
});
|
|
}, []);
|
|
|
|
return (
|
|
<div className={''}>
|
|
<ImageGallery
|
|
items={items}
|
|
showFullscreenButton={true}
|
|
showThumbnails={true}
|
|
showBullets={true}
|
|
showIndex={true}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|