fix: Dismiss google one tap after logged in by setting disableCancelOnUnmount to false (#2854)

* fix: Google One Tap should be hidden after logged in

* Change the call location for google.accounts.id.cancel()

* fix: hide google one tap after login by set disableCancelOnUnmount to false

conf/app.conf

@@ -15,6 +15,7 @@ socks5Proxy = "127.0.0.1:10808"
 verificationCodeTimeout = 10
 initScore = 0
 logPostOnly = true
+isUsernameLowered = false
 origin =
 originFrontend =
 staticBaseUrl = "https://cdn.casbin.org"

controllers/cert.go

@@ -68,7 +68,7 @@ func (c *ApiController) GetCerts() {
 // GetGlobalCerts
 // @Title GetGlobalCerts
 // @Tag Cert API
-// @Description get globle certs
+// @Description get global certs
 // @Success 200 {array} object.Cert The Response object
 // @router /get-global-certs [get]
 func (c *ApiController) GetGlobalCerts() {

controllers/provider.go

@@ -141,6 +141,20 @@ func (c *ApiController) GetProvider() {
 	c.ResponseOk(object.GetMaskedProvider(provider, isMaskEnabled))
 }
 
+func (c *ApiController) requireProviderPermission(provider *object.Provider) bool {
+	isGlobalAdmin, user := c.isGlobalAdmin()
+	if isGlobalAdmin {
+		return true
+	}
+
+	if provider.Owner == "admin" || user.Owner != provider.Owner {
+		c.ResponseError(c.T("auth:Unauthorized operation"))
+		return false
+	}
+
+	return true
+}
+
 // UpdateProvider
 // @Title UpdateProvider
 // @Tag Provider API
@@ -159,6 +173,11 @@ func (c *ApiController) UpdateProvider() {
 		return
 	}
 
+	ok := c.requireProviderPermission(&provider)
+	if !ok {
+		return
+	}
+
 	c.Data["json"] = wrapActionResponse(object.UpdateProvider(id, &provider))
 	c.ServeJSON()
 }
@@ -184,11 +203,17 @@ func (c *ApiController) AddProvider() {
 		return
 	}
 
-	if err := checkQuotaForProvider(int(count)); err != nil {
+	err = checkQuotaForProvider(int(count))
+	if err != nil {
 		c.ResponseError(err.Error())
 		return
 	}
 
+	ok := c.requireProviderPermission(&provider)
+	if !ok {
+		return
+	}
+
 	c.Data["json"] = wrapActionResponse(object.AddProvider(&provider))
 	c.ServeJSON()
 }
@@ -208,6 +233,11 @@ func (c *ApiController) DeleteProvider() {
 		return
 	}
 
+	ok := c.requireProviderPermission(&provider)
+	if !ok {
+		return
+	}
+
 	c.Data["json"] = wrapActionResponse(object.DeleteProvider(&provider))
 	c.ServeJSON()
 }

object/user.go

@@ -833,6 +833,11 @@ func AddUser(user *User) (bool, error) {
 		}
 	}
 
+	isUsernameLowered := conf.GetConfigBool("isUsernameLowered")
+	if isUsernameLowered {
+		user.Name = strings.ToLower(user.Name)
+	}
+
 	affected, err := ormer.Engine.Insert(user)
 	if err != nil {
 		return false, err
@@ -846,6 +851,8 @@ func AddUsers(users []*User) (bool, error) {
 		return false, fmt.Errorf("no users are provided")
 	}
 
+	isUsernameLowered := conf.GetConfigBool("isUsernameLowered")
+
 	// organization := GetOrganizationByUser(users[0])
 	for _, user := range users {
 		// this function is only used for syncer or batch upload, so no need to encrypt the password
@@ -869,6 +876,10 @@ func AddUsers(users []*User) (bool, error) {
 				return false, err
 			}
 		}
+
+		if isUsernameLowered {
+			user.Name = strings.ToLower(user.Name)
+		}
 	}
 
 	affected, err := ormer.Engine.Insert(users)

web/src/App.js

@@ -41,6 +41,7 @@ setTwoToneColor("rgb(87,52,211)");
 class App extends Component {
   constructor(props) {
     super(props);
+    this.setThemeAlgorithm();
     let storageThemeAlgorithm = [];
     try {
       storageThemeAlgorithm = localStorage.getItem("themeAlgorithm") ? JSON.parse(localStorage.getItem("themeAlgorithm")) : ["default"];
@@ -157,6 +158,15 @@ class App extends Component {
     return Setting.getLogo(themes);
   }
 
+  setThemeAlgorithm() {
+    const currentUrl = window.location.href;
+    const url = new URL(currentUrl);
+    const themeType = url.searchParams.get("theme");
+    if (themeType === "dark" || themeType === "default") {
+      localStorage.setItem("themeAlgorithm", JSON.stringify([themeType]));
+    }
+  }
+
   setLanguage(account) {
     const language = account?.language;
     if (language !== null && language !== "" && language !== i18next.language) {
@@ -364,6 +374,7 @@ class App extends Component {
                         });
                       }}
                       onLoginSuccess={(redirectUrl) => {
+                        window.google?.accounts?.id?.cancel();
                         if (redirectUrl) {
                           localStorage.setItem("mfaRedirectUrl", redirectUrl);
                         }

web/src/UserEditPage.js

@@ -13,7 +13,7 @@
 // limitations under the License.
 
 import React from "react";
-import {Button, Card, Col, Form, Input, InputNumber, List, Result, Row, Select, Space, Spin, Switch, Tag} from "antd";
+import {Button, Card, Col, Form, Input, InputNumber, List, Result, Row, Select, Space, Spin, Switch, Tag, Tooltip} from "antd";
 import {withRouter} from "react-router-dom";
 import {TotpMfaType} from "./auth/MfaSetupPage";
 import * as GroupBackend from "./backend/GroupBackend";
@@ -407,7 +407,17 @@ class UserEditPage extends React.Component {
             {Setting.getLabel(i18next.t("general:Password"), i18next.t("general:Password - Tooltip"))} :
           </Col>
           <Col span={22} >
-            <PasswordModal user={this.state.user} userName={this.state.userName} organization={this.getUserOrganization()} account={this.props.account} disabled={disabled} />
+            {
+              (this.state.user.name === this.state.userName) ? (
+                <PasswordModal user={this.state.user} userName={this.state.userName} organization={this.getUserOrganization()} account={this.props.account} disabled={disabled} />
+              ) : (
+                <Tooltip placement={"topLeft"} title={i18next.t("user:You have changed the username, please save your change first before modifying the password")}>
+                  <span>
+                    <PasswordModal user={this.state.user} userName={this.state.userName} organization={this.getUserOrganization()} account={this.props.account} disabled={true} />
+                  </span>
+                </Tooltip>
+              )
+            }
           </Col>
         </Row>
       );

web/src/auth/ForgetPage.js

@@ -21,7 +21,7 @@ import * as Setting from "../Setting";
 import i18next from "i18next";
 import {SendCodeInput} from "../common/SendCodeInput";
 import * as UserBackend from "../backend/UserBackend";
-import {CheckCircleOutlined, KeyOutlined, LockOutlined, SolutionOutlined, UserOutlined} from "@ant-design/icons";
+import {ArrowLeftOutlined, CheckCircleOutlined, KeyOutlined, LockOutlined, SolutionOutlined, UserOutlined} from "@ant-design/icons";
 import CustomGithubCorner from "../common/CustomGithubCorner";
 import {withRouter} from "react-router-dom";
 import * as PasswordChecker from "../common/PasswordChecker";
@@ -443,6 +443,18 @@ class ForgetPage extends React.Component {
     );
   }
 
+  stepBack() {
+    if (this.state.current > 0) {
+      this.setState({
+        current: this.state.current - 1,
+      });
+    } else if (this.props.history.length > 1) {
+      this.props.history.goBack();
+    } else {
+      Setting.redirectToLoginPage(this.getApplicationObj(), this.props.history);
+    }
+  }
+
   render() {
     const application = this.getApplicationObj();
     if (application === undefined) {
@@ -456,6 +468,9 @@ class ForgetPage extends React.Component {
       <React.Fragment>
         <CustomGithubCorner />
         <div className="forget-content" style={{padding: Setting.isMobile() ? "0" : null, boxShadow: Setting.isMobile() ? "none" : null}}>
+          <Button type="text" style={{position: "relative", left: Setting.isMobile() ? "10px" : "-90px", top: 0}} size={"large"} onClick={() => {this.stepBack();}}>
+            <ArrowLeftOutlined style={{fontSize: "24px"}} />
+          </Button>
           <Row>
             <Col span={24} style={{justifyContent: "center"}}>
               <Row>

web/src/auth/GoogleLoginButton.js

@@ -52,7 +52,7 @@ export function GoogleOneTapLoginVirtualButton(prop) {
       redirectUri = `${redirectUri}?state=${state}&code=${encodeURIComponent(code)}`;
       Setting.goToLink(redirectUri);
     },
-    disableCancelOnUnmount: true,
+    disableCancelOnUnmount: false,
   });
 
 }

web/src/auth/LoginPage.js

@@ -1173,7 +1173,7 @@ class LoginPage extends React.Component {
     };
 
     return (
-      <div style={{height: 300}}>
+      <div style={{height: 300, minWidth: 320}}>
         {renderChoiceBox()}
       </div>
     );

web/src/auth/SignupPage.js

@@ -13,7 +13,7 @@
 // limitations under the License.
 
 import React from "react";
-import {Button, Form, Input, Result} from "antd";
+import {Button, Form, Input, Radio, Result, Row} from "antd";
 import * as Setting from "../Setting";
 import * as AuthBackend from "./AuthBackend";
 import * as ProviderButton from "./ProviderButton";
@@ -71,6 +71,7 @@ class SignupPage extends React.Component {
       applicationName: (props.applicationName ?? props.match?.params?.applicationName) ?? null,
       email: "",
       phone: "",
+      emailOrPhoneMode: "",
       countryCode: "",
       emailCode: "",
       phoneCode: "",
@@ -360,130 +361,176 @@ class SignupPage extends React.Component {
           <RegionSelect onChange={(value) => {this.setState({region: value});}} />
         </Form.Item>
       );
-    } else if (signupItem.name === "Email") {
-      return (
-        <React.Fragment>
-          <Form.Item
-            name="email"
-            label={signupItem.label ? signupItem.label : i18next.t("general:Email")}
-            rules={[
-              {
-                required: required,
-                message: i18next.t("signup:Please input your Email!"),
-              },
-              {
-                validator: (_, value) => {
-                  if (this.state.email !== "" && !Setting.isValidEmail(this.state.email)) {
-                    this.setState({validEmail: false});
-                    return Promise.reject(i18next.t("signup:The input is not valid Email!"));
-                  }
-
-                  this.setState({validEmail: true});
-                  return Promise.resolve();
-                },
-              },
-            ]}
-          >
-            <Input placeholder={signupItem.placeholder} disabled={this.state.invitation !== undefined && this.state.invitation.email !== ""} onChange={e => this.setState({email: e.target.value})} />
-          </Form.Item>
-          {
-            signupItem.rule !== "No verification" &&
+    } else if (signupItem.name === "Email" || signupItem.name === "Phone" || signupItem.name === "Email or Phone" || signupItem.name === "Phone or Email") {
+      const renderEmailItem = () => {
+        return (
+          <React.Fragment>
             <Form.Item
-              name="emailCode"
-              label={signupItem.label ? signupItem.label : i18next.t("code:Email code")}
-              rules={[{
-                required: required,
-                message: i18next.t("code:Please input your verification code!"),
-              }]}
-            >
-              <SendCodeInput
-                disabled={!this.state.validEmail}
-                method={"signup"}
-                onButtonClickArgs={[this.state.email, "email", Setting.getApplicationName(application)]}
-                application={application}
-              />
-            </Form.Item>
-          }
-        </React.Fragment>
-      );
-    } else if (signupItem.name === "Phone") {
-      return (
-        <React.Fragment>
-          <Form.Item label={signupItem.label ? signupItem.label : i18next.t("general:Phone")} required={required}>
-            <Input.Group compact>
-              <Form.Item
-                name="countryCode"
-                noStyle
-                rules={[
-                  {
-                    required: required,
-                    message: i18next.t("signup:Please select your country code!"),
-                  },
-                ]}
-              >
-                <CountryCodeSelect
-                  style={{width: "35%"}}
-                  countryCodes={this.getApplicationObj().organizationObj.countryCodes}
-                />
-              </Form.Item>
-              <Form.Item
-                name="phone"
-                dependencies={["countryCode"]}
-                noStyle
-                rules={[
-                  {
-                    required: required,
-                    message: i18next.t("signup:Please input your phone number!"),
-                  },
-                  ({getFieldValue}) => ({
-                    validator: (_, value) => {
-                      if (!required && !value) {
-                        return Promise.resolve();
-                      }
-
-                      if (value && !Setting.isValidPhone(value, getFieldValue("countryCode"))) {
-                        this.setState({validPhone: false});
-                        return Promise.reject(i18next.t("signup:The input is not valid Phone!"));
-                      }
-
-                      this.setState({validPhone: true});
-                      return Promise.resolve();
-                    },
-                  }),
-                ]}
-              >
-                <Input
-                  placeholder={signupItem.placeholder}
-                  style={{width: "65%"}}
-                  disabled={this.state.invitation !== undefined && this.state.invitation.phone !== ""}
-                  onChange={e => this.setState({phone: e.target.value})}
-                />
-              </Form.Item>
-            </Input.Group>
-          </Form.Item>
-          {
-            signupItem.rule !== "No verification" &&
-            <Form.Item
-              name="phoneCode"
-              label={signupItem.label ? signupItem.label : i18next.t("code:Phone code")}
+              name="email"
+              label={signupItem.label ? signupItem.label : i18next.t("general:Email")}
               rules={[
                 {
                   required: required,
-                  message: i18next.t("code:Please input your phone verification code!"),
+                  message: i18next.t("signup:Please input your Email!"),
+                },
+                {
+                  validator: (_, value) => {
+                    if (this.state.email !== "" && !Setting.isValidEmail(this.state.email)) {
+                      this.setState({validEmail: false});
+                      return Promise.reject(i18next.t("signup:The input is not valid Email!"));
+                    }
+
+                    this.setState({validEmail: true});
+                    return Promise.resolve();
+                  },
                 },
               ]}
             >
-              <SendCodeInput
-                disabled={!this.state.validPhone}
-                method={"signup"}
-                onButtonClickArgs={[this.state.phone, "phone", Setting.getApplicationName(application)]}
-                application={application}
-                countryCode={this.form.current?.getFieldValue("countryCode")}
-              />
+              <Input placeholder={signupItem.placeholder} disabled={this.state.invitation !== undefined && this.state.invitation.email !== ""} onChange={e => this.setState({email: e.target.value})} />
             </Form.Item>
-          }
-        </React.Fragment>
-      );
+            {
+              signupItem.rule !== "No verification" &&
+              <Form.Item
+                name="emailCode"
+                label={signupItem.label ? signupItem.label : i18next.t("code:Email code")}
+                rules={[{
+                  required: required,
+                  message: i18next.t("code:Please input your verification code!"),
+                }]}
+              >
+                <SendCodeInput
+                  disabled={!this.state.validEmail}
+                  method={"signup"}
+                  onButtonClickArgs={[this.state.email, "email", Setting.getApplicationName(application)]}
+                  application={application}
+                />
+              </Form.Item>
+            }
+          </React.Fragment>
+        );
+      };
+
+      const renderPhoneItem = () => {
+        return (
+          <React.Fragment>
+            <Form.Item label={signupItem.label ? signupItem.label : i18next.t("general:Phone")} required={required}>
+              <Input.Group compact>
+                <Form.Item
+                  name="countryCode"
+                  noStyle
+                  rules={[
+                    {
+                      required: required,
+                      message: i18next.t("signup:Please select your country code!"),
+                    },
+                  ]}
+                >
+                  <CountryCodeSelect
+                    style={{width: "35%"}}
+                    countryCodes={this.getApplicationObj().organizationObj.countryCodes}
+                  />
+                </Form.Item>
+                <Form.Item
+                  name="phone"
+                  dependencies={["countryCode"]}
+                  noStyle
+                  rules={[
+                    {
+                      required: required,
+                      message: i18next.t("signup:Please input your phone number!"),
+                    },
+                    ({getFieldValue}) => ({
+                      validator: (_, value) => {
+                        if (!required && !value) {
+                          return Promise.resolve();
+                        }
+
+                        if (value && !Setting.isValidPhone(value, getFieldValue("countryCode"))) {
+                          this.setState({validPhone: false});
+                          return Promise.reject(i18next.t("signup:The input is not valid Phone!"));
+                        }
+
+                        this.setState({validPhone: true});
+                        return Promise.resolve();
+                      },
+                    }),
+                  ]}
+                >
+                  <Input
+                    placeholder={signupItem.placeholder}
+                    style={{width: "65%"}}
+                    disabled={this.state.invitation !== undefined && this.state.invitation.phone !== ""}
+                    onChange={e => this.setState({phone: e.target.value})}
+                  />
+                </Form.Item>
+              </Input.Group>
+            </Form.Item>
+            {
+              signupItem.rule !== "No verification" &&
+              <Form.Item
+                name="phoneCode"
+                label={signupItem.label ? signupItem.label : i18next.t("code:Phone code")}
+                rules={[
+                  {
+                    required: required,
+                    message: i18next.t("code:Please input your phone verification code!"),
+                  },
+                ]}
+              >
+                <SendCodeInput
+                  disabled={!this.state.validPhone}
+                  method={"signup"}
+                  onButtonClickArgs={[this.state.phone, "phone", Setting.getApplicationName(application)]}
+                  application={application}
+                  countryCode={this.form.current?.getFieldValue("countryCode")}
+                />
+              </Form.Item>
+            }
+          </React.Fragment>
+        );
+      };
+
+      if (signupItem.name === "Email") {
+        return renderEmailItem();
+      } else if (signupItem.name === "Phone") {
+        return renderPhoneItem();
+      } else if (signupItem.name === "Email or Phone" || signupItem.name === "Phone or Email") {
+        let emailOrPhoneMode = this.state.emailOrPhoneMode;
+        if (emailOrPhoneMode === "") {
+          emailOrPhoneMode = signupItem.name === "Email or Phone" ? "Email" : "Phone";
+        }
+
+        return (
+          <React.Fragment>
+            <Row style={{marginTop: "30px", marginBottom: "20px"}} >
+              <Radio.Group style={{width: "400px"}} buttonStyle="solid" onChange={e => {
+                this.setState({
+                  emailOrPhoneMode: e.target.value,
+                });
+              }} value={emailOrPhoneMode}>
+                {
+                  signupItem.name === "Email or Phone" ? (
+                    <React.Fragment>
+                      <Radio.Button value={"Email"}>{i18next.t("general:Email")}</Radio.Button>
+                      <Radio.Button value={"Phone"}>{i18next.t("general:Phone")}</Radio.Button>
+                    </React.Fragment>
+                  ) : (
+                    <React.Fragment>
+                      <Radio.Button value={"Phone"}>{i18next.t("general:Phone")}</Radio.Button>
+                      <Radio.Button value={"Email"}>{i18next.t("general:Email")}</Radio.Button>
+                    </React.Fragment>
+                  )
+                }
+              </Radio.Group>
+            </Row>
+            {
+              emailOrPhoneMode === "Email" ? renderEmailItem() : renderPhoneItem()
+            }
+          </React.Fragment>
+        );
+      } else {
+        return null;
+      }
     } else if (signupItem.name === "Password") {
       return (
         <Form.Item

web/src/table/SignupTable.js

@@ -81,10 +81,12 @@ class SignupTable extends React.Component {
             {name: "Affiliation", displayName: i18next.t("user:Affiliation")},
             {name: "Country/Region", displayName: i18next.t("user:Country/Region")},
             {name: "ID card", displayName: i18next.t("user:ID card")},
-            {name: "Email", displayName: i18next.t("general:Email")},
             {name: "Password", displayName: i18next.t("general:Password")},
             {name: "Confirm password", displayName: i18next.t("signup:Confirm")},
+            {name: "Email", displayName: i18next.t("general:Email")},
             {name: "Phone", displayName: i18next.t("general:Phone")},
+            {name: "Email or Phone", displayName: i18next.t("general:Email or Phone")},
+            {name: "Phone or Email", displayName: i18next.t("general:Phone or Email")},
             {name: "Invitation code", displayName: i18next.t("application:Invitation code")},
             {name: "Agreement", displayName: i18next.t("signup:Agreement")},
             {name: "Text 1", displayName: i18next.t("signup:Text 1")},