UniqAI/hexabot
1
0
Fork 0
mirror of https://github.com/hexastack/hexabot synced 2025-01-22 10:35:37 +00:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

fix: display carousel navigation buttons when we have more than one item

Browse Source
This commit is contained in:
abdou6666 2024-11-29 16:11:58 +01:00
parent e0a8bc2b0c
commit a7ab87cfa5
1 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
widget/src/components/messages/CarouselMessage.tsx
View File

@ -81,6 +81,7 @@ const CarouselMessage: React.FC<CarouselMessageProps> = ({
setActiveIndex((prevIndex) => (prevIndex + 1) % items.length);
};
const colors = allColors[messageCarousel.direction || "received"];
const shouldDisplayNavigationButtons = items.length > 1;
return (
<div
@ -98,15 +99,19 @@ const CarouselMessage: React.FC<CarouselMessageProps> = ({
<CarouselItem key={idx} message={message} idx={idx} />
))}
</div>
<button
className="sc-message--carousel-control prev"
onClick={goToPrevious}
>
&#10094;
</button>
<button className="sc-message--carousel-control next" onClick={goToNext}>
&#10095;
</button>
{shouldDisplayNavigationButtons && (
<>
<button
className="sc-message--carousel-control prev"
onClick={goToPrevious}
>
&#10094;
</button>
<button className="sc-message--carousel-control next" onClick={goToNext}>
&#10095;
</button>
</>
)}
</div>
);
};