diff --git a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx index 771f43804..34b0b0310 100644 --- a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx +++ b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import React, { useEffect, useMemo, useState } from "react"; import { Button, Tabs, Tab } from "react-bootstrap"; import { useParams, useHistory } from "react-router-dom"; import cx from "classnames"; @@ -48,9 +48,13 @@ export const Performer: React.FC = () => { imagePreview === undefined ? performer.image_path ?? "" : imagePreview ?? `${performer.image_path}?default=true`; + const lightboxImages = useMemo( + () => [{ paths: { thumbnail: activeImage, image: activeImage } }], + [activeImage] + ); const showLightbox = useLightbox({ - images: [{ paths: { thumbnail: activeImage, image: activeImage } }], + images: lightboxImages, }); // Network state