Merge branch 'master' of https://github.com/omec-project/webconsole i…

…nto add-swagger-ui

Signed-off-by: Patricia Reinoso <[email protected]>

.github/workflows/master.yml

@@ -70,7 +70,7 @@ jobs:
       - uses: actions/checkout@v4
 
       - name: reuse lint
-        uses: fsfe/reuse-action@v3
+        uses: fsfe/reuse-action@v4
 
   fossa-check:
     runs-on: ubuntu-latest

Makefile

@@ -53,8 +53,15 @@ $(GO_BIN_PATH)/$(WEBCONSOLE): server.go  $(WEBCONSOLE_GO_FILES)
 
 vpath %.go $(addprefix $(GO_SRC_PATH)/, $(GO_NF))
 
+webconsole-ui: $(GO_BIN_PATH)/$(WEBCONSOLE)-ui
+
+$(GO_BIN_PATH)/$(WEBCONSOLE)-ui: server.go  $(WEBCONSOLE_GO_FILES)
+	@echo "Start building $(@F)...."
+	go build --tags ui -o $(ROOT_PATH)/$@ ./server.go
+
 clean:
-	rm -rf $(WEBCONSOLE)/$(GO_BIN_PATH)/$(WEBCONSOLE)
+	rm -rf $(ROOT_PATH)/$(GO_BIN_PATH)/$(WEBCONSOLE)
+	rm -rf $(ROOT_PATH)/$(GO_BIN_PATH)/$(WEBCONSOLE)-ui
 
 docker-build:
 	@go mod vendor

README.md

@@ -17,6 +17,24 @@ features Configuration Service provides APIs for subscriber management.
 4. 5G clients can connect & get complete configuration copy through grpc interface.
 5. 4G clients communicate with Webconsole through REST interface
 
+# UI
+
+Webconsole can optionally serve static files, which constitute the frontend part of the application.
+
+To build webui with a frontend, place the static files under `webconsole/ui/frontend_files` before compilation.
+
+To build the webconsole including the UI option:
+```
+make webconsole-ui
+```
+
+Access the UI at:
+```
+http://<webconsole-ip>:5000/
+```
+
+An example static file has been placed in the `webconsole/ui/frontend_files` directory.
+
 ## Webconsole Architecture diagram
 
 ![Architecture](/docs/images/architecture1.png)

backend/webui_service/README.md

@@ -14,9 +14,9 @@ swag init -g backend/webui_service/swagger_ui_service.go --outputTypes go
 ```
 The `docs.go` file will automatically be created in `webconsole/docs`
 
-The swagger UI runs by default on `localhost`. If the webconsole server runs remotely, set the following environment variable.
+The swagger UI operations are executed by default on `localhost`. If the webconsole server runs remotely, set the following environment variable.
 ```
-export SWAGGER_HOST=<webconsole-ip>
+export WEBUI_ENDPOINT=<webconsole-ip>:5000
 ```
 Build the webconsole including the UI option:
 ```

backend/webui_service/dummy_ui_service.go

@@ -0,0 +1,16 @@
+// SPDX-License-Identifier: Apache-2.0
+// Copyright 2024 Canonical Ltd.
+
+//go:build !ui
+
+package webui_service
+
+import (
+	"github.com/gin-gonic/gin"
+	"github.com/omec-project/webconsole/backend/logger"
+)
+
+func AddUiService(engine *gin.Engine) *gin.RouterGroup {
+	logger.WebUILog.Infoln("UI service will not be added")
+	return nil
+}

backend/webui_service/swagger_ui_service.go

@@ -28,10 +28,9 @@ import (
 // @BasePath	/
 func AddSwaggerUiService(engine *gin.Engine) {
     logger.WebUILog.Infoln("Adding Swagger UI service")
-    host := os.Getenv("SWAGGER_HOST")
-    if host != "" {
-        docs.SwaggerInfo.Host = host + ":5000"
-        logger.WebUILog.Infoln(docs.SwaggerInfo.Host)
+    endpoint := os.Getenv("WEBUI_ENDPOINT")
+    if endpoint != "" {
+        docs.SwaggerInfo.Host = endpoint
     }
     engine.GET("/swagger/*any", ginSwagger.WrapHandler(swaggerFiles.Handler))
 }

backend/webui_service/ui_service.go

@@ -0,0 +1,42 @@
+// SPDX-License-Identifier: Apache-2.0
+// Copyright 2024 Canonical Ltd.
+
+// +build ui
+
+package webui_service
+
+import (
+    "io/fs"
+    "net/http"
+    "strings"
+
+    "github.com/gin-gonic/gin"
+    "github.com/omec-project/webconsole/backend/logger"
+    "github.com/omec-project/webconsole/ui"
+)
+
+func AddUiService(engine *gin.Engine) {
+	logger.WebUILog.Infoln("Adding UI service")
+    staticFilesSystem, err := fs.Sub(ui.FrontendFS, "frontend_files")
+    if err != nil {
+        logger.WebUILog.Fatal(err)
+    }
+
+    engine.Use(func(c *gin.Context) {
+        if !isApiUrlPath(c.Request.URL.Path){
+            htmlPath := strings.TrimPrefix(c.Request.URL.Path, "/") + ".html"
+            if _, err := staticFilesSystem.Open(htmlPath); err == nil {
+                c.Request.URL.Path = htmlPath
+            }
+            fileServer := http.FileServer(http.FS(staticFilesSystem))
+            fileServer.ServeHTTP(c.Writer, c.Request)
+            c.Abort()
+        }
+    })
+}
+
+func isApiUrlPath(path string) bool{
+    return strings.HasPrefix(path, "/config/v1/") || strings.HasPrefix(path, "/api/");
+}
+
+

backend/webui_service/webui_init.go

@@ -170,6 +170,7 @@ func (webui *WEBUI) Start() {
 	/* First HTTP Server running at port to receive Config from ROC */
 	subconfig_router := logger_util.NewGinWithLogrus(logger.GinLog)
 	AddSwaggerUiService(subconfig_router)
+	AddUiService(subconfig_router)
 	configapi.AddServiceSub(subconfig_router)
 	configapi.AddService(subconfig_router)
 

ui/embed.go

@@ -0,0 +1,13 @@
+// SPDX-License-Identifier: Apache-2.0
+// Copyright 2024 Canonical Ltd.
+
+// +build ui
+
+package ui
+
+import (
+    "embed"
+)
+
+//go:embed all:frontend_files
+var FrontendFS embed.FS

ui/frontend_files/index.html

@@ -0,0 +1,14 @@
+<!-- SPDX-License-Identifier: Apache-2.0 -->
+<!-- Copyright 2024 Canonical Ltd. -->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Webui</title>
+</head>
+<body>
+    <h1>Welcome to the webconsole UI</h1>
+    <h3>This is an example of a static file from a frontend application.</h3>
+</body>
+</html>