From e5ed477c5af0e6c2a56c961dca98b4a949b6cef4 Mon Sep 17 00:00:00 2001 From: Isaac Mann Date: Tue, 15 Apr 2025 11:54:03 -0400 Subject: [PATCH] docs(core): partners page (#30376) Creates a [/partners](https://nx-dev-git-nx-dev-partners-nrwl.vercel.app/partners) page --------- Co-authored-by: Jordan Powell --- nx-dev/nx-dev/pages/partners.tsx | 44 ++++++++ .../ui-common/src/lib/headers/menu-items.ts | 9 ++ nx-dev/ui-icons/src/index.ts | 7 ++ nx-dev/ui-icons/src/lib/partners/bitovi.tsx | 48 +++++++++ .../ui-icons/src/lib/partners/callstack.tsx | 32 ++++++ nx-dev/ui-icons/src/lib/partners/e-square.tsx | 43 ++++++++ .../ui-icons/src/lib/partners/hero-devs.tsx | 57 ++++++++++ .../ui-icons/src/lib/partners/push-based.tsx | 24 +++++ nx-dev/ui-partners/.babelrc | 12 +++ nx-dev/ui-partners/.eslintrc.json | 18 ++++ nx-dev/ui-partners/README.md | 7 ++ nx-dev/ui-partners/project.json | 9 ++ nx-dev/ui-partners/src/index.ts | 3 + nx-dev/ui-partners/src/lib/call-to-action.tsx | 102 ++++++++++++++++++ nx-dev/ui-partners/src/lib/hero.tsx | 28 +++++ .../ui-partners/src/lib/partner-icon-grid.tsx | 38 +++++++ nx-dev/ui-partners/src/lib/partner.tsx | 48 +++++++++ nx-dev/ui-partners/src/lib/partners-list.tsx | 78 ++++++++++++++ nx-dev/ui-partners/tsconfig.json | 18 ++++ nx-dev/ui-partners/tsconfig.lib.json | 29 +++++ tsconfig.base.json | 1 + 21 files changed, 655 insertions(+) create mode 100644 nx-dev/nx-dev/pages/partners.tsx create mode 100644 nx-dev/ui-icons/src/lib/partners/bitovi.tsx create mode 100644 nx-dev/ui-icons/src/lib/partners/callstack.tsx create mode 100644 nx-dev/ui-icons/src/lib/partners/e-square.tsx create mode 100644 nx-dev/ui-icons/src/lib/partners/hero-devs.tsx create mode 100644 nx-dev/ui-icons/src/lib/partners/push-based.tsx create mode 100644 nx-dev/ui-partners/.babelrc create mode 100644 nx-dev/ui-partners/.eslintrc.json create mode 100644 nx-dev/ui-partners/README.md create mode 100644 nx-dev/ui-partners/project.json create mode 100644 nx-dev/ui-partners/src/index.ts create mode 100644 nx-dev/ui-partners/src/lib/call-to-action.tsx create mode 100644 nx-dev/ui-partners/src/lib/hero.tsx create mode 100644 nx-dev/ui-partners/src/lib/partner-icon-grid.tsx create mode 100644 nx-dev/ui-partners/src/lib/partner.tsx create mode 100644 nx-dev/ui-partners/src/lib/partners-list.tsx create mode 100644 nx-dev/ui-partners/tsconfig.json create mode 100644 nx-dev/ui-partners/tsconfig.lib.json diff --git a/nx-dev/nx-dev/pages/partners.tsx b/nx-dev/nx-dev/pages/partners.tsx new file mode 100644 index 0000000000..d6dea7084b --- /dev/null +++ b/nx-dev/nx-dev/pages/partners.tsx @@ -0,0 +1,44 @@ +import { DefaultLayout } from '@nx/nx-dev/ui-common'; +import { Hero, PartnersList } from '@nx/nx-dev/ui-partners'; +import { NextSeo } from 'next-seo'; +import { useRouter } from 'next/router'; +import { contactButton } from '../lib/components/headerCtaConfigs'; + +export function Partners(): JSX.Element { + const router = useRouter(); + + return ( + <> + + +
+ +
+
+ +
+ + + ); +} + +export default Partners; diff --git a/nx-dev/ui-common/src/lib/headers/menu-items.ts b/nx-dev/ui-common/src/lib/headers/menu-items.ts index 14289563ec..4decda6471 100644 --- a/nx-dev/ui-common/src/lib/headers/menu-items.ts +++ b/nx-dev/ui-common/src/lib/headers/menu-items.ts @@ -16,6 +16,7 @@ import { MicrophoneIcon, VideoCameraIcon, CheckBadgeIcon, + LifebuoyIcon, BookOpenIcon, } from '@heroicons/react/24/outline'; import { FC, SVGProps } from 'react'; @@ -277,6 +278,14 @@ export const companyItems: MenuItem[] = [ isNew: false, isHighlight: false, }, + { + name: 'Partners', + description: null, + icon: LifebuoyIcon, + href: '/partners', + isNew: false, + isHighlight: false, + }, ]; export const resourceMenuItems = { diff --git a/nx-dev/ui-icons/src/index.ts b/nx-dev/ui-icons/src/index.ts index 189a022ad0..067903db1f 100644 --- a/nx-dev/ui-icons/src/index.ts +++ b/nx-dev/ui-icons/src/index.ts @@ -89,6 +89,13 @@ export * from './lib/others/linux'; export * from './lib/others/min-io'; export * from './lib/others/windows'; +// PARTNERS +export * from './lib/partners/bitovi'; +export * from './lib/partners/callstack'; +export * from './lib/partners/hero-devs'; +export * from './lib/partners/push-based'; +export * from './lib/partners/e-square'; + // PODCASTS export * from './lib/podcasts/amazon-music'; export * from './lib/podcasts/apple-podcasts'; diff --git a/nx-dev/ui-icons/src/lib/partners/bitovi.tsx b/nx-dev/ui-icons/src/lib/partners/bitovi.tsx new file mode 100644 index 0000000000..08f5ba2354 --- /dev/null +++ b/nx-dev/ui-icons/src/lib/partners/bitovi.tsx @@ -0,0 +1,48 @@ +import { FC, SVGProps } from 'react'; + +export const BitoviIcon: FC> = (props) => { + return ( + + Bitovi + + + + + + + + + + ); +}; diff --git a/nx-dev/ui-icons/src/lib/partners/callstack.tsx b/nx-dev/ui-icons/src/lib/partners/callstack.tsx new file mode 100644 index 0000000000..34505bb051 --- /dev/null +++ b/nx-dev/ui-icons/src/lib/partners/callstack.tsx @@ -0,0 +1,32 @@ +import { FC, SVGProps } from 'react'; + +export const CallstackIcon: FC> = (props) => { + return ( + + Callstack + + + + + + ); +}; diff --git a/nx-dev/ui-icons/src/lib/partners/e-square.tsx b/nx-dev/ui-icons/src/lib/partners/e-square.tsx new file mode 100644 index 0000000000..5b604d2774 --- /dev/null +++ b/nx-dev/ui-icons/src/lib/partners/e-square.tsx @@ -0,0 +1,43 @@ +import { FC, SVGProps } from 'react'; + +export const ESquareIcon: FC> = (props) => { + return ( + + E-Square + + + + + + + + + + + ); +}; diff --git a/nx-dev/ui-icons/src/lib/partners/hero-devs.tsx b/nx-dev/ui-icons/src/lib/partners/hero-devs.tsx new file mode 100644 index 0000000000..69efd6547d --- /dev/null +++ b/nx-dev/ui-icons/src/lib/partners/hero-devs.tsx @@ -0,0 +1,57 @@ +import { FC, SVGProps } from 'react'; + +export const HeroDevsIcon: FC> = (props) => { + return ( + + HeroDevs + + + + + + + + + + + + + + + + + + + ); +}; diff --git a/nx-dev/ui-icons/src/lib/partners/push-based.tsx b/nx-dev/ui-icons/src/lib/partners/push-based.tsx new file mode 100644 index 0000000000..ad4ca5ec31 --- /dev/null +++ b/nx-dev/ui-icons/src/lib/partners/push-based.tsx @@ -0,0 +1,24 @@ +import { FC, SVGProps } from 'react'; + +export const PushBasedIcon: FC> = (props) => { + return ( + + Push Based + + + + ); +}; diff --git a/nx-dev/ui-partners/.babelrc b/nx-dev/ui-partners/.babelrc new file mode 100644 index 0000000000..1ea870ead4 --- /dev/null +++ b/nx-dev/ui-partners/.babelrc @@ -0,0 +1,12 @@ +{ + "presets": [ + [ + "@nx/react/babel", + { + "runtime": "automatic", + "useBuiltIns": "usage" + } + ] + ], + "plugins": [] +} diff --git a/nx-dev/ui-partners/.eslintrc.json b/nx-dev/ui-partners/.eslintrc.json new file mode 100644 index 0000000000..a39ac5d057 --- /dev/null +++ b/nx-dev/ui-partners/.eslintrc.json @@ -0,0 +1,18 @@ +{ + "extends": ["plugin:@nx/react", "../../.eslintrc.json"], + "ignorePatterns": ["!**/*"], + "overrides": [ + { + "files": ["*.ts", "*.tsx", "*.js", "*.jsx"], + "rules": {} + }, + { + "files": ["*.ts", "*.tsx"], + "rules": {} + }, + { + "files": ["*.js", "*.jsx"], + "rules": {} + } + ] +} diff --git a/nx-dev/ui-partners/README.md b/nx-dev/ui-partners/README.md new file mode 100644 index 0000000000..034a9e9989 --- /dev/null +++ b/nx-dev/ui-partners/README.md @@ -0,0 +1,7 @@ +# ui-partners + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test ui-partners` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/nx-dev/ui-partners/project.json b/nx-dev/ui-partners/project.json new file mode 100644 index 0000000000..192187f542 --- /dev/null +++ b/nx-dev/ui-partners/project.json @@ -0,0 +1,9 @@ +{ + "name": "ui-partners", + "$schema": "../../node_modules/nx/schemas/project-schema.json", + "sourceRoot": "nx-dev/ui-partners/src", + "projectType": "library", + "tags": [], + "// targets": "to see all targets run: nx show project ui-partners --web", + "targets": {} +} diff --git a/nx-dev/ui-partners/src/index.ts b/nx-dev/ui-partners/src/index.ts new file mode 100644 index 0000000000..a7be984191 --- /dev/null +++ b/nx-dev/ui-partners/src/index.ts @@ -0,0 +1,3 @@ +export * from './lib/call-to-action'; +export * from './lib/hero'; +export * from './lib/partners-list'; diff --git a/nx-dev/ui-partners/src/lib/call-to-action.tsx b/nx-dev/ui-partners/src/lib/call-to-action.tsx new file mode 100644 index 0000000000..78b7cfeb2c --- /dev/null +++ b/nx-dev/ui-partners/src/lib/call-to-action.tsx @@ -0,0 +1,102 @@ +import { SectionDescription } from '@nx/nx-dev/ui-common'; +import Link from 'next/link'; + +export interface CTAProps { + mainActionLinkText?: string; + mainActionTitle?: string; + mainActionLink?: string; +} + +export function CallToAction({ + mainActionTitle = 'Get started with Nx', + mainActionLinkText = 'Get started', + mainActionLink = '/getting-started/intro', +}: CTAProps): JSX.Element { + return ( +
+ +
+ ); +} diff --git a/nx-dev/ui-partners/src/lib/hero.tsx b/nx-dev/ui-partners/src/lib/hero.tsx new file mode 100644 index 0000000000..11c403cba9 --- /dev/null +++ b/nx-dev/ui-partners/src/lib/hero.tsx @@ -0,0 +1,28 @@ +import { SectionHeading, Strong } from '@nx/nx-dev/ui-common'; +import { type ReactElement } from 'react'; + +export function Hero(): ReactElement { + return ( +
+
+
+ + Nx Partners + + + Hire Nx Certified Experts to help you adopt best practices, + implement Nx Cloud, and accelerate your CI. + +
+
+
+ ); +} diff --git a/nx-dev/ui-partners/src/lib/partner-icon-grid.tsx b/nx-dev/ui-partners/src/lib/partner-icon-grid.tsx new file mode 100644 index 0000000000..2e643d72b4 --- /dev/null +++ b/nx-dev/ui-partners/src/lib/partner-icon-grid.tsx @@ -0,0 +1,38 @@ +import { FC, SVGProps } from 'react'; + +interface PartnerIcon { + url: string; + icon: FC>; + height: string; + width: string; +} + +interface PartnerIconGridProps { + icons: PartnerIcon[]; +} + +const PartnerIconGrid: FC = ({ icons }) => { + return ( +
+ {icons.map((partnerIcon, index) => { + return ( + + + ); + })} +
+ ); +}; + +export default PartnerIconGrid; +export { PartnerIconGrid, type PartnerIcon }; diff --git a/nx-dev/ui-partners/src/lib/partner.tsx b/nx-dev/ui-partners/src/lib/partner.tsx new file mode 100644 index 0000000000..967cd8644b --- /dev/null +++ b/nx-dev/ui-partners/src/lib/partner.tsx @@ -0,0 +1,48 @@ +import { FC } from 'react'; + +export const Partner: FC<{ + name: string; + logo: React.ReactNode; + href: string; + location: string; + tagline: string; + capabilities: string[]; +}> = ({ name, logo, href, location, tagline, capabilities }) => { + return ( + +
+ {logo} +
+
+
+ {name} +

{tagline}

+
({location})
+
+
+ {capabilities.map((capability) => ( + + {capability} + + ))} +
+
+ + ); +}; diff --git a/nx-dev/ui-partners/src/lib/partners-list.tsx b/nx-dev/ui-partners/src/lib/partners-list.tsx new file mode 100644 index 0000000000..b6544a8caf --- /dev/null +++ b/nx-dev/ui-partners/src/lib/partners-list.tsx @@ -0,0 +1,78 @@ +import { + BitoviIcon, + CallstackIcon, + ESquareIcon, + HeroDevsIcon, + PushBasedIcon, +} from '@nx/nx-dev/ui-icons'; +import { useEffect, useMemo, useState } from 'react'; +import { Partner } from './partner'; + +export function PartnersList(): JSX.Element { + const initialPartners = useMemo( + () => [ + { + name: 'HeroDevs', + logo: