Add PRs #305 and #306 (#307)

airtai · Apr 9, 2024 · 30c9a46 · 30c9a46
2 parents 09534da + 5e268f7
commit 30c9a46
Show file tree

Hide file tree

Showing 7 changed files with 36 additions and 30 deletions.
diff --git a/app/src/client/App.tsx b/app/src/client/App.tsx
@@ -57,7 +57,7 @@ export default function App({ children }: { children: ReactNode }) {
   useEffect(() => {
     if (user) {
       if (!user.isSignUpComplete) {
-        if (user.hasAcceptedTos && user.hasSubscribedToMarketingEmails) {
+        if (user.hasAcceptedTos) {
           updateCurrentUser({
             isSignUpComplete: true,
           });
@@ -67,13 +67,13 @@ export default function App({ children }: { children: ReactNode }) {
             localStorage.getItem('hasAcceptedTos') === 'true';
           const hasSubscribedToMarketingEmails =
             localStorage.getItem('hasSubscribedToMarketingEmails') === 'true';
-          if (!hasAcceptedTos || !hasSubscribedToMarketingEmails) {
+          if (!hasAcceptedTos) {
             setShowTosAndMarketingEmailsModal(true);
           } else {
             updateCurrentUser({
               isSignUpComplete: true,
-              hasAcceptedTos: true,
-              hasSubscribedToMarketingEmails: true,
+              hasAcceptedTos: hasAcceptedTos,
+              hasSubscribedToMarketingEmails: hasSubscribedToMarketingEmails,
             });
             setShowTosAndMarketingEmailsModal(false);
           }

diff --git a/app/src/client/auth/LoginSignupForm.tsx b/app/src/client/auth/LoginSignupForm.tsx
@@ -45,7 +45,7 @@ const googleSignInUrl = `${config.apiUrl}/auth/google/login`;
 
 export const checkBoxErrMsg = {
   title:
-    'To proceed, please ensure you have accepted the Terms & Conditions, Privacy Policy, and opted to receive marketing emails.',
+    "To proceed, please ensure you've accepted our Terms & Conditions and Privacy Policy.",
   description: '',
 };
 
@@ -88,10 +88,10 @@ export const LoginSignupForm = ({
   } = hookForm;
 
   useEffect(() => {
-    if (tocChecked && marketingEmailsChecked) {
+    if (tocChecked) {
       setErrorMessage(null);
     }
-  }, [tocChecked, marketingEmailsChecked]);
+  }, [tocChecked]);
 
   const handleTocChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     setTocChecked(event.target.checked);
@@ -122,7 +122,7 @@ export const LoginSignupForm = ({
       updateLocalStorage();
       window.location.href = googleSignInUrl;
     } else {
-      if (tocChecked && marketingEmailsChecked) {
+      if (tocChecked) {
         updateLocalStorage();
         window.location.href = googleSignInUrl;
       } else {

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/TosAndMarketingEmailsModal.tsx b/app/src/client/components/TosAndMarketingEmailsModal.tsx
@@ -12,6 +12,9 @@ export type ErrorMessage = {
   description?: string;
 };
 
+export const notificationMsg =
+  'Before accessing the application, please confirm your agreement to the Terms & Conditions and Privacy Policy.';
+
 const TosAndMarketingEmailsModal = () => {
   const history = useHistory();
   const { isLoading, setSuccessMessage, setIsLoading } =
@@ -22,10 +25,10 @@ const TosAndMarketingEmailsModal = () => {
   const [marketingEmailsChecked, setMarketingEmailsChecked] = useState(false);
 
   useEffect(() => {
-    if (tocChecked && marketingEmailsChecked) {
+    if (tocChecked) {
       setErrorMessage(null);
     }
-  }, [tocChecked, marketingEmailsChecked]);
+  }, [tocChecked]);
 
   const handleTocChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     setTocChecked(event.target.checked);
@@ -39,12 +42,14 @@ const TosAndMarketingEmailsModal = () => {
 
   const onClick = (event: React.MouseEvent<HTMLButtonElement>) => {
     event.preventDefault();
-    if (tocChecked && marketingEmailsChecked) {
+    if (tocChecked) {
       setErrorMessage(null);
       updateCurrentUser({
         isSignUpComplete: true,
         hasAcceptedTos: tocChecked,
-        hasSubscribedToMarketingEmails: marketingEmailsChecked,
+        ...(marketingEmailsChecked && {
+          hasSubscribedToMarketingEmails: marketingEmailsChecked,
+        }),
       });
       history.push('/chat');
     } else {
@@ -66,18 +71,14 @@ const TosAndMarketingEmailsModal = () => {
 
       <div className='flex items-center justify-center z-50 p-16 backdrop-blur-sm bg-captn-light-cream/30 mt-16'>
         <div
-          className='toc-marketing-container bg-captn-dark-blue rounded-lg shadow-lg p-8 m-4 max-w-3xl mx-auto'
+          className='toc-marketing-container bg-captn-dark-blue rounded-lg shadow-lg p-8 m-4 max-w-xl mx-auto'
           style={customStyle}
         >
           <div className='inner-wrapper'>
             <h2 className='text-xl font-bold mb-4 text-captn-light-cream'>
               Almost there...
             </h2>
-            <p className='text-captn-light-cream'>
-              Before accessing the application, please confirm your agreement to
-              the Terms & Conditions, Privacy Policy, and consent to receiving
-              marketing emails by checking the boxes below
-            </p>
+            <p className='text-captn-light-cream'>{notificationMsg}</p>
             <TosAndMarketingEmails
               tocChecked={tocChecked}
               handleTocChange={handleTocChange}

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 },
 ];

diff --git a/app/src/client/tests/TosAndMarketingEmailsModal.test.tsx b/app/src/client/tests/TosAndMarketingEmailsModal.test.tsx
@@ -4,7 +4,9 @@ import { fireEvent, screen } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
 import { Router } from 'react-router-dom';
 
-import TosAndMarketingEmailsModal from '../components/TosAndMarketingEmailsModal';
+import TosAndMarketingEmailsModal, {
+  notificationMsg,
+} from '../components/TosAndMarketingEmailsModal';
 
 describe('TosAndMarketingEmailsModal', () => {
   test('renders TosAndMarketingEmailsModal component', async () => {
@@ -55,9 +57,7 @@ describe('TosAndMarketingEmailsModal', () => {
   test('renders error message when save button is clicked and checkboxes are not checked', async () => {
     renderInContext(<TosAndMarketingEmailsModal />);
     fireEvent.click(screen.getByText('Save'));
-    const errorItems = await screen.findAllByText(
-      'Before accessing the application, please confirm your agreement to the Terms & Conditions, Privacy Policy, and consent to receiving marketing emails by checking the boxes below'
-    );
+    const errorItems = await screen.findAllByText(notificationMsg);
     expect(errorItems).toHaveLength(1);
   });
 });