From edbf656701fcb4692550f1316e78618aa786b85c Mon Sep 17 00:00:00 2001 From: James Wyndham Date: Thu, 22 Feb 2024 10:23:12 +0800 Subject: [PATCH] feature - signin from signup --- Frontend/app/layout.tsx | 1 + Frontend/components/Header.tsx | 5 +- Frontend/components/Modals/ModalSignUp.tsx | 43 ++++++++-- Frontend/components/Utilities/Background.tsx | 20 ++++- Frontend/middleware.ts | 21 +++-- .../FormLeftDescriptionRightContactUs.tsx | 10 ++- .../Hero/WaitingListWithImageHero.tsx | 38 ++++---- Frontend/sections/Newsletter/Newsletter.tsx | 86 +++++++++++-------- Frontend/utils/form.ts | 2 +- 9 files changed, 144 insertions(+), 82 deletions(-) diff --git a/Frontend/app/layout.tsx b/Frontend/app/layout.tsx index 6558934..ef21675 100644 --- a/Frontend/app/layout.tsx +++ b/Frontend/app/layout.tsx @@ -31,6 +31,7 @@ export default async function RootLayout({ children: React.ReactNode; }) { const isUserLoggedIn = await isAuthenticated(cookies()); + console.log(isUserLoggedIn); return ( ) : ( - )} diff --git a/Frontend/components/Modals/ModalSignUp.tsx b/Frontend/components/Modals/ModalSignUp.tsx index 4e5733f..15bc50d 100644 --- a/Frontend/components/Modals/ModalSignUp.tsx +++ b/Frontend/components/Modals/ModalSignUp.tsx @@ -4,6 +4,8 @@ import { useForm } from "react-hook-form"; import { yupResolver } from "@hookform/resolvers/yup"; import { signUpValidationSchema } from "@/utils/form"; import { companySizeList } from "@/constants"; +import pb from "@/lib/pocketbase"; +import { login } from "@/app/(auth)/actions"; function ModalSignUp() { const { @@ -14,6 +16,35 @@ function ModalSignUp() { } = useForm({ resolver: yupResolver(signUpValidationSchema), }); + const onSubmit = async (data: any) => { + data = { + emailVisibility: false, + lastSeen: new Date(), + role: "Admin", + displayName: `${data.firstName} ${data.lastName}`, + ...data, + }; + try { + //create organisation + const organisation = await pb.collection("organisation").create({ + name: data.organisation, + organisationSize: data.organisationSize, + }); + //create user + await pb + .collection("user") + .create({ ...data, organisation: organisation.id }); + //login user + if ( + (await login({ email: data.email, password: data.password })).success + ) { + reset(); + document.getElementById("sign-up-modal")?.click(); + } + } catch (error) { + console.log("heyaa"); + } + }; return ( <> -
{ - console.log(data); - reset(); - })} - className="w-full md:w-2/3" - > +
- {errors.passwordConfirmation?.message}  + {errors.passwordConfirm?.message} 
diff --git a/Frontend/components/Utilities/Background.tsx b/Frontend/components/Utilities/Background.tsx index e24a719..4a34fef 100644 --- a/Frontend/components/Utilities/Background.tsx +++ b/Frontend/components/Utilities/Background.tsx @@ -1,11 +1,27 @@ "use client"; + import colors, { hexToRgb } from "@/utils/colors"; import { useTheme } from "next-themes"; -import React, { ReactNode } from "react"; +import React, { ReactNode, useEffect, useMemo, useState } from "react"; const Background = ({ children }: { children: ReactNode }) => { const { theme } = useTheme(); - const backgroundColor = hexToRgb(colors[theme ?? "light"]["base-100"]); + const [mounted, setMounted] = useState(false); + + // useEffect only runs on the client, so now we can safely show the UI + useEffect(() => { + setMounted(true); + }, []); + + if (!mounted) { + return ( +
+ ); + } + + console.log("theme", theme); + const backgroundColor = hexToRgb(colors[theme!]["base-100"]); + return (
{ resolver: yupResolver(contactUsValidationSchema), }); - const onSubmit = (data: { + const onSubmit = async (data: { firstName: string; lastName: string; email: string; phoneNumber?: string; note?: string; }) => { - localStorage.setItem("contactus", JSON.stringify(data)); - pb.collection("contact").create(data); + try { + await pb.collection("contact").create({ source: "contactus", ...data }); + localStorage.setItem("contactus", JSON.stringify(data)); + } catch (error) { + console.log("heya"); + } }; return ( <> diff --git a/Frontend/sections/Hero/WaitingListWithImageHero.tsx b/Frontend/sections/Hero/WaitingListWithImageHero.tsx index 1fda14d..8e11c91 100644 --- a/Frontend/sections/Hero/WaitingListWithImageHero.tsx +++ b/Frontend/sections/Hero/WaitingListWithImageHero.tsx @@ -8,6 +8,7 @@ import Icon from "@/components/Icon"; import colors, { hexToRgb } from "@/utils/colors"; import Footer from "@/components/Footer"; import { useTheme } from "next-themes"; +import Background from "@/components/Utilities/Background"; const WaitingListWithImageHero = () => { const { theme } = useTheme(); @@ -21,28 +22,28 @@ const WaitingListWithImageHero = () => { resolver: yupResolver(waitinglistValidationSchema), }); - const onSubmit = (data: { + const onSubmit = async (data: { firstName: string; lastName: string; email: string; }) => { - localStorage.setItem("contact", JSON.stringify(data)); - pb.collection("contact").create(data); + try { + await pb.collection("contact").create({ source: "waitinglist", ...data }); + localStorage.setItem("waitinglist", JSON.stringify(data)); + } catch (error) { + console.log("heya"); + } }; return ( -
+

Bethel Farms

- {typeof window !== "undefined" && !localStorage.getItem("contact") ? ( + {typeof window !== "undefined" && + !localStorage.getItem("waitinglist") ? ( <>

Get notified when we launch @@ -61,7 +62,7 @@ const WaitingListWithImageHero = () => { {...register("firstName")} type="text" id="hs-cover-with-gradient-form-name-1" - className=" py-3 ps-11 pe-4 block w-full bg-base-100/[.03] border-white/20 placeholder:text-base-content dark:placeholder:bg-base-content placeholder:text-base-content rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11" + className=" py-3 ps-11 pe-4 block w-full bg-base-100/[.03] border-white/20 placeholder:text-base-content placeholder:text-base-content rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11" placeholder="First name" />
@@ -82,7 +83,7 @@ const WaitingListWithImageHero = () => {

-
+
{errors.firstName?.message} 
@@ -119,7 +120,7 @@ const WaitingListWithImageHero = () => {
-
+
{errors.lastName?.message} 
@@ -135,7 +136,7 @@ const WaitingListWithImageHero = () => { {...register("email")} type="email" id="hs-cover-with-gradient-form-email-1" - className=" py-3 ps-11 pe-4 block w-full bg-base-100/[.03] border-white/20 text-base-content placeholder:text-base-content dark:placeholder:bg-base-content rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11" + className=" py-3 ps-11 pe-4 block w-full bg-base-100/[.03] border-white/20 text-base-content placeholder:text-base-content rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11" placeholder="Email address" />
@@ -156,15 +157,12 @@ const WaitingListWithImageHero = () => {
-
+
{errors.email?.message} 
-