Serve both UI assets and REST API from handler

.github/workflows/release.yml

@@ -36,29 +36,12 @@ jobs:
       - name: Install NPM packages
         run: cd ui && rm yarn.lock && yarn install
 
-      - name: Build UI Bundle
+      - name: Build Release Binary
-        run: cd ui && yarn build
-
-      - name: Create Release Archive
-        run: tar -czvf ui-assets.tar.gz -C ui/build .
-
-      - name: Build release binary
         run: |
           GOOS=${{ matrix.goos }} GOARCH=amd64 make build
           tar -czvf asynqmon_${{ steps.release.outputs.tag_name }}_${{ matrix.goos }}_amd64.tar.gz asynqmon
           ls
 
-      - name: Upload UI Bundle
-        id: upload-ui-release-asset
-        uses: actions/upload-release-asset@v1
-        env:
-          GITHUB_TOKEN: ${{ github.token }}
-        with:
-          upload_url: ${{ steps.release.outputs.upload_url }}
-          asset_path: ./ui-assets.tar.gz
-          asset_name: ui-assets.tar.gz
-          asset_content_type: application/gzip
-
       - name: Upload Release Binary
         id: upload-go-release-asset
         uses: actions/upload-release-asset@v1

.gitignore

@@ -26,9 +26,11 @@ package-json.lock
 # main binary
 asynqmon
 dist/
-cmd/asynqmon/ui-assets
 
 # Editor configs
 .idea/
 .vscode/
 .editorconfig
+
+# examples
+examples/

Dockerfile

@@ -36,7 +36,7 @@ RUN go mod download
 COPY . .
 
 # Copy frontend static files from /static to the root folder of the backend container.
-COPY --from=frontend ["/static/build", "ui-assets"]
+COPY --from=frontend ["/static/build", "ui/build"]
 
 # Set necessary environmet variables needed for the image and build the server.
 ENV CGO_ENABLED=0 GOOS=linux GOARCH=amd64

Makefile

@@ -1,22 +1,9 @@
-.PHONY: assets sync go_binary build docker
+.PHONY: build docker
 
-NODE_PATH ?= $(PWD)/ui/node_modules
+# Build a release binary.
-
+build:
-assets:
-	@if [ ! -d "$(NODE_PATH)" ]; then cd ./ui && yarn install --modules-folder $(NODE_PATH); fi
-	cd ./ui && yarn build --modules-folder $(NODE_PATH)
-
-# sync will copy the ui build assets to cmd/asynqmon so that it can be embedded into the go binary
-sync:
-	rsync -avu --delete "./ui/build/" "./cmd/asynqmon/ui-assets"
-
-# Build go binary.
-go_binary: assets sync
 	go build -o asynqmon ./cmd/asynqmon
 
-# Target to build a release binary.
-build: go_binary
-
 # Build image and run Asynqmon server (with default settings).
 docker:
 	docker build -t asynqmon .

README.md

@@ -2,6 +2,10 @@
 
 # A modern web based tool for monitoring & administrating [Asynq](https://github.com/hibiken/asynq) queues, tasks and message broker
 
+## Overview
+
+Asynqmon is both a library that you can include in your web application, as well as a binary that you can simply install and run.
+
 ## Version Compatibility
 
 | Asynq version  | WebUI (asynqmon) version |
@@ -9,7 +13,7 @@
 | 0.18.x         | 0.2.x                    |
 | 0.16.x, 0.17.x | 0.1.x                    |
 
-## Install
+## Install the binary
 
 ### Release binaries
 
@@ -47,57 +51,7 @@ To build Docker image locally, run:
 make docker
 ```
 
-### Importing into projects
+## Run the binary
-
-You can import `asynqmon` into other projects and create a single binary to serve other components of `asynq` and `asynqmon` from a single binary.
-
-<details><summary>Example</summary>
-<p>
-
-> `staticContents` can be embedded by using the pre-built UI bundle from the Releases section.
-
-```go
-package main
-
-import (
-	"embed"
-	"log"
-	"net/http"
-
-	"github.com/gorilla/mux"
-
-	"github.com/hibiken/asynq"
-	"github.com/hibiken/asynqmon"
-)
-
-//go:embed ui-assets/*
-var staticContents embed.FS
-
-func main() {
-	h := asynqmon.New(asynqmon.Options{
-		RedisConnOpt: asynq.RedisClientOpt{Addr: ":6379"},
-	})
-	defer h.Close()
-
-	r := mux.NewRouter()
-	r.PathPrefix("/api").Handler(h)
-	// Add static content handler or other handlers
-	// r.PathPrefix("/").Handler( /* &staticContentHandler{staticContents} */ )
-
-	srv := &http.Server{
-		Handler: r,
-		Addr:    ":8080",
-	}
-
-	log.Fatal(srv.ListenAndServe())
-}
-```
-
-</p>
-</details>
-
-
-## Run
 
 To use the defaults, simply run and open http://localhost:8080.
 
@@ -171,6 +125,69 @@ Next, go to [localhost:8080](http://localhost:8080) and see Asynqmon dashboard:
 
 ![Web UI Settings and adaptive dark mode](https://user-images.githubusercontent.com/11155743/114697149-3517c380-9d26-11eb-9f7a-ae2dd00aad5b.png)
 
+### Importing into projects
+
+Asynqmon is also a library which can be imported into an existing web application.
+
+Example with [net/http](https://pkg.go.dev/net/http):
+
+```go
+package main
+
+import (
+	"log"
+	"net/http"
+
+	"github.com/hibiken/asynq"
+	"github.com/hibiken/asynqmon"
+)
+
+func main() {
+	h := asynqmon.New(asynqmon.Options{
+		RootPath: "/monitoring", // RootPath specifies the root for asynqmon app
+		RedisConnOpt: asynq.RedisClientOpt{Addr: ":6379"},
+	})
+
+	http.Handle(h.RootPath(), h)
+
+	// Go to http://localhost:8080/monitoring to see asynqmon homepage.
+	log.Fatal(http.ListenAndServe(":8000", nil))
+}
+```
+
+Example with [gorilla/mux](https://pkg.go.dev/github.com/gorilla/mux):
+
+```go
+package main
+
+import (
+	"log"
+	"net/http"
+
+	"github.com/gorilla/mux"
+	"github.com/hibiken/asynq"
+	"github.com/hibiken/asynqmon"
+)
+
+func main() {
+	h := asynqmon.New(asynqmon.Options{
+		RootPath: "/monitoring", // RootPath specifies the root for asynqmon app
+		RedisConnOpt: asynq.RedisClientOpt{Addr: ":6379"},
+	})
+
+	r := mux.NewRouter()
+	r.PathPrefix(h.RootPath()).Handler(h)
+
+	srv := &http.Server{
+		Handler: r,
+		Addr:    ":8080",
+	}
+
+	// Go to http://localhost:8080/monitoring to see asynqmon homepage.
+	log.Fatal(srv.ListenAndServe())
+}
+```
+
 ## License
 
 Copyright (c) 2019-present [Ken Hibino](https://github.com/hibiken) and [Contributors](https://github.com/hibiken/asynqmon/graphs/contributors). `Asynqmon` is free and open-source software licensed under the [MIT License](https://github.com/hibiken/asynq/blob/master/LICENSE). Official logo was created by [Vic Shóstak](https://github.com/koddr) and distributed under [Creative Commons](https://creativecommons.org/publicdomain/zero/1.0/) license (CC0 1.0 Universal).

cmd/asynqmon/main.go

@@ -2,10 +2,8 @@ package main
 
 import (
 	"crypto/tls"
-	"embed"
 	"flag"
 	"fmt"
-	"github.com/gorilla/mux"
 	"log"
 	"net/http"
 	"strings"
@@ -41,7 +39,9 @@ func init() {
 	flag.StringVar(&flagRedisClusterNodes, "redis-cluster-nodes", "", "comma separated list of host:port addresses of cluster nodes")
 }
 
-func getRedisOptionsFromFlags() (*redis.UniversalOptions, error) {
+// TODO: Write test and refactor this code.
+// IDEA: https://eli.thegreenplace.net/2020/testing-flag-parsing-in-go-programs/
+func getRedisOptionsFromFlags() (asynq.RedisConnOpt, error) {
 	var opts redis.UniversalOptions
 
 	if flagRedisClusterNodes != "" {
@@ -74,59 +74,40 @@ func getRedisOptionsFromFlags() (*redis.UniversalOptions, error) {
 		opts.TLSConfig.InsecureSkipVerify = true
 	}
 
-	return &opts, nil
+	if flagRedisClusterNodes != "" {
+		return asynq.RedisClusterClientOpt{
+			Addrs:     opts.Addrs,
+			Password:  opts.Password,
+			TLSConfig: opts.TLSConfig,
+		}, nil
+	}
+	return asynq.RedisClientOpt{
+		Addr:      opts.Addrs[0],
+		DB:        opts.DB,
+		Password:  opts.Password,
+		TLSConfig: opts.TLSConfig,
+	}, nil
 }
 
-//go:embed ui-assets/*
-var staticContents embed.FS
-
 func main() {
 	flag.Parse()
 
-	opts, err := getRedisOptionsFromFlags()
+	redisConnOpt, err := getRedisOptionsFromFlags()
 	if err != nil {
 		log.Fatal(err)
 	}
 
-	useRedisCluster := flagRedisClusterNodes != ""
-
-	var redisConnOpt asynq.RedisConnOpt
-	if useRedisCluster {
-		redisConnOpt = asynq.RedisClusterClientOpt{
-			Addrs:     opts.Addrs,
-			Password:  opts.Password,
-			TLSConfig: opts.TLSConfig,
-		}
-	} else {
-		redisConnOpt = asynq.RedisClientOpt{
-			Addr:      opts.Addrs[0],
-			DB:        opts.DB,
-			Password:  opts.Password,
-			TLSConfig: opts.TLSConfig,
-		}
-	}
-
 	h := asynqmon.New(asynqmon.Options{
 		RedisConnOpt: redisConnOpt,
 	})
 	defer h.Close()
 
-	r := mux.NewRouter()
-	r.PathPrefix("/api").Handler(h)
-	r.PathPrefix("/").Handler(&staticContentHandler{
-		contents:      staticContents,
-		staticDirPath: "ui-assets",
-		indexFileName: "index.html",
-	})
-
-	r.Use(loggingMiddleware)
-
 	c := cors.New(cors.Options{
 		AllowedMethods: []string{"GET", "POST", "DELETE"},
 	})
 
 	srv := &http.Server{
-		Handler:      c.Handler(r),
+		Handler:      c.Handler(h),
 		Addr:         fmt.Sprintf(":%d", flagPort),
 		WriteTimeout: 10 * time.Second,
 		ReadTimeout:  10 * time.Second,

cmd/asynqmon/static.go

@@ -1,58 +0,0 @@
-package main
-
-import (
-	"embed"
-	"errors"
-	"io/fs"
-	"net/http"
-	"path/filepath"
-)
-
-// staticFileServer implements the http.Handler interface, so we can use it
-// to respond to HTTP requests. The path to the static directory and
-// path to the index file within that static directory are used to
-// serve the SPA in the given static directory.
-type staticContentHandler struct {
-	contents      embed.FS
-	staticDirPath string
-	indexFileName string
-}
-
-// ServeHTTP inspects the URL path to locate a file within the static dir
-// on the SPA handler.
-// If path '/' is requested, it will serve the index file, otherwise it will
-// serve the file specified by the URL path.
-func (h *staticContentHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
-	// Get the absolute path to prevent directory traversal.
-	path, err := filepath.Abs(r.URL.Path)
-	if err != nil {
-		http.Error(w, err.Error(), http.StatusBadRequest)
-		return
-	}
-
-	if path == "/" {
-		path = h.indexFilePath()
-	} else {
-		path = filepath.Join(h.staticDirPath, path)
-	}
-
-	bytes, err := h.contents.ReadFile(path)
-	// If path is error (e.g. file not exist, path is a directory), serve index file.
-	var pathErr *fs.PathError
-	if errors.As(err, &pathErr) {
-		bytes, err = h.contents.ReadFile(h.indexFilePath())
-	}
-	if err != nil {
-		http.Error(w, err.Error(), http.StatusInternalServerError)
-		return
-	}
-
-	if _, err := w.Write(bytes); err != nil {
-		http.Error(w, err.Error(), http.StatusInternalServerError)
-		return
-	}
-}
-
-func (h *staticContentHandler) indexFilePath() string {
-	return filepath.Join(h.staticDirPath, h.indexFileName)
-}

conversion_helpers.go

@@ -14,15 +14,15 @@ import (
 //   - conversion function from an external type to an internal type
 // ****************************************************************************
 
-// PayloadFormatter can be used to convert payload bytes to string to show in web UI.
+// PayloadFormatter is used to convert payload bytes to string shown in the UI.
 type PayloadFormatter interface {
+	// FormatPayload takes the task's typename and payload and returns a string representation of the payload.
 	FormatPayload(taskType string, payload []byte) string
 }
 
-// PayloadFormatterFunc can be used to create a PayloadFormatter.
 type PayloadFormatterFunc func(string, []byte) string
 
-// FormatPayload returns the string representation of the payload of a type.
+// FormatPayload returns a string representation of the payload of the given taskType.
 func (f PayloadFormatterFunc) FormatPayload(taskType string, payload []byte) string {
 	return f(taskType, payload)
 }
@@ -407,8 +407,8 @@ type serverInfo struct {
 	Queues         map[string]int `json:"queue_priorities"`
 	StrictPriority bool           `json:"strict_priority_enabled"`
 	Started        string         `json:"start_time"`
-	Status         string        `json:"status"`
+	Status         string         `json:"status"`
-	ActiveWorkers  []*workerInfo `json:"active_workers"`
+	ActiveWorkers  []*workerInfo  `json:"active_workers"`
 }
 
 func toServerInfo(info *asynq.ServerInfo, pf PayloadFormatter) *serverInfo {

example_test.go

@@ -4,27 +4,16 @@ import (
 	"log"
 	"net/http"
 
-	"github.com/gorilla/mux"
-
 	"github.com/hibiken/asynq"
 	"github.com/hibiken/asynqmon"
 )
 
-func ExampleNew() {
+func ExampleHTTPHandler() {
 	h := asynqmon.New(asynqmon.Options{
+		RootPath:     "/monitoring",
 		RedisConnOpt: asynq.RedisClientOpt{Addr: ":6379"},
 	})
-	defer h.Close()
 
-	r := mux.NewRouter()
+	http.Handle(h.RootPath(), h)
-	r.PathPrefix("/api").Handler(h)
+	log.Fatal(http.ListenAndServe(":8000", nil)) // visit localhost:8000/monitoring to see asynqmon homepage
-	// Add static content handler or other handlers
-	// r.PathPrefix("/").Handler(h)
-
-	srv := &http.Server{
-		Handler: r,
-		Addr:    ":8080",
-	}
-
-	log.Fatal(srv.ListenAndServe())
 }

go.sum

@@ -1,15 +1,21 @@
+cloud.google.com/go v0.26.0 h1:e0WKqKTd5BnrG8aKH3J3h+QvEIQtSUcf2n5UZ5ZgLtQ=
 cloud.google.com/go v0.26.0/go.mod h1:aQUYkXzVsufM+DwF1aE+0xfcU+56JwCaLick0ClmMTw=
+github.com/BurntSushi/toml v0.3.1 h1:WXkYYl6Yr3qBf1K79EBnL4mak0OimBfB0XUf9Vl28OQ=
 github.com/BurntSushi/toml v0.3.1/go.mod h1:xHWCNGjB5oqiDr8zfno3MHue2Ht5sIBksp03qcyfWMU=
+github.com/census-instrumentation/opencensus-proto v0.2.1 h1:glEXhBS5PSLLv4IXzLA5yPRVX4bilULVyxxbrfOtDAk=
 github.com/census-instrumentation/opencensus-proto v0.2.1/go.mod h1:f6KPmirojxKA12rnyqOA5BBL4O983OfeGPqjHWSTneU=
 github.com/cespare/xxhash/v2 v2.1.1 h1:6MnRN8NT7+YBpUIWxHtefFZOKTAPgGjpQSxqLNn0+qY=
 github.com/cespare/xxhash/v2 v2.1.1/go.mod h1:VGX0DQ3Q6kWi7AoAeZDth3/j3BFtOZR5XLFGgcrjCOs=
+github.com/client9/misspell v0.3.4 h1:ta993UF76GwbvJcIo3Y68y/M3WxlpEHPWIGDkJYwzJI=
 github.com/client9/misspell v0.3.4/go.mod h1:qj6jICC3Q7zFZvVWo7KLAzC3yx5G7kyvSDkc90ppPyw=
 github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
 github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
 github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
 github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f h1:lO4WD4F/rVNCu3HqELle0jiPLLBs70cWOduZpkS1E78=
 github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f/go.mod h1:cuUVRXasLTGF7a8hSLbxyZXjz+1KgoB3wDUb6vlszIc=
+github.com/envoyproxy/go-control-plane v0.9.1-0.20191026205805-5f8ba28d4473 h1:4cmBvAEBNJaGARUEs3/suWRyfyBfhf7I60WBZq+bv2w=
 github.com/envoyproxy/go-control-plane v0.9.1-0.20191026205805-5f8ba28d4473/go.mod h1:YTl/9mNaCwkRvm6d1a2C3ymFceY/DCBVvsKhRF0iEA4=
+github.com/envoyproxy/protoc-gen-validate v0.1.0 h1:EQciDnbrYxy13PgWoY8AqoxGiPrpgBZ1R8UNe3ddc+A=
 github.com/envoyproxy/protoc-gen-validate v0.1.0/go.mod h1:iSmxcyjqTsJpI2R4NaDN7+kN2VEUnK/pcBlmesArF7c=
 github.com/fsnotify/fsnotify v1.4.7/go.mod h1:jwhsz4b93w/PPRr/qN1Yymfu8t87LnFCMoQvtojpjFo=
 github.com/fsnotify/fsnotify v1.4.9 h1:hsms1Qyu0jgnwNXIxa+/V/PDsU6CfLf6CNO8H7IWoS4=
@@ -17,8 +23,11 @@ github.com/fsnotify/fsnotify v1.4.9/go.mod h1:znqG4EE+3YCdAaPaxE2ZRY/06pZUdp0tY4
 github.com/go-redis/redis/v8 v8.11.2/go.mod h1:DLomh7y2e3ggQXQLd1YgmvIfecPJoFl7WU5SOQ/r06M=
 github.com/go-redis/redis/v8 v8.11.3 h1:GCjoYp8c+yQTJfc0n69iwSiHjvuAdruxl7elnZCxgt8=
 github.com/go-redis/redis/v8 v8.11.3/go.mod h1:xNJ9xDG09FsIPwh3bWdk+0oDWHbtF9rPN0F/oD9XeKc=
+github.com/go-task/slim-sprig v0.0.0-20210107165309-348f09dbbbc0 h1:p104kn46Q8WdvHunIJ9dAyjPVtrBPhSr3KT2yUst43I=
 github.com/go-task/slim-sprig v0.0.0-20210107165309-348f09dbbbc0/go.mod h1:fyg7847qk6SyHyPtNmDHnmrv/HOrqktSC+C9fM+CJOE=
+github.com/golang/glog v0.0.0-20160126235308-23def4e6c14b h1:VKtxabqXZkF25pY9ekfRL6a582T4P37/31XEstQ5p58=
 github.com/golang/glog v0.0.0-20160126235308-23def4e6c14b/go.mod h1:SBH7ygxi8pfUlaOkMMuAQtPIUF8ecWP5IEl/CR7VP2Q=
+github.com/golang/mock v1.1.1 h1:G5FRp8JnTd7RQH5kemVNlMeyXQAztQ3mOWV95KxsXH8=
 github.com/golang/mock v1.1.1/go.mod h1:oTYuIxOrZwtPieC+H1uAHpcLFnEyAGVDL/k47Jfbm0A=
 github.com/golang/protobuf v1.2.0/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
 github.com/golang/protobuf v1.3.2/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
@@ -46,9 +55,13 @@ github.com/gorilla/mux v1.8.0 h1:i40aqfkR1h2SlN9hojwV5ZA91wcXFOvkdNIeFDP5koI=
 github.com/gorilla/mux v1.8.0/go.mod h1:DVbg23sWSpFRCP0SfiEN6jmj59UnW/n46BH5rLB71So=
 github.com/hibiken/asynq v0.18.6 h1:pBjtGh2QhDe1+/0yaSc56ANpdQ77BQgVfMIrj+NJrUM=
 github.com/hibiken/asynq v0.18.6/go.mod h1:tyc63ojaW8SJ5SBm8mvI4DDONsguP5HE85EEl4Qr5Ig=
+github.com/hpcloud/tail v1.0.0 h1:nfCOvKYfkgYP8hkirhJocXT2+zOD8yUNjXaWfTlyFKI=
 github.com/hpcloud/tail v1.0.0/go.mod h1:ab1qPbhIpdTxEkNHXyeSf5vhxWSCs/tWer42PpOxQnU=
+github.com/kr/pretty v0.1.0 h1:L/CwN0zerZDmRFUapSPitk6f+Q3+0za1rQkzVuMiMFI=
 github.com/kr/pretty v0.1.0/go.mod h1:dAy3ld7l9f0ibDNOQOHHMYYIIbhfbHSm3C4ZsoJORNo=
+github.com/kr/pty v1.1.1 h1:VkoXIwSboBpnk99O/KFauAEILuNHv5DVFKZMBN/gUgw=
 github.com/kr/pty v1.1.1/go.mod h1:pFQYn66WHrOpPYNljwOMqo10TkYh1fy3cYio2l3bCsQ=
+github.com/kr/text v0.1.0 h1:45sCR5RtlFHMR4UwH9sdQ5TC8v0qDQCHnXt+kaKSTVE=
 github.com/kr/text v0.1.0/go.mod h1:4Jbv+DJW3UT/LiOwJeYQe1efqtUx/iVham/4vfdArNI=
 github.com/nxadm/tail v1.4.4/go.mod h1:kenIhsEOeOJmVchQTgglprH7qJGnHDVpk1VPCcaMI8A=
 github.com/nxadm/tail v1.4.8 h1:nPr65rt6Y5JFSKQO7qToXr7pePgD6Gwiw05lkbyAQTE=
@@ -65,6 +78,7 @@ github.com/onsi/gomega v1.15.0 h1:WjP/FQ/sk43MRmnEcT+MlDw2TFvkrXlprrPST/IudjU=
 github.com/onsi/gomega v1.15.0/go.mod h1:cIuvLEne0aoVhAgh/O6ac0Op8WWw9H6eYCriF+tEHG0=
 github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/prometheus/client_model v0.0.0-20190812154241-14fe0d1b01d4 h1:gQz4mCbXsO+nc9n1hCxHcGA3Zx3Eo+UHZoInFGUIXNM=
 github.com/prometheus/client_model v0.0.0-20190812154241-14fe0d1b01d4/go.mod h1:xMI15A0UPsDsEKsMN9yxemIoYk6Tm2C1GtYGdfGttqA=
 github.com/robfig/cron/v3 v3.0.1 h1:WdRxkvbJztn8LMz/QEvLN5sBU+xKpSqwwUO1Pjr4qDs=
 github.com/robfig/cron/v3 v3.0.1/go.mod h1:eQICP3HwyT7UooqI/z+Ov+PtYAWygg1TEWWzGIFLtro=
@@ -72,21 +86,27 @@ github.com/rs/cors v1.7.0 h1:+88SsELBHx5r+hZ8TCkggzSstaWNbDvThkVK8H6f9ik=
 github.com/rs/cors v1.7.0/go.mod h1:gFx+x8UowdsKA9AchylcLynDq+nNFfI8FkUZdN/jGCU=
 github.com/spf13/cast v1.3.1 h1:nFm6S0SMdyzrzcmThSipiEubIDy8WEXKNZ0UOgiRpng=
 github.com/spf13/cast v1.3.1/go.mod h1:Qx5cxh0v+4UWYiBimWS+eyWzqEqokIECu5etghLkUJE=
+github.com/stretchr/objx v0.1.0 h1:4G4v2dO3VZwixGIRoQ5Lfboy6nUhCyYzaqnIAPPhYs4=
 github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
 github.com/stretchr/testify v1.2.2/go.mod h1:a8OnRcib4nhh0OaRAV+Yts87kKdq0PP7pXfy6kDkUVs=
 github.com/stretchr/testify v1.5.1/go.mod h1:5W2xD1RspED5o8YsWQXVCued0rvSQ+mT+I5cxcmMvtA=
 github.com/stretchr/testify v1.6.1 h1:hDPOHmpOpP40lSULcqw7IrRb/u7w6RpDC9399XyoNd0=
 github.com/stretchr/testify v1.6.1/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
+github.com/yuin/goldmark v1.2.1 h1:ruQGxdhGHe7FWOJPT0mKs5+pD2Xs1Bm/kdGlHO04FmM=
 github.com/yuin/goldmark v1.2.1/go.mod h1:3hX8gzYuyVAZsxl0MRgGTJEmQBFcNTphYh9decYSb74=
 go.uber.org/goleak v0.10.0 h1:G3eWbSNIskeRqtsN/1uI5B+eP73y3JUuBsv9AZjehb4=
 go.uber.org/goleak v0.10.0/go.mod h1:VCZuO8V8mFPlL0F5J5GK1rtHV3DrFcQ1R8ryq7FK0aI=
 golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
 golang.org/x/crypto v0.0.0-20191011191535-87dc89f01550/go.mod h1:yigFU9vqHzYiE8UmvKecakEJjdnWj3jj499lnFckfCI=
+golang.org/x/crypto v0.0.0-20200622213623-75b288015ac9 h1:psW17arqaxU48Z5kZ0CQnkZWQJsqcURM6tKiBApRjXI=
 golang.org/x/crypto v0.0.0-20200622213623-75b288015ac9/go.mod h1:LzIPMQfyMNhhGPhUkYOs5KpL4U8rLKemX1yGLhDgUto=
+golang.org/x/exp v0.0.0-20190121172915-509febef88a4 h1:c2HOrn5iMezYjSlGPncknSEr/8x5LELb/ilJbXi9DEA=
 golang.org/x/exp v0.0.0-20190121172915-509febef88a4/go.mod h1:CJ0aWSM057203Lf6IL+f9T1iT9GByDxfZKAQTCR3kQA=
 golang.org/x/lint v0.0.0-20181026193005-c67002cb31c3/go.mod h1:UVdnD1Gm6xHRNCYTkRU2/jEulfH38KcIWyp/GAMgvoE=
 golang.org/x/lint v0.0.0-20190227174305-5b3e6a55c961/go.mod h1:wehouNa3lNwaWXcvxsM5YxQ5yQlVC4a0KAMCusXpPoU=
+golang.org/x/lint v0.0.0-20190313153728-d0100b6bd8b3 h1:XQyxROzUlZH+WIQwySDgnISgOivlhjIEwaQaJEJrrN0=
 golang.org/x/lint v0.0.0-20190313153728-d0100b6bd8b3/go.mod h1:6SW0HCj/g11FgYtHlgUYUwCkIfeOF89ocIRzGO/8vkc=
+golang.org/x/mod v0.3.0 h1:RM4zey1++hCTbCVQfnWeKs9/IEsaBLA8vTkd0WVtmH4=
 golang.org/x/mod v0.3.0/go.mod h1:s0Qsj1ACt9ePp/hMypM3fl4fZqREWJwdYDEqhRiZZUA=
 golang.org/x/net v0.0.0-20180724234803-3673e40ba225/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
 golang.org/x/net v0.0.0-20180826012351-8a410e7b638d/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
@@ -100,10 +120,12 @@ golang.org/x/net v0.0.0-20201021035429-f5854403a974/go.mod h1:sp8m0HH+o8qH0wwXwY
 golang.org/x/net v0.0.0-20201202161906-c7110b5ffcbb/go.mod h1:sp8m0HH+o8qH0wwXwYZr8TS3Oi6o0r6Gce1SSxlDquU=
 golang.org/x/net v0.0.0-20210428140749-89ef3d95e781 h1:DzZ89McO9/gWPsQXS/FVKAlG02ZjaQ6AlZRBimEYOd0=
 golang.org/x/net v0.0.0-20210428140749-89ef3d95e781/go.mod h1:OJAsFXCWl8Ukc7SiCT/9KSuxbyM7479/AVlXFRxuMCk=
+golang.org/x/oauth2 v0.0.0-20180821212333-d2e6202438be h1:vEDujvNQGv4jgYKudGeI/+DAX4Jffq6hpD55MmoEvKs=
 golang.org/x/oauth2 v0.0.0-20180821212333-d2e6202438be/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/sync v0.0.0-20180314180146-1d60e4601c6f/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.0.0-20181108010431-42b317875d0f/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
+golang.org/x/sync v0.0.0-20201020160332-67f06af15bc9 h1:SQFwaSi55rU7vdNs9Yr0Z324VNlrF+0wMqRXT4St8ck=
 golang.org/x/sync v0.0.0-20201020160332-67f06af15bc9/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sys v0.0.0-20180830151530-49385e6e1522/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
 golang.org/x/sys v0.0.0-20180909124046-d0be0721c37e/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
@@ -118,6 +140,7 @@ golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7w
 golang.org/x/sys v0.0.0-20210112080510-489259a85091/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20210423082822-04245dca01da h1:b3NXsE2LusjYGGjL5bxEVZZORm/YEFFrWFjR8eFrw/c=
 golang.org/x/sys v0.0.0-20210423082822-04245dca01da/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
+golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1 h1:v+OssWQX+hTHEmOBgwxdZxK4zHq3yOs8F9J7mk0PY8E=
 golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
 golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
 golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
@@ -131,6 +154,7 @@ golang.org/x/tools v0.0.0-20190226205152-f727befe758c/go.mod h1:9Yl7xja0Znq3iFh3
 golang.org/x/tools v0.0.0-20190311212946-11955173bddd/go.mod h1:LCzVGOaR6xXOjkQ3onu1FJEFr0SW1gC7cKk1uF8kGRs=
 golang.org/x/tools v0.0.0-20190524140312-2c0ae7006135/go.mod h1:RgjU9mgBXZiqYHBnxXauZ1Gv1EHHAz9KjViQ78xBX0Q=
 golang.org/x/tools v0.0.0-20191119224855-298f0cb1881e/go.mod h1:b+2E5dAYhXwXZwtnZ6UAqBI28+e2cm9otk0dWdXHAEo=
+golang.org/x/tools v0.0.0-20201224043029-2b0845dc783e h1:4nW4NLDYnU28ojHaHO8OVxFHk/aQ33U01a9cjED+pzE=
 golang.org/x/tools v0.0.0-20201224043029-2b0845dc783e/go.mod h1:emZCQorbCU4vsT4fOWvOPXz4eW1wZW4PmDk9uLelYpA=
 golang.org/x/xerrors v0.0.0-20190717185122-a985d3407aa7/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
 golang.org/x/xerrors v0.0.0-20191011141410-1b5146add898/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
@@ -138,12 +162,15 @@ golang.org/x/xerrors v0.0.0-20191204190536-9bdfabe68543/go.mod h1:I/5z698sn9Ka8T
 golang.org/x/xerrors v0.0.0-20200804184101-5ec99f83aff1 h1:go1bK/D/BFZV2I8cIQd1NKEZ+0owSTG1fDTci4IqFcE=
 golang.org/x/xerrors v0.0.0-20200804184101-5ec99f83aff1/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
 google.golang.org/appengine v1.1.0/go.mod h1:EbEs0AVv82hx2wNQdGPgUI5lhzA/G0D9YwlJXL52JkM=
+google.golang.org/appengine v1.4.0 h1:/wp5JvzpHIxhs/dumFmF7BXTf3Z+dd4uXta4kVyO508=
 google.golang.org/appengine v1.4.0/go.mod h1:xpcJRLb0r/rnEns0DIKYYv+WjYCduHsrkT7/EB5XEv4=
 google.golang.org/genproto v0.0.0-20180817151627-c66870c02cf8/go.mod h1:JiN7NxoALGmiZfu7CAH4rXhgtRTLTxftemlI0sWmxmc=
 google.golang.org/genproto v0.0.0-20190819201941-24fa4b261c55/go.mod h1:DMBHOl98Agz4BDEuKkezgsaosCRResVns1a3J2ZsMNc=
+google.golang.org/genproto v0.0.0-20200526211855-cb27e3aa2013 h1:+kGHl1aib/qcwaRi1CbqBZ1rk19r85MNUf8HaBghugY=
 google.golang.org/genproto v0.0.0-20200526211855-cb27e3aa2013/go.mod h1:NbSheEEYHJ7i3ixzK3sjbqSGDJWnxyFXZblF3eUsNvo=
 google.golang.org/grpc v1.19.0/go.mod h1:mqu4LbDTu4XGKhr4mRzUsmM4RtVoemTSY81AxZiDr8c=
 google.golang.org/grpc v1.23.0/go.mod h1:Y5yQAOtifL1yxbo5wqy6BxZv8vAUGQwXBOALyacEbxg=
+google.golang.org/grpc v1.27.0 h1:rRYRFMVgRv6E0D70Skyfsr28tDXIuuPZyWGMPdMcnXg=
 google.golang.org/grpc v1.27.0/go.mod h1:qbnxyOmOxrQa7FizSgH+ReBfzJrCY1pSN7KXBS8abTk=
 google.golang.org/protobuf v0.0.0-20200109180630-ec00e32a8dfd/go.mod h1:DFci5gLYBciE7Vtevhsrf46CRTquxDuWsQurQQe4oz8=
 google.golang.org/protobuf v0.0.0-20200221191635-4d8936d0db64/go.mod h1:kwYJMbMJ01Woi6D6+Kah6886xMZcty6N08ah7+eCXa0=
@@ -158,7 +185,9 @@ google.golang.org/protobuf v1.26.0-rc.1/go.mod h1:jlhhOSvTdKEhbULTjvd4ARK9grFBp0
 google.golang.org/protobuf v1.26.0 h1:bxAC2xTBsZGibn2RTntX0oH50xLsqy1OxA9tTL3p/lk=
 google.golang.org/protobuf v1.26.0/go.mod h1:9q0QmTI4eRPtz6boOQmLYwt+qCgq0jsYwAQnmE0givc=
 gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
+gopkg.in/check.v1 v1.0.0-20190902080502-41f04d3bba15 h1:YR8cESwS4TdDjEe65xsg0ogRM/Nc3DYOhEAlW+xobZo=
 gopkg.in/check.v1 v1.0.0-20190902080502-41f04d3bba15/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
+gopkg.in/fsnotify.v1 v1.4.7 h1:xOHLXZwVvI9hhs+cLKq5+I5onOuwQLhQwiu63xxlHs4=
 gopkg.in/fsnotify.v1 v1.4.7/go.mod h1:Tz8NjZHkW78fSQdbUxIjBTcgA1z1m8ZHf0WmKUhAMys=
 gopkg.in/tomb.v1 v1.0.0-20141024135613-dd632973f1e7 h1:uRGJdciOHaEIrze2W8Q3AKkepLTh2hOroT7a+7czfdQ=
 gopkg.in/tomb.v1 v1.0.0-20141024135613-dd632973f1e7/go.mod h1:dt/ZhP58zS4L8KSrWDmTeBkI65Dw0HsyUHuEVlX15mw=
@@ -170,4 +199,5 @@ gopkg.in/yaml.v2 v2.4.0/go.mod h1:RDklbk79AGWmwhnvt/jBztapEOGDOx6ZbXqjP6csGnQ=
 gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c h1:dUUwHk2QECo/6vqA44rthZ8ie2QXMNeKRTHCNY2nXvo=
 gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
 honnef.co/go/tools v0.0.0-20190102054323-c2f93a96b099/go.mod h1:rf3lG4BRIbNafJWhAfAdb/ePZxsR/4RtNHQocxwk9r4=
+honnef.co/go/tools v0.0.0-20190523083050-ea95bdfd59fc h1:/hemPrYIhOhy8zYrNj+069zDB68us2sMGsfkFJO0iZs=
 honnef.co/go/tools v0.0.0-20190523083050-ea95bdfd59fc/go.mod h1:rf3lG4BRIbNafJWhAfAdb/ePZxsR/4RtNHQocxwk9r4=

handler.go

@@ -1,8 +1,10 @@
 package asynqmon
 
 import (
+	"embed"
 	"fmt"
 	"net/http"
+	"strings"
 
 	"github.com/go-redis/redis/v8"
 	"github.com/gorilla/mux"
@@ -10,48 +12,81 @@ import (
 	"github.com/hibiken/asynq"
 )
 
-// Options can be used to customise HTTPHandler.
+// Options is used to configure HTTPHandler.
 type Options struct {
-	// RedisConnOpt is a discriminated union of types that represent Redis connection configuration option.
+	// URL path the handler is responsible for.
-	RedisConnOpt         asynq.RedisConnOpt
+	// The path is used for the homepage of asynqmon, and every other page is rooted in this subtree.
-	// PayloadFormatter can be used to convert payload bytes to string to show in web UI.
+	//
-	PayloadFormatter     PayloadFormatter
+	// This field is optional. Default is "/".
+	RootPath string
+
+	// RedisConnOpt specifies the connection to a redis-server or redis-cluster.
+	//
+	// This field is required.
+	RedisConnOpt asynq.RedisConnOpt
+
+	// PayloadFormatter is used to convert payload bytes to string shown in the UI.
+	//
+	// This field is optional.
+	PayloadFormatter PayloadFormatter
 }
 
-// HTTPHandler can serve the API and UI required for asynq monitoring.
+// HTTPHandler is a http.Handler for asynqmon application.
 type HTTPHandler struct {
-	router  *mux.Router
+	router   *mux.Router
-	closers []func() error
+	closers  []func() error
+	rootPath string // the value should not have the trailing slash
 }
 
-// ServeHTTP will serve the API request as well as any static resources.
+func (h *HTTPHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
-func (a *HTTPHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	h.router.ServeHTTP(w, r)
-	a.router.ServeHTTP(w, r)
 }
 
-// New creates an HTTPHandler that can be used to serve asynqmon web API, it is prefixed with `/api`.
+// New creates a HTTPHandler with the given options.
 func New(opts Options) *HTTPHandler {
+	if opts.RedisConnOpt == nil {
+		panic("asynqmon.New: RedisConnOpt field is required")
+	}
 	rc, ok := opts.RedisConnOpt.MakeRedisClient().(redis.UniversalClient)
 	if !ok {
-		panic(fmt.Sprintf("asnyqmon.HTTPHandler: unsupported RedisConnOpt type %T", opts.RedisConnOpt))
+		panic(fmt.Sprintf("asnyqmon.New: unsupported RedisConnOpt type %T", opts.RedisConnOpt))
 	}
 	i := asynq.NewInspector(opts.RedisConnOpt)
-	return &HTTPHandler{router: muxRouter(opts, rc, i), closers: []func() error{rc.Close, i.Close}}
+
+	// Make sure that RootPath starts with a slash if provided.
+	if opts.RootPath != "" && !strings.HasPrefix(opts.RootPath, "/") {
+		panic(fmt.Sprintf("asynqmon.New: RootPath must start with a slash"))
+	}
+	// Remove tailing slash from RootPath.
+	opts.RootPath = strings.TrimSuffix(opts.RootPath, "/")
+
+	return &HTTPHandler{
+		router:   muxRouter(opts, rc, i),
+		closers:  []func() error{rc.Close, i.Close},
+		rootPath: opts.RootPath,
+	}
 }
 
-// Close will close connections to redis.
+// Close closes connections to redis.
-func (a *HTTPHandler) Close() error {
+func (h *HTTPHandler) Close() error {
-	for _, f := range a.closers {
+	for _, f := range h.closers {
 		if err := f(); err != nil {
 			return err
 		}
 	}
-
 	return nil
 }
 
+// RootPath returns the root URL path used for asynqmon application.
+func (h *HTTPHandler) RootPath() string {
+	return h.rootPath + "/"
+}
+
+//go:embed ui/build/*
+var staticContents embed.FS
+
 func muxRouter(opts Options, rc redis.UniversalClient, inspector *asynq.Inspector) *mux.Router {
-	router := mux.NewRouter()
+	router := mux.NewRouter().PathPrefix(opts.RootPath).Subrouter()
 
 	var pf PayloadFormatter = defaultPayloadFormatter
 	if opts.PayloadFormatter != nil {
@@ -130,5 +165,12 @@ func muxRouter(opts Options, rc redis.UniversalClient, inspector *asynq.Inspecto
 		api.HandleFunc("/redis_info", newRedisInfoHandlerFunc(c)).Methods("GET")
 	}
 
+	// Everything else, route to uiAssetsHandler.
+	router.NotFoundHandler = &uiAssetsHandler{
+		rootPath:      opts.RootPath,
+		contents:      staticContents,
+		staticDirPath: "ui/build",
+		indexFileName: "index.html",
+	}
 	return router
 }

static.go

@@ -0,0 +1,100 @@
+package asynqmon
+
+import (
+	"embed"
+	"errors"
+	"html/template"
+	"io/fs"
+	"net/http"
+	"path/filepath"
+	"strings"
+)
+
+// uiAssetsHandler is a http.Handler.
+// The path to the static file directory and
+// the path to the index file within that static directory are used to
+// serve the SPA.
+type uiAssetsHandler struct {
+	rootPath      string
+	contents      embed.FS
+	staticDirPath string
+	indexFileName string
+}
+
+// ServeHTTP inspects the URL path to locate a file within the static dir
+// on the SPA handler.
+// If path '/' is requested, it will serve the index file, otherwise it will
+// serve the file specified by the URL path.
+func (h *uiAssetsHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	// Get the absolute path to prevent directory traversal.
+	path, err := filepath.Abs(r.URL.Path)
+	if err != nil {
+		http.Error(w, err.Error(), http.StatusBadRequest)
+		return
+	}
+
+	// Get the path relative to the root path.
+	if !strings.HasPrefix(path, h.rootPath) {
+		http.Error(w, "unexpected path prefix", http.StatusBadRequest)
+		return
+	}
+	path = strings.TrimPrefix(path, h.rootPath)
+
+	if code, err := h.serveFile(w, path); err != nil {
+		http.Error(w, err.Error(), code)
+		return
+	}
+}
+
+func (h *uiAssetsHandler) indexFilePath() string {
+	return filepath.Join(h.staticDirPath, h.indexFileName)
+}
+
+func (h *uiAssetsHandler) renderIndexFile(w http.ResponseWriter) error {
+	// Note: Replace the default delimiter ("{{") with a custom one
+	// since webpack escapes the '{' character when it compiles the index.html file.
+	// See the "homepage" field in package.json.
+	tmpl, err := template.New(h.indexFileName).Delims("/[[", "]]").ParseFS(h.contents, h.indexFilePath())
+	if err != nil {
+		return err
+	}
+	data := struct {
+		RootPath string
+	}{
+		RootPath: h.rootPath,
+	}
+	return tmpl.Execute(w, data)
+}
+
+// serveFile writes file requested at path and returns http status code and error if any.
+// If requested path is root, it serves the index file.
+// Otherwise, it looks for file requiested in the static content filesystem
+// and serves if a file is found.
+// If a requested file is not found in the filesystem, it serves the index file to
+// make sure when user refreshes the page in SPA things still work.
+func (h *uiAssetsHandler) serveFile(w http.ResponseWriter, path string) (code int, err error) {
+	if path == "/" || path == "" {
+		if err := h.renderIndexFile(w); err != nil {
+			return http.StatusInternalServerError, err
+		}
+		return http.StatusOK, nil
+	}
+	path = filepath.Join(h.staticDirPath, path)
+	bytes, err := h.contents.ReadFile(path)
+	if err != nil {
+		// If path is error (e.g. file not exist, path is a directory), serve index file.
+		var pathErr *fs.PathError
+		if errors.As(err, &pathErr) {
+			if err := h.renderIndexFile(w); err != nil {
+				return http.StatusInternalServerError, err
+			}
+			return http.StatusOK, nil
+		}
+		return http.StatusInternalServerError, err
+	}
+
+	if _, err := w.Write(bytes); err != nil {
+		return http.StatusInternalServerError, err
+	}
+	return http.StatusOK, nil
+}

ui/.gitignore

@@ -8,9 +8,6 @@
 # testing
 /coverage
 
-# production
-/build
-
 # misc
 .DS_Store
 .env.local

ui/build/asset-manifest.json

@@ -0,0 +1,17 @@
+{
+  "files": {
+    "main.js": "/[[.RootPath]]/static/js/main.090c4a40.chunk.js",
+    "main.js.map": "/[[.RootPath]]/static/js/main.090c4a40.chunk.js.map",
+    "runtime-main.js": "/[[.RootPath]]/static/js/runtime-main.9fea6c1a.js",
+    "runtime-main.js.map": "/[[.RootPath]]/static/js/runtime-main.9fea6c1a.js.map",
+    "static/js/2.980b0c32.chunk.js": "/[[.RootPath]]/static/js/2.980b0c32.chunk.js",
+    "static/js/2.980b0c32.chunk.js.map": "/[[.RootPath]]/static/js/2.980b0c32.chunk.js.map",
+    "index.html": "/[[.RootPath]]/index.html",
+    "static/js/2.980b0c32.chunk.js.LICENSE.txt": "/[[.RootPath]]/static/js/2.980b0c32.chunk.js.LICENSE.txt"
+  },
+  "entrypoints": [
+    "static/js/runtime-main.9fea6c1a.js",
+    "static/js/2.980b0c32.chunk.js",
+    "static/js/main.090c4a40.chunk.js"
+  ]
+}

ui/build/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" type="image/png" href="/[[.RootPath]]/favicon.ico"/><link rel="icon" type="image/png" sizes="32x32" href="/[[.RootPath]]/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/[[.RootPath]]/favicon-16x16.png"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Asynq monitoring web console"/><link rel="apple-touch-icon" sizes="180x180" href="/[[.RootPath]]/apple-touch-icon.png"/><link rel="manifest" href="/[[.RootPath]]/manifest.json"/><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"/><link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/><script>window.ROOT_PATH=/[[.RootPath]];</script><title>Asynq - Monitoring</title></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function t(t){for(var n,i,l=t[0],a=t[1],f=t[2],c=0,s=[];c<l.length;c++)i=l[c],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&s.push(o[i][0]),o[i]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(p&&p(t);s.length;)s.shift()();return u.push.apply(u,f||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,l=1;l<r.length;l++){var a=r[l];0!==o[a]&&(n=!1)}n&&(u.splice(t--,1),e=i(i.s=r[0]))}return e}var n={},o={1:0},u=[];function i(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=e,i.c=n,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)i.d(r,n,function(t){return e[t]}.bind(null,n));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="/[[.RootPath]]/";var l=this.webpackJsonpui=this.webpackJsonpui||[],a=l.push.bind(l);l.push=t,l=l.slice();for(var f=0;f<l.length;f++)t(l[f]);var p=a;r()}([])</script><script src="/[[.RootPath]]/static/js/2.980b0c32.chunk.js"></script><script src="/[[.RootPath]]/static/js/main.090c4a40.chunk.js"></script></body></html>

ui/build/manifest.json

@@ -0,0 +1,19 @@
+{
+  "name": "Asynq Monitoring",
+  "short_name": "Asynqmon",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

ui/build/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

ui/build/static/js/2.980b0c32.chunk.js.LICENSE.txt

@@ -0,0 +1,253 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+
+/*!
+  Copyright (c) 2017 Jed Watson.
+  Licensed under the MIT License (MIT), see
+  http://jedwatson.github.io/classnames
+*/
+
+/*! Conditions:: INITIAL */
+
+/*! Production::    $accept : expression $end */
+
+/*! Production::    css_value : ANGLE */
+
+/*! Production::    css_value : CHS */
+
+/*! Production::    css_value : EMS */
+
+/*! Production::    css_value : EXS */
+
+/*! Production::    css_value : FREQ */
+
+/*! Production::    css_value : LENGTH */
+
+/*! Production::    css_value : PERCENTAGE */
+
+/*! Production::    css_value : REMS */
+
+/*! Production::    css_value : RES */
+
+/*! Production::    css_value : SUB css_value */
+
+/*! Production::    css_value : TIME */
+
+/*! Production::    css_value : VHS */
+
+/*! Production::    css_value : VMAXS */
+
+/*! Production::    css_value : VMINS */
+
+/*! Production::    css_value : VWS */
+
+/*! Production::    css_variable : CSS_VAR LPAREN CSS_CPROP COMMA math_expression RPAREN */
+
+/*! Production::    css_variable : CSS_VAR LPAREN CSS_CPROP RPAREN */
+
+/*! Production::    expression : math_expression EOF */
+
+/*! Production::    math_expression : LPAREN math_expression RPAREN */
+
+/*! Production::    math_expression : NESTED_CALC LPAREN math_expression RPAREN */
+
+/*! Production::    math_expression : SUB PREFIX SUB NESTED_CALC LPAREN math_expression RPAREN */
+
+/*! Production::    math_expression : css_value */
+
+/*! Production::    math_expression : css_variable */
+
+/*! Production::    math_expression : math_expression ADD math_expression */
+
+/*! Production::    math_expression : math_expression DIV math_expression */
+
+/*! Production::    math_expression : math_expression MUL math_expression */
+
+/*! Production::    math_expression : math_expression SUB math_expression */
+
+/*! Production::    math_expression : value */
+
+/*! Production::    value : NUMBER */
+
+/*! Production::    value : SUB NUMBER */
+
+/*! Rule::       $ */
+
+/*! Rule::       (--[0-9a-z-A-Z-]*) */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)% */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)Hz\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)ch\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)cm\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)deg\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)dpcm\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)dpi\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)dppx\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)em\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)ex\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)grad\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)in\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)kHz\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)mm\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)ms\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)pc\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)pt\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)px\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)rad\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)rem\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)s\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)turn\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)vh\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)vmax\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)vmin\b */
+
+/*! Rule::       ([0-9]+(\.[0-9]*)?|\.[0-9]+)vw\b */
+
+/*! Rule::       ([a-z]+) */
+
+/*! Rule::       (calc) */
+
+/*! Rule::       (var) */
+
+/*! Rule::       , */
+
+/*! Rule::       - */
+
+/*! Rule::       \( */
+
+/*! Rule::       \) */
+
+/*! Rule::       \* */
+
+/*! Rule::       \+ */
+
+/*! Rule::       \/ */
+
+/*! Rule::       \s+ */
+
+/*! decimal.js-light v2.5.1 https://github.com/MikeMcl/decimal.js-light/LICENCE */
+
+/**
+ * A better abstraction over CSS.
+ *
+ * @copyright Oleg Isonen (Slobodskoi) / Isonen 2014-present
+ * @website https://github.com/cssinjs/jss
+ * @license MIT
+ */
+
+/** @license React v0.19.1
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.10.2
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v17.0.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**!
+ * @fileOverview Kickass library to create and place poppers near their reference elements.
+ * @version 1.16.1-lts
+ * @license
+ * Copyright (c) 2016 Federico Zivolo and contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */

ui/build/static/js/runtime-main.9fea6c1a.js

@@ -0,0 +1,2 @@
+!function(e){function t(t){for(var n,i,l=t[0],a=t[1],f=t[2],c=0,s=[];c<l.length;c++)i=l[c],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&s.push(o[i][0]),o[i]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(p&&p(t);s.length;)s.shift()();return u.push.apply(u,f||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,l=1;l<r.length;l++){var a=r[l];0!==o[a]&&(n=!1)}n&&(u.splice(t--,1),e=i(i.s=r[0]))}return e}var n={},o={1:0},u=[];function i(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=e,i.c=n,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)i.d(r,n,function(t){return e[t]}.bind(null,n));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="/[[.RootPath]]/";var l=this.webpackJsonpui=this.webpackJsonpui||[],a=l.push.bind(l);l.push=t,l=l.slice();for(var f=0;f<l.length;f++)t(l[f]);var p=a;r()}([]);
+//# sourceMappingURL=runtime-main.9fea6c1a.js.map

ui/package.json

@@ -55,5 +55,6 @@
   },
   "devDependencies": {
     "redux-devtools": "3.7.0"
-  }
+  },
+  "homepage": "/[[.RootPath]]"
 }

ui/public/index.html

@@ -1,3 +1,7 @@
+<!--
+  This file is used as a template for go's html/template package.
+  Use delimiter "/[[", "]]" to denote actions.
+-->
 <!DOCTYPE html>
 <html lang="en">
   <head>
@@ -45,6 +49,9 @@
       rel="stylesheet"
       href="https://fonts.googleapis.com/icon?family=Material+Icons"
     />
+    <script>
+      window.ROOT_PATH=/[[.RootPath]];
+    </script>
     <title>Asynq - Monitoring</title>
   </head>
   <body>

ui/src/api.ts

@@ -5,7 +5,7 @@ import queryString from "query-string";
 // the static file server.
 // In developement, we assume that the API server is listening on port 8080.
 const BASE_URL =
-  process.env.NODE_ENV === "production" ? "/api" : "http://localhost:8080/api";
+  process.env.NODE_ENV === "production" ? `${window.ROOT_PATH}/api` : `http://localhost:8080${window.ROOT_PATH}/api`;
 
 export interface ListQueuesResponse {
   queues: Queue[];

ui/src/global.d.ts

@@ -0,0 +1,5 @@
+interface Window {
+  // Root URL path for asynqmon app.
+  // ROOT_PATH should not have the tailing slash.
+  ROOT_PATH: string;
+}

ui/src/paths.ts

@@ -1,11 +1,11 @@
 export const paths = {
-  HOME: "/",
+  HOME: `${window.ROOT_PATH}/`,
-  SETTINGS: "/settings",
+  SETTINGS: `${window.ROOT_PATH}/settings`,
-  SERVERS: "/servers",
+  SERVERS: `${window.ROOT_PATH}/servers`,
-  SCHEDULERS: "/schedulers",
+  SCHEDULERS: `${window.ROOT_PATH}/schedulers`,
-  QUEUE_DETAILS: "/queues/:qname",
+  QUEUE_DETAILS: `${window.ROOT_PATH}/queues/:qname`,
-  REDIS: "/redis",
+  REDIS: `${window.ROOT_PATH}/redis`,
-  TASK_DETAILS: "/queues/:qname/tasks/:taskId",
+  TASK_DETAILS: `${window.ROOT_PATH}/queues/:qname/tasks/:taskId`,
 };
 
 /**************************************************************