feat(web): support github login

web/public/locales/en/translation.json

@@ -215,7 +215,8 @@
     "EditorFont": "Editor Font",
     "FontSize": "Font Size",
     "FuncListDisplay": "Function List Display",
-    "ListDisplay": "List Display"
+    "ListDisplay": "List Display",
+    "Github": "GitHub"
   },
   "StoragePanel": {
     "All": "Total Capacity",
@@ -369,7 +370,10 @@
     "NewPassword": "New Password",
     "SignUpSuccess": "Sign up successfully",
     "EmailTip": "Please input a valid Email",
-    "LoginOrRegister": "Login / Register"
+    "LoginOrRegister": "Login / Register",
+    "BindGitHub": "Bind GitHub",
+    "BindSuccess": "Bind Successfully",
+    "GitHubLogin": "GitHub Login"
   },
   "Time": "Time",
   "CreateTime": "Created",
@@ -575,7 +579,9 @@
     "NoAuth": "Not Real-name Verified",
     "WarnTips": "You have not yet completed real-name authentication.",
     "PleaseBindPhone": "Please bind your mobile number first",
-    "VerifiedIdentity": "Verified Identity"
+    "VerifiedIdentity": "Verified Identity",
+    "Bind": "Bind",
+    "VerifiedGithub": "Verified"
   },
   "Reset": "Reset",
   "SettingModal": {
@@ -647,5 +653,8 @@
   "NextPage": "Next Page",
   "LastPage": "Last Page",
   "FirstPage": "First Page",
-  "SavedSuccessfully": "Saved Successfully"
-}
+  "SavedSuccessfully": "Saved Successfully",
+  "Bind": "Bind",
+  "UnBind": "Unbind",
+  "UnBindSuccess": "Unbind Successfully"
+}

web/public/locales/zh-CN/translation.json

@@ -215,7 +215,8 @@
     "EditorFont": "编辑器字体",
     "FontSize": "字体大小",
     "FuncListDisplay": "函数列表显示",
-    "ListDisplay": "列表显示"
+    "ListDisplay": "列表显示",
+    "Github": "GitHub"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -369,7 +370,10 @@
     "NewPassword": "新密码",
     "SignUpSuccess": "注册成功",
     "EmailTip": "请输入有效的邮箱",
-    "LoginOrRegister": "登录 / 注册"
+    "LoginOrRegister": "登录 / 注册",
+    "BindGitHub": "绑定 GitHub",
+    "BindSuccess": "绑定成功",
+    "GitHubLogin": "GitHub 登录"
   },
   "Time": "时间",
   "CreateTime": "创建时间",
@@ -575,7 +579,9 @@
     "NoAuth": "未实名",
     "WarnTips": "您尚未实名认证",
     "PleaseBindPhone": "请先绑定手机号",
-    "VerifiedIdentity": "已实名"
+    "VerifiedIdentity": "已实名",
+    "Bind": "绑定",
+    "VerifiedGithub": "已认证"
   },
   "Reset": "重置",
   "SettingModal": {
@@ -647,5 +653,8 @@
   "NextPage": "下一页",
   "LastPage": "最后一页",
   "FirstPage": "第一页",
-  "SavedSuccessfully": "保存成功"
-}
+  "SavedSuccessfully": "保存成功",
+  "Bind": "绑定",
+  "UnBind": "解绑",
+  "UnBindSuccess": "解绑成功"
+}

web/public/locales/zh/translation.json

@@ -215,7 +215,8 @@
     "EditorFont": "编辑器字体",
     "FontSize": "字体大小",
     "FuncListDisplay": "函数列表显示",
-    "ListDisplay": "列表显示"
+    "ListDisplay": "列表显示",
+    "Github": "GitHub"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -369,7 +370,10 @@
     "NewPassword": "新密码",
     "SignUpSuccess": "注册成功",
     "EmailTip": "请输入有效的邮箱",
-    "LoginOrRegister": "登录 / 注册"
+    "LoginOrRegister": "登录 / 注册",
+    "BindGitHub": "绑定 GitHub",
+    "BindSuccess": "绑定成功",
+    "GitHubLogin": "GitHub 登录"
   },
   "Time": "时间",
   "CreateTime": "创建时间",
@@ -575,7 +579,9 @@
     "NoAuth": "未实名",
     "WarnTips": "您尚未实名认证",
     "PleaseBindPhone": "请先绑定手机号",
-    "VerifiedIdentity": "已实名"
+    "VerifiedIdentity": "已实名",
+    "Bind": "绑定",
+    "VerifiedGithub": "已认证"
   },
   "Reset": "重置",
   "SettingModal": {
@@ -647,5 +653,8 @@
   "NextPage": "下一页",
   "LastPage": "最后一页",
   "FirstPage": "第一页",
-  "SavedSuccessfully": "保存成功"
-}
+  "SavedSuccessfully": "保存成功",
+  "Bind": "绑定",
+  "UnBind": "解绑",
+  "UnBindSuccess": "解绑成功"
+}

web/src/apis/v1/api-auto.d.ts

@@ -291,21 +291,32 @@ declare namespace Definitions {
     type?: string /* verify code type */;
   };
 
-  export type CreatePATDto = {
-    name?: string;
-    expiresIn?: number;
+  export type GithubSigninDto = {
+    code?: string;
+    state?: string;
+  };
+
+  export type GithubBind = {
+    token?: string /* temporary token signed for github bindings */;
+    register?: boolean /* Is a newly registered use */;
   };
 
   export type UserWithProfile = {
     _id?: string;
     username?: string;
     email?: string;
     phone?: string;
+    github?: number;
     createdAt?: string;
     updatedAt?: string;
     profile?: Definitions.UserProfile;
   };
 
+  export type CreatePATDto = {
+    name?: string;
+    expiresIn?: number;
+  };
+
   export type BindPhoneDto = {
     oldPhoneNumber?: string /* old phone number */;
     newPhoneNumber?: string /* new phone number */;
@@ -533,6 +544,7 @@ declare namespace Definitions {
     username?: string;
     email?: string;
     phone?: string;
+    github?: number;
     createdAt?: string;
     updatedAt?: string;
   };
@@ -1091,6 +1103,38 @@ declare namespace Paths {
     export type Responses = any;
   }
 
+  namespace GithubAuthControllerJumpLogin {
+    export type QueryParameters = any;
+
+    export type BodyParameters = any;
+
+    export type Responses = any;
+  }
+
+  namespace GithubAuthControllerSignin {
+    export type QueryParameters = any;
+
+    export type BodyParameters = Definitions.GithubSigninDto;
+
+    export type Responses = any;
+  }
+
+  namespace GithubAuthControllerBind {
+    export type QueryParameters = any;
+
+    export type BodyParameters = Definitions.GithubBind;
+
+    export type Responses = any;
+  }
+
+  namespace GithubAuthControllerUnbind {
+    export type QueryParameters = any;
+
+    export type BodyParameters = any;
+
+    export type Responses = any;
+  }
+
   namespace PatControllerCreate {
     export type QueryParameters = any;
 

web/src/apis/v1/auth.ts

@@ -173,3 +173,79 @@ export async function EmailControllerSendCode(params: Definitions.SendEmailCodeD
     data: params,
   });
 }
+
+/**
+ * Redirect to the login page of github
+ */
+export async function GithubAuthControllerJumpLogin(
+  params: Paths.GithubAuthControllerJumpLogin.BodyParameters,
+): Promise<{
+  error: string;
+  data: Paths.GithubAuthControllerJumpLogin.Responses;
+}> {
+  // /v1/auth/github/jump_login
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/auth/github/jump_login`, {
+    method: "GET",
+    params: params,
+  });
+}
+
+/**
+ * Signin by github
+ */
+export async function GithubAuthControllerSignin(params: Definitions.GithubSigninDto): Promise<{
+  error: string;
+  data: Paths.GithubAuthControllerSignin.Responses;
+}> {
+  // /v1/auth/github/signin
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/auth/github/signin`, {
+    method: "POST",
+    data: params,
+  });
+}
+
+/**
+ * Bind github
+ */
+export async function GithubAuthControllerBind(params: Definitions.GithubBind): Promise<{
+  error: string;
+  data: Definitions.UserWithProfile;
+}> {
+  // /v1/auth/github/bind
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/auth/github/bind`, {
+    method: "POST",
+    data: params,
+  });
+}
+
+/**
+ * Unbind github
+ */
+export async function GithubAuthControllerUnbind(
+  params: Paths.GithubAuthControllerUnbind.BodyParameters,
+): Promise<{
+  error: string;
+  data: Definitions.UserWithProfile;
+}> {
+  // /v1/auth/github/unbind
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/auth/github/unbind`, {
+    method: "POST",
+    data: params,
+  });
+}

web/src/constants/index.ts

@@ -64,6 +64,7 @@ export enum CURRENCY {
 }
 
 export const Routes = {
+  login: "/login",
   dashboard: "/dashboard",
   templates: "/market/templates",
 };

web/src/pages/app/setting/UserSetting/UserInfo/index.tsx

@@ -16,20 +16,23 @@ import UsernameEditor from "./Mods/UsernameEditor";
 
 import "react-image-crop/dist/ReactCrop.css";
 
-import { useGetProvidersQuery } from "@/pages/auth/service";
+import { useGetProvidersQuery, useGithubAuthControllerUnbindMutation } from "@/pages/auth/service";
 import useAuthStore from "@/pages/auth/store";
 import useGlobalStore from "@/pages/globalStore";
 import useSiteSettingStore from "@/pages/siteSetting";
 
 export default function UserInfo() {
   const [showItem, setShowItem] = useState("");
   const [selectedImage, setSelectedImage] = useState<string | null>(null);
-  const { userInfo, avatarUpdatedAt, showError } = useGlobalStore((state) => state);
+  const { userInfo, updateUserInfo, avatarUpdatedAt, showError, showSuccess } = useGlobalStore(
+    (state) => state,
+  );
   const fileInputRef = useRef<HTMLInputElement>(null);
   const { colorMode } = useColorMode();
   const darkMode = colorMode === "dark";
   const { siteSettings } = useSiteSettingStore((state) => state);
   const { providers, setProviders } = useAuthStore((state) => state);
+  const githubAuthControllerUnbindMutation = useGithubAuthControllerUnbindMutation();
 
   useGetProvidersQuery((data: any) => {
     setProviders(data?.data || []);
@@ -209,6 +212,52 @@ export default function UserInfo() {
                 </span>
               </span>
             </div> */}
+            {providers.find((provider: any) => provider.name === "github") && (
+              <div className="flex flex-col pb-4">
+                <span
+                  className={clsx(
+                    "flex items-center justify-between pb-3 text-xl",
+                    !darkMode && "text-grayModern-900",
+                  )}
+                >
+                  <span>{t("SettingPanel.Github")}</span>
+                  {userInfo?.github ? (
+                    <div className="flex  items-center">
+                      <span className="mr-4">
+                        <Avatar
+                          src={`https://avatars.githubusercontent.com/u/${userInfo?.github}`}
+                          size="sm"
+                        />
+                      </span>
+                      <span
+                        className={clsx(
+                          "flex cursor-pointer items-center text-base",
+                          !darkMode && "text-grayModern-900",
+                        )}
+                        onClick={async () => {
+                          const res = await githubAuthControllerUnbindMutation.mutateAsync({});
+                          if (!res.error) {
+                            updateUserInfo();
+                            showSuccess(t("UnBindSuccess"));
+                          }
+                        }}
+                      >
+                        {t("UnBind")} <ChevronRightIcon boxSize={5} />
+                      </span>
+                    </div>
+                  ) : (
+                    <span
+                      className="flex cursor-pointer items-center text-base text-[#0884DD]"
+                      onClick={() => {
+                        window.location.href = `${window.location.origin}/v1/auth/github/jump_login?redirectUri=${window.location.origin}/bind/github`;
+                      }}
+                    >
+                      {t("Bind")} <ChevronRightIcon boxSize={5} />
+                    </span>
+                  )}
+                </span>
+              </div>
+            )}
           </Box>
         </>
       )}