From fc7ee36a96b7e5bdf4e7dfee831badf21088a64d Mon Sep 17 00:00:00 2001 From: Isaac Mann Date: Mon, 25 Nov 2024 07:37:19 -0500 Subject: [PATCH 01/24] chore(nx-dev): wrap breadcrumbs (#29059) --- nx-dev/ui-common/src/lib/breadcrumbs.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/nx-dev/ui-common/src/lib/breadcrumbs.tsx b/nx-dev/ui-common/src/lib/breadcrumbs.tsx index 71aef1949f318b..b15f905abcd88f 100644 --- a/nx-dev/ui-common/src/lib/breadcrumbs.tsx +++ b/nx-dev/ui-common/src/lib/breadcrumbs.tsx @@ -72,9 +72,12 @@ export function Breadcrumbs({ return (
{/* SPACER */}
@@ -385,22 +320,14 @@ export function DocumentationHeader({ role="menu" className="items-justified hidden justify-center space-x-4 lg:flex" > - - Contact - diff --git a/nx-dev/ui-common/src/lib/headers/header.tsx b/nx-dev/ui-common/src/lib/headers/header.tsx index 64739266cf7af9..08f2462b15b197 100644 --- a/nx-dev/ui-common/src/lib/headers/header.tsx +++ b/nx-dev/ui-common/src/lib/headers/header.tsx @@ -8,15 +8,16 @@ import { import cx from 'classnames'; import Link from 'next/link'; import { Fragment, useEffect, useState } from 'react'; -import { ButtonLink } from '../button'; +import { ButtonLink, ButtonLinkProps } from '../button'; import { companyItems, eventItems, featuresItems, learnItems, - solutions, + ossProducts, resourceMenuItems, - solutionsMenuItems, + productsMenuItems, + enterpriseResourcesMenuItems, } from './menu-items'; import { MobileMenuItem } from './mobile-menu-item'; import { SectionsMenu } from './sections-menu'; @@ -24,7 +25,11 @@ import { TwoColumnsMenu } from './two-columns-menu'; import { AlgoliaSearch } from '@nx/nx-dev/feature-search'; import { GitHubIcon, NxCloudAnimatedIcon, NxIcon } from '@nx/nx-dev/ui-icons'; -export function Header(): JSX.Element { +interface HeaderProps { + ctaButtons?: ButtonLinkProps[]; +} + +export function Header({ ctaButtons }: HeaderProps): JSX.Element { let [isOpen, setIsOpen] = useState(false); // We need to close the popover if the route changes or the window is resized to prevent the popover from being stuck open. @@ -42,6 +47,19 @@ export function Header(): JSX.Element { }; }, []); + const defaultCtaButtons: ButtonLinkProps[] = [ + { + href: '/nx-cloud', + variant: 'primary', + size: 'small', + target: '_blank', + title: 'Try Nx Cloud for free', + children: Try Nx Cloud for free, + }, + ]; + + const buttonsToRender = ctaButtons || defaultCtaButtons; + return (

Main navigation

- {/*FEATURES*/} - - {({ open }) => ( - <> - - - Features - - - - - - - - - )} - - {/*SOLUTIONS*/} - - {({ open }) => ( - <> - - - Solutions - - - - - - - - - - )} - Blog - - CI Pricing - {/*RESOURCES*/} {({ open }) => ( @@ -215,14 +136,49 @@ export function Header(): JSX.Element { leaveFrom="opacity-100 translate-y-0" leaveTo="opacity-0 translate-y-1" > - + )} -
+
+ + Nx Cloud + + + Pricing + +
+ + Powerpack + + + Enterprise + +
+
@@ -230,24 +186,9 @@ export function Header(): JSX.Element { {/*SECONDARY NAVIGATION*/}