mirror of
https://github.com/jeffvli/feishin.git
synced 2024-11-20 14:37:06 +01:00
Add memoized version of grid carousel
This commit is contained in:
parent
20524452ae
commit
74384639de
@ -1,4 +1,4 @@
|
|||||||
import { isValidElement, ReactNode, useCallback, useMemo, useRef, useState } from 'react';
|
import { isValidElement, memo, ReactNode, useCallback, useMemo, useRef, useState } from 'react';
|
||||||
import { Group, Stack } from '@mantine/core';
|
import { Group, Stack } from '@mantine/core';
|
||||||
import throttle from 'lodash/throttle';
|
import throttle from 'lodash/throttle';
|
||||||
import { RiArrowLeftSLine, RiArrowRightSLine } from 'react-icons/ri';
|
import { RiArrowLeftSLine, RiArrowRightSLine } from 'react-icons/ri';
|
||||||
@ -79,7 +79,7 @@ const Title = ({ label, handleNext, handlePrev, pagination }: TitleProps) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
interface SwiperGridCarouselProps {
|
export interface SwiperGridCarouselProps {
|
||||||
cardRows: CardRow<Album>[] | CardRow<Artist>[] | CardRow<AlbumArtist>[];
|
cardRows: CardRow<Album>[] | CardRow<Artist>[] | CardRow<AlbumArtist>[];
|
||||||
data: Album[] | AlbumArtist[] | Artist[] | RelatedArtist[] | undefined;
|
data: Album[] | AlbumArtist[] | Artist[] | RelatedArtist[] | undefined;
|
||||||
isLoading?: boolean;
|
isLoading?: boolean;
|
||||||
@ -281,3 +281,14 @@ export const SwiperGridCarousel = ({
|
|||||||
</CarouselContainer>
|
</CarouselContainer>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const MemoizedSwiperGridCarousel = memo(
|
||||||
|
function Carousel(props: SwiperGridCarouselProps) {
|
||||||
|
return <SwiperGridCarousel {...props} />;
|
||||||
|
},
|
||||||
|
(oldProps, newProps) => {
|
||||||
|
const uniqueIdIsEqual = oldProps.uniqueId === newProps.uniqueId;
|
||||||
|
const dataIsEqual = oldProps.data === newProps.data;
|
||||||
|
return uniqueIdIsEqual && dataIsEqual;
|
||||||
|
},
|
||||||
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user