Compare commits
3 commits
main
...
oauthbutto
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
84e7a0edd0 | ||
|
|
af2c1d1035 | ||
|
|
08d291b913 |
3 changed files with 67 additions and 1 deletions
60
frontend/app/components/Login/GoogleLogin.tsx
Normal file
60
frontend/app/components/Login/GoogleLogin.tsx
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
import React from 'react';
|
||||
|
||||
function GoogleLogin({ isLogin }: { isLogin?: boolean }) {
|
||||
console.log(window.env, window.env.API_EDP)
|
||||
|
||||
const rootUrl = window.env.API_EDP || 'https://ee.openreplay.tools/api'
|
||||
return (
|
||||
<div className={'w-full'}>
|
||||
<a href={rootUrl + '/signup-oauth'} role={'button'}>
|
||||
<div className="w-full flex justify-center items-center bg-white border border-gray-300 rounded px-6 py-2 font-medium text-gray-800 hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500">
|
||||
<svg
|
||||
className="h-5 w-5 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
width="800px"
|
||||
height="800px"
|
||||
viewBox="-0.5 0 48 48"
|
||||
version="1.1"
|
||||
>
|
||||
<g
|
||||
id="Icons"
|
||||
stroke="none"
|
||||
strokeWidth="1"
|
||||
fill="none"
|
||||
fillRule="evenodd"
|
||||
>
|
||||
<g id="Color-" transform="translate(-401.000000, -860.000000)">
|
||||
<g id="Google" transform="translate(401.000000, 860.000000)">
|
||||
<path
|
||||
d="M9.82727273,24 C9.82727273,22.4757333 10.0804318,21.0144 10.5322727,19.6437333 L2.62345455,13.6042667 C1.08206818,16.7338667 0.213636364,20.2602667 0.213636364,24 C0.213636364,27.7365333 1.081,31.2608 2.62025,34.3882667 L10.5247955,28.3370667 C10.0772273,26.9728 9.82727273,25.5168 9.82727273,24"
|
||||
id="Fill-1"
|
||||
fill="#FBBC05"
|
||||
></path>
|
||||
<path
|
||||
d="M23.7136364,10.1333333 C27.025,10.1333333 30.0159091,11.3066667 32.3659091,13.2266667 L39.2022727,6.4 C35.0363636,2.77333333 29.6954545,0.533333333 23.7136364,0.533333333 C14.4268636,0.533333333 6.44540909,5.84426667 2.62345455,13.6042667 L10.5322727,19.6437333 C12.3545909,14.112 17.5491591,10.1333333 23.7136364,10.1333333"
|
||||
id="Fill-2"
|
||||
fill="#EB4335"
|
||||
></path>
|
||||
<path
|
||||
d="M23.7136364,37.8666667 C17.5491591,37.8666667 12.3545909,33.888 10.5322727,28.3562667 L2.62345455,34.3946667 C6.44540909,42.1557333 14.4268636,47.4666667 23.7136364,47.4666667 C29.4455,47.4666667 34.9177955,45.4314667 39.0249545,41.6181333 L31.5177727,35.8144 C29.3995682,37.1488 26.7323182,37.8666667 23.7136364,37.8666667"
|
||||
id="Fill-3"
|
||||
fill="#34A853"
|
||||
></path>
|
||||
<path
|
||||
d="M46.1454545,24 C46.1454545,22.6133333 45.9318182,21.12 45.6113636,19.7333333 L23.7136364,19.7333333 L23.7136364,28.8 L36.3181818,28.8 C35.6879545,31.8912 33.9724545,34.2677333 31.5177727,35.8144 L39.0249545,41.6181333 C43.3393409,37.6138667 46.1454545,31.6490667 46.1454545,24"
|
||||
id="Fill-4"
|
||||
fill="#4285F4"
|
||||
></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<span>{isLogin ? 'Login' : 'Sign up'} with Google</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default GoogleLogin;
|
||||
|
|
@ -20,7 +20,7 @@ import {
|
|||
import { Button, Form, Icon, Input, Link, Loader, Tooltip } from 'UI';
|
||||
|
||||
import Copyright from 'Shared/Copyright';
|
||||
|
||||
import GoogleLogin from "./GoogleLogin";
|
||||
import stl from './login.module.css';
|
||||
|
||||
const FORGOT_PASSWORD = forgotPassword();
|
||||
|
|
@ -177,6 +177,8 @@ const Login: React.FC<LoginProps> = ({
|
|||
/>
|
||||
)}
|
||||
<div style={{ width: '350px' }} className="px-8">
|
||||
<GoogleLogin isLogin />
|
||||
<div className={'my-4 text-disabled-text w-full text-center'}>Or continue with</div>
|
||||
<Form.Field>
|
||||
<label>Email Address</label>
|
||||
<Input
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import { validatePassword } from 'App/validate';
|
|||
import { PASSWORD_POLICY } from 'App/constants';
|
||||
import { Alert, Space } from 'antd';
|
||||
import { toast } from 'react-toastify';
|
||||
import GoogleLogin from "../../Login/GoogleLogin";
|
||||
|
||||
const LOGIN_ROUTE = login();
|
||||
|
||||
|
|
@ -113,6 +114,9 @@ const SignupForm: React.FC<SignupFormProps> = ({ tenants, errors, loading, signu
|
|||
/>
|
||||
)}
|
||||
<div className='px-8'>
|
||||
<GoogleLogin isLogin={false} />
|
||||
<div className={'my-4 text-disabled-text w-full text-center'}>Or continue with</div>
|
||||
|
||||
{tenants.length > 0 && (
|
||||
<Form.Field>
|
||||
<label>Existing Accounts</label>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue