Fix for layout shift (#147)

components/ui/Marquee/Marquee.tsx

@@ -2,7 +2,6 @@ import cn from 'classnames'
 import s from './Marquee.module.css'
 import { FC, ReactNode, Component } from 'react'
 import Ticker from 'react-ticker'
-import { useInView } from 'react-intersection-observer'
 
 interface Props {
   className?: string
@@ -23,18 +22,12 @@ const Maquee: FC<Props> = ({
     },
     className
   )
-  const [ref, inView] = useInView({
-    triggerOnce: true,
-    rootMargin: '200px 0px',
-  })
 
   return (
-    <div className={rootClassName} ref={ref}>
-      {inView ? (
-        <Ticker offset={80}>
-          {() => <div className={s.container}>{children}</div>}
-        </Ticker>
-      ) : null}
+    <div className={rootClassName}>
+      <Ticker offset={80}>
+        {() => <div className={s.container}>{children}</div>}
+      </Ticker>
     </div>
   )
 }

package.json

@@ -63,7 +63,6 @@
     "postcss-nesting": "^7.0.1",
     "react": "^16.14.0",
     "react-dom": "^16.14.0",
-    "react-intersection-observer": "^8.30.1",
     "react-merge-refs": "^1.1.0",
     "react-ticker": "^1.2.2",
     "swr": "^0.3.11",

yarn.lock

@@ -6406,11 +6406,6 @@ react-dom@^16.14.0:
     prop-types "^15.6.2"
     scheduler "^0.19.1"
 
-react-intersection-observer@^8.30.1:
-  version "8.30.1"
-  resolved "https://registry.yarnpkg.com/react-intersection-observer/-/react-intersection-observer-8.30.1.tgz#e0ce4835d2834fc712b096aec65230de79eeaadb"
-  integrity sha512-BGHGkmWz/d4Gs+44jWkrZBtJ6//HGwouZ9ub+kRRoRfguw2JoDlVrgTDwkQ/deDJAR9keTkQmMilNu+onhqfgw==
-
 react-is@16.13.1, react-is@^16.8.1:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"