feat: improve UI for "No account?"

* fix(organization): ensure count includes shared organizations

Adjust the `GetOrganizationCount` function to account for shared organizations by adding
an additional parameter and modifying the count query accordingly. This change ensures that
the organization count correctly reflects shared organizations within the system.

* ```fix(organization): optimize GetOrganizationCount query

Refactor the GetOrganizationCount function to use a more efficient search
method by leveraging the 'is_shared' field directly in the query condition.
This change improves the performance for counting organizations by avoiding
unnecessary iteration over potentially large result sets.
```

---------

Co-authored-by: CuiJing <cuijing@tul.com.cn>

README.md

@@ -13,7 +13,7 @@
   <a href="https://github.com/casdoor/casdoor/releases/latest">
     <img alt="GitHub Release" src="https://img.shields.io/github/v/release/casdoor/casdoor.svg">
   </a>
-  <a href="https://hub.docker.com/repository/docker/casbin/casdoor">
+  <a href="https://hub.docker.com/r/casbin/casdoor">
     <img alt="Docker Image Version (latest semver)" src="https://img.shields.io/badge/Docker%20Hub-latest-brightgreen">
   </a>
 </p>

controllers/organization.go

@@ -65,7 +65,7 @@ func (c *ApiController) GetOrganizations() {
 			c.ResponseOk(organizations)
 		} else {
 			limit := util.ParseInt(limit)
-			count, err := object.GetOrganizationCount(owner, field, value)
+			count, err := object.GetOrganizationCount(owner, organizationName, field, value)
 			if err != nil {
 				c.ResponseError(err.Error())
 				return
@@ -138,7 +138,7 @@ func (c *ApiController) AddOrganization() {
 		return
 	}
 
-	count, err := object.GetOrganizationCount("", "", "")
+	count, err := object.GetOrganizationCount("", "", "", "")
 	if err != nil {
 		c.ResponseError(err.Error())
 		return

object/application.go

@@ -78,6 +78,7 @@ type Application struct {
 	EnableSamlCompress    bool            `json:"enableSamlCompress"`
 	EnableSamlC14n10      bool            `json:"enableSamlC14n10"`
 	EnableSamlPostBinding bool            `json:"enableSamlPostBinding"`
+	UseEmailAsSamlNameId  bool            `json:"useEmailAsSamlNameId"`
 	EnableWebAuthn        bool            `json:"enableWebAuthn"`
 	EnableLinkWithEmail   bool            `json:"enableLinkWithEmail"`
 	OrgChoiceMode         string          `json:"orgChoiceMode"`

object/check.go

@@ -354,8 +354,8 @@ func CheckUserPassword(organization string, username string, password string, la
 		}
 	}
 
-	if user.Ldap != "" && (isSigninViaLdap || user.Password == "") {
+	if user.Ldap != "" {
-		if !isPasswordWithLdapEnabled {
+		if !isSigninViaLdap && !isPasswordWithLdapEnabled {
 			return nil, fmt.Errorf(i18n.Translate(lang, "check:password or code is incorrect"))
 		}
 

object/organization.go

@@ -79,9 +79,9 @@ type Organization struct {
 	AccountItems []*AccountItem `xorm:"varchar(5000)" json:"accountItems"`
 }
 
-func GetOrganizationCount(owner, field, value string) (int64, error) {
+func GetOrganizationCount(owner, name, field, value string) (int64, error) {
 	session := GetSession(owner, -1, -1, field, value, "", "")
-	return session.Count(&Organization{})
+	return session.Count(&Organization{Name: name})
 }
 
 func GetOrganizations(owner string, name ...string) ([]*Organization, error) {

object/saml_idp.go

@@ -65,7 +65,11 @@ func NewSamlResponse(application *Application, user *User, host string, certific
 	assertion.CreateAttr("IssueInstant", now)
 	assertion.CreateElement("saml:Issuer").SetText(host)
 	subject := assertion.CreateElement("saml:Subject")
-	subject.CreateElement("saml:NameID").SetText(user.Name)
+	nameIDValue := user.Name
+	if application.UseEmailAsSamlNameId {
+		nameIDValue = user.Email
+	}
+	subject.CreateElement("saml:NameID").SetText(nameIDValue)
 	subjectConfirmation := subject.CreateElement("saml:SubjectConfirmation")
 	subjectConfirmation.CreateAttr("Method", "urn:oasis:names:tc:SAML:2.0:cm:bearer")
 	subjectConfirmationData := subjectConfirmation.CreateElement("saml:SubjectConfirmationData")
@@ -184,17 +188,17 @@ type NameIDFormat struct {
 }
 
 type SingleSignOnService struct {
-	XMLName  xml.Name
+	// XMLName  xml.Name
 	Binding  string `xml:"Binding,attr"`
 	Location string `xml:"Location,attr"`
 }
 
 type Attribute struct {
 	// XMLName      xml.Name
+	Xmlns        string   `xml:"xmlns,attr"`
 	Name         string   `xml:"Name,attr"`
 	NameFormat   string   `xml:"NameFormat,attr"`
 	FriendlyName string   `xml:"FriendlyName,attr"`
-	Xmlns        string   `xml:"xmlns,attr"`
 	Values       []string `xml:"AttributeValue"`
 }
 
@@ -386,7 +390,7 @@ func GetSamlResponse(application *Application, user *User, samlRequest string, h
 }
 
 // NewSamlResponse11 return a saml1.1 response(not 2.0)
-func NewSamlResponse11(user *User, requestID string, host string) (*etree.Element, error) {
+func NewSamlResponse11(application *Application, user *User, requestID string, host string) (*etree.Element, error) {
 	samlResponse := &etree.Element{
 		Space: "samlp",
 		Tag:   "Response",
@@ -430,7 +434,11 @@ func NewSamlResponse11(user *User, requestID string, host string) (*etree.Elemen
 	// nameIdentifier inside subject
 	nameIdentifier := subject.CreateElement("saml:NameIdentifier")
 	// nameIdentifier.CreateAttr("Format", "urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress")
+	if application.UseEmailAsSamlNameId {
+		nameIdentifier.SetText(user.Email)
+	} else {
 		nameIdentifier.SetText(user.Name)
+	}
 
 	// subjectConfirmation inside subject
 	subjectConfirmation := subject.CreateElement("saml:SubjectConfirmation")
@@ -439,7 +447,11 @@ func NewSamlResponse11(user *User, requestID string, host string) (*etree.Elemen
 	attributeStatement := assertion.CreateElement("saml:AttributeStatement")
 	subjectInAttribute := attributeStatement.CreateElement("saml:Subject")
 	nameIdentifierInAttribute := subjectInAttribute.CreateElement("saml:NameIdentifier")
+	if application.UseEmailAsSamlNameId {
+		nameIdentifierInAttribute.SetText(user.Email)
+	} else {
 		nameIdentifierInAttribute.SetText(user.Name)
+	}
 
 	subjectConfirmationInAttribute := subjectInAttribute.CreateElement("saml:SubjectConfirmation")
 	subjectConfirmationInAttribute.CreateElement("saml:ConfirmationMethod").SetText("urn:oasis:names:tc:SAML:1.0:cm:artifact")

object/token_cas.go

@@ -281,7 +281,7 @@ func GetValidationBySaml(samlRequest string, host string) (string, string, error
 		return "", "", fmt.Errorf("the application for user %s is not found", userId)
 	}
 
-	samlResponse, err := NewSamlResponse11(user, request.RequestID, host)
+	samlResponse, err := NewSamlResponse11(application, user, request.RequestID, host)
 	if err != nil {
 		return "", "", err
 	}

object/user.go

@@ -950,7 +950,17 @@ func DeleteUser(user *User) (bool, error) {
 		return false, err
 	}
 
+	organization, err := GetOrganizationByUser(user)
+	if err != nil {
+		return false, err
+	}
+	if organization != nil && organization.EnableSoftDeletion {
+		user.IsDeleted = true
+		user.DeletedTime = util.GetCurrentTime()
+		return UpdateUser(user.GetId(), user, []string{"is_deleted", "deleted_time"}, false)
+	} else {
 		return deleteUser(user)
+	}
 }
 
 func GetUserInfo(user *User, scope string, aud string, host string) (*Userinfo, error) {

object/user_util.go

@@ -271,114 +271,214 @@ func CheckPermissionForUpdateUser(oldUser, newUser *User, isAdmin bool, lang str
 
 	if oldUser.Owner != newUser.Owner {
 		item := GetAccountItemByName("Organization", organization)
+		if item == nil {
+			newUser.Owner = oldUser.Owner
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Name != newUser.Name {
 		item := GetAccountItemByName("Name", organization)
+		if item == nil {
+			newUser.Name = oldUser.Name
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Id != newUser.Id {
 		item := GetAccountItemByName("ID", organization)
+		if item == nil {
+			newUser.Id = oldUser.Id
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.DisplayName != newUser.DisplayName {
 		item := GetAccountItemByName("Display name", organization)
+		if item == nil {
+			newUser.DisplayName = oldUser.DisplayName
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Avatar != newUser.Avatar {
 		item := GetAccountItemByName("Avatar", organization)
+		if item == nil {
+			newUser.Avatar = oldUser.Avatar
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Type != newUser.Type {
 		item := GetAccountItemByName("User type", organization)
+		if item == nil {
+			newUser.Type = oldUser.Type
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	// The password is *** when not modified
 	if oldUser.Password != newUser.Password && newUser.Password != "***" {
 		item := GetAccountItemByName("Password", organization)
+		if item == nil {
+			newUser.Password = oldUser.Password
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Email != newUser.Email {
 		item := GetAccountItemByName("Email", organization)
+		if item == nil {
+			newUser.Email = oldUser.Email
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Phone != newUser.Phone {
 		item := GetAccountItemByName("Phone", organization)
+		if item == nil {
+			newUser.Phone = oldUser.Phone
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.CountryCode != newUser.CountryCode {
 		item := GetAccountItemByName("Country code", organization)
+		if item == nil {
+			newUser.CountryCode = oldUser.CountryCode
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Region != newUser.Region {
 		item := GetAccountItemByName("Country/Region", organization)
+		if item == nil {
+			newUser.Region = oldUser.Region
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Location != newUser.Location {
 		item := GetAccountItemByName("Location", organization)
+		if item == nil {
+			newUser.Location = oldUser.Location
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Affiliation != newUser.Affiliation {
 		item := GetAccountItemByName("Affiliation", organization)
+		if item == nil {
+			newUser.Affiliation = oldUser.Affiliation
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Title != newUser.Title {
 		item := GetAccountItemByName("Title", organization)
+		if item == nil {
+			newUser.Title = oldUser.Title
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Homepage != newUser.Homepage {
 		item := GetAccountItemByName("Homepage", organization)
+		if item == nil {
+			newUser.Homepage = oldUser.Homepage
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Bio != newUser.Bio {
 		item := GetAccountItemByName("Bio", organization)
+		if item == nil {
+			newUser.Bio = oldUser.Bio
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.Tag != newUser.Tag {
 		item := GetAccountItemByName("Tag", organization)
+		if item == nil {
+			newUser.Tag = oldUser.Tag
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.SignupApplication != newUser.SignupApplication {
 		item := GetAccountItemByName("Signup application", organization)
+		if item == nil {
+			newUser.SignupApplication = oldUser.SignupApplication
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Gender != newUser.Gender {
 		item := GetAccountItemByName("Gender", organization)
+		if item == nil {
+			newUser.Gender = oldUser.Gender
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Birthday != newUser.Birthday {
 		item := GetAccountItemByName("Birthday", organization)
+		if item == nil {
+			newUser.Birthday = oldUser.Birthday
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Education != newUser.Education {
 		item := GetAccountItemByName("Education", organization)
+		if item == nil {
+			newUser.Education = oldUser.Education
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.IdCard != newUser.IdCard {
 		item := GetAccountItemByName("ID card", organization)
+		if item == nil {
+			newUser.IdCard = oldUser.IdCard
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.IdCardType != newUser.IdCardType {
 		item := GetAccountItemByName("ID card type", organization)
+		if item == nil {
+			newUser.IdCardType = oldUser.IdCardType
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	oldUserPropertiesJson, _ := json.Marshal(oldUser.Properties)
 	newUserPropertiesJson, _ := json.Marshal(newUser.Properties)
 	if string(oldUserPropertiesJson) != string(newUserPropertiesJson) {
 		item := GetAccountItemByName("Properties", organization)
+		if item == nil {
+			newUser.Properties = oldUser.Properties
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.PreferredMfaType != newUser.PreferredMfaType {
 		item := GetAccountItemByName("Multi-factor authentication", organization)
+		if item == nil {
+			newUser.PreferredMfaType = oldUser.PreferredMfaType
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Groups == nil {
 		oldUser.Groups = []string{}
@@ -390,8 +490,12 @@ func CheckPermissionForUpdateUser(oldUser, newUser *User, isAdmin bool, lang str
 	newUserGroupsJson, _ := json.Marshal(newUser.Groups)
 	if string(oldUserGroupsJson) != string(newUserGroupsJson) {
 		item := GetAccountItemByName("Groups", organization)
+		if item == nil {
+			newUser.Groups = oldUser.Groups
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Address == nil {
 		oldUser.Address = []string{}
@@ -404,66 +508,118 @@ func CheckPermissionForUpdateUser(oldUser, newUser *User, isAdmin bool, lang str
 	newUserAddressJson, _ := json.Marshal(newUser.Address)
 	if string(oldUserAddressJson) != string(newUserAddressJson) {
 		item := GetAccountItemByName("Address", organization)
+		if item == nil {
+			newUser.Address = oldUser.Address
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if newUser.FaceIds != nil {
 		item := GetAccountItemByName("Face ID", organization)
+		if item == nil {
+			newUser.FaceIds = oldUser.FaceIds
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.IsAdmin != newUser.IsAdmin {
 		item := GetAccountItemByName("Is admin", organization)
+		if item == nil {
+			newUser.IsAdmin = oldUser.IsAdmin
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.IsForbidden != newUser.IsForbidden {
 		item := GetAccountItemByName("Is forbidden", organization)
+		if item == nil {
+			newUser.IsForbidden = oldUser.IsForbidden
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.IsDeleted != newUser.IsDeleted {
 		item := GetAccountItemByName("Is deleted", organization)
+		if item == nil {
+			newUser.IsDeleted = oldUser.IsDeleted
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 	if oldUser.NeedUpdatePassword != newUser.NeedUpdatePassword {
 		item := GetAccountItemByName("Need update password", organization)
+		if item == nil {
+			newUser.NeedUpdatePassword = oldUser.NeedUpdatePassword
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Balance != newUser.Balance {
 		item := GetAccountItemByName("Balance", organization)
+		if item == nil {
+			newUser.Balance = oldUser.Balance
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Score != newUser.Score {
 		item := GetAccountItemByName("Score", organization)
+		if item == nil {
+			newUser.Score = oldUser.Score
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Karma != newUser.Karma {
 		item := GetAccountItemByName("Karma", organization)
+		if item == nil {
+			newUser.Karma = oldUser.Karma
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Language != newUser.Language {
 		item := GetAccountItemByName("Language", organization)
+		if item == nil {
+			newUser.Language = oldUser.Language
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Ranking != newUser.Ranking {
 		item := GetAccountItemByName("Ranking", organization)
+		if item == nil {
+			newUser.Ranking = oldUser.Ranking
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Currency != newUser.Currency {
 		item := GetAccountItemByName("Currency", organization)
+		if item == nil {
+			newUser.Currency = oldUser.Currency
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	if oldUser.Hash != newUser.Hash {
 		item := GetAccountItemByName("Hash", organization)
+		if item == nil {
+			newUser.Hash = oldUser.Hash
+		} else {
 			itemsChanged = append(itemsChanged, item)
 		}
+	}
 
 	for _, accountItem := range itemsChanged {
 

routers/cors_filter.go

@@ -48,6 +48,10 @@ func CorsFilter(ctx *context.Context) {
 	originHostname := getHostname(origin)
 	host := removePort(ctx.Request.Host)
 
+	if origin == "null" {
+		origin = ""
+	}
+
 	if strings.HasPrefix(origin, "http://localhost") || strings.HasPrefix(origin, "https://localhost") || strings.HasPrefix(origin, "http://127.0.0.1") || strings.HasPrefix(origin, "http://casdoor-app") || strings.Contains(origin, ".chromiumapp.org") {
 		setCorsHeaders(ctx, origin)
 		return

routers/static_filter.go

@@ -43,6 +43,10 @@ func getWebBuildFolder() string {
 		return path
 	}
 
+	if util.FileExist(filepath.Join(frontendBaseDir, "index.html")) {
+		return frontendBaseDir
+	}
+
 	path = filepath.Join(frontendBaseDir, "web/build")
 	return path
 }

web/src/ApplicationEditPage.js

@@ -703,6 +703,16 @@ class ApplicationEditPage extends React.Component {
             }} />
           </Col>
         </Row>
+        <Row style={{marginTop: "20px"}}>
+          <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 19 : 2}>
+            {Setting.getLabel(i18next.t("application:Use Email as NameID"), i18next.t("application:Use Email as NameID - Tooltip"))} :
+          </Col>
+          <Col span={1}>
+            <Switch checked={this.state.application.useEmailAsSamlNameId} onChange={checked => {
+              this.updateApplicationField("useEmailAsSamlNameId", checked);
+            }} />
+          </Col>
+        </Row>
         <Row style={{marginTop: "20px"}} >
           <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 19 : 2}>
             {Setting.getLabel(i18next.t("application:Enable SAML POST binding"), i18next.t("application:Enable SAML POST binding - Tooltip"))} :

web/src/CasbinEditor.js

@@ -0,0 +1,97 @@
+// Copyright 2024 The Casdoor Authors. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import React, {useCallback, useEffect, useRef, useState} from "react";
+import {Controlled as CodeMirror} from "react-codemirror2";
+import "codemirror/lib/codemirror.css";
+import "codemirror/mode/properties/properties";
+import * as Setting from "./Setting";
+import IframeEditor from "./IframeEditor";
+import {Tabs} from "antd";
+
+const {TabPane} = Tabs;
+
+const CasbinEditor = ({model, onModelTextChange}) => {
+  const [activeKey, setActiveKey] = useState("advanced");
+  const iframeRef = useRef(null);
+  const [localModelText, setLocalModelText] = useState(model.modelText);
+
+  const handleModelTextChange = useCallback((newModelText) => {
+    if (!Setting.builtInObject(model)) {
+      setLocalModelText(newModelText);
+      onModelTextChange(newModelText);
+    }
+  }, [model, onModelTextChange]);
+
+  const syncModelText = useCallback(() => {
+    return new Promise((resolve) => {
+      if (activeKey === "advanced" && iframeRef.current) {
+        const handleSyncMessage = (event) => {
+          if (event.data.type === "modelUpdate") {
+            window.removeEventListener("message", handleSyncMessage);
+            handleModelTextChange(event.data.modelText);
+            resolve();
+          }
+        };
+        window.addEventListener("message", handleSyncMessage);
+        iframeRef.current.getModelText();
+      } else {
+        resolve();
+      }
+    });
+  }, [activeKey, handleModelTextChange]);
+
+  const handleTabChange = (key) => {
+    syncModelText().then(() => {
+      setActiveKey(key);
+      if (key === "advanced" && iframeRef.current) {
+        iframeRef.current.updateModelText(localModelText);
+      }
+    });
+  };
+
+  useEffect(() => {
+    setLocalModelText(model.modelText);
+  }, [model.modelText]);
+
+  return (
+    <div style={{height: "100%", width: "100%", display: "flex", flexDirection: "column"}}>
+      <Tabs activeKey={activeKey} onChange={handleTabChange} style={{flex: "0 0 auto", marginTop: "-10px"}}>
+        <TabPane tab="Basic Editor" key="basic" />
+        <TabPane tab="Advanced Editor" key="advanced" />
+      </Tabs>
+      <div style={{flex: "1 1 auto", overflow: "hidden"}}>
+        {activeKey === "advanced" ? (
+          <IframeEditor
+            ref={iframeRef}
+            initialModelText={localModelText}
+            onModelTextChange={handleModelTextChange}
+            style={{width: "100%", height: "100%"}}
+          />
+        ) : (
+          <CodeMirror
+            value={localModelText}
+            className="full-height-editor no-horizontal-scroll-editor"
+            options={{mode: "properties", theme: "default"}}
+            onBeforeChange={(editor, data, value) => {
+              handleModelTextChange(value);
+            }}
+          />
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default CasbinEditor;

web/src/IframeEditor.js

@@ -0,0 +1,66 @@
+// Copyright 2024 The Casdoor Authors. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import React, {forwardRef, useEffect, useImperativeHandle, useRef, useState} from "react";
+
+const IframeEditor = forwardRef(({initialModelText, onModelTextChange}, ref) => {
+  const iframeRef = useRef(null);
+  const [iframeReady, setIframeReady] = useState(false);
+
+  useEffect(() => {
+    const handleMessage = (event) => {
+      if (event.origin !== "https://editor.casbin.org") {return;}
+
+      if (event.data.type === "modelUpdate") {
+        onModelTextChange(event.data.modelText);
+      } else if (event.data.type === "iframeReady") {
+        setIframeReady(true);
+        iframeRef.current?.contentWindow.postMessage({
+          type: "initializeModel",
+          modelText: initialModelText,
+        }, "*");
+      }
+    };
+
+    window.addEventListener("message", handleMessage);
+    return () => window.removeEventListener("message", handleMessage);
+  }, [onModelTextChange, initialModelText]);
+
+  useImperativeHandle(ref, () => ({
+    getModelText: () => {
+      iframeRef.current?.contentWindow.postMessage({type: "getModelText"}, "*");
+    },
+    updateModelText: (newModelText) => {
+      if (iframeReady) {
+        iframeRef.current?.contentWindow.postMessage({
+          type: "updateModelText",
+          modelText: newModelText,
+        }, "*");
+      }
+    },
+  }));
+
+  return (
+    <iframe
+      ref={iframeRef}
+      src="https://editor.casbin.org/model-editor"
+      frameBorder="0"
+      width="100%"
+      height="500px"
+      title="Casbin Model Editor"
+    />
+  );
+});
+
+export default IframeEditor;

web/src/ModelEditPage.js

@@ -18,11 +18,7 @@ import * as ModelBackend from "./backend/ModelBackend";
 import * as OrganizationBackend from "./backend/OrganizationBackend";
 import * as Setting from "./Setting";
 import i18next from "i18next";
-
+import ModelEditor from "./CasbinEditor";
-import {Controlled as CodeMirror} from "react-codemirror2";
-import "codemirror/lib/codemirror.css";
-
-require("codemirror/mode/properties/properties");
 
 const {Option} = Select;
 
@@ -147,16 +143,10 @@ class ModelEditPage extends React.Component {
             {Setting.getLabel(i18next.t("model:Model text"), i18next.t("model:Model text - Tooltip"))} :
           </Col>
           <Col span={22}>
-            <div style={{width: "100%"}} >
+            <div style={{position: "relative", height: "500px"}} >
-              <CodeMirror
+              <ModelEditor
-                value={this.state.model.modelText}
+                model={this.state.model}
-                options={{mode: "properties", theme: "default"}}
+                onModelTextChange={(value) => this.updateModelField("modelText", value)}
-                onBeforeChange={(editor, data, value) => {
-                  if (Setting.builtInObject(this.state.model)) {
-                    return;
-                  }
-                  this.updateModelField("modelText", value);
-                }}
               />
             </div>
           </Col>

web/src/SyncerEditPage.js

@@ -434,8 +434,7 @@ class SyncerEditPage extends React.Component {
             {Setting.getLabel(i18next.t("syncer:Table"), i18next.t("syncer:Table - Tooltip"))} :
           </Col>
           <Col span={22} >
-            <Input value={this.state.syncer.table}
+            <Input value={this.state.syncer.table} onChange={e => {
-              disabled={this.state.syncer.type === "Keycloak"} onChange={e => {
               this.updateSyncerField("table", e.target.value);
             }} />
           </Col>

web/src/UserEditPage.js

@@ -1050,6 +1050,13 @@ class UserEditPage extends React.Component {
             <MfaAccountTable
               title={i18next.t("user:MFA accounts")}
               table={this.state.user.mfaAccounts}
+              qrUrl={
+                "casdoor-app://login/into?serverUrl=" + window.location.origin +
+                "&clientId=" + this.state.application.clientId +
+                "&organizationName=" + this.state.organizationName +
+                "&appName=" + this.state.user.signupApplication
+              }
+              icon={this.state.user.avatar}
               onUpdateTable={(table) => {this.updateUserField("mfaAccounts", table);}}
             />
           </Col>

web/src/auth/CasLogout.js

@@ -34,13 +34,22 @@ class CasLogout extends React.Component {
 
   UNSAFE_componentWillMount() {
     const params = new URLSearchParams(this.props.location.search);
+    const logoutInterval = 100;
 
-    AuthBackend.logout()
+    const logoutTimeOut = (redirectUri) => {
-      .then((res) => {
+      setTimeout(() => {
-        if (res.status === "ok") {
+        AuthBackend.getAccount().then((accountRes) => {
-          Setting.showMessage("success", "Logged out successfully");
+          if (accountRes.status === "ok") {
+            AuthBackend.logout().then((logoutRes) => {
+              if (logoutRes.status === "ok") {
+                logoutTimeOut(logoutRes.data2);
+              } else {
+                Setting.showMessage("error", `${i18next.t("login:Failed to log out")}: ${logoutRes.msg}`);
+              }
+            });
+          } else {
+            Setting.showMessage("success", i18next.t("application:Logged out successfully"));
             this.props.onUpdateAccount(null);
-          const redirectUri = res.data2;
             if (redirectUri !== null && redirectUri !== undefined && redirectUri !== "") {
               Setting.goToLink(redirectUri);
             } else if (params.has("service")) {
@@ -48,11 +57,19 @@ class CasLogout extends React.Component {
             } else {
               Setting.goToLinkSoft(this, `/cas/${this.state.owner}/${this.state.applicationName}/login`);
             }
-        } else {
-          Setting.showMessage("error", `Failed to log out: ${res.msg}`);
           }
         });
+      }, logoutInterval);
+    };
 
+    AuthBackend.logout()
+      .then((res) => {
+        if (res.status === "ok") {
+          logoutTimeOut(res.data2);
+        } else {
+          Setting.showMessage("error", `${i18next.t("login:Failed to log out")}: ${res.msg}`);
+        }
+      });
   }
 
   render() {

web/src/auth/LoginPage.js

@@ -938,7 +938,7 @@ class LoginPage extends React.Component {
             signinItem.label ? Setting.renderSignupLink(application, signinItem.label) :
               (
                 <React.Fragment>
-                  {i18next.t("login:No account?")}
+                  {i18next.t("login:No account?")}&nbsp;
                   {
                     Setting.renderSignupLink(application, i18next.t("login:sign up now"))
                   }

web/src/index.css

@@ -51,3 +51,19 @@ code {
 .custom-link:hover {
   color: rgb(64 64 64) !important;
 }
+
+.full-height-editor {
+  height: 100%;
+}
+
+.full-height-editor [class*="CodeMirror"] {
+  height: 100%;
+}
+
+.no-horizontal-scroll-editor [class*="CodeMirror-hscrollbar"] {
+  display: none !important;
+}
+
+.no-horizontal-scroll-editor [class*="CodeMirror-scroll"] {
+  overflow-x: hidden !important;
+}

web/src/table/MfaAccountTable.js

@@ -14,7 +14,7 @@
 
 import React from "react";
 import {DeleteOutlined, DownOutlined, UpOutlined} from "@ant-design/icons";
-import {Button, Col, Image, Input, Row, Table, Tooltip} from "antd";
+import {Button, Col, Image, Input, Popover, QRCode, Row, Table, Tooltip} from "antd";
 import * as Setting from "../Setting";
 import i18next from "i18next";
 
@@ -23,6 +23,8 @@ class MfaAccountTable extends React.Component {
     super(props);
     this.state = {
       classes: props,
+      qrUrl: this.props.qrUrl,
+      icon: this.props.icon,
       mfaAccounts: this.props.table !== null ? this.props.table.map((item, index) => {
         item.key = index;
         return item;
@@ -158,6 +160,15 @@ class MfaAccountTable extends React.Component {
           <div>
             {this.props.title}&nbsp;&nbsp;&nbsp;&nbsp;
             <Button style={{marginRight: "5px"}} type="primary" size="small" onClick={() => this.addRow(table)}>{i18next.t("general:Add")}</Button>
+            <Popover trigger="focus" content={
+              <QRCode
+                value={this.state.qrUrl}
+                icon={this.state.icon}
+                bordered={false}
+              />
+            }>
+              <Button style={{marginLeft: "5px"}} type="primary" size="small">{i18next.t("general:QR Code")}</Button>
+            </Popover>
           </div>
         )}
       />