1 files changed, 13 insertions, 12 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js b/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
index 20dedd2..f113abf 100644
--- a/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
+++ b/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
@@ -5,7 +5,7 @@ import { MediaCitation, Vitrine, Gallery, Carousel, Grid } from '../components.m
 
 export const InlineVitrine = ({ paragraph, media, currentSection, onAnnotationClick }) => {
   const annotation = paragraph.annotations[0]
-  const item = media.lookup[annotation.settings.media_id]
+  const mediaItem = media.lookup[annotation.settings.media_id]
   const color = CURTAIN_COLOR_LOOKUP[annotation.settings.color] || CURTAIN_COLOR_LOOKUP.white
   const style = {
     backgroundColor: color.backgroundColor,
@@ -17,39 +17,41 @@ export const InlineVitrine = ({ paragraph, media, currentSection, onAnnotationCl
       style={style}
     >
       {annotation.settings.title && <div className='heading'>{annotation.settings.title}</div>}
-      <Vitrine media={item} color={color} />
+      <Vitrine media={mediaItem} color={color} />
     </div>
   )
-  // <MediaCitation media={item} />
+  // <MediaCitation media={mediaItem} />
 }
 
 export const InlineGallery = ({ paragraph, media, currentSection, onAnnotationClick }) => {
   const annotation = paragraph.annotations[0]
-  const item = media.lookup[annotation.settings.media_id]
+  const mediaItem = media.lookup[annotation.settings.media_id]
   return (
     <div
       className='inline-element media gallery'
     >
-      <Gallery media={item} annotation={annotation} />
+      <Gallery media={mediaItem} annotation={annotation} />
     </div>
   )
 }
 
 export const InlineCarousel = ({ paragraph, media, currentSection, onAnnotationClick }) => {
   const annotation = paragraph.annotations[0]
-  const item = media.lookup[annotation.settings.media_id]
+  const mediaItem = media.lookup[annotation.settings.media_id]
   const color = CURTAIN_COLOR_LOOKUP[annotation.settings.color] || CURTAIN_COLOR_LOOKUP.white
   const style = {
     backgroundColor: color.backgroundColor,
     color: color.textColor,
   }
-
   return (
     <div
       className={'inline-element media carousel ' + color.label}
     >
       <div style={style} className='carousel-container'>
-        <Carousel media={item} />
+        <Carousel
+          media={mediaItem}
+          cues={currentSection.mediaCues[mediaItem.id]}
+        />
       </div>
     </div>
   )
@@ -57,15 +59,14 @@ export const InlineCarousel = ({ paragraph, media, currentSection, onAnnotationC
 
 export const InlineGrid = ({ paragraph, media, currentSection, onAnnotationClick }) => {
   const annotation = paragraph.annotations[0]
-  const item = media.lookup[annotation.settings.media_id]
-
+  const mediaItem = media.lookup[annotation.settings.media_id]
   return (
     <div
       className='inline-element media grid'
     >
-      <Grid media={item} annotation={annotation} />
+      <Grid media={mediaItem} annotation={annotation} />
     </div>
   )
 }
 
-// <MediaCitation media={item} />
+// <MediaCitation media={mediaItem} />