fix: disables animations on scene layer on first render

This commit is contained in:
Mark Mankarious 2023-10-31 10:29:12 +00:00
parent db9f60f569
commit 8d98b84213

View file

@ -1,4 +1,4 @@
import React, { useRef, useEffect } from 'react';
import React, { useRef, useEffect, useState } from 'react';
import gsap from 'gsap';
import { Box, SxProps } from '@mui/material';
import { useUiStateStore } from 'src/stores/uiStateStore';
@ -16,6 +16,7 @@ export const SceneLayer = ({
sx,
disableAnimation
}: Props) => {
const [isFirstRender, setIsFirstRender] = useState(true);
const elementRef = useRef<HTMLDivElement>(null);
const scroll = useUiStateStore((state) => {
@ -29,12 +30,16 @@ export const SceneLayer = ({
if (!elementRef.current) return;
gsap.to(elementRef.current, {
duration: disableAnimation ? 0 : 0.25,
duration: disableAnimation || isFirstRender ? 0 : 0.25,
translateX: scroll.position.x,
translateY: scroll.position.y,
scale: zoom
});
}, [zoom, scroll, disableAnimation]);
if (isFirstRender) {
setIsFirstRender(false);
}
}, [zoom, scroll, disableAnimation, isFirstRender]);
return (
<Box