feat(nx-dev): Updates based on feedback

nrwl · Jul 19, 2024 · 550e510 · 550e510
1 parent cd49857
commit 550e510
Show file tree

Hide file tree

Showing 7 changed files with 21 additions and 91 deletions.
diff --git a/nx-dev/nx-dev/app/blog/page.tsx b/nx-dev/nx-dev/app/blog/page.tsx
@@ -1,6 +1,7 @@
 import type { Metadata } from 'next';
 import { blogApi } from '../../lib/blog.api';
 import { BlogContainer } from '@nx/nx-dev/ui-blog';
+import { DefaultLayout } from '@nx/nx-dev/ui-common';
 
 export const metadata: Metadata = {
   title: 'Nx Blog - Updates from the Nx & Nx Cloud team',
@@ -29,5 +30,9 @@ async function getBlogs() {
 
 export default async function BlogIndex() {
   const blogs = await getBlogs();
-  return <BlogContainer blogPosts={blogs} />;
+  return (
+    <DefaultLayout>
+      <BlogContainer blogPosts={blogs} />
+    </DefaultLayout>
+  );
 }
diff --git a/nx-dev/nx-dev/app/layout.tsx b/nx-dev/nx-dev/app/layout.tsx
@@ -81,9 +81,7 @@ export default function RootLayout({
       </head>
       <body className="h-full bg-white text-slate-700 antialiased selection:bg-blue-500 selection:text-white dark:bg-slate-900 dark:text-slate-400 dark:selection:bg-sky-500">
         <AnnouncementBanner />
-        <Header />
         {children}
-        <Footer />
         <GlobalScripts gaMeasurementId={gaMeasurementId} />
       </body>
     </html>

diff --git a/nx-dev/nx-dev/app/nx-cloud/page.tsx b/nx-dev/nx-dev/app/nx-cloud/page.tsx
@@ -1,5 +1,4 @@
 import {
-  Layout,
   Hero,
   TrustedBy,
   FasterAndCheaper,
@@ -8,8 +7,10 @@ import {
   AutomatedAgentsManagement,
   AgentNumberOverTime,
   Statistics,
-  CallToAction,
 } from '@nx/nx-dev/ui-cloud';
+
+import { CallToAction, DefaultLayout } from '@nx/nx-dev/ui-common';
+
 import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
@@ -37,7 +38,7 @@ export const metadata: Metadata = {
 
 export default function NxCloudPage(): JSX.Element {
   return (
-    <Layout>
+    <DefaultLayout>
       <Hero />
       <TrustedBy />
 
@@ -62,6 +63,6 @@ export default function NxCloudPage(): JSX.Element {
       <div className="mt-32 lg:mt-56">
         <CallToAction />
       </div>
-    </Layout>
+    </DefaultLayout>
   );
 }
diff --git a/nx-dev/ui-cloud/src/index.ts b/nx-dev/ui-cloud/src/index.ts
@@ -7,4 +7,3 @@ export * from './lib/enhance-with-ai';
 export * from './lib/automated-agents-management';
 export * from './lib/agent-number-over-time';
 export * from './lib/statistics';
-export * from './lib/call-to-action';
diff --git a/nx-dev/ui-cloud/src/lib/enhance-with-ai.tsx b/nx-dev/ui-cloud/src/lib/enhance-with-ai.tsx
@@ -45,7 +45,7 @@ export function EnhancedWithAi(): JSX.Element {
           </SectionHeading>
           <SectionHeading as="p" variant="subtitle" className="mt-6">
             With the knowledge of your workspace structure, your CI and commit
-            history, Tusky AI can optimize CI resource usage, help resolve
+            history, Nx Cloud can optimize CI resource usage, help resolve
             issues, provide powerful analytics and suggest refactorings.
           </SectionHeading>
         </div>

diff --git a/nx-dev/ui-cloud/src/lib/faster-and-cheaper.tsx b/nx-dev/ui-cloud/src/lib/faster-and-cheaper.tsx
@@ -1,13 +1,7 @@
 'use client';
-import {
-  Variants,
-  animate,
-  motion,
-  useMotionValue,
-  useTransform,
-} from 'framer-motion';
-import { useEffect } from 'react';
+import { Variants, motion } from 'framer-motion';
 import { Spotlight } from './elements/spotlight';
+import { AnimateValue } from '@nx/nx-dev/ui-animations';
 
 export function FasterAndCheaper(): JSX.Element {
   const spotlight: Variants = {
@@ -19,33 +13,6 @@ export function FasterAndCheaper(): JSX.Element {
     },
   };
 
-  const ciBar: Variants = {
-    start: {
-      width: 0,
-    },
-    end: {
-      width: '100%',
-      transition: {
-        type: 'tween',
-        ease: 'easeOut',
-        duration: 1.2,
-      },
-    },
-  };
-  const nxBar: Variants = {
-    start: {
-      width: 0,
-    },
-    end: {
-      width: '50%',
-      transition: {
-        type: 'tween',
-        ease: 'easeOut',
-        duration: 1.2,
-      },
-    },
-  };
-
   return (
     <section>
       <motion.div
@@ -75,8 +42,8 @@ export function FasterAndCheaper(): JSX.Element {
             <article className="group/card relative grid transform-gpu cursor-default items-center gap-4 overflow-hidden rounded-xl border border-slate-200 bg-white/50 backdrop-blur-sm transition duration-200 hover:-translate-y-4 hover:shadow-xl md:col-span-1 dark:border-slate-800 dark:bg-slate-950/50 dark:shadow-none">
               <div className="p-4 text-center">
                 <div className="mt-2 text-3xl font-medium leading-7 text-slate-950 transition duration-200 lg:text-8xl dark:text-white">
-                  <Counter value={30}></Counter> -{' '}
-                  <Counter value={70}></Counter>%
+                  <AnimateValue num={30} suffix=" - " />
+                  <AnimateValue num={70} suffix="%" />
                 </div>
                 <div className="mt-4 text-3xl font-medium leading-7 text-slate-950 transition duration-200 lg:text-5xl dark:text-white">
                   Faster CI
@@ -97,31 +64,19 @@ export function FasterAndCheaper(): JSX.Element {
                       CI
                     </div>
                     <div className="flex-grow py-1.5 font-semibold">
-                      <motion.div
-                        initial="start"
-                        whileInView="end"
-                        variants={ciBar}
-                        viewport={{ once: true }}
-                        className="w-full flex-grow items-center justify-end rounded-r-lg border border-l-0 border-slate-200 bg-slate-100 px-4 py-2 text-right text-slate-900 transition duration-200 dark:border-slate-800 dark:bg-slate-700 dark:text-white"
-                      >
+                      <div className="w-full flex-grow items-center justify-end rounded-r-lg border border-l-0 border-slate-200 bg-slate-100 px-4 py-2 text-right text-slate-900 transition duration-200 dark:border-slate-800 dark:bg-slate-700 dark:text-white">
                         <span className="drop-shadow-sm">$6k</span>
-                      </motion.div>
+                      </div>
                     </div>
                   </div>
                   <div className="flex items-center">
                     <div className="w-28 shrink-0 border-r-2 border-slate-200 py-3 pr-2 text-right font-medium text-slate-700 transition duration-200 dark:border-slate-800 dark:text-slate-300">
                       CI + Nx Cloud
                     </div>
                     <div className="flex-grow py-1.5 font-semibold">
-                      <motion.div
-                        initial="start"
-                        whileInView="end"
-                        variants={nxBar}
-                        viewport={{ once: true }}
-                        className="w-1/2 rounded-r-lg border border-l-0 border-slate-200 bg-gradient-to-r from-emerald-500 to-green-500 px-4 py-2 text-right text-white transition duration-200 dark:border-slate-800"
-                      >
+                      <div className="w-1/2 rounded-r-lg border border-l-0 border-slate-200 bg-gradient-to-r from-emerald-500 to-green-500 px-4 py-2 text-right text-white transition duration-200 dark:border-slate-800">
                         <span className="drop-shadow-sm">$3.2k</span>
-                      </motion.div>
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -140,26 +95,3 @@ export function FasterAndCheaper(): JSX.Element {
     </section>
   );
 }
-
-function Counter({
-  value,
-  duration = 2,
-}: {
-  value: number;
-  duration?: number;
-}) {
-  const count = useMotionValue(0);
-  const rounded = useTransform(count, Math.round);
-
-  useEffect(() => {
-    const animation = animate(count, value, {
-      type: 'tween',
-      ease: 'easeOut',
-      duration,
-    });
-
-    return animation.stop;
-  }, []);
-
-  return <motion.span>{rounded}</motion.span>;
-}
diff --git a/nx.json b/nx.json
@@ -232,10 +232,5 @@
   "parallel": 1,
   "cacheDirectory": "/tmp/nx-cache",
   "bust": 7,
-  "defaultBase": "master",
-  "generators": {
-    "@nx/react": {
-      "library": {}
-    }
-  }
+  "defaultBase": "master"
 }