Add pricing to navbar (#306)

airtai · Apr 9, 2024 · 5e268f7 · 5e268f7
1 parent 185934f
commit 5e268f7
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 8 deletions.
diff --git a/app/src/client/components/AppNavBar.tsx b/app/src/client/components/AppNavBar.tsx
@@ -10,12 +10,7 @@ import DropdownUser from './DropdownUser';
 import { UserMenuItems } from '../components/UserMenuItems';
 import FreeTrialButton from '../components/FreeTrialButton';
 
-export const navigation = [
-  { name: 'Home', href: '/' },
-  { name: 'Chat', href: '/chat' },
-  // { name: 'Documentation', href: DOCS_URL },
-  // { name: 'Blog', href: BLOG_URL },
-];
+import { navigation } from '../landing-page/contentSections';
 
 const NavLogo = () => (
   <img className='h-10 w-auto -ml-2' src={logo} alt='Capt’n.ai' />

diff --git a/app/src/client/components/UserMenuItems.tsx b/app/src/client/components/UserMenuItems.tsx
@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
 import { Link } from 'wasp/client/router';
 import { type User } from 'wasp/entities';
 import { logout } from 'wasp/client/auth';
@@ -17,6 +18,14 @@ export const UserMenuItems = ({
     if (setMobileMenuOpen) setMobileMenuOpen(false);
   };
 
+  const isChatPage = useMemo(() => {
+    return location.pathname.startsWith('/chat');
+  }, [location]);
+
+  const navFontColor = isChatPage
+    ? 'text-captn-light-cream'
+    : 'text-captn-dark-blue';
+
   return (
     <>
       <ul
@@ -39,7 +48,7 @@ export const UserMenuItems = ({
           <Link
             to='/account'
             onClick={handleMobileMenuClick}
-            className='no-underline flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out text-captn-light-cream hover:text-captn-light-blue'
+            className={`${navFontColor} no-underline flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out lg:text-captn-light-cream hover:text-captn-light-blue`}
           >
             <svg
               className='fill-current'
@@ -72,7 +81,7 @@ export const UserMenuItems = ({
             <Link
               to='/admin'
               onClick={handleMobileMenuClick}
-              className='no-underline  flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out text-captn-light-cream hover:text-captn-light-blue'
+              className={`${navFontColor} no-underline  flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out lg:text-captn-light-cream hover:text-captn-light-blue`}
             >
               <TfiDashboard size='1.1rem' />
               Admin dashboard

diff --git a/app/src/client/landing-page/contentSections.ts b/app/src/client/landing-page/contentSections.ts
@@ -5,6 +5,7 @@ import avatarPlaceholder from '../static/avatar-placeholder.png';
 export const navigation = [
   { name: 'Home', href: '/' },
   { name: 'Chat', href: '/chat' },
+  { name: 'Pricing', href: '/pricing' },
   // { name: 'Documentation', href: DOCS_URL },
   // { name: 'Blog', href: BLOG_URL },
 ];