Cool_Tools/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2024-11-20 14:37:06 +01:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

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 throttle from 'lodash/throttle';
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>[];
data: Album[] | AlbumArtist[] | Artist[] | RelatedArtist[] | undefined;
isLoading?: boolean;
@ -281,3 +281,14 @@ export const SwiperGridCarousel = ({
</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;
},
);