mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-11 20:08:37 +00:00
build: lazy load lottie-web (#1622)
This commit is contained in:
@@ -1,7 +1,9 @@
|
||||
import lottie from 'lottie-web';
|
||||
import { atom, useAtomValue } from 'jotai';
|
||||
import type { FC } from 'react';
|
||||
import { useEffect, useRef } from 'react';
|
||||
|
||||
const lottieAtom = atom(async () => import('lottie-web').then(m => m.default));
|
||||
|
||||
type CustomLottieProps = {
|
||||
options: {
|
||||
loop?: boolean | number | undefined;
|
||||
@@ -26,6 +28,7 @@ const CustomLottie: FC<CustomLottieProps> = ({
|
||||
}) => {
|
||||
const element = useRef<HTMLDivElement>(null);
|
||||
const lottieInstance = useRef<any>();
|
||||
const lottie = useAtomValue(lottieAtom);
|
||||
|
||||
useEffect(() => {
|
||||
if (element.current) {
|
||||
@@ -37,7 +40,7 @@ const CustomLottie: FC<CustomLottieProps> = ({
|
||||
return () => {
|
||||
lottieInstance.current?.destroy();
|
||||
};
|
||||
}, [options]);
|
||||
}, [lottie, options]);
|
||||
|
||||
useEffect(() => {
|
||||
if (speed) {
|
||||
|
||||
Reference in New Issue
Block a user