From 7dccb15d5c01a668df78703945186f9530b22f11 Mon Sep 17 00:00:00 2001
From: Benjamin Cabanes <3447705+bcabanes@users.noreply.github.com>
Date: Fri, 12 Nov 2021 13:34:06 -0500
Subject: [PATCH] docs(nxdev): getting started animation cleanup (#7720)

---
 nx-dev/ui-home/src/lib/getting-started.tsx | 13 +++----------
 1 file changed, 3 insertions(+), 10 deletions(-)

diff --git a/nx-dev/ui-home/src/lib/getting-started.tsx b/nx-dev/ui-home/src/lib/getting-started.tsx
index a25b8bd41b..71ea0ec41c 100644
--- a/nx-dev/ui-home/src/lib/getting-started.tsx
+++ b/nx-dev/ui-home/src/lib/getting-started.tsx
@@ -1,8 +1,7 @@
-import { ReactComponentElement, useEffect, useState } from 'react';
+import { ReactComponentElement, useState } from 'react';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
-import { AnimatePresence, motion, useAnimation } from 'framer-motion';
-import { useInView } from 'react-intersection-observer';
+import { AnimatePresence, motion } from 'framer-motion';
 import cx from 'classnames';
 import { InlineCommand } from '@nrwl/nx-dev/ui-commands';
 import { sendCustomEvent } from '@nrwl/nx-dev/feature-analytics';
@@ -987,17 +986,11 @@ export function GettingStarted(): ReactComponentElement<any> {
     },
   ];
   const [activeId, setActiveId] = useState('typescript');
-  const controls = useAnimation();
-  const [, inView] = useInView({ threshold: 0.5, triggerOnce: true });
-  useEffect(() => {
-    if (!inView) return;
-    controls.start('visible');
-  }, [controls, inView]);
 
   return (
     <div id="getting-started">
       <Tabs tabs={tabs} activeTab={activeId} setActiveTab={setActiveId} />
-      <AnimatePresence exitBeforeEnter>
+      <AnimatePresence>
         {panes.find((pane) => pane.id === activeId)?.element()}
       </AnimatePresence>
     </div>