pogmommy/feishin
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add memoized version of grid carousel

Browse source
This commit is contained in:
jeffvli 2023-07-21 18:00:51 -07:00
parent 20524452ae
commit 74384639de
1 changed files with 13 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/renderer/components/grid-carousel/index.tsx
View file

@ -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;
},
);