feat(nx-dev): Move nx-cloud to app router

nx-dev/nx-dev/app/nx-cloud/page.tsx

@@ -0,0 +1,67 @@
+import {
+  Layout,
+  Hero,
+  TrustedBy,
+  FasterAndCheaper,
+  UnderstandWorkspace,
+  EnhancedWithAi,
+  AutomatedAgentsManagement,
+  AgentNumberOverTime,
+  Statistics,
+  CallToAction,
+} from '@nx/nx-dev/ui-cloud';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Nx Cloud',
+  description:
+    'Nx Cloud is the end-to-end solution for smart, efficient and maintainable CI.',
+  openGraph: {
+    url: 'https://nx.dev/nx-cloud',
+    title: 'Nx Cloud',
+    description:
+      'Nx Cloud is the end-to-end solution for smart, efficient and maintainable CI.',
+    images: [
+      {
+        url: 'https://nx.dev/socials/nx-media.png',
+        width: 800,
+        height: 421,
+        alt: 'Nx: Smart Monorepos · Fast CI',
+        type: 'image/jpeg',
+      },
+    ],
+    siteName: 'NxDev',
+    type: 'website',
+  },
+};
+
+export default function NxCloudPage(): JSX.Element {
+  return (
+    <Layout>
+      <Hero />
+      <TrustedBy />
+
+      <div className="mt-32 lg:mt-56">
+        <FasterAndCheaper />
+      </div>
+      <div className="mt-32 lg:mt-56">
+        <UnderstandWorkspace />
+      </div>
+      <div className="mt-32 lg:mt-56">
+        <EnhancedWithAi />
+      </div>
+      <div className="mt-32 lg:mt-56">
+        <AutomatedAgentsManagement />
+      </div>
+      <div className="mt-32 lg:mt-56">
+        <AgentNumberOverTime />
+      </div>
+      <div className="mt-32 lg:mt-56">
+        <Statistics />
+      </div>
+      <div className="mt-32 lg:mt-56">
+        <CallToAction />
+      </div>
+    </Layout>
+  );
+}

nx-dev/ui-cloud/src/lib/agent-number-over-time.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { SectionHeading } from '@nx/nx-dev/ui-common/src/lib/section-tags';
 import { motion } from 'framer-motion';
 import { useEffect, useState } from 'react';

nx-dev/ui-cloud/src/lib/automated-agents-management.tsx

@@ -1,3 +1,4 @@
+'use client';
 import {
   AdjustmentsVerticalIcon,
   ArrowLongDownIcon,

nx-dev/ui-cloud/src/lib/faster-and-cheaper.tsx

@@ -1,3 +1,4 @@
+'use client';
 import {
   Variants,
   animate,

nx-dev/ui-cloud/src/lib/hero.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { Dialog, Transition } from '@headlessui/react';
 import { cx } from '@nx/nx-dev/ui-primitives';
 import { PlayIcon } from '@heroicons/react/24/outline';

nx-dev/ui-cloud/src/lib/layout.tsx

@@ -1,13 +1,10 @@
-import { Header, Footer } from '@nx/nx-dev/ui-common';
-
 export function Layout({
   children,
 }: {
   children: React.ReactNode;
 }): JSX.Element {
   return (
     <div>
-      <Header />
       <div className="relative isolate pt-14">
         <div
           className="absolute inset-x-0 -top-40 -z-10 h-full transform-gpu overflow-hidden blur-3xl sm:-top-80"
@@ -23,7 +20,6 @@ export function Layout({
         </div>
         <main className="py-24 sm:py-32">{children}</main>
       </div>
-      <Footer />
     </div>
   );
 }

nx-dev/ui-cloud/src/lib/statistics.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { motion } from 'framer-motion';
 import { useEffect, useState } from 'react';
 import { SectionHeading } from '@nx/nx-dev/ui-common/src/lib/section-tags';

nx-dev/ui-cloud/src/lib/understand-workspace.tsx

@@ -1,3 +1,4 @@
+'use client';
 import {
   ArrowLongRightIcon,
   ArrowsRightLeftIcon,