Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-12 04:18:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

build: lazy load lottie-web (#1622)

Browse Source
This commit is contained in:
Himself65
2023-03-20 02:55:09 -05:00
committed by GitHub
parent cf3230c1ff
commit 45761f0250
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
apps/web/src/components/blocksuite/header/editor-mode-switch/CustomLottie.tsx
View File

@@ -1,7 +1,9 @@
import lottie from 'lottie-web'; import { atom, useAtomValue } from 'jotai';
import type { FC } from 'react'; import type { FC } from 'react';
import { useEffect, useRef } from 'react'; import { useEffect, useRef } from 'react';
const lottieAtom = atom(async () => import('lottie-web').then(m => m.default));
type CustomLottieProps = { type CustomLottieProps = {
options: { options: {
loop?: boolean | number | undefined; loop?: boolean | number | undefined;
@@ -26,6 +28,7 @@ const CustomLottie: FC<CustomLottieProps> = ({
}) => { }) => {
const element = useRef<HTMLDivElement>(null); const element = useRef<HTMLDivElement>(null);
const lottieInstance = useRef<any>(); const lottieInstance = useRef<any>();
const lottie = useAtomValue(lottieAtom);
useEffect(() => { useEffect(() => {
if (element.current) { if (element.current) {
@@ -37,7 +40,7 @@ const CustomLottie: FC<CustomLottieProps> = ({
return () => { return () => {
lottieInstance.current?.destroy(); lottieInstance.current?.destroy();
}; };
}, [options]); }, [lottie, options]);
useEffect(() => { useEffect(() => {
if (speed) { if (speed) {