Merge pull request #66 from PlakarKorp/jcastets/rework-ui-v2-build

Jcastets/rework UI v2 build
PlakarKorp · Nov 12, 2024 · 56f5dcf · 56f5dcf
2 parents fd90e63 + 4824b66
commit 56f5dcf
Show file tree

Hide file tree

Showing 58 changed files with 826 additions and 37 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,3 @@
 **/.DS_Store
+/plakar
+/vendor
diff --git a/ui/v2/README.md b/ui/v2/README.md
@@ -0,0 +1,31 @@
+# Plakar UI
+
+Plakar UI is available at the private repository [plakar-ui](https://github.com/plakarkorp/plakar-ui). This repository only stores the compiled build version of the UI.
+
+To synchronize the build assets with this repository, use the provided `sync.sh` script.
+
+## Development
+
+To sync the Plakar UI build from your local filesystem, use the `--local` flag with `sync.sh`:
+
+```bash
+$ cd ~/dev/plakar/plakar-ui
+$ npm run build
+$ ./sync.sh --local ~/dev/plakar/plakar-ui
+$ cat ./frontend/VERSION
+version: local
+commit: 4e5613ea839beba564d57cdad97664bf24d9b582
+date: 2024-11-12T14:41:26+0100
+```
+
+## Production build
+
+For syncing the UI build from the latest Plakar UI release on GitHub, use the `--release` flag. Optionally, specify a release version if needed:
+
+```bash
+$ ./sync.sh --release
+$ cat ./frontend/VERSION
+version: 0.1.0
+commit: 4e5613ea839beba564d57cdad97664bf24d9b582
+date: 2024-11-12T14:41:26+0100
+```
diff --git a/ui/v2/frontend/VERSION b/ui/v2/frontend/VERSION
@@ -0,0 +1,3 @@
+version: local
+commit: e1eb6c4d93f7764ce78528dba5677ed948ef0686
+date: 2024-11-12T17:04:05+0100
diff --git a/ui/v2/frontend/assets/index-BUmZTsSd.js b/ui/v2/frontend/assets/index-BUmZTsSd.js
diff --git a/ui/v2/frontend/assets/index-DEagmxS9.css b/ui/v2/frontend/assets/index-DEagmxS9.css
diff --git a/ui/v2/frontend/assets/plakup-UPFDsr4d.png b/ui/v2/frontend/assets/plakup-UPFDsr4d.png
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-300-normal-DJfICpyc.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-300-normal-DJfICpyc.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-300-normal-Dg7J0kAT.woff b/ui/v2/frontend/assets/roboto-cyrillic-300-normal-Dg7J0kAT.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-400-normal-BiRJyiea.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-400-normal-BiRJyiea.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-400-normal-JN0iKxGs.woff b/ui/v2/frontend/assets/roboto-cyrillic-400-normal-JN0iKxGs.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-500-normal-YnJLGrUm.woff b/ui/v2/frontend/assets/roboto-cyrillic-500-normal-YnJLGrUm.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-500-normal-_hamcpv8.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-500-normal-_hamcpv8.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-700-normal-BJaAVvFw.woff b/ui/v2/frontend/assets/roboto-cyrillic-700-normal-BJaAVvFw.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-700-normal-jruQITdB.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-700-normal-jruQITdB.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-300-normal-BLLmCegk.woff b/ui/v2/frontend/assets/roboto-cyrillic-ext-300-normal-BLLmCegk.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-300-normal-Chhwl1Jq.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-ext-300-normal-Chhwl1Jq.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-400-normal-D76n7Daw.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-ext-400-normal-D76n7Daw.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-400-normal-b0JluIOJ.woff b/ui/v2/frontend/assets/roboto-cyrillic-ext-400-normal-b0JluIOJ.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-500-normal-37WQE4S0.woff b/ui/v2/frontend/assets/roboto-cyrillic-ext-500-normal-37WQE4S0.woff
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-500-normal-BJvL3D7h.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-ext-500-normal-BJvL3D7h.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-700-normal-CyZgh00P.woff2 b/ui/v2/frontend/assets/roboto-cyrillic-ext-700-normal-CyZgh00P.woff2
diff --git a/ui/v2/frontend/assets/roboto-cyrillic-ext-700-normal-DXzexxfu.woff b/ui/v2/frontend/assets/roboto-cyrillic-ext-700-normal-DXzexxfu.woff
diff --git a/ui/v2/frontend/assets/roboto-greek-300-normal-Bx8edVml.woff2 b/ui/v2/frontend/assets/roboto-greek-300-normal-Bx8edVml.woff2
diff --git a/ui/v2/frontend/assets/roboto-greek-300-normal-D3gN5oZ1.woff b/ui/v2/frontend/assets/roboto-greek-300-normal-D3gN5oZ1.woff
diff --git a/ui/v2/frontend/assets/roboto-greek-400-normal-IIc_WWwF.woff b/ui/v2/frontend/assets/roboto-greek-400-normal-IIc_WWwF.woff
diff --git a/ui/v2/frontend/assets/roboto-greek-400-normal-LPh2sqOm.woff2 b/ui/v2/frontend/assets/roboto-greek-400-normal-LPh2sqOm.woff2
diff --git a/ui/v2/frontend/assets/roboto-greek-500-normal-Bg8BLohm.woff2 b/ui/v2/frontend/assets/roboto-greek-500-normal-Bg8BLohm.woff2
diff --git a/ui/v2/frontend/assets/roboto-greek-500-normal-CdRewbqV.woff b/ui/v2/frontend/assets/roboto-greek-500-normal-CdRewbqV.woff
diff --git a/ui/v2/frontend/assets/roboto-greek-700-normal-1IZ-NEfb.woff b/ui/v2/frontend/assets/roboto-greek-700-normal-1IZ-NEfb.woff
diff --git a/ui/v2/frontend/assets/roboto-greek-700-normal-Bs05n1ZH.woff2 b/ui/v2/frontend/assets/roboto-greek-700-normal-Bs05n1ZH.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-300-normal-BZ6gvbSO.woff b/ui/v2/frontend/assets/roboto-latin-300-normal-BZ6gvbSO.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-300-normal-BizgZZ3y.woff2 b/ui/v2/frontend/assets/roboto-latin-300-normal-BizgZZ3y.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-400-normal-BVyCgWwA.woff b/ui/v2/frontend/assets/roboto-latin-400-normal-BVyCgWwA.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-400-normal-DXyFPIdK.woff2 b/ui/v2/frontend/assets/roboto-latin-400-normal-DXyFPIdK.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-500-normal-C6iW8rdg.woff2 b/ui/v2/frontend/assets/roboto-latin-500-normal-C6iW8rdg.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-500-normal-rpP1_v3s.woff b/ui/v2/frontend/assets/roboto-latin-500-normal-rpP1_v3s.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-700-normal-BWcFiwQV.woff b/ui/v2/frontend/assets/roboto-latin-700-normal-BWcFiwQV.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-700-normal-CbYYDfWS.woff2 b/ui/v2/frontend/assets/roboto-latin-700-normal-CbYYDfWS.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-300-normal-BzRVPTS2.woff2 b/ui/v2/frontend/assets/roboto-latin-ext-300-normal-BzRVPTS2.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-300-normal-Djx841zm.woff b/ui/v2/frontend/assets/roboto-latin-ext-300-normal-Djx841zm.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-400-normal-BSFkPfbf.woff b/ui/v2/frontend/assets/roboto-latin-ext-400-normal-BSFkPfbf.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-400-normal-DgXbz5gU.woff2 b/ui/v2/frontend/assets/roboto-latin-ext-400-normal-DgXbz5gU.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-500-normal-DvHxAkTn.woff b/ui/v2/frontend/assets/roboto-latin-ext-500-normal-DvHxAkTn.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-500-normal-OQJhyaXd.woff2 b/ui/v2/frontend/assets/roboto-latin-ext-500-normal-OQJhyaXd.woff2
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-700-normal-Ba-CAIIA.woff b/ui/v2/frontend/assets/roboto-latin-ext-700-normal-Ba-CAIIA.woff
diff --git a/ui/v2/frontend/assets/roboto-latin-ext-700-normal-DchBbzVz.woff2 b/ui/v2/frontend/assets/roboto-latin-ext-700-normal-DchBbzVz.woff2
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-300-normal-CAomnZLO.woff b/ui/v2/frontend/assets/roboto-vietnamese-300-normal-CAomnZLO.woff
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-300-normal-PZa9KE_J.woff2 b/ui/v2/frontend/assets/roboto-vietnamese-300-normal-PZa9KE_J.woff2
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-400-normal-D5pJwT9g.woff b/ui/v2/frontend/assets/roboto-vietnamese-400-normal-D5pJwT9g.woff
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-400-normal-DhTUfTw_.woff2 b/ui/v2/frontend/assets/roboto-vietnamese-400-normal-DhTUfTw_.woff2
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-500-normal-LvuCHq7y.woff b/ui/v2/frontend/assets/roboto-vietnamese-500-normal-LvuCHq7y.woff
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-500-normal-p0V0BAAE.woff2 b/ui/v2/frontend/assets/roboto-vietnamese-500-normal-p0V0BAAE.woff2
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-700-normal-B4Nagvlm.woff b/ui/v2/frontend/assets/roboto-vietnamese-700-normal-B4Nagvlm.woff
diff --git a/ui/v2/frontend/assets/roboto-vietnamese-700-normal-CBbheh0s.woff2 b/ui/v2/frontend/assets/roboto-vietnamese-700-normal-CBbheh0s.woff2
diff --git a/ui/v2/frontend/favicon.png b/ui/v2/frontend/favicon.png
diff --git a/ui/v2/frontend/index.html b/ui/v2/frontend/index.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/png" href="/favicon.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Plakar UI</title>
+    <script type="module" crossorigin src="/assets/index-BUmZTsSd.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-DEagmxS9.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>
diff --git a/ui/v2/sync.sh b/ui/v2/sync.sh
@@ -0,0 +1,81 @@
+#!/bin/sh
+
+set -e
+
+cd `dirname $0`
+
+usage() {
+    echo "Usage: $0 --release [RELEASE_NUMBER] | --local PLAKAR_UI_PATH"
+    exit 1
+}
+
+if [ "$#" -lt 1 ]; then
+    usage
+fi
+
+# Initialize variables
+mode=""
+path=""
+release_number="latest"
+
+while [ "$#" -gt 0 ]; do
+    case "$1" in
+        --release)
+            if [ -n "$mode" ]; then
+                echo "Error: Only one of --release or --local can be specified."
+                usage
+            fi
+            mode="release"
+            if [ -n "$2" ] && [ "${2#-}" = "$2" ]; then
+                release_number="$2"
+                shift
+            fi
+            ;;
+        --local)
+            if [ -n "$mode" ]; then
+                echo "Error: Only one of --release or --local can be specified."
+                usage
+            fi
+            mode="local"
+            if [ -z "$2" ] || [ "${2#-}" != "$2" ]; then
+                echo "Error: --local requires a path argument."
+                usage
+            fi
+            path="$2"
+            shift
+            ;;
+        *)
+            echo "Error: Invalid argument '$1'"
+            usage
+            ;;
+    esac
+    shift
+done
+
+if [ "$mode" = "release" ]; then
+    echo "Downloading release: $release_number"
+    # TODO
+
+elif [ "$mode" = "local" ]; then
+    if [ ! -d "$path" ]; then
+        echo "Error: Path '$path' does not exist."
+        exit 1
+    fi
+
+    if [ ! -d "$path/dist" ]; then
+        echo "Error: before syncing, please build the UI using 'npm run build' in the UI directory."
+        exit 1
+    fi
+
+	rm -rf -- ./frontend/
+	cp -r ${path}/dist ./frontend
+
+    cat<<EOF > ./frontend/VERSION
+version: local
+commit: $(git -C ${path} log -1 --format="%H")
+date: $(date +"%Y-%m-%dT%H:%M:%S%z")
+EOF
+
+else
+    usage
+fi
diff --git a/ui/v2/ui.go b/ui/v2/ui.go
@@ -20,11 +20,13 @@ import (
 	"embed"
 	_ "embed"
 	"fmt"
+	"io/fs"
 	"math/rand/v2"
 	"net/http"
+	"os"
 	"os/exec"
+	"path/filepath"
 	"runtime"
-	"strings"
 
 	"github.com/PlakarKorp/plakar/api"
 	"github.com/PlakarKorp/plakar/repository"
@@ -35,51 +37,38 @@ import (
 var content embed.FS
 
 func Ui(repo *repository.Repository, addr string, spawn bool, cors bool) error {
-
 	r := api.NewRouter(repo)
 
-	r.PathPrefix("/static/").HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		// Strip the "/static/" prefix from the request path
-		httpPath := r.URL.Path
+	// Serve files from the ./frontend directory
+	r.PathPrefix("/").HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		// Join internally call path.Clean to prevent directory traversal
+		path := filepath.Join("frontend", r.URL.Path)
 
-		// Read the file from the embedded content
-		data, err := content.ReadFile("frontend" + httpPath)
-		if err != nil {
-			http.Error(w, "File not found", http.StatusNotFound)
+		_, err := content.Open(path)
+		if os.IsNotExist(err) {
+			// File does not exist, serve index.html
+			index, err := content.ReadFile(filepath.Join("frontend", "index.html"))
+			if err != nil {
+				http.Error(w, err.Error(), http.StatusInternalServerError)
+				return
+			}
+			w.Header().Set("Content-Type", "text/html; charset=utf-8")
+			w.WriteHeader(http.StatusAccepted)
+			_, _ = w.Write(index)
+			return
+		} else if err != nil {
+			// If we got an error (that wasn't that the file doesn't exist) stating the
+			// file, return a 500 internal server error and stop
+			http.Error(w, err.Error(), http.StatusInternalServerError)
 			return
 		}
 
-		// Determine the content type based on the file extension
-		contentType := ""
-		switch {
-		case strings.HasSuffix(httpPath, ".css"):
-			contentType = "text/css"
-		case strings.HasSuffix(httpPath, ".js"):
-			contentType = "application/javascript"
-		case strings.HasSuffix(httpPath, ".png"):
-			contentType = "image/png"
-		case strings.HasSuffix(httpPath, ".jpg"), strings.HasSuffix(httpPath, ".jpeg"):
-			contentType = "image/jpeg"
-			// Add more content types as needed
-		}
-
-		// Set the content type header
-		if contentType != "" {
-			w.Header().Set("Content-Type", contentType)
-		}
-		w.WriteHeader(http.StatusOK)
-		w.Write(data)
-	})
-
-	r.PathPrefix("/").HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		data, err := content.ReadFile("frontend/index.html")
+		statics, err := fs.Sub(content, "frontend")
 		if err != nil {
-			http.Error(w, "App not found", http.StatusNotFound)
+			http.Error(w, err.Error(), http.StatusInternalServerError)
 			return
 		}
-		w.Header().Set("Content-Type", "text/html; charset=utf-8")
-		w.WriteHeader(http.StatusOK)
-		w.Write(data)
+		http.FileServer(http.FS(statics)).ServeHTTP(w, r)
 	})
 
 	var url string