feat(SW-337): logic for accesible dialog title text for lightbox

components/Lightbox/Gallery.tsx

@@ -16,6 +16,7 @@ import type { GalleryProps } from "@/types/components/lightbox/lightbox"
 
 export default function Gallery({
   images,
+  dialogTitle,
   onClose,
   onSelectImage,
   onImageClick,
@@ -58,7 +59,7 @@ export default function Gallery({
       <div className={styles.desktopGallery}>
         <VisuallyHidden asChild>
           <DialogTitle asChild>
-            <VisuallyHidden>Image Gallery</VisuallyHidden>
+            <VisuallyHidden>{dialogTitle}</VisuallyHidden>
           </DialogTitle>
         </VisuallyHidden>
         <div className={styles.galleryHeader}>

components/Lightbox/index.tsx

@@ -10,7 +10,11 @@ import styles from "./Lightbox.module.css"
 
 import type { LightboxProps } from "@/types/components/lightbox/lightbox"
 
-export default function Lightbox({ images, children }: LightboxProps) {
+export default function Lightbox({
+  images,
+  children,
+  dialogTitle,
+}: LightboxProps) {
   const [isOpen, setIsOpen] = useState(false)
   const [selectedImageIndex, setSelectedImageIndex] = useState(0)
   const [isFullView, setIsFullView] = useState(false)
@@ -93,6 +97,7 @@ export default function Lightbox({ images, children }: LightboxProps) {
                   ) : (
                     <Gallery
                       images={images}
+                      dialogTitle={dialogTitle}
                       onClose={() => setIsOpen(false)}
                       onSelectImage={(image) => {
                         setSelectedImageIndex(