diff --git a/app/main.wasp b/app/main.wasp
index 3f59068..fba8738 100644
--- a/app/main.wasp
+++ b/app/main.wasp
@@ -201,10 +201,10 @@ page LoginPage {
component: import Login from "@src/client/auth/LoginPage"
}
-// route SignupRoute { path: "/signup", to: SignupPage }
-// page SignupPage {
-// component: import { Signup } from "@src/client/auth/SignupPage"
-// }
+route SignupRoute { path: "/signup", to: SignupPage }
+page SignupPage {
+ component: import { Signup } from "@src/client/auth/SignupPage"
+}
route TocPageRoute { path: "/toc", to: TocPage }
page TocPage {
diff --git a/app/src/client/App.tsx b/app/src/client/App.tsx
index ee57ddd..8262653 100644
--- a/app/src/client/App.tsx
+++ b/app/src/client/App.tsx
@@ -5,6 +5,7 @@ import AppNavBar from './components/AppNavBar';
import ServerNotRechableComponent from './components/ServerNotRechableComponent';
import LoadingComponent from './components/LoadingComponent';
import TosAndMarketingEmailsModal from './components/TosAndMarketingEmailsModal';
+import Footer from './components/Footer';
import { useMemo, useEffect, ReactNode, useState } from 'react';
import { useLocation } from 'react-router-dom';
@@ -32,9 +33,10 @@ export default function App({ children }: { children: ReactNode }) {
const shouldDisplayAppNavBar = useMemo(() => {
return (
- location.pathname !== '/' &&
- location.pathname !== '/login' &&
- location.pathname !== '/signup'
+ location.pathname !== '/'
+ // &&
+ // location.pathname !== '/login' &&
+ // location.pathname !== '/signup'
);
}, [location]);
@@ -114,9 +116,9 @@ export default function App({ children }: { children: ReactNode }) {
)}
>
) : (
- <>
+
{shouldDisplayAppNavBar &&
}
-
+
{isError ? (
children
) : isLoading ? (
@@ -133,7 +135,15 @@ export default function App({ children }: { children: ReactNode }) {
))
)}
- >
+
+
+
+
+ © 2024 airt. All rights reserved.
+
+
+
+
)}
>
diff --git a/app/src/client/Main.css b/app/src/client/Main.css
index bf3f964..8504457 100644
--- a/app/src/client/Main.css
+++ b/app/src/client/Main.css
@@ -140,7 +140,6 @@ a {
-o-transition: max-height 0.5s;
transition: max-height 0.5s;
overflow: hidden;
- max-height: 280px;
}
.custom-auth-wrapper div>a {
diff --git a/app/src/client/app/AccountPage.tsx b/app/src/client/app/AccountPage.tsx
index 4e2e7c7..26d3bda 100644
--- a/app/src/client/app/AccountPage.tsx
+++ b/app/src/client/app/AccountPage.tsx
@@ -99,7 +99,7 @@ const AccountPage = ({ user }: { user: User }) => {
onClick={logout}
className='inline-flex justify-center mx-8 py-2 px-4 border border-transparent shadow-md text-sm font-medium rounded-md text-captn-light-cream bg-captn-cta-green hover:bg-captn-cta-green-hover focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500'
>
- Log out
+ Sign out
diff --git a/app/src/client/app/PricingPage.tsx b/app/src/client/app/PricingPage.tsx
index 0892e25..b83345b 100644
--- a/app/src/client/app/PricingPage.tsx
+++ b/app/src/client/app/PricingPage.tsx
@@ -191,7 +191,7 @@ const PricingPage = () => {
: !!user
? // ? 'Buy plan'
'Start free trial'
- : 'Log in to buy plan'}
+ : 'Sign in to buy plan'}
)}
diff --git a/app/src/client/auth/Auth.tsx b/app/src/client/auth/Auth.tsx
index 16c97c6..a7ec8c3 100644
--- a/app/src/client/auth/Auth.tsx
+++ b/app/src/client/auth/Auth.tsx
@@ -50,7 +50,7 @@ export const AuthContext = createContext({
const titles: Record = {
login: 'Sign in to your account',
- signup: 'Create a new account',
+ signup: 'Create an account',
};
function Auth({
@@ -67,7 +67,6 @@ function Auth({
const [errorMessage, setErrorMessage] = useState(null);
const [successMessage, setSuccessMessage] = useState(null);
const [isLoading, setIsLoading] = useState(false);
- const [loginFlow, setLoginFlow] = useState(titles.signup);
// TODO(matija): this is called on every render, is it a problem?
// If we do it in useEffect(), then there is a glitch between the default color and the
@@ -79,10 +78,6 @@ function Auth({
const socialButtonsDirection =
socialLayout === 'vertical' ? 'vertical' : 'horizontal';
- const changeHeaderText = (loginFlow: string) => {
- setLoginFlow(loginFlow === 'signIn' ? titles.signup : titles.login);
- };
-
return (
@@ -95,7 +90,9 @@ function Auth({
/>
)}
{/*
{title} */}
-
{loginFlow}
+
+ {state === 'signup' ? titles.signup : titles.login}
+
{/* {errorMessage && (
@@ -115,7 +112,6 @@ function Auth({
socialButtonsDirection={socialButtonsDirection}
additionalSignupFields={additionalSignupFields}
errorMessage={errorMessage}
- changeHeaderText={changeHeaderText}
/>
)}
diff --git a/app/src/client/auth/LoginPage.tsx b/app/src/client/auth/LoginPage.tsx
index 58eb9c3..7a18095 100644
--- a/app/src/client/auth/LoginPage.tsx
+++ b/app/src/client/auth/LoginPage.tsx
@@ -1,11 +1,9 @@
-import { useAuth, type CustomizationOptions } from 'wasp/client/auth';
+import { createTheme } from '@stitches/react';
+import { useAuth } from 'wasp/client/auth';
import { useHistory } from 'react-router-dom';
import { useEffect } from 'react';
-import { Link } from 'react-router-dom';
-// import { LoginForm } from '@wasp/auth/forms/Login';
import { AuthWrapper } from './authWrapper';
import Auth from './Auth';
-// import { State } from 'wasp/auth/forms/types';
import imgUrl from '../static/captn-logo-large.png';
export enum State {
@@ -26,38 +24,30 @@ export default function Login() {
return (
-
- {/*
-
- Don't have an account yet?{' '}
-
- go to signup
-
- .
-
-
-
- Forgot your password?{' '}
-
- reset it
-
- .
- */}
+
);
}
+export type CustomizationOptions = {
+ logo?: string;
+ socialLayout?: 'horizontal' | 'vertical';
+ appearance?: Parameters
[0];
+ state: State;
+};
+
export function LoginForm({
appearance,
logo,
socialLayout,
+ state,
}: CustomizationOptions) {
return (
);
}
diff --git a/app/src/client/auth/LoginSignupForm.tsx b/app/src/client/auth/LoginSignupForm.tsx
index f83be99..a42de1d 100644
--- a/app/src/client/auth/LoginSignupForm.tsx
+++ b/app/src/client/auth/LoginSignupForm.tsx
@@ -3,9 +3,10 @@ import { useForm } from 'react-hook-form';
import { styled } from './configs/stitches.config';
import { AuthContext } from './Auth';
-import { useHistory } from 'react-router-dom';
import config from './configs/config';
import TosAndMarketingEmails from '../components/TosAndMarketingEmails';
+import { State } from './Auth';
+import { Link } from 'wasp/client/router';
const SocialAuth = styled('div', {
marginTop: '1.5rem',
@@ -58,28 +59,17 @@ export const LoginSignupForm = ({
socialButtonsDirection = 'horizontal',
additionalSignupFields,
errorMessage,
- changeHeaderText,
}: {
state: 'login' | 'signup';
socialButtonsDirection?: 'horizontal' | 'vertical';
additionalSignupFields?: any;
errorMessage?: any;
- changeHeaderText: any;
}) => {
const { isLoading, setErrorMessage, setSuccessMessage, setIsLoading } =
useContext(AuthContext);
- const isLogin = state === 'login';
- const cta = isLogin ? 'Log in' : 'Sign up';
- const history = useHistory();
const [tocChecked, setTocChecked] = useState(false);
const [marketingEmailsChecked, setMarketingEmailsChecked] = useState(false);
- const [loginFlow, setLoginFlow] = useState('signUp');
- // const onErrorHandler = (error) => {
- // setErrorMessage({
- // title: error.message,
- // description: error.data?.data?.message,
- // });
- // };
+ const [loginFlow, setLoginFlow] = useState(state);
const hookForm = useForm();
const {
register,
@@ -118,7 +108,7 @@ export const LoginSignupForm = ({
googleSignInUrl: string
) => {
event.preventDefault();
- if (loginFlow === 'signIn') {
+ if (loginFlow === State.Login) {
updateLocalStorage();
window.location.href = googleSignInUrl;
} else {
@@ -131,21 +121,12 @@ export const LoginSignupForm = ({
}
};
- const toggleLoginFlow = () => {
- const newLoginFlow = loginFlow === 'signIn' ? 'signUp' : 'signIn';
- setLoginFlow(newLoginFlow);
- setTocChecked(false);
- setMarketingEmailsChecked(false);
- setErrorMessage(null);
- changeHeaderText(loginFlow);
- };
-
const googleBtnText =
- loginFlow === 'signIn' ? 'Sign in with Google' : 'Sign up with Google';
+ loginFlow === State.Login ? 'Sign in with Google' : 'Sign up with Google';
return (
<>
- {loginFlow === 'signUp' && (
+ {loginFlow === State.Signup && (
>
diff --git a/app/src/client/auth/SignupPage.tsx b/app/src/client/auth/SignupPage.tsx
index 55ae84a..23965c9 100644
--- a/app/src/client/auth/SignupPage.tsx
+++ b/app/src/client/auth/SignupPage.tsx
@@ -1,20 +1,11 @@
-import { SignupForm } from "wasp/client/auth";
-import { Link } from 'react-router-dom';
import { AuthWrapper } from './authWrapper';
+import imgUrl from '../static/captn-logo-large.png';
+import { State, LoginForm } from './LoginPage';
export function Signup() {
return (
-
-
-
- I already have an account (
-
- go to login
-
- ).
-
-
+
);
}
diff --git a/app/src/client/components/AppNavBar.tsx b/app/src/client/components/AppNavBar.tsx
index a23bd73..62353fc 100644
--- a/app/src/client/components/AppNavBar.tsx
+++ b/app/src/client/components/AppNavBar.tsx
@@ -9,6 +9,7 @@ import logo from '../static/logo.png';
import DropdownUser from './DropdownUser';
import { UserMenuItems } from '../components/UserMenuItems';
import FreeTrialButton from '../components/FreeTrialButton';
+import UserActionButton from '../components/UserActionButton';
import { navigation } from '../landing-page/contentSections';
@@ -63,7 +64,7 @@ export default function AppNavBar() {
{/* */}
- {!user?.hasPaid && }
+
{isUserLoading ? null : !user ? (
@@ -72,7 +73,7 @@ export default function AppNavBar() {
className='text-sm font-semibold leading-6 ml-4'
>
- Log in
+ Sign in
) : (
@@ -120,11 +121,19 @@ export default function AppNavBar() {
{isUserLoading ? null : !user ? (
-
-
- Log in
-
-
+
+
+ Create an account
+
+
+
+ Sign in
+
+
+
) : (
{
+ return (
+
+ );
+};
+
+export default Footer;
diff --git a/app/src/client/components/TosAndMarketingEmailsModal.tsx b/app/src/client/components/TosAndMarketingEmailsModal.tsx
index 76f07d6..53ad9fd 100644
--- a/app/src/client/components/TosAndMarketingEmailsModal.tsx
+++ b/app/src/client/components/TosAndMarketingEmailsModal.tsx
@@ -57,10 +57,6 @@ const TosAndMarketingEmailsModal = () => {
}
};
- const customStyle = errorMessage
- ? { maxHeight: '400px' }
- : { maxHeight: '280px' };
-
const isAccountPage = useMemo(() => {
return location.pathname.startsWith('/account');
}, [location]);
@@ -70,10 +66,7 @@ const TosAndMarketingEmailsModal = () => {
{!isAccountPage && }
-
+
Almost there...
diff --git a/app/src/client/components/UserActionButton.tsx b/app/src/client/components/UserActionButton.tsx
new file mode 100644
index 0000000..e8fd998
--- /dev/null
+++ b/app/src/client/components/UserActionButton.tsx
@@ -0,0 +1,40 @@
+import { Link } from 'react-router-dom';
+import FreeTrialButton from './FreeTrialButton';
+
+interface UserActionButtonProps {
+ user: any;
+ renderGoToChat: boolean;
+}
+
+const UserActionButton: React.FC = ({
+ user,
+ renderGoToChat,
+}) => {
+ if (!user) {
+ return (
+
+ Create an account
+
+ );
+ }
+
+ if (!user.hasPaid) {
+ return ;
+ }
+
+ return renderGoToChat ? (
+
+ Go to chat →
+
+ ) : (
+ <>>
+ );
+};
+
+export default UserActionButton;
diff --git a/app/src/client/components/UserMenuItems.tsx b/app/src/client/components/UserMenuItems.tsx
index a2551b6..07c69fa 100644
--- a/app/src/client/components/UserMenuItems.tsx
+++ b/app/src/client/components/UserMenuItems.tsx
@@ -112,7 +112,7 @@ export const UserMenuItems = ({
fill=''
/>
- Log out
+ Sign out
>
);
diff --git a/app/src/client/landing-page/LandingPage.tsx b/app/src/client/landing-page/LandingPage.tsx
index 6182a26..81e5812 100644
--- a/app/src/client/landing-page/LandingPage.tsx
+++ b/app/src/client/landing-page/LandingPage.tsx
@@ -17,7 +17,8 @@ import {
} from './contentSections';
import DropdownUser from '../components/DropdownUser';
import { UserMenuItems } from '../components/UserMenuItems';
-import FreeTrialButton from '../components/FreeTrialButton';
+import Footer from '../components/Footer';
+import UserActionButton from '../components/UserActionButton';
export default function LandingPage() {
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
@@ -76,15 +77,11 @@ export default function LandingPage() {
{/* */}
- {!user?.hasPaid && (
-
-
-
- )}
+
{isUserLoading ? null : !user ? (
-
- Log in
+
+ Sign in
) : (
@@ -131,11 +128,19 @@ export default function LandingPage() {
{isUserLoading ? null : !user ? (
-
-
- Log in
-
-
+
+
+ Create an account
+
+
+
+ Sign in
+
+
+
) : (
)}
@@ -189,16 +194,7 @@ export default function LandingPage() {
business. 30 days free trial, no credit card required!
@@ -393,7 +389,7 @@ export default function LandingPage() {
{/* Footer */}
-
*/}
);
}
diff --git a/app/src/client/landing-page/contentSections.ts b/app/src/client/landing-page/contentSections.ts
index 6564ba2..084e2da 100644
--- a/app/src/client/landing-page/contentSections.ts
+++ b/app/src/client/landing-page/contentSections.ts
@@ -113,8 +113,8 @@ export const footerNavigation = {
{ name: 'Blog', href: BLOG_URL },
],
company: [
- { name: 'About', href: 'https://airt.ai/' },
- { name: 'Privacy', href: 'https://captn.ai/privacy' },
- { name: 'Terms of Service', href: 'https://captn.ai/toc' },
+ { name: 'airt', href: 'https://airt.ai/' },
+ { name: 'Privacy', href: '/privacy' },
+ { name: 'Terms of Service', href: '/toc' },
],
};