feat: support long OAuth buttons for providers (#106)

* Show signup preview.

* feat: support other mode,dingtalk,weibo,wechat,gitee,facebook

Signed-off-by: wasabi <690898835@qq.com>

* feat: convert svg codes into files.

Signed-off-by: wasabi <690898835@qq.com>

* feat: convert svg codes into files.

Signed-off-by: wasabi <690898835@qq.com>

Co-authored-by: Yang Luo <hsluoyz@qq.com>
This commit is contained in:
wasabi
2021-06-14 23:29:22 +08:00
committed by GitHub
parent c122e89fc1
commit 134b2db3d7
9 changed files with 246 additions and 5 deletions

View File

@ -21,8 +21,14 @@ import * as ApplicationBackend from "../backend/ApplicationBackend";
import * as Provider from "./Provider";
import * as Util from "./Util";
import * as Setting from "../Setting";
import {GithubLoginButton, GoogleLoginButton} from "react-social-login-buttons";
import FacebookLoginButton from "./FacebookLoginButton";
import GitHubLoginButton from "./GitHubLoginButton";
import GoogleLoginButton from "./GoogleLoginButton";
import QqLoginButton from "./QqLoginButton";
import DingTalkLoginButton from "./DingTalkLoginButton";
import GiteeLoginButton from "./GiteeLoginButton";
import WechatLoginButton from "./WechatLoginButton";
import WeiboLoginButton from "./WeiboLoginButton";
import i18next from "i18next";
class LoginPage extends React.Component {
@ -111,11 +117,21 @@ class LoginPage extends React.Component {
getSigninButton(type) {
const text = i18next.t("login:Sign in with {type}").replace("{type}", type);
if (type === "GitHub") {
return <GithubLoginButton text={text} align={"center"} />
return <GitHubLoginButton text={text} align={"left"} />
} else if (type === "Google") {
return <GoogleLoginButton text={text} align={"center"} />
return <GoogleLoginButton text={text} align={"left"} />
} else if (type === "QQ") {
return <QqLoginButton text={text} align={"center"} />
return <QqLoginButton text={text} align={"left"} />
} else if (type === "Facebook") {
return <FacebookLoginButton text={text} align={"left"} />
} else if (type === "Weibo") {
return <WeiboLoginButton text={text} align={"left"} />
} else if (type === "Gitee") {
return <GiteeLoginButton text={text} align={"left"} />
} else if (type === "WeChat") {
return <WechatLoginButton text={text} align={"left"} />
} else if (type === "DingTalk") {
return <DingTalkLoginButton text={text} align={"left"} />
} else {
return text;
}