webconsole refactoring with react 18 (#47)

* Apply changes for react-18.

* Apply patches for react-18.

* Update favicon.

* Fix SubscriberCreate error when no S-NSSAI is defined.

* Show proper error message.

* Add webconsole to .gitignore.

* Add MSISDN field in Subscription.

* Make label to be consistent.

* Update diff to 3.3.0.

* add apiConfig as default value

* Fix bug of identify admin tenant.

* Fix FlowRule handling.

* Fix golangci-lint error.

* Remove diff to avoid confusion.

* Handle non first DNN's FlowRules.

* Add number of subscribers for bulk creation of the user.

* Start from 1.

* Set default S-NSSAI with 2 S-NSSAI configuration.

* Fix Tenant Id -> Tenant Name.

* Refactor again -> confirm.

* Support Password Confirm feature when creating new user.

* Support password confirmation in editing the user.

---------

Co-authored-by: ianchen0119 <[email protected]>

.gitignore

@@ -31,3 +31,6 @@ cscope.*
 # Debug
 *.log
 *.pcap
+
+# Binary
+webconsole

backend/WebUI/api_webui.go

@@ -154,7 +154,7 @@ func setCorsHeader(c *gin.Context) {
 	c.Writer.Header().Set(
 		"Access-Control-Allow-Headers",
 		"Content-Type, Content-Length, Accept-Encoding, "+
-			"X-CSRF-Token, Authorization, accept, origin, Cache-Control, X-Requested-With",
+			"X-CSRF-Token, Authorization, accept, origin, Cache-Control, X-Requested-With, Token",
 	)
 	c.Writer.Header().Set("Access-Control-Allow-Methods", "POST, OPTIONS, GET, PUT, PATCH, DELETE")
 }
@@ -579,8 +579,10 @@ func ParseJWT(tokenStr string) (jwt.MapClaims, error) {
 func CheckAuth(c *gin.Context) bool {
 	tokenStr := c.GetHeader("Token")
 	claims, err := ParseJWT(tokenStr)
-
-	if err == nil && claims["email"] == "admin" {
+	if err != nil {
+		return false
+	}
+	if claims["email"].(string) == "admin" {
 		return true
 	} else {
 		return false
@@ -590,9 +592,6 @@ func CheckAuth(c *gin.Context) bool {
 // Tenant ID
 func GetTenantId(c *gin.Context) (string, error) {
 	tokenStr := c.GetHeader("Token")
-	if CheckAuth(c) {
-		return "", nil
-	}
 	claims, err := ParseJWT(tokenStr)
 	if err != nil {
 		c.JSON(http.StatusInternalServerError, gin.H{})
@@ -1008,8 +1007,7 @@ func GetSubscribers(c *gin.Context) {
 
 	logger.ProcLog.Infoln("Get All Subscribers List")
 
-	tokenStr := c.GetHeader("Token")
-	claims, err := ParseJWT(tokenStr)
+	userTenantId, err := GetTenantId(c)
 	if err != nil {
 		logger.ProcLog.Errorln(err.Error())
 		c.JSON(http.StatusBadRequest, gin.H{
@@ -1018,6 +1016,8 @@ func GetSubscribers(c *gin.Context) {
 		return
 	}
 
+	isAdmin := CheckAuth(c)
+
 	var subsList []SubsListIE = make([]SubsListIE, 0)
 	amDataList, err := mongoapi.RestfulAPIGetMany(amDataColl, bson.M{})
 	if err != nil {
@@ -1047,7 +1047,7 @@ func GetSubscribers(c *gin.Context) {
 			return
 		}
 
-		if claims["email"] == "admin" || tenantId == claims["tenantId"].(string) {
+		if isAdmin || userTenantId == tenantId {
 			tmp := SubsListIE{
 				PlmnID: servingPlmnId.(string),
 				UeId:   ueId.(string),
@@ -1670,6 +1670,8 @@ func GetRegisteredUEContext(c *gin.Context) {
 	webuiSelf := webui_context.GetSelf()
 	webuiSelf.UpdateNfProfiles()
 
+	isAdmin := CheckAuth(c)
+
 	supi, supiExists := c.Params.Get("supi")
 	// TODO: support fetching data from multiple AMFs
 	if amfUris := webuiSelf.GetOamUris(models.NfType_AMF); amfUris != nil {
@@ -1709,7 +1711,7 @@ func GetRegisteredUEContext(c *gin.Context) {
 			return
 		}
 
-		if tenantId == "" {
+		if isAdmin {
 			sendResponseToClient(c, resp)
 		} else {
 			sendResponseToClientFilterTenant(c, resp, tenantId)
@@ -1763,3 +1765,59 @@ func GetUEPDUSessionInfo(c *gin.Context) {
 		})
 	}
 }
+
+func ChangePasswordInfo(c *gin.Context) {
+	setCorsHeader(c)
+
+	// Need to get tenantId.
+	tenantId, err := GetTenantId(c)
+	if err != nil {
+		logger.ProcLog.Errorln(err.Error())
+		c.JSON(http.StatusBadRequest, gin.H{})
+		return
+	}
+
+	var newUserData User
+	if err = c.ShouldBindJSON(&newUserData); err != nil {
+		logger.ProcLog.Errorln(err.Error())
+		c.JSON(http.StatusBadRequest, gin.H{})
+		return
+	}
+
+	filterEmailOnly := bson.M{"tenantId": tenantId, "email": newUserData.Email}
+	userDataInterface, err := mongoapi.RestfulAPIGetOne(userDataColl, filterEmailOnly)
+	if err != nil {
+		logger.ProcLog.Errorf("ChangePassword err: %+v", err)
+	}
+	if len(userDataInterface) == 0 {
+		c.JSON(http.StatusNotFound, bson.M{})
+		return
+	}
+
+	var userData User
+	err = json.Unmarshal(mapToByte(userDataInterface), &userData)
+	if err != nil {
+		logger.ProcLog.Errorf("JSON Unmarshal err: %+v", err)
+	}
+
+	if newUserData.EncryptedPassword != "" {
+		hash, err := bcrypt.GenerateFromPassword([]byte(newUserData.EncryptedPassword), 12)
+		if err != nil {
+			logger.ProcLog.Errorf("GenerateFromPassword err: %+v", err)
+		}
+		userData.EncryptedPassword = string(hash)
+	}
+
+	userBsonM := toBsonM(userData)
+	if _, err := mongoapi.RestfulAPIPost(userDataColl, filterEmailOnly, userBsonM); err != nil {
+		logger.ProcLog.Errorf("PutUserByID err: %+v", err)
+	}
+
+	c.JSON(http.StatusOK, userData)
+}
+
+func OptionsSubscribers(c *gin.Context) {
+	setCorsHeader(c)
+
+	c.JSON(http.StatusNoContent, gin.H{})
+}

backend/WebUI/routers.go

@@ -46,6 +46,8 @@ func AddService(engine *gin.Engine) *gin.RouterGroup {
 			group.DELETE(route.Pattern, route.HandlerFunc)
 		case http.MethodPatch:
 			group.PATCH(route.Pattern, route.HandlerFunc)
+		case http.MethodOptions:
+			group.OPTIONS(route.Pattern, route.HandlerFunc)
 		}
 	}
 
@@ -151,6 +153,13 @@ var routes = Routes{
 		GetSubscribers,
 	},
 
+	{
+		"OptionsSubscribers",
+		http.MethodOptions,
+		"/subscriber",
+		OptionsSubscribers,
+	},
+
 	{
 		"GetSubscriberByID",
 		http.MethodGet,
@@ -213,4 +222,11 @@ var routes = Routes{
 		"/ue-pdu-session-info/:smContextRef",
 		GetUEPDUSessionInfo,
 	},
+
+	{
+		"Change Password",
+		http.MethodPost,
+		"/change-password",
+		ChangePasswordInfo,
+	},
 }

frontend/.env

@@ -0,0 +1 @@
+GENERATE_SOURCEMAP=false

frontend/.eslintrc.js

@@ -0,0 +1,32 @@
+module.exports = {
+    "env": {
+        "browser": true,
+        "es2021": true
+    },
+  "root": true,
+    "extends": [
+      "airbnb-typescript/base",
+        "eslint:recommended",
+        "plugin:react/recommended",
+        "plugin:@typescript-eslint/recommended",
+        "prettier"
+    ],
+    "overrides": [
+    ],
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "ecmaVersion": "latest",
+      "sourceType": "module",
+      "project": "./tsconfig.json"
+    },
+    "plugins": [
+        "react",
+      "@typescript-eslint",
+      "import"
+    ],
+    "rules": {
+      "@typescript-eslint/no-non-null-assertion": 0,
+      "@typescript-eslint/no-explicit-any": 0,
+      "import/extensions": "off"
+    }
+}

frontend/.gitignore

@@ -1,3 +1,41 @@
-node_modules
+## openapi-generate
+**/.DS_Store
+/node_modules
+/.pnp
+.pnp.js
+/build
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.openapi-generator-ignore
+.openapi-generator/
+mdm
+README.md
 
-build
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

frontend/.prettierrc

@@ -0,0 +1,9 @@
+{
+  "semi": true,
+  "tabWidth": 2,
+  "printWidth": 100,
+  "singleQuote": false,
+  "trailingComma": "all",
+  "jsxSingleQuote": false,
+  "bracketSpacing": true
+}