diff --git a/nx-dev/ui-enterprise/src/lib/enterprise-addons.tsx b/nx-dev/ui-enterprise/src/lib/enterprise-addons.tsx index 22f9bd1e79ed7..7fde9872ff399 100644 --- a/nx-dev/ui-enterprise/src/lib/enterprise-addons.tsx +++ b/nx-dev/ui-enterprise/src/lib/enterprise-addons.tsx @@ -1,10 +1,9 @@ -import { SectionHeading } from './temp/typography'; import { BoltIcon, ChevronDoubleRightIcon, UsersIcon, - WrenchIcon, } from '@heroicons/react/24/outline'; +import { SectionHeading } from '@nx/nx-dev/ui-common'; export function EnterpriseAddons(): JSX.Element { return ( diff --git a/nx-dev/ui-enterprise/src/lib/hero.tsx b/nx-dev/ui-enterprise/src/lib/hero.tsx index b83b0089e64ca..530caff564cee 100644 --- a/nx-dev/ui-enterprise/src/lib/hero.tsx +++ b/nx-dev/ui-enterprise/src/lib/hero.tsx @@ -1,5 +1,4 @@ -import { SectionHeading } from './temp/typography'; -import { ButtonLink } from '@nx/nx-dev/ui-common'; +import { ButtonLink, SectionHeading } from '@nx/nx-dev/ui-common'; import Link from 'next/link'; export function Hero(): JSX.Element { diff --git a/nx-dev/ui-enterprise/src/lib/scale-ci-and-teams.tsx b/nx-dev/ui-enterprise/src/lib/scale-ci-and-teams.tsx deleted file mode 100644 index 12d332d8fcc35..0000000000000 --- a/nx-dev/ui-enterprise/src/lib/scale-ci-and-teams.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import { BoltIcon } from '@heroicons/react/24/outline'; -import { SectionHeading } from '@nx/nx-dev/ui-common'; -import { NxAgentsIcon, NxReplayIcon } from '@nx/nx-dev/ui-icons'; - -const features = [ - { - name: 'Cache with Nx Replay', - description: - 'Quis tellus eget adipiscing convallis sit sit eget aliquet quis. Suspendisse eget egestas a elementum pulvinar et feugiat blandit at. In mi viverra elit nunc.', - icon: NxReplayIcon, - }, - { - name: 'Distribution with Nx Agents', - description: - 'Quis tellus eget adipiscing convallis sit sit eget aliquet quis. Suspendisse eget egestas a elementum pulvinar et feugiat blandit at. In mi viverra elit nunc.', - icon: NxAgentsIcon, - }, - { - name: 'Split tasks with Atomizer', - description: - 'Quis tellus eget adipiscing convallis sit sit eget aliquet quis. Suspendisse eget egestas a elementum pulvinar et feugiat blandit at. In mi viverra elit nunc.', - icon: BoltIcon, - }, -]; - -export function ScaleCiAndTeams(): JSX.Element { - return ( -
-
- - Scale CI & teams - -

- Quis tellus eget adipiscing convallis sit sit eget aliquet quis. - Suspendisse eget egestas a elementum pulvinar et feugiat blandit at. - In mi viverra elit nunc. -

-
-
-
- {features.map((feature) => ( -
-
-
-
-

{feature.description}

-
-
- ))} -
-
-
- ); -} diff --git a/nx-dev/ui-enterprise/src/lib/scale-your-people.tsx b/nx-dev/ui-enterprise/src/lib/scale-your-people.tsx index 235e6fb3ffdd7..a20f61ce61c26 100644 --- a/nx-dev/ui-enterprise/src/lib/scale-your-people.tsx +++ b/nx-dev/ui-enterprise/src/lib/scale-your-people.tsx @@ -3,11 +3,10 @@ import { Cog6ToothIcon, CubeTransparentIcon, IdentificationIcon, - PhotoIcon, SquaresPlusIcon, UserGroupIcon, } from '@heroicons/react/24/outline'; -import { SectionHeading } from './temp/typography'; +import { SectionHeading } from '@nx/nx-dev/ui-common'; export function ScaleYourPeople(): JSX.Element { return ( @@ -250,28 +249,6 @@ export function ScaleYourPeople(): JSX.Element { - {/*
*/} - {/* */} - {/* */} - {/* */} - {/*
*/} - {/*

*/} - {/* Crystal clear organizations*/} - {/*

*/} - {/*

*/} - {/* Regardless of how many Nx Workspaces your company has, Nx Enterprise*/} - {/* can give you the visibility you need to understand what they have in*/} - {/* common, how they relate, and how they differ. Developers are no*/} - {/* longer relegated to contributing to one Nx Workspace.*/} - {/*

*/} - {/*
*/} - {/*
*/} ); diff --git a/nx-dev/ui-enterprise/src/lib/security.tsx b/nx-dev/ui-enterprise/src/lib/security.tsx index 0a820a56394f9..29d5e4460fe3d 100644 --- a/nx-dev/ui-enterprise/src/lib/security.tsx +++ b/nx-dev/ui-enterprise/src/lib/security.tsx @@ -1,4 +1,4 @@ -import { SectionHeading } from './temp/typography'; +import { SectionHeading } from '@nx/nx-dev/ui-common'; export function Security(): JSX.Element { return ( diff --git a/nx-dev/ui-enterprise/src/lib/solve-your-ci.tsx b/nx-dev/ui-enterprise/src/lib/solve-your-ci.tsx index 1240510cc953e..8d1f91cb66713 100644 --- a/nx-dev/ui-enterprise/src/lib/solve-your-ci.tsx +++ b/nx-dev/ui-enterprise/src/lib/solve-your-ci.tsx @@ -12,9 +12,9 @@ import { } from '@heroicons/react/24/outline'; import { animate, motion, useMotionValue, useTransform } from 'framer-motion'; import { useEffect } from 'react'; -import { SectionHeading } from './temp/typography'; import { BentoGrid, BentoGridItem } from './bento-grid'; import { cx } from '@nx/nx-dev/ui-primitives'; +import { SectionHeading } from '@nx/nx-dev/ui-common'; export function SolveYourCi(): JSX.Element { return ( diff --git a/nx-dev/ui-enterprise/src/lib/statistics.tsx b/nx-dev/ui-enterprise/src/lib/statistics.tsx deleted file mode 100644 index 05a921930a188..0000000000000 --- a/nx-dev/ui-enterprise/src/lib/statistics.tsx +++ /dev/null @@ -1,150 +0,0 @@ -import { motion } from 'framer-motion'; -import { useEffect, useState } from 'react'; -import { SectionHeading } from './temp/typography'; - -/** - * Calculate the total number of years worth of compute. - * - * @param {number} millis - The total number of seconds. - * @return {number} The total number of years. - */ -function getTotalYears(millis: number): number { - /** - * The number of millis in a year is approximately: - * 86 400 000 millis/day * 365.25 days/year ≈ 31 557 600 000 seconds/year. - */ - const yearMillis = Number(31557600000); - return Math.round(millis / yearMillis); -} - -/** - * Fetches the time saved from a remote API. - * - * @returns {Promise} A promise that resolves to an object containing the time saved data. - * @returns {Date} The date the time saved data was retrieved. - * @returns {number} The time saved in the last 7 days. - * @returns {number} The time saved in the last 30 days. - * @returns {number} The time's saved since the start. - */ -function fetchTimeSaved(): Promise<{ - date: Date; - last7days: number; - last30days: number; - sinceStart: number; -}> { - const apiUrl = 'https://cloud.nx.app/time-saved'; - - return fetch(apiUrl) - .then((response) => response.json()) - .catch(() => ({ - date: new Date(), - last7days: Math.round(Math.random() * 1000000000), - last30days: Math.round(Math.random() * 100000000000), - sinceStart: Math.round(Math.random() * 10000000000000), - })); -} - -const stats = [ - { - id: 1, - name: 'Developers using Nx', - value: 2, - suffix: 'M+', - }, - { - id: 3, - name: 'Active workspaces', - value: '4k', - suffix: '+', - }, - { id: 2, name: 'Compute time saved', value: 800, suffix: '+ years' }, - { id: 4, name: 'Runs daily', value: 100, suffix: 'k+' }, -]; - -export function Statistics(): JSX.Element { - const variants = { - hidden: { - opacity: 0, - transition: { - when: 'afterChildren', - }, - }, - visible: (i: number) => ({ - opacity: 1, - transition: { - delay: i || 0, - }, - }), - }; - const itemVariants = { - visible: (i: number) => ({ - opacity: 1, - y: 0, - transition: { - delay: i * 0.25, - duration: 0.65, - ease: 'easeOut', - when: 'beforeChildren', - staggerChildren: 0.3, - }, - }), - hidden: { - opacity: 0, - y: 4, - transition: { - when: 'afterChildren', - }, - }, - }; - const [timeSaved, setTimeSaved] = useState(800); - - useEffect(() => { - let ignore = false; - fetchTimeSaved().then((data) => { - if (!ignore) { - setTimeSaved(getTotalYears(data.sinceStart)); - } - }); - return () => { - ignore = true; - }; - }, []); - - return ( -
-
- - Trusted by startups and Fortune 500 companies - - {/**/} - {/* Nx Cloud provides plans for open source projects, startups, and large*/} - {/* enterprises.*/} - {/**/} -
- - {stats.map((stat, idx) => ( - -
- {stat.name} -
-
- {stat.name === 'Compute time saved' ? timeSaved : stat.value} - {stat.suffix} -
-
- ))} -
-
- ); -} diff --git a/nx-dev/ui-enterprise/src/lib/temp/typography.tsx b/nx-dev/ui-enterprise/src/lib/temp/typography.tsx deleted file mode 100644 index 8006bca76672d..0000000000000 --- a/nx-dev/ui-enterprise/src/lib/temp/typography.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import { cx } from '@nx/nx-dev/ui-primitives'; -import { ElementType, ReactNode } from 'react'; - -type AllowedVariants = 'title' | 'display' | 'subtitle'; - -type Headings = { - as: ElementType; - className?: string; - children: ReactNode | ReactNode[]; - id?: string; - variant: AllowedVariants; -}; - -type Description = { - as: ElementType; - className?: string; - children: ReactNode | ReactNode[]; - id?: string; -}; - -const variants: Record = { - title: - 'text-3xl font-medium tracking-tight text-slate-950 dark:text-white sm:text-5xl', - display: - 'text-4xl font-medium tracking-tight text-slate-950 dark:text-white sm:text-7xl', - subtitle: 'text-lg leading-8 text-slate-700 dark:text-slate-300 sm:text-2xl', -}; - -export function SectionHeading({ - as = 'div', - children, - className, - variant, - ...rest -}: Headings): JSX.Element { - const Tag = as; - return ( - - {children} - - ); -} - -export function SectionDescription({ - as = 'div', - children, - className, - ...rest -}: Description): JSX.Element { - const Tag = as; - return ( - - {children} - - ); -}