style(dashboard-v2): simplify 'key' props
This commit is contained in:
parent
7adbc4bf68
commit
7681287127
|
@ -9,11 +9,12 @@ export default function Bullets({ visibleSlides, activeIndex, allSlides, changeS
|
||||||
<div className="flex gap-3 pt-6">
|
<div className="flex gap-3 pt-6">
|
||||||
{Array(allSlides - visibleSlides + 1)
|
{Array(allSlides - visibleSlides + 1)
|
||||||
.fill(null)
|
.fill(null)
|
||||||
.map((_, i) => (
|
.map((_, index) => (
|
||||||
<span
|
<button
|
||||||
key={`slider-bullets-${i}`}
|
key={index}
|
||||||
className={`rounded-full w-3 h-3 ${activeIndex === i ? "bg-primary" : "border-2 cursor-pointer"}`}
|
type="button"
|
||||||
onClick={() => changeSlide(i)}
|
className={`rounded-full w-3 h-3 ${activeIndex === index ? "bg-primary" : "border-2 cursor-pointer"}`}
|
||||||
|
onClick={() => changeSlide(index)}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -55,14 +55,14 @@ const Slider = ({ slides, breakpoints }) => {
|
||||||
$activeIndex={activeIndex}
|
$activeIndex={activeIndex}
|
||||||
$scrollable={scrollable}
|
$scrollable={scrollable}
|
||||||
>
|
>
|
||||||
{slides.map((slide, i) => {
|
{slides.map((slide, index) => {
|
||||||
const isVisible = i >= activeIndex && i < activeIndex + visibleSlides;
|
const isVisible = index >= activeIndex && index < activeIndex + visibleSlides;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={`slide-${i}`}>
|
<div key={`slide-${index}`}>
|
||||||
<Slide
|
<Slide
|
||||||
isVisible={isVisible || !scrollable}
|
isVisible={isVisible || !scrollable}
|
||||||
onClick={scrollable && !isVisible ? () => changeSlide(i) : null}
|
onClick={scrollable && !isVisible ? () => changeSlide(index) : null}
|
||||||
>
|
>
|
||||||
{slide}
|
{slide}
|
||||||
</Slide>
|
</Slide>
|
||||||
|
|
Reference in New Issue