added google login interface

.env

@@ -34,5 +34,7 @@ REACT_APP_ITEM_PER_PAGE=5
 # Empty Listings
 REACT_APP_ZERO_STATE=0
 
+REACT_APP_GOOGLE_CLIENT_ID=234407841224-k5g7f67p908hqtegiokmjqt8qqf3hi2i.apps.googleusercontent.com
+
 #apigate.lotus.g1.wrenchboard.com:76.209.103.227
 #apigate.orion.g1.wrenchboard.com:76.209.103.227

.env.development

@@ -33,3 +33,5 @@ REACT_APP_ITEM_PER_PAGE=5
 
 #apigate.lotus.g1.wrenchboard.com:76.209.103.227
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
+
+REACT_APP_GOOGLE_CLIENT_ID=234407841224-k5g7f67p908hqtegiokmjqt8qqf3hi2i.apps.googleusercontent.com

.env.production

@@ -33,3 +33,5 @@ REACT_APP_ITEM_PER_PAGE=5
 
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
+
+REACT_APP_GOOGLE_CLIENT_ID=234407841224-k5g7f67p908hqtegiokmjqt8qqf3hi2i.apps.googleusercontent.com

src/components/AuthPages/AuthLayout.jsx

@@ -4,7 +4,7 @@ import { Link } from "react-router-dom";
 export default function LoginLayout({ slogan, children }) {
   return (
     <div className={`layout-wrapper login`}>
-      <div className={`main-wrapper login-wrapper w-full h-screen overflow-y-auto sm:p-20 p-10`}>
+      <div className={`main-wrapper login-wrapper w-full h-screen overflow-y-auto p-2 sm:p-20`}>
         <div className="w-full h-full">
           <div className="flex-1 flex justify-center items-center">
             {children && children}

src/components/AuthPages/Login/index.jsx

@@ -8,8 +8,8 @@ import WrenchBoard from "../../../assets/images/wrenchboard.png";
 import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
-//import { GoogleOAuthProvider } from '@react-oauth/google';
+// import { GoogleOAuthProvider } from '@react-oauth/google';
-// import { googleLogout, useGoogleLogin } from '@react-oauth/google';
+import { googleLogout, useGoogleLogin } from '@react-oauth/google';
 
 import { useDispatch } from "react-redux";
 import { updateUserDetails } from "../../../store/UserDetails";
@@ -120,6 +120,18 @@ export default function Login() {
       });
   };
 
+  const googleLogin = useGoogleLogin({
+    onSuccess: async (tokenResponse) => {
+      console.log(tokenResponse);
+      // const userInfo = await axios.get(
+      //   'https://www.googleapis.com/oauth2/v3/userinfo',
+      //   { headers: { Authorization: `Bearer ${tokenResponse.access_token}` } },
+      // );
+      // console.log(userInfo);
+    },
+    onError: errorResponse => console.log(errorResponse),
+  });
+
   useEffect(()=>{
     setMail('')
     setPassword('')
@@ -187,7 +199,7 @@ export default function Login() {
                     <div className="input-item mb-5">
                       <InputCom
                         labelClass="tracking-wider"
-                        fieldClass="px-6"
+                        fieldClass="sm:px-6 px-2"
                         value={email}
                         inputHandler={handleEmail}
                         placeholder="support@mermsemr.com"
@@ -201,7 +213,7 @@ export default function Login() {
                     <div className="input-item mb-5">
                       <InputCom
                         labelClass="tracking-wider"
-                        fieldClass="px-6"
+                        fieldClass="sm:px-6 px-2"
                         value={password}
                         inputHandler={handlePassword}
                         placeholder="● ● ● ● ● ●"
@@ -246,7 +258,7 @@ export default function Login() {
                         </button>
                       </div>
                       <div className="sm:flex sm:justify-between sm:items-center sm:space-x-2">
-                        <BrandBtn link="#" imgSrc={googleLogo} brand="Google" />
+                        <BrandBtn link="#" imgSrc={googleLogo} brand="Google" onClick={googleLogin} />
                         <BrandBtn link="#" imgSrc={appleLogo} brand="Apple" />
                       </div>
                       <div className="sm:flex sm:justify-between sm:items-center sm:space-x-2">
@@ -347,10 +359,10 @@ export default function Login() {
   );
 }
 
-const BrandBtn = ({ link, imgSrc, brand }) => {
+const BrandBtn = ({ link, imgSrc, brand, onClick }) => {
-  const doGoogle = async () => {
+  // const doGoogle = async () => {
-    alert("start google");
+  //   alert("start google");
-  };
+  // };
 
   //  onSuccess: (codeResponse) => setUser(codeResponse),
 
@@ -359,26 +371,26 @@ const BrandBtn = ({ link, imgSrc, brand }) => {
   //   onError: (error) => console.log('Login Failed:', error)
   // });
 
-  const doApple = async () => {
+  // const doApple = async () => {
-    alert("start apple");
+  //   alert("start apple");
-  };
+  // };
 
-  const doFacebook = async () => {
+  // const doFacebook = async () => {
-    alert("start facebook");
+  //   alert("start facebook");
-  };
+  // };
 
   return (
     <div className="w-full sm:w-1/2 flex justify-center bottomMargin">
-      <a
+      <button
-        // onClick={doGoogle}
+        onClick={onClick}
-        href="#dd"
+        // href="#dd"
         className="w-full border border-light-purple dark:border-[#5356fb29]  rounded-[0.475rem] h-[48px] flex justify-center bg-[#FAFAFA] hover:bg-[#eff2f5] hover:text-[#7e8299] transition duration-300 dark:bg-[#11131F]  items-center font-medium cursor-pointer"
       >
         <img className="mr-3 h-6" src={imgSrc} alt="logo-icon(s)" />
         <span className="text-lg text-thin-light-gray font-normal text-[15px]">
           Continue with {brand}
         </span>
-      </a>
+      </button>
     </div>
   );
 };

src/components/MyJobs/StartJob.jsx

@@ -15,10 +15,6 @@ export default function StartJob(props) {
     const navigate = useNavigate()
 
     let [request, setRequest] = useState({loading: false, status: false, message: ''})
-    const [selectTab, setValue] = useState("today");
-    const filterHandler = (value) => {
-        setValue(value);
-    };
 
     const handleOnclick = () => {
         setRequest({loading: true, status: false, message: ''})
@@ -42,25 +38,6 @@ export default function StartJob(props) {
             {/*<CommonHead />*/}
             <div className="notification-page w-full mb-10">
                 <div className="notification-wrapper w-full">
-                    {/* heading */}
-                    {/* <div className="sm:flex justify-between items-center mb-6">
-                        <div className="mb-5 sm:mb-0">
-                            <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
-                <span
-                    className={`${selectTab === "today" ? "block" : "hidden"}`}
-                >
-                  Additional Terms for Jobs Posting.
-                </span>
-
-                            </h1>
-                        </div>
-                        <div className="slider-btns flex space-x-4">
-                            <div onClick={() => filterHandler("today")} className="relative">
-
-                            </div>
-                        </div>
-                    </div> */}
-
                     <div
                         className={`update-table w-full p-8 bg-white dark:bg-dark-white   overflow-hidden rounded-2xl section-shadow min-h-[520px]`}
                     >

src/components/Partials/Sidebar.jsx

@@ -12,7 +12,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
   const darkMode = useContext(DarkModeContext);
 
   let { userDetails } = useSelector((state) => state.userDetails);
-  console.log(userDetails);
+  console.log('user-details for job',userDetails);
   //const jobLists =  getJobList(); // pass from upper - we need in a lot of places
   let { jobLists } = useSelector((state) => state.jobLists);
   const marketData = jobLists?.result_list;
@@ -29,7 +29,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
         elm.classList.remove("active");
       });
     }
-  });
+  }, [jobLists]);
   return (
     <div className="w-full h-full">
       {/* logo-area */}
@@ -167,15 +167,6 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
                     sidebar ? "mb-14" : "rounded-none p-0"
                   }`}
                 >
-                  {/* <div className="setting-item">
-                <div className="top-platform bg-pink dark:bg-dark-white rounded-2xl p-16 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border">
-                  <NavLink to="/start-job">
-                    <span className="item-content relative group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray font-medium active flex-1">
-                      Enable Job Post
-                    </span>
-                  </NavLink>
-                </div>
-              </div> */}
                   <div className="items">
                     <div className="heading mb-5">
                       <h1 className="title text-xl font-bold text-purple">

src/index.js

@@ -6,11 +6,15 @@ import App from "./App";
 import "./index.css";
 import store from "./store/store";
 
+import { GoogleOAuthProvider } from '@react-oauth/google';
+
 const root = document.getElementById("root");
 ReactDOM.createRoot(root).render(
   <BrowserRouter>
     <Provider store={store}>
-      <App />
+      <GoogleOAuthProvider clientId={process.env.REACT_APP_GOOGLE_CLIENT_ID}>
+        <App />
+      </GoogleOAuthProvider>
     </Provider>
   </BrowserRouter>
 );

src/middleware/AuthRoute.jsx

@@ -77,7 +77,7 @@ const AuthRoute = ({ redirectPath = "/login", children }) => {
     // Getting market data
     const getMarketActiveJobList = async () => {
       try {
-        const res = await apiCall.getActiveJobList();
+        const res = await apiCall.getMyJobList();
         dispatch(updateJobs(res.data));
       } catch (error) {
         console.log("Error getting mode");

src/services/UsersService.js

@@ -97,7 +97,7 @@ class usersService {
      */
   getActiveJobList() {
     var postData = {
-      uuid: localStorage.getItem("uid"),
+      uid: localStorage.getItem("uid"),
       member_id: localStorage.getItem("member_id"),
       sessionid: localStorage.getItem("session_token"),
       page: 0,