43 lines
835 B
TypeScript
43 lines
835 B
TypeScript
import React, {
|
|
FC, memo, useEffect, useState,
|
|
} from '../../lib/teact/teact';
|
|
|
|
import getAnimationData, { ANIMATED_STICKERS_PATHS } from './helpers/animatedAssets';
|
|
|
|
import AnimatedSticker from './AnimatedSticker';
|
|
|
|
type OwnProps = {
|
|
name: keyof typeof ANIMATED_STICKERS_PATHS;
|
|
size: number;
|
|
playSegment?: [number, number];
|
|
color?: [number, number, number];
|
|
};
|
|
|
|
const AnimatedIcon: FC<OwnProps> = ({
|
|
size,
|
|
name,
|
|
playSegment,
|
|
color,
|
|
}) => {
|
|
const [iconData, setIconData] = useState<string>();
|
|
|
|
useEffect(() => {
|
|
getAnimationData(name).then(setIconData);
|
|
}, [name]);
|
|
|
|
return (
|
|
<AnimatedSticker
|
|
id={name}
|
|
play
|
|
noLoop
|
|
playSegment={playSegment}
|
|
size={size}
|
|
speed={1}
|
|
animationData={iconData}
|
|
color={color}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default memo(AnimatedIcon);
|