Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | 41x 3026x 3026x 3026x 3026x 3026x | import React, { ElementType, memo } from "react";
import { animated, useSpring } from "react-spring";
import { getAnimationConfig } from "./config";
import { SxProps, TableRow, TableRowProps } from "@mui/material";
import { useCustomThemeV2 } from "@theme/hooks/useCustomThemeV2";
type Props = {
Wrapper?: ElementType;
height?: number;
children?: React.ReactNode;
index?: number;
rowProps?: TableRowProps;
shouldAnimate?: boolean;
sx?: SxProps;
};
const GiveAnimatedListItem = ({
Wrapper = animated(TableRow),
height,
children,
rowProps,
index = 0,
shouldAnimate,
...props
}: Props) => {
const config = getAnimationConfig(height || 50);
const usedIndex = index > 20 ? index % 20 : index;
const { isDesktopView } = useCustomThemeV2();
const styles = useSpring({
...config,
delay: 40 * (usedIndex + 1),
});
return (
<Wrapper
data-testid="givetable-row-item"
{...rowProps}
{...props}
style={shouldAnimate ? styles : {}}
sx={{
...rowProps?.sx,
...props?.sx,
...(!isDesktopView && {
WebkitTapHighlightColor: "transparent",
}),
borderBottom: "none",
minHeight:"100%"
}}
>
{children}
</Wrapper>
);
};
export default memo(GiveAnimatedListItem);
|