GoogleLogin is added issue #37

package.json

@@ -26,6 +26,7 @@
     "react-dom": "^18.3.1",
     "react-dropzone": "^14.2.3",
     "react-hook-form": "^7.51.3",
+    "react-icons": "^5.2.1",
     "react-intersection-observer": "^9.10.1",
     "react-router-dom": "^6.23.0",
     "tailwind-merge": "^2.3.0",

src/_auth/forms/SigninForm.tsx

@@ -17,6 +17,7 @@ import Loader from "../../components/shared/Loader";
 import { Link, useNavigate } from "react-router-dom";
 import { useSignInAccount } from "@/lib/react-query/queriesAndMutations.js";
 import { useUserContext } from "@/context/AuthContext.js";
+import GoogleLogin from "../google/page";
 
 const SigninForm = () => {
   const form = useForm<z.infer<typeof SigninValidation>>({
@@ -114,6 +115,7 @@ const SigninForm = () => {
               "Sign in"
             )}
           </Button>
+          <GoogleLogin/>
           <p className="mt-2 text-center text-small-regular text-light-2">
             Already have an Account?
             <Link

src/_auth/forms/SignupForm.tsx

@@ -20,6 +20,7 @@ import {
   useSignInAccount,
 } from "@/lib/react-query/queriesAndMutations.js";
 import { useUserContext } from "@/context/AuthContext.js";
+import GoogleLogin from "../google/page";
 
 const SignupForm = () => {
   const form = useForm<z.infer<typeof SignupValidation>>({
@@ -156,6 +157,8 @@ const SignupForm = () => {
               "Sign-up"
             )}
           </Button>
+
+          <GoogleLogin/>
           <p className="text-small-regular text-light-2 text-center mt-2">
             Already have an Account?
             <Link

src/_auth/google/page.tsx

@@ -0,0 +1,29 @@
+"use client";
+import { FcGoogle } from "react-icons/fc";
+
+import { account } from "@/lib/appwrite/config";
+import { OAuthProvider } from "appwrite";
+
+const GoogleLogin = () => {
+    return (
+            // <h1 className="text-2xl font-bold"></h1>
+            <div className=" flex mt-5 justify-center items-center">
+                <button
+                    className="flex justify-center items-center gap-2 border-2 border-slate-600 px-5 py-2 w-full bg-white rounded-lg"
+                    onClick={() => {
+                        account.createOAuth2Session(
+                            OAuthProvider.Google,
+                            "http://localhost:5173/", // Success URL
+                            "http://localhost:3000" // Failure URL
+
+                        );
+                    }}
+                >
+                    <FcGoogle size={30} />
+                    <span className=" text-black">Login with Google</span>
+                </button>
+            </div>
+    );
+};
+
+export default GoogleLogin;