fixed rerendering issues on flow

src/components/flow/FlowSwiperHero/index.tsx

@@ -1,6 +1,5 @@
 import React, { FC, useCallback, useMemo, useState } from 'react';
 
-
 import classNames from 'classnames';
 import SwiperCore, { Autoplay, EffectFade, Lazy, Navigation } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/react';
@@ -22,6 +21,18 @@ interface Props {
   heroes: IFlowNode[];
 }
 
+const autoplay = {
+  delay: 3000,
+  pauseOnMouseEnter: false,
+  stopOnLastSlide: false,
+  disableOnInteraction: false,
+};
+
+const lazy = {
+  loadPrevNextAmount: 5,
+  checkInView: false,
+};
+
 export const FlowSwiperHero: FC<Props> = ({ heroes }) => {
   const { innerWidth } = useWindowSize();
   const { push } = useNavigation();
@@ -104,18 +115,10 @@ export const FlowSwiperHero: FC<Props> = ({ heroes }) => {
         effect="fade"
         speed={3000}
         className={styles.swiper}
-        lazy={{
-          loadPrevNextAmount: 5,
-          checkInView: false,
-        }}
+        lazy={lazy}
         loop
         slidesPerView={1}
-        autoplay={{
-          delay: 3000,
-          pauseOnMouseEnter: false,
-          stopOnLastSlide: false,
-          disableOnInteraction: false,
-        }}
+        autoplay={autoplay}
         runCallbacksOnInit
         onSwiper={setControlledSwiper}
         onSlidesLengthChange={onIndexChange}

src/hooks/dom/useWindowSize.ts

@@ -14,7 +14,7 @@ export const useWindowSize = () => {
     window.addEventListener('resize', onResize);
 
     return () => window.removeEventListener('resize', onResize);
-  });
+  }, []);
 
   return size;
 };

src/pages/index.tsx

@@ -10,7 +10,7 @@ import { FlowLayout } from '~/layouts/FlowLayout';
 import { FlowProvider } from '~/utils/providers/FlowProvider';
 import { getPageTitle } from '~/utils/ssr/getPageTitle';
 
-export const getStaticProps = async () => {
+export const getStaticProps = async ctx => {
   const fallbackData = await getNodeDiff({
     start: new Date().toISOString(),
     end: new Date().toISOString(),