feat: increase frontend build memory to 4096 in Dockerfile (#3672)

297.8 FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

Dockerfile

@@ -1,7 +1,7 @@
 FROM --platform=$BUILDPLATFORM node:18.19.0 AS FRONT
 WORKDIR /web
 COPY ./web .
-RUN yarn install --frozen-lockfile --network-timeout 1000000 && yarn run build
+RUN yarn install --frozen-lockfile --network-timeout 1000000 && NODE_OPTIONS="--max-old-space-size=4096" yarn run build
 
 
 FROM --platform=$BUILDPLATFORM golang:1.20.12 AS BACK

controllers/account.go

@@ -249,6 +249,10 @@ func (c *ApiController) Signup() {
 		user.Groups = []string{invitation.SignupGroup}
 	}
 
+	if application.DefaultGroup != "" && user.Groups == nil {
+		user.Groups = []string{application.DefaultGroup}
+	}
+
 	affected, err := object.AddUser(user)
 	if err != nil {
 		c.ResponseError(err.Error())

controllers/auth.go

@@ -598,6 +598,9 @@ func (c *ApiController) Login() {
 			c.ResponseError(err.Error())
 			return
 		}
+		if provider == nil {
+			c.ResponseError(fmt.Sprintf(c.T("auth:The provider: %s does not exist"), authForm.Provider))
+		}
 
 		providerItem := application.GetProviderItem(provider.Name)
 		if !providerItem.IsProviderVisible() {

object/application.go

@@ -71,6 +71,7 @@ type Application struct {
 	Description           string          `xorm:"varchar(100)" json:"description"`
 	Organization          string          `xorm:"varchar(100)" json:"organization"`
 	Cert                  string          `xorm:"varchar(100)" json:"cert"`
+	DefaultGroup          string          `xorm:"varchar(100)" json:"defaultGroup"`
 	HeaderHtml            string          `xorm:"mediumtext" json:"headerHtml"`
 	EnablePassword        bool            `json:"enablePassword"`
 	EnableSignUp          bool            `json:"enableSignUp"`

object/webhook.go

@@ -38,6 +38,7 @@ type Webhook struct {
 	ContentType    string    `xorm:"varchar(100)" json:"contentType"`
 	Headers        []*Header `xorm:"mediumtext" json:"headers"`
 	Events         []string  `xorm:"varchar(1000)" json:"events"`
+	TokenFields    []string  `xorm:"varchar(1000)" json:"tokenFields"`
 	IsUserExtended bool      `json:"isUserExtended"`
 	SingleOrgOnly  bool      `json:"singleOrgOnly"`
 	IsEnabled      bool      `json:"isEnabled"`

object/webhook_util.go

@@ -17,6 +17,7 @@ package object
 import (
 	"io"
 	"net/http"
+	"reflect"
 	"strings"
 
 	"github.com/casdoor/casdoor/util"
@@ -25,7 +26,32 @@ import (
 
 func sendWebhook(webhook *Webhook, record *casvisorsdk.Record, extendedUser *User) (int, string, error) {
 	client := &http.Client{}
+	userMap := make(map[string]interface{})
+	var body io.Reader
 
+	if webhook.TokenFields != nil && len(webhook.TokenFields) > 0 && extendedUser != nil {
+		userValue := reflect.ValueOf(extendedUser).Elem()
+
+		for _, field := range webhook.TokenFields {
+			userField := userValue.FieldByName(field)
+			if userField.IsValid() {
+				newfield := util.SnakeToCamel(util.CamelToSnakeCase(field))
+				userMap[newfield] = userField.Interface()
+			}
+		}
+
+		type RecordEx struct {
+			casvisorsdk.Record
+			ExtendedUser map[string]interface{} `json:"extendedUser"`
+		}
+
+		recordEx := &RecordEx{
+			Record:       *record,
+			ExtendedUser: userMap,
+		}
+
+		body = strings.NewReader(util.StructToJson(recordEx))
+	} else {
 		type RecordEx struct {
 			casvisorsdk.Record
 			ExtendedUser *User `xorm:"-" json:"extendedUser"`
@@ -35,7 +61,8 @@ func sendWebhook(webhook *Webhook, record *casvisorsdk.Record, extendedUser *Use
 			ExtendedUser: extendedUser,
 		}
 
-	body := strings.NewReader(util.StructToJson(recordEx))
+		body = strings.NewReader(util.StructToJson(recordEx))
+	}
 
 	req, err := http.NewRequest(webhook.Method, webhook.Url, body)
 	if err != nil {

pp/airwallex.go

@@ -4,6 +4,7 @@ import (
 	"bytes"
 	"encoding/json"
 	"fmt"
+	"io"
 	"net/http"
 	"net/url"
 	"strings"
@@ -180,7 +181,11 @@ func (c *AirwallexClient) authRequest(method, url string, body interface{}) (map
 		return nil, err
 	}
 	b, _ := json.Marshal(body)
-	req, _ := http.NewRequest(method, url, bytes.NewBuffer(b))
+	var reqBody io.Reader
+	if method != "GET" {
+		reqBody = bytes.NewBuffer(b)
+	}
+	req, _ := http.NewRequest(method, url, reqBody)
 	req.Header.Set("Authorization", "Bearer "+token)
 	req.Header.Set("Content-Type", "application/json")
 	resp, err := c.client.Do(req)

web/src/ApplicationEditPage.js

@@ -13,8 +13,8 @@
 // limitations under the License.
 
 import React from "react";
-import {Button, Card, Col, ConfigProvider, Input, InputNumber, Popover, Radio, Result, Row, Select, Switch, Upload} from "antd";
-import {CopyOutlined, LinkOutlined, UploadOutlined} from "@ant-design/icons";
+import {Button, Card, Col, ConfigProvider, Input, InputNumber, Popover, Radio, Result, Row, Select, Space, Switch, Upload} from "antd";
+import {CopyOutlined, HolderOutlined, LinkOutlined, UploadOutlined, UsergroupAddOutlined} from "@ant-design/icons";
 import * as ApplicationBackend from "./backend/ApplicationBackend";
 import * as CertBackend from "./backend/CertBackend";
 import * as Setting from "./Setting";
@@ -36,6 +36,7 @@ import ThemeEditor from "./common/theme/ThemeEditor";
 
 import SigninTable from "./table/SigninTable";
 import Editor from "./common/Editor";
+import * as GroupBackend from "./backend/GroupBackend";
 
 const {Option} = Select;
 
@@ -116,6 +117,7 @@ class ApplicationEditPage extends React.Component {
   UNSAFE_componentWillMount() {
     this.getApplication();
     this.getOrganizations();
+    this.getGroups();
   }
 
   getApplication() {
@@ -167,6 +169,17 @@ class ApplicationEditPage extends React.Component {
       });
   }
 
+  getGroups() {
+    GroupBackend.getGroups(this.state.organizationName)
+      .then((res) => {
+        if (res.status === "ok") {
+          this.setState({
+            groups: res.data,
+          });
+        }
+      });
+  }
+
   getCerts(application) {
     let owner = application.organization;
     if (application.isShared) {
@@ -469,6 +482,31 @@ class ApplicationEditPage extends React.Component {
             }} />
           </Col>
         </Row>
+        <Row style={{marginTop: "20px"}} >
+          <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
+            {Setting.getLabel(i18next.t("ldap:Default group"), i18next.t("ldap:Default group - Tooltip"))} :
+          </Col>
+          <Col span={22}>
+            <Select virtual={false} style={{width: "100%"}} value={this.state.application.defaultGroup ?? []} onChange={(value => {
+              this.updateApplicationField("defaultGroup", value);
+            })}
+            >
+              <Option key={""} value={""}>
+                <Space>
+                  {i18next.t("general:Default")}
+                </Space>
+              </Option>
+              {
+                this.state.groups?.map((group) => <Option key={group.name} value={`${group.owner}/${group.name}`}>
+                  <Space>
+                    {group.type === "Physical" ? <UsergroupAddOutlined /> : <HolderOutlined />}
+                    {group.displayName}
+                  </Space>
+                </Option>)
+              }
+            </Select>
+          </Col>
+        </Row>
         <Row style={{marginTop: "20px"}} >
           <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 19 : 2}>
             {Setting.getLabel(i18next.t("application:Enable signup"), i18next.t("application:Enable signup - Tooltip"))} :

web/src/ManagementPage.js

@@ -443,8 +443,6 @@ function ManagementPage(props) {
     return Setting.isMobile() || window.location.pathname.startsWith("/trees");
   }
 
-  const menuStyleRight = Setting.isAdminUser(props.account) && !Setting.isMobile() ? "calc(180px + 280px)" : "320px";
-
   const onClose = () => {
     setMenuVisible(false);
   };
@@ -456,8 +454,9 @@ function ManagementPage(props) {
   return (
     <React.Fragment>
       <EnableMfaNotification account={props.account} />
-      <Header style={{padding: "0", marginBottom: "3px", backgroundColor: props.themeAlgorithm.includes("dark") ? "black" : "white"}} >
-        {props.requiredEnableMfa || (Setting.isMobile() ?
+      <Header style={{display: "flex", justifyContent: "space-between", alignItems: "center", padding: "0", marginBottom: "4px", backgroundColor: props.themeAlgorithm.includes("dark") ? "black" : "white"}} >
+        {
+          props.requiredEnableMfa || (Setting.isMobile() ? (
             <React.Fragment>
               <Drawer title={i18next.t("general:Close")} placement="left" open={menuVisible} onClose={onClose}>
                 <Menu
@@ -472,18 +471,23 @@ function ManagementPage(props) {
               <Button icon={<BarsOutlined />} onClick={showMenu} type="text">
                 {i18next.t("general:Menu")}
               </Button>
-          </React.Fragment> :
+            </React.Fragment>
+          ) : (
+            // Padding 1px for Menu Item Highlight border
+            <div style={{flex: 1, overflow: "hidden", paddingBottom: "1px"}}>
               <Menu
                 onClick={onClose}
                 items={getMenuItems()}
                 mode={"horizontal"}
                 selectedKeys={[props.selectedMenuKey]}
-            style={{position: "absolute", left: 0, right: menuStyleRight, backgroundColor: props.themeAlgorithm.includes("dark") ? "black" : "white"}}
+                style={{backgroundColor: props.themeAlgorithm.includes("dark") ? "black" : "white"}}
               />
-        )}
-        {
-          renderAccountMenu()
+            </div>
+          ))
         }
+        <div style={{flexShrink: 0}}>
+          {renderAccountMenu()}
+        </div>
       </Header>
       <Content style={{display: "flex", flexDirection: "column"}} >
         {isWithoutCard() ?

web/src/WebhookEditPage.js

@@ -174,8 +174,17 @@ class WebhookEditPage extends React.Component {
   renderWebhook() {
     const preview = Setting.deepCopy(previewTemplate);
     if (this.state.webhook.isUserExtended) {
+      if (this.state.webhook.tokenFields && this.state.webhook.tokenFields.length !== 0) {
+        const extendedUser = {};
+        this.state.webhook.tokenFields.forEach(field => {
+          const fieldTrans = field.replace(field[0], field[0].toLowerCase());
+          extendedUser[fieldTrans] = userTemplate[fieldTrans];
+        });
+        preview["extendedUser"] = extendedUser;
+      } else {
         preview["extendedUser"] = userTemplate;
       }
+    }
     const previewText = JSON.stringify(preview, null, 2);
 
     return (
@@ -295,6 +304,18 @@ class WebhookEditPage extends React.Component {
             }} />
           </Col>
         </Row>
+        <Row style={{marginTop: "20px"}} >
+          <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
+            {Setting.getLabel(i18next.t("application:Extended user fields"), i18next.t("application:Extended user fields - Tooltip"))} :
+          </Col>
+          <Col span={22} >
+            <Select virtual={false} mode="tags" showSearch style={{width: "100%"}} value={this.state.webhook.tokenFields} onChange={(value => {this.updateWebhookField("tokenFields", value);})}>
+              {
+                Setting.getUserCommonFields().map((item, index) => <Option key={index} value={item}>{item}</Option>)
+              }
+            </Select>
+          </Col>
+        </Row>
         <Row style={{marginTop: "20px"}} >
           <Col style={{marginTop: "5px"}} span={(Setting.isMobile()) ? 22 : 2}>
             {Setting.getLabel(i18next.t("general:Preview"), i18next.t("general:Preview - Tooltip"))} :

web/src/auth/Provider.js

@@ -420,7 +420,7 @@ export function getAuthUrl(application, provider, method, code) {
   } else if (provider.type === "AzureADB2C") {
     return `https://${provider.domain}.b2clogin.com/${provider.domain}.onmicrosoft.com/${provider.appId}/oauth2/v2.0/authorize?client_id=${provider.clientId}&nonce=defaultNonce&redirect_uri=${encodeURIComponent(redirectUri)}&scope=${scope}&response_type=code&state=${state}&prompt=login`;
   } else if (provider.type === "DingTalk") {
-    return `${endpoint}?client_id=${provider.clientId}&redirect_uri=${redirectUri}&scope=${scope}&response_type=code&prompt=consent&state=${state}`;
+    return `${endpoint}?client_id=${provider.clientId}&redirect_uri=${redirectUri}&scope=${scope}&response_type=code&prompt=login%20consent&state=${state}`;
   } else if (provider.type === "WeChat") {
     if (navigator.userAgent.includes("MicroMessenger")) {
       return `${authInfo[provider.type].mpEndpoint}?appid=${provider.clientId2}&redirect_uri=${redirectUri}&state=${state}&scope=${authInfo[provider.type].mpScope}&response_type=code#wechat_redirect`;

web/src/common/modal/FaceRecognitionModal.js

@@ -14,11 +14,12 @@
 
 import * as faceapi from "face-api.js";
 import React, {useState} from "react";
-import {Button, Modal, Progress, Spin, message} from "antd";
+import {Button, Modal, Progress, Space, Spin, message} from "antd";
 import i18next from "i18next";
+import Dragger from "antd/es/upload/Dragger";
 
 const FaceRecognitionModal = (props) => {
-  const {visible, onOk, onCancel} = props;
+  const {visible, onOk, onCancel, withImage} = props;
   const [modelsLoaded, setModelsLoaded] = React.useState(false);
   const [isCameraCaptured, setIsCameraCaptured] = useState(false);
 
@@ -28,6 +29,10 @@ const FaceRecognitionModal = (props) => {
   const mediaStreamRef = React.useRef(null);
   const [percent, setPercent] = useState(0);
 
+  const [files, setFiles] = useState([]);
+  const [currentFaceId, setCurrentFaceId] = React.useState();
+  const [currentFaceIndex, setCurrentFaceIndex] = React.useState();
+
   React.useEffect(() => {
     const loadModels = async() => {
       // const MODEL_URL = process.env.PUBLIC_URL + "/models";
@@ -50,6 +55,9 @@ const FaceRecognitionModal = (props) => {
   }, []);
 
   React.useEffect(() => {
+    if (withImage) {
+      return;
+    }
     if (visible) {
       setPercent(0);
       if (modelsLoaded) {
@@ -75,6 +83,9 @@ const FaceRecognitionModal = (props) => {
   }, [visible, modelsLoaded]);
 
   React.useEffect(() => {
+    if (withImage) {
+      return;
+    }
     if (isCameraCaptured) {
       let count = 0;
       const interval = setInterval(() => {
@@ -98,6 +109,9 @@ const FaceRecognitionModal = (props) => {
   }, [isCameraCaptured]);
 
   const handleStreamVideo = () => {
+    if (withImage) {
+      return;
+    }
     let count = 0;
     let goodCount = 0;
     if (!detection.current) {
@@ -148,6 +162,16 @@ const FaceRecognitionModal = (props) => {
     }
   };
 
+  const getBase64 = (file) => {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.readAsDataURL(file);
+      reader.onload = () => resolve(reader.result);
+      reader.onerror = (error) => reject(error);
+    });
+  };
+
+  if (!withImage) {
     return (
       <div>
         <Modal
@@ -164,7 +188,14 @@ const FaceRecognitionModal = (props) => {
           ]}
         >
           <Progress percent={percent} />
-        <div style={{marginTop: "20px", marginBottom: "50px", justifyContent: "center", alignContent: "center", position: "relative", flexDirection: "column"}}>
+          <div style={{
+            marginTop: "20px",
+            marginBottom: "50px",
+            justifyContent: "center",
+            alignContent: "center",
+            position: "relative",
+            flexDirection: "column",
+          }}>
             {
               modelsLoaded ?
                 <div style={{display: "flex", justifyContent: "center", alignContent: "center"}}>
@@ -206,7 +237,8 @@ const FaceRecognitionModal = (props) => {
                 </div>
                 :
                 <div>
-                <Spin tip={i18next.t("login:Loading")} size="large" style={{display: "flex", justifyContent: "center", alignContent: "center"}}>
+                  <Spin tip={i18next.t("login:Loading")} size="large"
+                    style={{display: "flex", justifyContent: "center", alignContent: "center"}}>
                     <div className="content" />
                   </Spin>
                 </div>
@@ -215,6 +247,78 @@ const FaceRecognitionModal = (props) => {
         </Modal>
       </div>
     );
+  } else {
+    return <div>
+      <Modal closable={false}
+        maskClosable={false}
+        destroyOnClose={true}
+        open={visible}
+        title={i18next.t("login:Face Recognition")}
+        width={350}
+        footer={[
+          <Button key="ok" type={"primary"} disabled={!currentFaceId || currentFaceId?.length === 0} onClick={() => {
+            onOk(Array.from(currentFaceId.descriptor));
+          }}>
+            Ok
+          </Button>,
+          <Button key="back" onClick={onCancel}>
+                  Cancel
+          </Button>,
+        ]}>
+        <Space direction={"vertical"} style={{width: "100%"}}>
+          <Dragger
+            multiple={true}
+            defaultFileList={files}
+            style={{width: "100%"}}
+            beforeUpload={(file) => {
+              getBase64(file).then(res => {
+                file.base64 = res;
+                files.push(file);
+              });
+              setCurrentFaceId([]);
+              return false;
+            }}
+            onRemove={(file) => {
+              const index = files.indexOf(file);
+              const newFileList = files.slice();
+              newFileList.splice(index, 1);
+              setFiles(newFileList);
+              setCurrentFaceId([]);
+            }}
+          >
+            <p>{i18next.t("general:Click to Upload")}</p>
+          </Dragger >
+          {
+            modelsLoaded ? <Button style={{width: "100%"}} onClick={async() => {
+              let maxScore = 0;
+              for (const file of files) {
+                const fileIndex = files.indexOf(file);
+                const img = new Image();
+                img.src = file.base64;
+                const faceIds = await faceapi.detectAllFaces(img, new faceapi.TinyFaceDetectorOptions()).withFaceLandmarks().withFaceDescriptors();
+                if (faceIds[0]?.detection.score > 0.9 && faceIds[0]?.detection.score > maxScore) {
+                  maxScore = faceIds[0]?.detection.score;
+                  setCurrentFaceId(faceIds[0]);
+                  setCurrentFaceIndex(fileIndex);
+                }
+              }
+              if (maxScore < 0.9) {
+                message.error(i18next.t("login:Face recognition failed"));
+              }
+            }}> {i18next.t("application:Generate faceId")}</Button> : null
+          }
+        </Space>
+        {
+          currentFaceId && currentFaceId.length !== 0 ? (
+            <React.Fragment>
+              <div>{i18next.t("application:Select")}:{files[currentFaceIndex]?.name}</div>
+              <div><img src={files[currentFaceIndex]?.base64} alt="selected" style={{width: "100%"}} /></div>
+            </React.Fragment>
+          ) : null
+        }
+      </Modal>
+    </div>;
+  }
 };
 
 export default FaceRecognitionModal;

web/src/table/FaceIdTable.js

@@ -97,12 +97,16 @@ class FaceIdTable extends React.Component {
         title={() => (
           <div>
             {i18next.t("user:Face IDs")}&nbsp;&nbsp;&nbsp;&nbsp;
-            <Button disabled={this.props.table?.length >= 5} style={{marginRight: "5px"}} type="primary" size="small" onClick={() => this.setState({openFaceRecognitionModal: true})}>
+            <Button disabled={this.props.table?.length >= 5} style={{marginRight: "5px"}} type="primary" size="small" onClick={() => this.setState({openFaceRecognitionModal: true, withImage: false})}>
               {i18next.t("general:Add Face Id")}
             </Button>
+            <Button disabled={this.props.table?.length >= 5} style={{marginRight: "5px"}} type="primary" size="small" onClick={() => this.setState({openFaceRecognitionModal: true, withImage: true})}>
+              {i18next.t("general:Add Face Id with image")}
+            </Button>
             <Suspense fallback={null}>
               <FaceRecognitionModal
                 visible={this.state.openFaceRecognitionModal}
+                withImage={this.state.withImage}
                 onOk={(faceIdData) => {
                   this.addFaceId(table, faceIdData);
                   this.setState({openFaceRecognitionModal: false});