miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

docs(nxdev): getting started animation cleanup (#7720)

Browse Source
This commit is contained in:
Benjamin Cabanes 2021-11-12 13:34:06 -05:00 committed by GitHub
parent 91967a37a7
commit 7dccb15d5c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 3 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
nx-dev/ui-home/src/lib/getting-started.tsx
View File

@ -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>