51 lines
1.3 KiB
JavaScript
51 lines
1.3 KiB
JavaScript
import React, { useEffect } from "react";
|
|
import { Gallery } from "react-grid-gallery";
|
|
import { useTranslation } from "react-i18next";
|
|
import { GenerateSrcUrl, GenerateThumbUrl } from "./job-documents.utility";
|
|
|
|
function JobsDocumentGalleryExternal({
|
|
data,
|
|
|
|
externalMediaState
|
|
}) {
|
|
const [galleryImages, setgalleryImages] = externalMediaState;
|
|
const { t } = useTranslation();
|
|
|
|
useEffect(() => {
|
|
let documents = data.reduce((acc, value) => {
|
|
if (value.type.startsWith("image")) {
|
|
acc.push({
|
|
fullsize: GenerateSrcUrl(value),
|
|
src: GenerateThumbUrl(value),
|
|
thumbnailHeight: 225,
|
|
thumbnailWidth: 225,
|
|
isSelected: false,
|
|
key: value.key,
|
|
extension: value.extension,
|
|
id: value.id,
|
|
type: value.type,
|
|
tags: [{ value: value.type, title: value.type }],
|
|
size: value.size
|
|
});
|
|
}
|
|
|
|
return acc;
|
|
}, []);
|
|
setgalleryImages(documents);
|
|
}, [data, setgalleryImages, t]);
|
|
|
|
return (
|
|
<div className="clearfix">
|
|
<Gallery
|
|
images={galleryImages}
|
|
backdropClosesModal={true}
|
|
onSelect={(index, image) => {
|
|
setgalleryImages(galleryImages.map((g, idx) => (index === idx ? { ...g, isSelected: !g.isSelected } : g)));
|
|
}}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default JobsDocumentGalleryExternal;
|