I am using the caption and thumbnail plugin, I want to show a poll question with answers where the user can vote (API request), the problem I am facing is I want to show it below the thumbnail and I want it to be fixed through all the slides or at least shown in each slide. I figured out I need to create a custom plugin and a custom slide, correct me if I am wrong. Is it doable with these specific requirements? and if yes can you help me with how to do it? Using nextjs and yet-another-react-lightbox Here's my current lightbox:
import Thumbnails from "yet-another-react-lightbox/plugins/thumbnails";
import "yet-another-react-lightbox/plugins/thumbnails.css";
import "yet-another-react-lightbox/plugins/captions.css";
import Captions from "yet-another-react-lightbox/plugins/captions";
import Lightbox from "yet-another-react-lightbox";
import { ItemDetail } from "@/types/photoNews";
const AlbumModal = ({
item,
open,
setOpen,
}: {
albumItem: ItemDetail;
open: boolean;
setOpen: (value: React.SetStateAction<boolean>) => void;
})=>
{
return(
<Lightbox
open={open}
close={() => setOpen(false)}
slides={slides}
carousel={{
finite: true,
imageFit: "contain",
}}
plugins={[Thumbnails, Captions,]}
captions={{ descriptionMaxLines: 1, descriptionTextAlign: "center" }}
styles = {{
container: {
backgroundColor: "rgba(0, 0, 0, .95)",
},
captionsDescriptionContainer: {
paddingBottom: "5%",
},
}}
/>)}
The item object has the polls and answers.