UI update show (flipt-io#650)

* WIP

* Update Dockerfile

* Add Footer wip; recommended extentions

* use npx

* Update devcontainer

* Go tools devcontainer

* Fix dockerfile

* WIP

* sticky footer; wip add version to nav

* Add link to release if not dev version; show version in navbar

* WIP

* Version/commit in header nav

* WIP

* Getting versions and updates to show in UI; introduce vuex

* Fix version shenangians, use modd

* Fix IT

* little cleanup

* version

* Only populate info with versions if release

.devcontainer/devcontainer.json

@@ -10,7 +10,10 @@
   "settings": {
     "go.toolsManagement.checkForUpdates": "local",
     "go.gopath": "/go",
-    "go.useLanguageServer": true
+    "go.useLanguageServer": true,
+    "go.formatTool": "goimports",
+    "go.lintTool": "golangci-lint",
+    "go.lintFlags": ["--fast"]
   },
   // Add the IDs of extensions you want installed when the container is created.
   "extensions": [
@@ -19,7 +22,6 @@
     "dbaeumer.vscode-eslint",
     "octref.vetur",
     "zxh404.vscode-proto3",
-    "vsls-contrib.codetour",
     "esbenp.prettier-vscode"
   ],
   // Use 'forwardPorts' to make a list of ports inside the container available locally.
@@ -37,7 +39,7 @@
       "label": "GRPC Port",
       "onAutoForward": "notify"
     }
-  },
+  }
   // Uncomment the next line to run commands after the container is created - for example installing curl.
   // "postCreateCommand": "apt-get update && apt-get install -y curl",
   // Uncomment when using a ptrace-based debugger like C++, Go, and Rust
@@ -46,4 +48,4 @@
   // "mounts": [ "source=/var/run/docker.sock,target=/var/run/docker.sock,type=bind" ],
   // Uncomment to connect as a non-root user if you've added one. See https://aka.ms/vscode-remote/containers/non-root.
   // "remoteUser": "vscode"
-}
+}

.gitignore

@@ -13,6 +13,7 @@ _test
 .vscode/*
 !.vscode/launch.json
 !.vscode/tasks.json
+!.vscode/extensions.json
 *.cov
 *.log
 *.out

.tool-versions

@@ -0,0 +1,2 @@
+golang 1.17.6
+nodejs 16.13.2

.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+    "recommendations": [
+        "mutantdino.resourcemonitor",
+        "eamodio.gitlens",
+        "vsls-contrib.codetour",
+        "github.vscode-pull-request-github"
+    ]
+}

DEVELOPMENT.md

@@ -11,14 +11,15 @@ Before starting, make sure you have the following installed:
 - [Go 1.16+](https://golang.org/doc/install)
 - [Buf](https://docs.buf.build/introduction)
 - [Protoc Compiler](https://github.com/protocolbuffers/protobuf)
+- [NodeJS >= 16](https://nodejs.org/en/)
+- [Yarn](https://yarnpkg.com/en/)
 
 ## Setup
 
 1. Clone this repo: `git clone https://github.com/markphelps/flipt`
 1. Run `make bootstrap` to install required development tools
 1. Run `make test` to execute the test suite
-1. Run `make server` to build and run the server locally
-1. Run `cd ui && yarn run dev` to build and run the ui dev server
+1. Run `modd` to run the server and ui in development mode.
 1. Run `make help` to see a full list of possible make commands
 
 ## Go
@@ -55,7 +56,7 @@ The UI is built using [Yarn](https://yarnpkg.com/en/) and [webpack](https://webp
 
 The [ui/README.md](https://github.com/markphelps/flipt/tree/master/ui/README.md) has more information on how to build the UI and also how to run it locally during development.
 
-## Remote Containers
+## Remote Containers/GitHub Codespaces
 
 Flipt now supports [VSCode Remote Containers](https://github.com/Microsoft/vscode-dev-containers)/[GitHub Codespaces](https://github.com/features/codespaces).
 
@@ -67,10 +68,14 @@ If you have access to [GitHub Codespaces](https://github.com/features/codespaces
 
 ### Building/Running
 
-Regardless of whether you are using Remote Containers or GitHub Codespaces, you'll need to run a couple tasks to successfully build/run Flipt in these environments.
+Flipt uses [modd](https://github.com/cortesi/modd) for managing processes during development.
 
-Then run the [Server/Client](.vscode/launch.json) run command to start the server and client.
+Run `modd` from the project root. This will intelligently rebuild/restart the backend server if any `*.go` files change which is helpful while developing. See [modd.conf](modd.conf) for configuration.
 
-This should publish three ports `8080`, `8081`, `9000`.
+The `webpack-dev-server` that is used when running the UI in development mode will also rebuild the UI assets when applicable files in the `ui` folder change. See [ui/README.md](https://github.com/markphelps/flipt/tree/master/ui/README.md) for more info.
+
+### Ports
+
+The three ports `8080`, `8081`, `9000` will be forwarded to your local machine automatically.
 
 `8081` is the UI dev port that runs the `yarn dev server` that you can open in your browser.

Dockerfile

@@ -3,7 +3,11 @@ ARG GO_VERSION=1.16
 FROM golang:${GO_VERSION}
 
 RUN apt-get update && \
-    apt-get install -y curl gnupg sudo \
+    apt-get -y install --no-install-recommends \
+    curl \
+    gnupg \ 
+    sudo \
+    openssh-server \
     postgresql-client
 
 RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add - && \

Makefile

@@ -77,7 +77,7 @@ build: clean assets ## Build a local copy
 server: clean  ## Build and run in server mode
 	@echo ">> building and running in server mode"
 	@echo "  ⚠️  ui must be run in another process  ⚠️"
-	go run ./cmd/$(PROJECT)/. --config ./config/local.yml --force-migrate
+	go run -ldflags "-X main.commit=$(commit-hash)" ./cmd/$(PROJECT)/. --config ./config/local.yml --force-migrate
 
 .PHONY: snapshot
 snapshot: clean assets ## Build a snapshot version

_tools/go.mod

@@ -4,6 +4,7 @@ go 1.16
 
 require (
 	github.com/buchanae/github-release-notes v0.0.0-20180827045457-200e1dacadbb
+	github.com/cortesi/modd v0.0.0-20211215124449-6083f9d1c171
 	github.com/golangci/golangci-lint v1.43.0
 	github.com/google/go-github v17.0.0+incompatible // indirect
 	github.com/google/go-querystring v1.1.0 // indirect