Merge pull request 'Design fixes for dark mode' (#34) from design-fixes into master

Reviewed-on: #34

.dockerignore

@@ -8,3 +8,4 @@ config.example.json
 .vscode/
 budgeteer
 budgeteer.exe
+**/node_modules/

.drone.yml

@@ -4,10 +4,23 @@ type: docker
 name: budgeteer
 
 steps:
-- name: Taskfile.dev
+- name: Taskfile.dev PR
   image: hub.javil.eu/budgeteer:dev
   commands:
-    - task build
+    - task ci
+  when:
+    event:
+    - pull_request
+
+- name: Taskfile.dev
+  image: hub.javil.eu/budgeteer:dev
+  pull: always
+  commands:
+    - task ci
+  when:
+    event:
+      exclude:
+      - pull_request
 
 - name: docker  
   image: plugins/docker
@@ -23,10 +36,26 @@ steps:
     tags: 
       - latest
   when:
+    branch:
+    - master
     event:
-      exclude:
-      - pull_request
+    - push
 
+- name: docker tag
+  image: plugins/docker
+  settings:
+    registry: hub.javil.eu
+    username: 
+      from_secret: docker_user
+    password:
+      from_secret: docker_password
+    repo: hub.javil.eu/budgeteer
+    context: build
+    dockerfile: build/Dockerfile
+    auto_tag: true
+  when:
+    event:
+    - tag
 
 image_pull_secrets:
 - hub.javil.eu 

.golangci.yml

@@ -0,0 +1,27 @@
+linters:
+  enable-all: true
+  disable:
+    - golint
+    - scopelint
+    - maligned
+    - interfacer
+    - wsl
+    - forbidigo
+    - nlreturn
+    - testpackage
+    - ifshort
+    - exhaustivestruct
+    - gci # not working, shows errors on freshly formatted file
+    - varnamelen
+    - lll
+linters-settings:
+  errcheck:
+    exclude-functions:
+      - io/ioutil.ReadFile
+      - io.Copy(*bytes.Buffer)
+      - (*github.com/gin-gonic/gin.Context).AbortWithError
+      - (*github.com/gin-gonic/gin.Context).AbortWithError
+      - io.Copy(os.Stdout)
+  varnamelen:
+    ignore-decls:
+      - c *gin.Context

.vscode/settings.json

@@ -2,5 +2,8 @@
         "files.exclude": {
                 "**/node_modules": true,
                 "**/vendor": true
+        },
+        "gopls": {
+                "formatting.gofumpt": true,
         }
 }

.woodpecker.yml

@@ -0,0 +1,23 @@
+pipeline:
+  build:
+    name: Taskfile.dev
+    image: hub.javil.eu/budgeteer:dev
+    pull: true
+    commands:
+      - task ci
+
+  docker:
+    image: plugins/docker
+    secrets: [ docker_username, docker_password ]
+    settings:
+      registry: hub.javil.eu
+      repo: hub.javil.eu/budgeteer
+      context: build
+      dockerfile: build/Dockerfile
+      tags: 
+        - latest
+    when:
+      event: [push, tag, deployment]
+
+image_pull_secrets:
+- hub.javil.eu 

Earthfile

@@ -12,7 +12,7 @@ docker:
 	WORKDIR /app
 	COPY +build/budgeteer .
 	ENTRYPOINT ["/app/budgeteer"]
-	SAVE IMAGE budgeteer:latest
+	SAVE IMAGE hub.javil.eu/budgeteer:latest
 
 run:
 	LOCALLY

Taskfile.yml

@@ -1,9 +1,12 @@
 version: '3'
 
+vars:
+  IMAGE_NAME: hub.javil.eu/budgeteer
+
 tasks:
   default:
     cmds:
-      - task: build
+      - task: build-prod
 
   sqlc:
     desc: sqlc code generation
@@ -30,12 +33,7 @@ tasks:
     sources:
       - ./go.mod
       - ./go.sum
-      - ./cmd/budgeteer/*.go
-      - ./*.go
-      - ./config/*.go
-      - ./http/*.go
-      - ./jwt/*.go
-      - ./postgres/*.go
+      - ./**/*.go
       - ./web/dist/**/*
       - ./postgres/schema/*
     generates:
@@ -49,31 +47,57 @@ tasks:
     desc: Build budgeteer in dev mode
     deps: [gomod, sqlc]
     cmds:
+      - go vet
+      - go fmt
+      - golangci-lint run
       - task: build
 
   build-prod:
     desc: Build budgeteer in prod mode
     deps: [gomod, sqlc, frontend]
     cmds:
+      - go vet
+      - go fmt
+      - golangci-lint run
       - task: build
 
+  ci:
+    desc: Run CI build
+    cmds:
+      - task: build-prod
+      - go test ./...
+
   frontend:
     desc: Build vue frontend
+    dir: web
     sources:
       - web/src/**/*
     generates:
       - web/dist/**/*
     cmds:
-      - cd web
+      - yarn
       - yarn build
+      - yarn run vue-tsc --noEmit
 
   docker:
     desc: Build budgeeter:latest
     deps: [build-prod]
     sources:
       - ./build/budgeteer{{exeExt}}
+      - ./build/Dockerfile
     cmds:
-      - docker build -t budgeteer:latest -t hub.javil.eu/budgeteer:latest ./build
+      - docker build -t {{.IMAGE_NAME}}:latest ./build
+      - docker push {{.IMAGE_NAME}}:latest
+
+  dev-docker:
+    desc: Build budgeeter:dev
+    sources:
+      - ./docker/Dockerfile
+      - ./docker/build.sh
+      - ./web/package.json
+    cmds:
+      - docker build -t {{.IMAGE_NAME}}:dev . -f docker/Dockerfile
+      - docker push {{.IMAGE_NAME}}:dev
 
   run:
     desc: Start budgeteer

bcrypt/verifier.go

@@ -1,23 +1,30 @@
 package bcrypt
 
-import "golang.org/x/crypto/bcrypt"
+import (
+	"fmt"
 
-// Verifier verifys passwords using Bcrypt
-type Verifier struct {
-	cost int
-}
+	"golang.org/x/crypto/bcrypt"
+)
 
-// Verify verifys a Password
-func (bv *Verifier) Verify(password string, hashOnDb string) error {
-	return bcrypt.CompareHashAndPassword([]byte(hashOnDb), []byte(password))
-}
+// Verifier verifys passwords using Bcrypt.
+type Verifier struct{}
 
-// Hash calculates a hash to be stored on the database
-func (bv *Verifier) Hash(password string) (string, error) {
-	hash, err := bcrypt.GenerateFromPassword([]byte(password), bv.cost)
+// Verify verifys a Password.
+func (bv *Verifier) Verify(password string, hashOnDB string) error {
+	err := bcrypt.CompareHashAndPassword([]byte(hashOnDB), []byte(password))
 	if err != nil {
-		return "", err
+		return fmt.Errorf("verify password: %w", err)
 	}
 
-	return string(hash[:]), nil
+	return nil
+}
+
+// Hash calculates a hash to be stored on the database.
+func (bv *Verifier) Hash(password string) (string, error) {
+	hash, err := bcrypt.GenerateFromPassword([]byte(password), bcrypt.DefaultCost)
+	if err != nil {
+		return "", fmt.Errorf("hash password: %w", err)
+	}
+
+	return string(hash), nil
 }

cmd/budgeteer/main.go

@@ -1,13 +1,17 @@
 package main
 
 import (
+	"fmt"
+	"io/fs"
 	"log"
+	"net/http"
 
 	"git.javil.eu/jacob1123/budgeteer/bcrypt"
 	"git.javil.eu/jacob1123/budgeteer/config"
-	"git.javil.eu/jacob1123/budgeteer/http"
 	"git.javil.eu/jacob1123/budgeteer/jwt"
 	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"git.javil.eu/jacob1123/budgeteer/server"
+	"git.javil.eu/jacob1123/budgeteer/web"
 )
 
 func main() {
@@ -16,16 +20,27 @@ func main() {
 		log.Fatalf("Could not load config: %v", err)
 	}
 
-	q, err := postgres.Connect("pgx", cfg.DatabaseConnection)
+	queries, err := postgres.Connect("pgx", cfg.DatabaseConnection)
 	if err != nil {
 		log.Fatalf("Failed connecting to DB: %v", err)
 	}
 
-	h := &http.Handler{
-		Service:             q,
-		TokenVerifier:       &jwt.TokenVerifier{},
-		CredentialsVerifier: &bcrypt.Verifier{},
+	static, err := fs.Sub(web.Static, "dist")
+	if err != nil {
+		panic("couldn't open static files")
 	}
 
-	h.Serve()
+	tokenVerifier, err := jwt.NewTokenVerifier(cfg.SessionSecret)
+	if err != nil {
+		panic(fmt.Errorf("couldn't create token verifier: %w", err))
+	}
+
+	handler := &server.Handler{
+		Service:             queries,
+		TokenVerifier:       tokenVerifier,
+		CredentialsVerifier: &bcrypt.Verifier{},
+		StaticFS:            http.FS(static),
+	}
+
+	handler.Serve()
 }

config/config.go

@@ -4,15 +4,17 @@ import (
 	"os"
 )
 
-// Config contains all needed configurations
+// Config contains all needed configurations.
 type Config struct {
 	DatabaseConnection string
+	SessionSecret      string
 }
 
-// LoadConfig from path
+// LoadConfig from path.
 func LoadConfig() (*Config, error) {
 	configuration := Config{
 		DatabaseConnection: os.Getenv("BUDGETEER_DB"),
+		SessionSecret:      os.Getenv("BUDGETEER_SESSION_SECRET"),
 	}
 
 	return &configuration, nil

docker-compose.dev.yml

@@ -2,9 +2,7 @@ version: '3.7'
 
 services:
         app:
-                image: budgeteer:dev
-                build:
-                        context: ./docker/
+                image: hub.javil.eu/budgeteer:dev
                 container_name: budgeteer
                 stdin_open: true # docker run -i
                 tty: true        # docker run -t
@@ -19,6 +17,7 @@ services:
                         - ~/.cache:/.cache
                 environment:
                         BUDGETEER_DB: postgres://budgeteer:budgeteer@db:5432/budgeteer
+                        BUDGETEER_SESSION_SECRET: random string for JWT authorization
                 depends_on:
                         - db
 

docker-compose.yml

@@ -2,7 +2,7 @@ version: '3.7'
 
 services:
         app:
-                image: budgeteer:latest
+                image: hub.javil.eu/budgeteer:latest
                 container_name: budgeteer
                 ports:
                         - 1323:1323

docker/Dockerfile

@@ -1,13 +1,17 @@
-FROM alpine
-RUN apk add go
-RUN apk add nodejs yarn bash curl git git-perl tmux
-RUN bash -c "$(curl --location https://taskfile.dev/install.sh)" -- -d -b /usr/local/bin
-ADD build.sh /
-RUN addgroup -S dev && adduser -S dev -G dev
-USER dev
+FROM alpine as godeps
+RUN apk --no-cache add go
 RUN go install github.com/kyleconroy/sqlc/cmd/sqlc@latest
 RUN go install github.com/go-task/task/v3/cmd/task@latest
+RUN go install github.com/golangci/golangci-lint/cmd/golangci-lint@latest
+
+FROM alpine
+RUN apk --no-cache add go nodejs yarn bash curl git git-perl tmux
+ADD docker/build.sh /
 RUN yarn global add @vue/cli
-ENV PATH="/home/dev/go/bin:/home/dev/.yarn/bin/:${PATH}"
+ENV PATH="/root/.yarn/bin/:${PATH}"
+WORKDIR /src/web
+ADD web/package.json web/yarn.lock /src/web/
+RUN yarn
 WORKDIR /src
+COPY --from=godeps /root/go/bin/task /root/go/bin/sqlc /root/go/bin/golangci-lint /usr/local/bin/
 CMD /build.sh

http/account.go

@@ -1,37 +0,0 @@
-package http
-
-import (
-	"net/http"
-
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-func (h *Handler) transactionsForAccount(c *gin.Context) {
-	accountID := c.Param("accountid")
-	accountUUID, err := uuid.Parse(accountID)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, err)
-		return
-	}
-
-	account, err := h.Service.GetAccount(c.Request.Context(), accountUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusNotFound, err)
-		return
-	}
-
-	transactions, err := h.Service.GetTransactionsForAccount(c.Request.Context(), accountUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusNotFound, err)
-		return
-	}
-
-	c.JSON(http.StatusOK, TransactionsResponse{account, transactions})
-}
-
-type TransactionsResponse struct {
-	Account      postgres.Account
-	Transactions []postgres.GetTransactionsForAccountRow
-}

http/autocomplete.go

@@ -1,54 +0,0 @@
-package http
-
-import (
-	"fmt"
-	"net/http"
-
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-func (h *Handler) autocompleteCategories(c *gin.Context) {
-	budgetID := c.Param("budgetid")
-	budgetUUID, err := uuid.Parse(budgetID)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("budgetid missing from URL"))
-		return
-	}
-
-	query := c.Request.URL.Query().Get("s")
-	searchParams := postgres.SearchCategoriesParams{
-		BudgetID: budgetUUID,
-		Search:   "%" + query + "%",
-	}
-	categories, err := h.Service.SearchCategories(c.Request.Context(), searchParams)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	c.JSON(http.StatusOK, categories)
-}
-
-func (h *Handler) autocompletePayee(c *gin.Context) {
-	budgetID := c.Param("budgetid")
-	budgetUUID, err := uuid.Parse(budgetID)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("budgetid missing from URL"))
-		return
-	}
-
-	query := c.Request.URL.Query().Get("s")
-	searchParams := postgres.SearchPayeesParams{
-		BudgetID: budgetUUID,
-		Search:   query + "%",
-	}
-	payees, err := h.Service.SearchPayees(c.Request.Context(), searchParams)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	c.JSON(http.StatusOK, payees)
-}

http/budgeting.go

@@ -1,216 +0,0 @@
-package http
-
-import (
-	"fmt"
-	"net/http"
-	"strconv"
-	"time"
-
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-func getFirstOfMonth(year, month int, location *time.Location) time.Time {
-	return time.Date(year, time.Month(month), 1, 0, 0, 0, 0, location)
-}
-
-func getFirstOfMonthTime(date time.Time) time.Time {
-	var monthM time.Month
-	year, monthM, _ := date.Date()
-	month := int(monthM)
-	return getFirstOfMonth(year, month, date.Location())
-}
-
-type CategoryWithBalance struct {
-	*postgres.GetCategoriesRow
-	Available          postgres.Numeric
-	AvailableLastMonth postgres.Numeric
-	Activity           postgres.Numeric
-	Assigned           postgres.Numeric
-}
-
-func getDate(c *gin.Context) (time.Time, error) {
-	var year, month int
-	yearString := c.Param("year")
-	monthString := c.Param("month")
-	if yearString == "" && monthString == "" {
-		return getFirstOfMonthTime(time.Now()), nil
-	}
-
-	year, err := strconv.Atoi(yearString)
-	if err != nil {
-		return time.Time{}, fmt.Errorf("parse year: %w", err)
-	}
-
-	month, err = strconv.Atoi(monthString)
-	if err != nil {
-		return time.Time{}, fmt.Errorf("parse month: %w", err)
-	}
-
-	return getFirstOfMonth(year, month, time.Now().Location()), nil
-}
-
-func (h *Handler) budgetingForMonth(c *gin.Context) {
-	budgetID := c.Param("budgetid")
-	budgetUUID, err := uuid.Parse(budgetID)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("budgetid missing from URL"))
-		return
-	}
-
-	budget, err := h.Service.GetBudget(c.Request.Context(), budgetUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, err)
-		return
-	}
-
-	firstOfMonth, err := getDate(c)
-	if err != nil {
-		c.Redirect(http.StatusTemporaryRedirect, "/budget/"+budgetUUID.String())
-		return
-	}
-
-	categories, err := h.Service.GetCategories(c.Request.Context(), budgetUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	firstOfNextMonth := firstOfMonth.AddDate(0, 1, 0)
-	cumultativeBalances, err := h.Service.GetCumultativeBalances(c.Request.Context(), budgetUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("load balances: %w", err))
-		return
-	}
-
-	// skip everything in the future
-	categoriesWithBalance, moneyUsed, err := h.calculateBalances(c, budget, firstOfNextMonth, firstOfMonth, categories, cumultativeBalances)
-	if err != nil {
-		return
-	}
-
-	availableBalance := postgres.NewZeroNumeric()
-	for _, cat := range categories {
-		if cat.ID != budget.IncomeCategoryID {
-			continue
-		}
-		availableBalance = moneyUsed
-
-		for _, bal := range cumultativeBalances {
-			if bal.CategoryID != cat.ID {
-				continue
-			}
-
-			if !bal.Date.Before(firstOfNextMonth) {
-				continue
-			}
-
-			availableBalance = availableBalance.Add(bal.Transactions)
-		}
-	}
-
-	data := struct {
-		Categories       []CategoryWithBalance
-		AvailableBalance postgres.Numeric
-	}{categoriesWithBalance, availableBalance}
-	c.JSON(http.StatusOK, data)
-
-}
-
-func (h *Handler) budgeting(c *gin.Context) {
-	budgetID := c.Param("budgetid")
-	budgetUUID, err := uuid.Parse(budgetID)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("budgetid missing from URL"))
-		return
-	}
-
-	budget, err := h.Service.GetBudget(c.Request.Context(), budgetUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusNotFound, err)
-		return
-	}
-
-	accounts, err := h.Service.GetAccountsWithBalance(c.Request.Context(), budgetUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	data := struct {
-		Accounts []postgres.GetAccountsWithBalanceRow
-		Budget   postgres.Budget
-	}{accounts, budget}
-
-	c.JSON(http.StatusOK, data)
-}
-
-func (h *Handler) calculateBalances(c *gin.Context, budget postgres.Budget, firstOfNextMonth time.Time, firstOfMonth time.Time, categories []postgres.GetCategoriesRow, cumultativeBalances []postgres.GetCumultativeBalancesRow) ([]CategoryWithBalance, postgres.Numeric, error) {
-	categoriesWithBalance := []CategoryWithBalance{}
-	hiddenCategory := CategoryWithBalance{
-		GetCategoriesRow: &postgres.GetCategoriesRow{
-			Name:  "",
-			Group: "Hidden Categories",
-		},
-		Available:          postgres.NewZeroNumeric(),
-		AvailableLastMonth: postgres.NewZeroNumeric(),
-		Activity:           postgres.NewZeroNumeric(),
-		Assigned:           postgres.NewZeroNumeric(),
-	}
-
-	moneyUsed := postgres.NewZeroNumeric()
-	for i := range categories {
-		cat := &categories[i]
-		categoryWithBalance := CategoryWithBalance{
-			GetCategoriesRow:   cat,
-			Available:          postgres.NewZeroNumeric(),
-			AvailableLastMonth: postgres.NewZeroNumeric(),
-			Activity:           postgres.NewZeroNumeric(),
-			Assigned:           postgres.NewZeroNumeric(),
-		}
-		for _, bal := range cumultativeBalances {
-			if bal.CategoryID != cat.ID {
-				continue
-			}
-
-			if !bal.Date.Before(firstOfNextMonth) {
-				continue
-			}
-
-			moneyUsed = moneyUsed.Sub(bal.Assignments)
-			categoryWithBalance.Available = categoryWithBalance.Available.Add(bal.Assignments)
-			categoryWithBalance.Available = categoryWithBalance.Available.Add(bal.Transactions)
-			if !categoryWithBalance.Available.IsPositive() && bal.Date.Before(firstOfMonth) {
-				moneyUsed = moneyUsed.Add(categoryWithBalance.Available)
-				categoryWithBalance.Available = postgres.NewZeroNumeric()
-			}
-
-			if bal.Date.Before(firstOfMonth) {
-				categoryWithBalance.AvailableLastMonth = categoryWithBalance.Available
-			} else if bal.Date.Before(firstOfNextMonth) {
-				categoryWithBalance.Activity = bal.Transactions
-				categoryWithBalance.Assigned = bal.Assignments
-			}
-		}
-
-		// do not show hidden categories
-		if cat.Group == "Hidden Categories" {
-			hiddenCategory.Available = hiddenCategory.Available.Add(categoryWithBalance.Available)
-			hiddenCategory.AvailableLastMonth = hiddenCategory.AvailableLastMonth.Add(categoryWithBalance.AvailableLastMonth)
-			hiddenCategory.Activity = hiddenCategory.Activity.Add(categoryWithBalance.Activity)
-			hiddenCategory.Assigned = hiddenCategory.Assigned.Add(categoryWithBalance.Assigned)
-			continue
-		}
-
-		if cat.ID == budget.IncomeCategoryID {
-			continue
-		}
-
-		categoriesWithBalance = append(categoriesWithBalance, categoryWithBalance)
-	}
-
-	categoriesWithBalance = append(categoriesWithBalance, hiddenCategory)
-
-	return categoriesWithBalance, moneyUsed, nil
-}

http/http.go

@@ -1,91 +0,0 @@
-package http
-
-import (
-	"io/fs"
-	"net/http"
-	"strings"
-
-	"git.javil.eu/jacob1123/budgeteer"
-	"git.javil.eu/jacob1123/budgeteer/bcrypt"
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"git.javil.eu/jacob1123/budgeteer/web"
-
-	"github.com/gin-gonic/gin"
-)
-
-// Handler handles incoming requests
-type Handler struct {
-	Service             *postgres.Database
-	TokenVerifier       budgeteer.TokenVerifier
-	CredentialsVerifier *bcrypt.Verifier
-}
-
-const (
-	expiration = 72
-)
-
-// Serve starts the http server
-func (h *Handler) Serve() {
-	router := gin.Default()
-	h.LoadRoutes(router)
-	router.Run(":1323")
-}
-
-// LoadRoutes initializes all the routes
-func (h *Handler) LoadRoutes(router *gin.Engine) {
-	static, err := fs.Sub(web.Static, "dist")
-	if err != nil {
-		panic("couldn't open static files")
-	}
-	staticFS := http.FS(static)
-
-	router.Use(enableCachingForStaticFiles())
-	router.NoRoute(
-		func(c *gin.Context) {
-			c.FileFromFS(c.Request.URL.Path, staticFS)
-		},
-	)
-
-	withLogin := router.Group("")
-	withLogin.Use(h.verifyLoginWithRedirect)
-
-	withBudget := router.Group("")
-	withBudget.Use(h.verifyLoginWithForbidden)
-	withBudget.GET("/budget/:budgetid/:year/:month", h.budgeting)
-	withBudget.GET("/budget/:budgetid/settings/clean-negative", h.cleanNegativeBudget)
-
-	api := router.Group("/api/v1")
-
-	unauthenticated := api.Group("/user")
-	unauthenticated.GET("/login", func(c *gin.Context) { c.Redirect(http.StatusPermanentRedirect, "/login") })
-	unauthenticated.POST("/login", h.loginPost)
-	unauthenticated.POST("/register", h.registerPost)
-
-	authenticated := api.Group("")
-	authenticated.Use(h.verifyLoginWithForbidden)
-	authenticated.GET("/dashboard", h.dashboard)
-	authenticated.GET("/account/:accountid/transactions", h.transactionsForAccount)
-	authenticated.GET("/admin/clear-database", h.clearDatabase)
-	authenticated.GET("/budget/:budgetid", h.budgeting)
-	authenticated.GET("/budget/:budgetid/:year/:month", h.budgetingForMonth)
-	authenticated.GET("/budget/:budgetid/autocomplete/payees", h.autocompletePayee)
-	authenticated.GET("/budget/:budgetid/autocomplete/categories", h.autocompleteCategories)
-	authenticated.DELETE("/budget/:budgetid", h.deleteBudget)
-	authenticated.POST("/budget/:budgetid/import/ynab", h.importYNAB)
-	authenticated.POST("/budget/:budgetid/settings/clear", h.clearBudget)
-
-	budget := authenticated.Group("/budget")
-	budget.POST("/new", h.newBudget)
-
-	transaction := authenticated.Group("/transaction")
-	transaction.POST("/new", h.newTransaction)
-	transaction.POST("/:transactionid", h.newTransaction)
-}
-
-func enableCachingForStaticFiles() gin.HandlerFunc {
-	return func(c *gin.Context) {
-		if strings.HasPrefix(c.Request.RequestURI, "/static/") {
-			c.Header("Cache-Control", "max-age=86400")
-		}
-	}
-}

http/transaction.go

@@ -1,89 +0,0 @@
-package http
-
-import (
-	"fmt"
-	"net/http"
-	"time"
-
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-type NewTransactionPayload struct {
-	Date  JSONDate `json:"date"`
-	Payee struct {
-		ID   uuid.NullUUID
-		Name string
-	} `json:"payee"`
-	Category struct {
-		ID   uuid.NullUUID
-		Name string
-	} `json:"category"`
-	Memo      string    `json:"memo"`
-	Amount    string    `json:"amount"`
-	BudgetID  uuid.UUID `json:"budget_id"`
-	AccountID uuid.UUID `json:"account_id"`
-	State     string    `json:"state"`
-}
-
-func (h *Handler) newTransaction(c *gin.Context) {
-	var payload NewTransactionPayload
-	err := c.BindJSON(&payload)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	fmt.Printf("%v\n", payload)
-
-	amount := postgres.Numeric{}
-	amount.Set(payload.Amount)
-
-	/*transactionUUID, err := getNullUUIDFromParam(c, "transactionid")
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("parse transaction id: %w", err))
-		return
-	}*/
-
-	//if !transactionUUID.Valid {
-	new := postgres.CreateTransactionParams{
-		Memo:       payload.Memo,
-		Date:       time.Time(payload.Date),
-		Amount:     amount,
-		AccountID:  payload.AccountID,
-		PayeeID:    payload.Payee.ID,    //TODO handle new payee
-		CategoryID: payload.Category.ID, //TODO handle new category
-		Status:     postgres.TransactionStatus(payload.State),
-	}
-	_, err = h.Service.CreateTransaction(c.Request.Context(), new)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("create transaction: %w", err))
-	}
-
-	return
-	//	}
-	/*
-		_, delete := c.GetPostForm("delete")
-		if delete {
-			err = h.Service.DeleteTransaction(c.Request.Context(), transactionUUID.UUID)
-			if err != nil {
-				c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("delete transaction: %w", err))
-			}
-			return
-		}
-
-		update := postgres.UpdateTransactionParams{
-			ID:         transactionUUID.UUID,
-			Memo:       payload.Memo,
-			Date:       time.Time(payload.Date),
-			Amount:     amount,
-			AccountID:  transactionAccountID,
-			PayeeID:    payload.Payee.ID,    //TODO handle new payee
-			CategoryID: payload.Category.ID, //TODO handle new category
-		}
-		err = h.Service.UpdateTransaction(c.Request.Context(), update)
-		if err != nil {
-			c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("update transaction: %w", err))
-		}*/
-}

http/util.go

@@ -1,56 +0,0 @@
-package http
-
-import (
-	"fmt"
-
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-func getUUID(c *gin.Context, name string) (uuid.UUID, error) {
-	value, succ := c.GetPostForm(name)
-	if !succ {
-		return uuid.UUID{}, fmt.Errorf("not set")
-	}
-
-	id, err := uuid.Parse(value)
-	if err != nil {
-		return uuid.UUID{}, fmt.Errorf("not a valid uuid: %w", err)
-	}
-
-	return id, nil
-}
-
-func getNullUUIDFromParam(c *gin.Context, name string) (uuid.NullUUID, error) {
-	value := c.Param(name)
-	if value == "" {
-		return uuid.NullUUID{}, nil
-	}
-
-	id, err := uuid.Parse(value)
-	if err != nil {
-		return uuid.NullUUID{}, fmt.Errorf("not a valid uuid: %w", err)
-	}
-
-	return uuid.NullUUID{
-		UUID:  id,
-		Valid: true,
-	}, nil
-}
-
-func getNullUUIDFromForm(c *gin.Context, name string) (uuid.NullUUID, error) {
-	value, succ := c.GetPostForm(name)
-	if !succ || value == "" {
-		return uuid.NullUUID{}, nil
-	}
-
-	id, err := uuid.Parse(value)
-	if err != nil {
-		return uuid.NullUUID{}, fmt.Errorf("not a valid uuid: %w", err)
-	}
-
-	return uuid.NullUUID{
-		UUID:  id,
-		Valid: true,
-	}, nil
-}

http/ynab-import.go

@@ -1,66 +0,0 @@
-package http
-
-import (
-	"fmt"
-	"net/http"
-
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-func (h *Handler) importYNAB(c *gin.Context) {
-	budgetID, succ := c.Params.Get("budgetid")
-	if !succ {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("no budget_id specified"))
-		return
-	}
-
-	budgetUUID, err := uuid.Parse(budgetID)
-	if !succ {
-		c.AbortWithError(http.StatusBadRequest, err)
-		return
-	}
-
-	ynab, err := postgres.NewYNABImport(c.Request.Context(), h.Service.Queries, budgetUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	transactionsFile, err := c.FormFile("transactions")
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	transactions, err := transactionsFile.Open()
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	err = ynab.ImportTransactions(transactions)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	assignmentsFile, err := c.FormFile("assignments")
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	assignments, err := assignmentsFile.Open()
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-
-	err = ynab.ImportAssignments(assignments)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, err)
-		return
-	}
-}

jwt/login.go

@@ -10,11 +10,24 @@ import (
 	"github.com/google/uuid"
 )
 
-// TokenVerifier verifies Tokens
+// TokenVerifier verifies Tokens.
 type TokenVerifier struct {
+	secret string
 }
 
-// Token contains everything to authenticate a user
+var ErrEmptySecret = fmt.Errorf("secret is required")
+
+func NewTokenVerifier(secret string) (*TokenVerifier, error) {
+	if secret == "" {
+		return nil, ErrEmptySecret
+	}
+
+	return &TokenVerifier{
+		secret: secret,
+	}, nil
+}
+
+// Token contains everything to authenticate a user.
 type Token struct {
 	username string
 	name     string
@@ -24,11 +37,14 @@ type Token struct {
 
 const (
 	expiration = 72
-	secret     = "uditapbzuditagscwxuqdflgzpbu´ßiaefnlmzeßtrubiadern"
 )
 
-// CreateToken creates a new token from username and name
+// CreateToken creates a new token from username and name.
 func (tv *TokenVerifier) CreateToken(user *postgres.User) (string, error) {
+	if tv.secret == "" {
+		return "", ErrEmptySecret
+	}
+
 	token := jwt.NewWithClaims(jwt.SigningMethodHS256, jwt.MapClaims{
 		"usr":  user.Email,
 		"name": user.Name,
@@ -37,21 +53,31 @@ func (tv *TokenVerifier) CreateToken(user *postgres.User) (string, error) {
 	})
 
 	// Generate encoded token and send it as response.
-	t, err := token.SignedString([]byte(secret))
+	t, err := token.SignedString([]byte(tv.secret))
 	if err != nil {
-		return "", err
+		return "", fmt.Errorf("create token: %w", err)
 	}
 
 	return t, nil
 }
 
-// VerifyToken verifys a given string-token
-func (tv *TokenVerifier) VerifyToken(tokenString string) (budgeteer.Token, error) {
+var (
+	ErrUnexpectedSigningMethod = fmt.Errorf("unexpected signing method")
+	ErrInvalidToken            = fmt.Errorf("token is invalid")
+	ErrTokenExpired            = fmt.Errorf("token has expired")
+)
+
+// VerifyToken verifys a given string-token.
+func (tv *TokenVerifier) VerifyToken(tokenString string) (budgeteer.Token, error) { //nolint:ireturn
+	if tv.secret == "" {
+		return nil, ErrEmptySecret
+	}
+
 	token, err := jwt.Parse(tokenString, func(token *jwt.Token) (interface{}, error) {
 		if _, ok := token.Method.(*jwt.SigningMethodHMAC); !ok {
-			return nil, fmt.Errorf("Unexpected signing method: %v", token.Header["alg"])
+			return nil, fmt.Errorf("method '%v': %w", token.Header["alg"], ErrUnexpectedSigningMethod)
 		}
-		return []byte(secret), nil
+		return []byte(tv.secret), nil
 	})
 	if err != nil {
 		return nil, fmt.Errorf("parse jwt: %w", err)
@@ -62,7 +88,7 @@ func (tv *TokenVerifier) VerifyToken(tokenString string) (budgeteer.Token, error
 		return nil, fmt.Errorf("verify jwt: %w", err)
 	}
 
-	tkn := &Token{
+	tkn := &Token{ //nolint:forcetypeassert
 		username: claims["usr"].(string),
 		name:     claims["name"].(string),
 		expiry:   claims["exp"].(float64),
@@ -73,16 +99,16 @@ func (tv *TokenVerifier) VerifyToken(tokenString string) (budgeteer.Token, error
 
 func verifyToken(token *jwt.Token) (jwt.MapClaims, error) {
 	if !token.Valid {
-		return nil, fmt.Errorf("Token is not valid")
+		return nil, ErrInvalidToken
 	}
 
 	claims, ok := token.Claims.(jwt.MapClaims)
 	if !ok {
-		return nil, fmt.Errorf("Claims are not of Type MapClaims")
+		return nil, ErrInvalidToken
 	}
 
 	if !claims.VerifyExpiresAt(time.Now().Unix(), true) {
-		return nil, fmt.Errorf("Claims have expired")
+		return nil, ErrTokenExpired
 	}
 
 	return claims, nil

postgres/accounts.sql.go

@@ -5,7 +5,9 @@ package postgres
 
 import (
 	"context"
+	"time"
 
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
 )
 
@@ -85,11 +87,13 @@ func (q *Queries) GetAccounts(ctx context.Context, budgetID uuid.UUID) ([]Accoun
 }
 
 const getAccountsWithBalance = `-- name: GetAccountsWithBalance :many
-SELECT accounts.id, accounts.name, accounts.on_budget, SUM(transactions.amount)::decimal(12,2) as balance
+SELECT accounts.id, accounts.name, accounts.on_budget, 
+        (SELECT MAX(transactions.date) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.status = 'Reconciled')::date as last_reconciled,
+        (SELECT SUM(transactions.amount) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.date < NOW())::decimal(12,2) as working_balance,
+        (SELECT SUM(transactions.amount) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.date < NOW() AND transactions.status IN ('Cleared', 'Reconciled'))::decimal(12,2) as cleared_balance,
+        (SELECT SUM(transactions.amount) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.date < NOW() AND transactions.status = 'Reconciled')::decimal(12,2) as reconciled_balance
 FROM accounts
-LEFT JOIN transactions ON transactions.account_id = accounts.id AND transactions.date < NOW()
 WHERE accounts.budget_id = $1
-GROUP BY accounts.id, accounts.name
 ORDER BY accounts.name
 `
 
@@ -97,7 +101,10 @@ type GetAccountsWithBalanceRow struct {
 	ID                uuid.UUID
 	Name              string
 	OnBudget          bool
-	Balance  Numeric
+	LastReconciled    time.Time
+	WorkingBalance    numeric.Numeric
+	ClearedBalance    numeric.Numeric
+	ReconciledBalance numeric.Numeric
 }
 
 func (q *Queries) GetAccountsWithBalance(ctx context.Context, budgetID uuid.UUID) ([]GetAccountsWithBalanceRow, error) {
@@ -113,7 +120,10 @@ func (q *Queries) GetAccountsWithBalance(ctx context.Context, budgetID uuid.UUID
 			&i.ID,
 			&i.Name,
 			&i.OnBudget,
-			&i.Balance,
+			&i.LastReconciled,
+			&i.WorkingBalance,
+			&i.ClearedBalance,
+			&i.ReconciledBalance,
 		); err != nil {
 			return nil, err
 		}
@@ -127,3 +137,76 @@ func (q *Queries) GetAccountsWithBalance(ctx context.Context, budgetID uuid.UUID
 	}
 	return items, nil
 }
+
+const searchAccounts = `-- name: SearchAccounts :many
+SELECT accounts.id, accounts.budget_id, accounts.name, 'account' as type FROM accounts
+WHERE accounts.budget_id = $1
+AND accounts.name LIKE $2
+ORDER BY accounts.name
+`
+
+type SearchAccountsParams struct {
+	BudgetID uuid.UUID
+	Search   string
+}
+
+type SearchAccountsRow struct {
+	ID       uuid.UUID
+	BudgetID uuid.UUID
+	Name     string
+	Type     interface{}
+}
+
+func (q *Queries) SearchAccounts(ctx context.Context, arg SearchAccountsParams) ([]SearchAccountsRow, error) {
+	rows, err := q.db.QueryContext(ctx, searchAccounts, arg.BudgetID, arg.Search)
+	if err != nil {
+		return nil, err
+	}
+	defer rows.Close()
+	var items []SearchAccountsRow
+	for rows.Next() {
+		var i SearchAccountsRow
+		if err := rows.Scan(
+			&i.ID,
+			&i.BudgetID,
+			&i.Name,
+			&i.Type,
+		); err != nil {
+			return nil, err
+		}
+		items = append(items, i)
+	}
+	if err := rows.Close(); err != nil {
+		return nil, err
+	}
+	if err := rows.Err(); err != nil {
+		return nil, err
+	}
+	return items, nil
+}
+
+const updateAccount = `-- name: UpdateAccount :one
+UPDATE accounts
+SET name = $1,
+    on_budget = $2
+WHERE accounts.id = $3
+RETURNING id, budget_id, name, on_budget
+`
+
+type UpdateAccountParams struct {
+	Name     string
+	OnBudget bool
+	ID       uuid.UUID
+}
+
+func (q *Queries) UpdateAccount(ctx context.Context, arg UpdateAccountParams) (Account, error) {
+	row := q.db.QueryRowContext(ctx, updateAccount, arg.Name, arg.OnBudget, arg.ID)
+	var i Account
+	err := row.Scan(
+		&i.ID,
+		&i.BudgetID,
+		&i.Name,
+		&i.OnBudget,
+	)
+	return i, err
+}

postgres/assignments.sql.go

@@ -7,6 +7,7 @@ import (
 	"context"
 	"time"
 
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
 )
 
@@ -21,7 +22,7 @@ RETURNING id, category_id, date, memo, amount
 
 type CreateAssignmentParams struct {
 	Date       time.Time
-	Amount     Numeric
+	Amount     numeric.Numeric
 	CategoryID uuid.UUID
 }
 
@@ -53,6 +54,49 @@ func (q *Queries) DeleteAllAssignments(ctx context.Context, budgetID uuid.UUID)
 	return result.RowsAffected()
 }
 
+const getAllAssignments = `-- name: GetAllAssignments :many
+SELECT assignments.date, categories.name as category, category_groups.name as group, assignments.amount
+FROM assignments
+INNER JOIN categories ON categories.id = assignments.category_id
+INNER JOIN category_groups ON categories.category_group_id = category_groups.id
+WHERE category_groups.budget_id = $1
+`
+
+type GetAllAssignmentsRow struct {
+	Date     time.Time
+	Category string
+	Group    string
+	Amount   numeric.Numeric
+}
+
+func (q *Queries) GetAllAssignments(ctx context.Context, budgetID uuid.UUID) ([]GetAllAssignmentsRow, error) {
+	rows, err := q.db.QueryContext(ctx, getAllAssignments, budgetID)
+	if err != nil {
+		return nil, err
+	}
+	defer rows.Close()
+	var items []GetAllAssignmentsRow
+	for rows.Next() {
+		var i GetAllAssignmentsRow
+		if err := rows.Scan(
+			&i.Date,
+			&i.Category,
+			&i.Group,
+			&i.Amount,
+		); err != nil {
+			return nil, err
+		}
+		items = append(items, i)
+	}
+	if err := rows.Close(); err != nil {
+		return nil, err
+	}
+	if err := rows.Err(); err != nil {
+		return nil, err
+	}
+	return items, nil
+}
+
 const getAssignmentsByMonthAndCategory = `-- name: GetAssignmentsByMonthAndCategory :many
 SELECT date, category_id, budget_id, amount
 FROM assignments_by_month

postgres/budgetservice.go

@@ -8,11 +8,15 @@ import (
 	"github.com/google/uuid"
 )
 
-// NewBudget creates a budget and adds it to the current user
+// NewBudget creates a budget and adds it to the current user.
 func (s *Database) NewBudget(context context.Context, name string, userID uuid.UUID) (*Budget, error) {
 	tx, err := s.BeginTx(context, &sql.TxOptions{})
-	q := s.WithTx(tx)
-	budget, err := q.CreateBudget(context, CreateBudgetParams{
+	if err != nil {
+		return nil, fmt.Errorf("begin transaction: %w", err)
+	}
+
+	transaction := s.WithTx(tx)
+	budget, err := transaction.CreateBudget(context, CreateBudgetParams{
 		Name:             name,
 		IncomeCategoryID: uuid.New(),
 	})
@@ -21,12 +25,12 @@ func (s *Database) NewBudget(context context.Context, name string, userID uuid.U
 	}
 
 	ub := LinkBudgetToUserParams{UserID: userID, BudgetID: budget.ID}
-	_, err = q.LinkBudgetToUser(context, ub)
+	_, err = transaction.LinkBudgetToUser(context, ub)
 	if err != nil {
 		return nil, fmt.Errorf("link budget to user: %w", err)
 	}
 
-	group, err := q.CreateCategoryGroup(context, CreateCategoryGroupParams{
+	group, err := transaction.CreateCategoryGroup(context, CreateCategoryGroupParams{
 		Name:     "Inflow",
 		BudgetID: budget.ID,
 	})
@@ -34,7 +38,7 @@ func (s *Database) NewBudget(context context.Context, name string, userID uuid.U
 		return nil, fmt.Errorf("create inflow category_group: %w", err)
 	}
 
-	cat, err := q.CreateCategory(context, CreateCategoryParams{
+	cat, err := transaction.CreateCategory(context, CreateCategoryParams{
 		Name:            "Ready to Assign",
 		CategoryGroupID: group.ID,
 	})
@@ -42,7 +46,7 @@ func (s *Database) NewBudget(context context.Context, name string, userID uuid.U
 		return nil, fmt.Errorf("create ready to assign category: %w", err)
 	}
 
-	err = q.SetInflowCategory(context, SetInflowCategoryParams{
+	err = transaction.SetInflowCategory(context, SetInflowCategoryParams{
 		IncomeCategoryID: cat.ID,
 		ID:               budget.ID,
 	})
@@ -50,7 +54,10 @@ func (s *Database) NewBudget(context context.Context, name string, userID uuid.U
 		return nil, fmt.Errorf("set inflow category: %w", err)
 	}
 
-	tx.Commit()
+	err = tx.Commit()
+	if err != nil {
+		return nil, fmt.Errorf("commit: %w", err)
+	}
 
 	return &budget, nil
 }

postgres/categories.sql.go

@@ -118,7 +118,8 @@ func (q *Queries) GetCategoryGroups(ctx context.Context, budgetID uuid.UUID) ([]
 }
 
 const searchCategories = `-- name: SearchCategories :many
-SELECT CONCAT(category_groups.name, ' : ', categories.name) as name, categories.id FROM categories
+SELECT CONCAT(category_groups.name, ' : ', categories.name) as name, categories.id, 'category' as type
+FROM categories
 INNER JOIN category_groups ON categories.category_group_id = category_groups.id
 WHERE category_groups.budget_id = $1
 AND categories.name LIKE $2
@@ -133,6 +134,7 @@ type SearchCategoriesParams struct {
 type SearchCategoriesRow struct {
 	Name interface{}
 	ID   uuid.UUID
+	Type interface{}
 }
 
 func (q *Queries) SearchCategories(ctx context.Context, arg SearchCategoriesParams) ([]SearchCategoriesRow, error) {
@@ -144,7 +146,7 @@ func (q *Queries) SearchCategories(ctx context.Context, arg SearchCategoriesPara
 	var items []SearchCategoriesRow
 	for rows.Next() {
 		var i SearchCategoriesRow
-		if err := rows.Scan(&i.Name, &i.ID); err != nil {
+		if err := rows.Scan(&i.Name, &i.ID, &i.Type); err != nil {
 			return nil, err
 		}
 		items = append(items, i)

postgres/conn.go

@@ -5,7 +5,7 @@ import (
 	"embed"
 	"fmt"
 
-	_ "github.com/jackc/pgx/v4/stdlib"
+	_ "github.com/jackc/pgx/v4/stdlib" // needed for pg connection
 	"github.com/pressly/goose/v3"
 )
 
@@ -17,7 +17,7 @@ type Database struct {
 	*sql.DB
 }
 
-// Connect to a database
+// Connect connects to a database.
 func Connect(typ string, connString string) (*Database, error) {
 	conn, err := sql.Open(typ, connString)
 	if err != nil {

postgres/cumultative-balances.sql.go

@@ -7,6 +7,7 @@ import (
 	"context"
 	"time"
 
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
 )
 
@@ -23,10 +24,10 @@ ORDER BY COALESCE(ass.date, tra.date), COALESCE(ass.category_id, tra.category_id
 type GetCumultativeBalancesRow struct {
 	Date            time.Time
 	CategoryID      uuid.UUID
-	Assignments     Numeric
-	AssignmentsCum  Numeric
-	Transactions    Numeric
-	TransactionsCum Numeric
+	Assignments     numeric.Numeric
+	AssignmentsCum  numeric.Numeric
+	Transactions    numeric.Numeric
+	TransactionsCum numeric.Numeric
 }
 
 func (q *Queries) GetCumultativeBalances(ctx context.Context, budgetID uuid.UUID) ([]GetCumultativeBalancesRow, error) {

postgres/models.go

@@ -7,6 +7,7 @@ import (
 	"fmt"
 	"time"
 
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
 )
 
@@ -42,7 +43,7 @@ type Assignment struct {
 	CategoryID uuid.UUID
 	Date       time.Time
 	Memo       sql.NullString
-	Amount     Numeric
+	Amount     numeric.Numeric
 }
 
 type AssignmentsByMonth struct {
@@ -71,6 +72,24 @@ type CategoryGroup struct {
 	Name     string
 }
 
+type DisplayTransaction struct {
+	ID              uuid.UUID
+	Date            time.Time
+	Memo            string
+	Amount          numeric.Numeric
+	GroupID         uuid.NullUUID
+	Status          TransactionStatus
+	Account         string
+	PayeeID         uuid.NullUUID
+	CategoryID      uuid.NullUUID
+	Payee           string
+	CategoryGroup   string
+	Category        string
+	TransferAccount string
+	BudgetID        uuid.UUID
+	AccountID       uuid.UUID
+}
+
 type Payee struct {
 	ID       uuid.UUID
 	BudgetID uuid.UUID
@@ -81,7 +100,7 @@ type Transaction struct {
 	ID         uuid.UUID
 	Date       time.Time
 	Memo       string
-	Amount     Numeric
+	Amount     numeric.Numeric
 	AccountID  uuid.UUID
 	CategoryID uuid.NullUUID
 	PayeeID    uuid.NullUUID

postgres/numeric.go

@@ -1,129 +0,0 @@
-package postgres
-
-import (
-	"fmt"
-	"math/big"
-
-	"github.com/jackc/pgtype"
-)
-
-type Numeric struct {
-	pgtype.Numeric
-}
-
-func NewZeroNumeric() Numeric {
-	return Numeric{pgtype.Numeric{Exp: 0, Int: big.NewInt(0), Status: pgtype.Present, NaN: false}}
-}
-
-func (n Numeric) GetFloat64() float64 {
-	if n.Status != pgtype.Present {
-		return 0
-	}
-	var balance float64
-	err := n.AssignTo(&balance)
-	if err != nil {
-		panic(err)
-	}
-	return balance
-}
-
-func (n Numeric) IsPositive() bool {
-	if n.Status != pgtype.Present {
-		return true
-	}
-	float := n.GetFloat64()
-	return float >= 0
-}
-
-func (n Numeric) IsZero() bool {
-	if n.Status != pgtype.Present {
-		return true
-	}
-	float := n.GetFloat64()
-	return float == 0
-}
-
-func (n Numeric) MatchExp(exp int32) Numeric {
-	diffExp := n.Exp - exp
-	factor := big.NewInt(0).Exp(big.NewInt(10), big.NewInt(int64(diffExp)), nil)
-	return Numeric{pgtype.Numeric{
-		Exp:    exp,
-		Int:    big.NewInt(0).Mul(n.Int, factor),
-		Status: n.Status,
-		NaN:    n.NaN,
-	}}
-}
-
-func (n Numeric) Sub(o Numeric) Numeric {
-	left := n
-	right := o
-	if n.Exp < o.Exp {
-		right = o.MatchExp(n.Exp)
-	} else if n.Exp > o.Exp {
-		left = n.MatchExp(o.Exp)
-	}
-
-	if left.Exp == right.Exp {
-		return Numeric{pgtype.Numeric{
-			Exp: left.Exp,
-			Int: big.NewInt(0).Sub(left.Int, right.Int),
-		}}
-	}
-
-	panic("Cannot subtract with different exponents")
-}
-func (n Numeric) Add(o Numeric) Numeric {
-	left := n
-	right := o
-	if n.Exp < o.Exp {
-		right = o.MatchExp(n.Exp)
-	} else if n.Exp > o.Exp {
-		left = n.MatchExp(o.Exp)
-	}
-
-	if left.Exp == right.Exp {
-		return Numeric{pgtype.Numeric{
-			Exp: left.Exp,
-			Int: big.NewInt(0).Add(left.Int, right.Int),
-		}}
-	}
-
-	panic("Cannot add with different exponents")
-}
-
-func (n Numeric) MarshalJSON() ([]byte, error) {
-	if n.Int.Int64() == 0 {
-		return []byte("\"0\""), nil
-	}
-
-	s := fmt.Sprintf("%d", n.Int)
-	bytes := []byte(s)
-
-	exp := n.Exp
-	for exp > 0 {
-		bytes = append(bytes, byte('0'))
-		exp--
-	}
-
-	if exp == 0 {
-		return bytes, nil
-	}
-
-	length := int32(len(bytes))
-	var bytesWithSeparator []byte
-
-	exp = -exp
-	for length <= exp {
-		bytes = append(bytes, byte('0'))
-		length++
-	}
-
-	split := length - exp
-	bytesWithSeparator = append(bytesWithSeparator, bytes[:split]...)
-	if split == 1 && n.Int.Int64() < 0 {
-		bytesWithSeparator = append(bytesWithSeparator, byte('0'))
-	}
-	bytesWithSeparator = append(bytesWithSeparator, byte('.'))
-	bytesWithSeparator = append(bytesWithSeparator, bytes[split:]...)
-	return bytesWithSeparator, nil
-}

postgres/numeric/numeric.go

@@ -0,0 +1,226 @@
+package numeric
+
+import (
+	"fmt"
+	"math/big"
+	"strings"
+	"unicode/utf8"
+
+	"github.com/jackc/pgtype"
+)
+
+type Numeric struct {
+	pgtype.Numeric
+}
+
+func Zero() Numeric {
+	return Numeric{pgtype.Numeric{Exp: 0, Int: big.NewInt(0), Status: pgtype.Present, NaN: false}}
+}
+
+func FromInt64(value int64) Numeric {
+	return Numeric{Numeric: pgtype.Numeric{Int: big.NewInt(value), Status: pgtype.Present}}
+}
+
+func FromInt64WithExp(value int64, exp int32) Numeric {
+	return Numeric{Numeric: pgtype.Numeric{Int: big.NewInt(value), Exp: exp, Status: pgtype.Present}}
+}
+
+func (n Numeric) GetFloat64() float64 {
+	if n.Status != pgtype.Present {
+		return 0
+	}
+	var balance float64
+	err := n.AssignTo(&balance)
+	if err != nil {
+		panic(err)
+	}
+	return balance
+}
+
+func (n Numeric) IsPositive() bool {
+	if n.Status != pgtype.Present {
+		return true
+	}
+	float := n.GetFloat64()
+	return float >= 0
+}
+
+func (n Numeric) IsZero() bool {
+	if n.Status != pgtype.Present {
+		return true
+	}
+	float := n.GetFloat64()
+	return float == 0
+}
+
+func (n Numeric) MatchExp(exp int32) Numeric {
+	diffExp := n.Exp - exp
+	factor := big.NewInt(0).Exp(big.NewInt(10), big.NewInt(int64(diffExp)), nil) //nolint:gomnd
+	return Numeric{pgtype.Numeric{
+		Exp:    exp,
+		Int:    big.NewInt(0).Mul(n.Int, factor),
+		Status: n.Status,
+		NaN:    n.NaN,
+	}}
+}
+
+func (n Numeric) Sub(other Numeric) Numeric {
+	left := n
+	right := other
+	if n.Exp < other.Exp {
+		right = other.MatchExp(n.Exp)
+	} else if n.Exp > other.Exp {
+		left = n.MatchExp(other.Exp)
+	}
+
+	if left.Exp == right.Exp {
+		return Numeric{pgtype.Numeric{
+			Exp: left.Exp,
+			Int: big.NewInt(0).Sub(left.Int, right.Int),
+		}}
+	}
+
+	panic("Cannot subtract with different exponents")
+}
+
+func (n Numeric) Neg() Numeric {
+	return Numeric{pgtype.Numeric{Exp: n.Exp, Int: big.NewInt(-1 * n.Int.Int64()), Status: n.Status}}
+}
+
+func (n Numeric) Add(other Numeric) Numeric {
+	left := n
+	right := other
+	if n.Exp < other.Exp {
+		right = other.MatchExp(n.Exp)
+	} else if n.Exp > other.Exp {
+		left = n.MatchExp(other.Exp)
+	}
+
+	if left.Exp == right.Exp {
+		return Numeric{pgtype.Numeric{
+			Exp: left.Exp,
+			Int: big.NewInt(0).Add(left.Int, right.Int),
+		}}
+	}
+
+	panic("Cannot add with different exponents")
+}
+
+func (n Numeric) String() string {
+	if n.Int == nil || n.Int.Int64() == 0 {
+		return "0"
+	}
+
+	s := fmt.Sprintf("%d", n.Int)
+	bytes := []byte(s)
+
+	exp := n.Exp
+	for exp > 0 {
+		bytes = append(bytes, byte('0'))
+		exp--
+	}
+
+	if exp == 0 {
+		return string(bytes)
+	}
+
+	length := int32(len(bytes))
+	var bytesWithSeparator []byte
+
+	exp = -exp
+	for length <= exp {
+		if n.Int.Int64() < 0 {
+			bytes = append([]byte{bytes[0], byte('0')}, bytes[1:]...)
+		} else {
+			bytes = append([]byte{byte('0')}, bytes...)
+		}
+		length++
+	}
+
+	split := length - exp
+	bytesWithSeparator = append(bytesWithSeparator, bytes[:split]...)
+	if split == 1 && n.Int.Int64() < 0 {
+		bytesWithSeparator = append(bytesWithSeparator, byte('0'))
+	}
+	bytesWithSeparator = append(bytesWithSeparator, byte('.'))
+	bytesWithSeparator = append(bytesWithSeparator, bytes[split:]...)
+	return string(bytesWithSeparator)
+}
+
+func (n Numeric) MarshalJSON() ([]byte, error) {
+	if n.Int == nil || n.Int.Int64() == 0 {
+		return []byte("0"), nil
+	}
+
+	s := fmt.Sprintf("%d", n.Int)
+	bytes := []byte(s)
+
+	exp := n.Exp
+	for exp > 0 {
+		bytes = append(bytes, byte('0'))
+		exp--
+	}
+
+	if exp == 0 {
+		return bytes, nil
+	}
+
+	length := int32(len(bytes))
+	var bytesWithSeparator []byte
+
+	exp = -exp
+	for length <= exp {
+		if n.Int.Int64() < 0 {
+			bytes = append([]byte{bytes[0], byte('0')}, bytes[1:]...)
+		} else {
+			bytes = append([]byte{byte('0')}, bytes...)
+		}
+		length++
+	}
+
+	split := length - exp
+	bytesWithSeparator = append(bytesWithSeparator, bytes[:split]...)
+	if split == 1 && n.Int.Int64() < 0 {
+		bytesWithSeparator = append(bytesWithSeparator, byte('0'))
+	}
+	bytesWithSeparator = append(bytesWithSeparator, byte('.'))
+	bytesWithSeparator = append(bytesWithSeparator, bytes[split:]...)
+	return bytesWithSeparator, nil
+}
+
+func MustParse(text string) Numeric {
+	num, err := Parse(text)
+	if err != nil {
+		panic(err)
+	}
+
+	return num
+}
+
+func Parse(text string) (Numeric, error) {
+	// Unify decimal separator
+	text = strings.Replace(text, ",", ".", 1)
+
+	num := Numeric{}
+	err := num.Set(text)
+	if err != nil {
+		return num, fmt.Errorf("parse numeric %s: %w", text, err)
+	}
+
+	return num, nil
+}
+
+func ParseCurrency(text string) (Numeric, error) {
+	// Remove trailing currency
+	text = trimLastChar(text)
+
+	return Parse(text)
+}
+
+func trimLastChar(s string) string {
+	r, size := utf8.DecodeLastRuneInString(s)
+	if r == utf8.RuneError && (size == 0 || size == 1) {
+		size = 0
+	}
+	return s[:len(s)-size]
+}

postgres/numeric/numeric_test.go

@@ -0,0 +1,118 @@
+package numeric_test
+
+import (
+	"testing"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+)
+
+type TestCaseMarshalJSON struct {
+	Value  numeric.Numeric
+	Result string
+}
+
+func TestMarshalJSON(t *testing.T) {
+	t.Parallel()
+	tests := []TestCaseMarshalJSON{
+		{numeric.Zero(), `0`},
+		{numeric.MustParse("1.23"), "1.23"},
+		{numeric.MustParse("1,24"), "1.24"},
+		{numeric.MustParse("1"), "1"},
+		{numeric.MustParse("10"), "10"},
+		{numeric.MustParse("100"), "100"},
+		{numeric.MustParse("1000"), "1000"},
+		{numeric.MustParse("0.1"), "0.1"},
+		{numeric.MustParse("0.01"), "0.01"},
+		{numeric.MustParse("0.001"), "0.001"},
+		{numeric.MustParse("0.0001"), "0.0001"},
+		{numeric.MustParse("-1"), "-1"},
+		{numeric.MustParse("-10"), "-10"},
+		{numeric.MustParse("-100"), "-100"},
+		{numeric.MustParse("-1000"), "-1000"},
+		{numeric.MustParse("-0.1"), "-0.1"},
+		{numeric.MustParse("-0.01"), "-0.01"},
+		{numeric.MustParse("-0.001"), "-0.001"},
+		{numeric.MustParse("-0.0001"), "-0.0001"},
+		{numeric.MustParse("123456789.12345"), "123456789.12345"},
+		{numeric.MustParse("123456789.12345"), "123456789.12345"},
+		{numeric.MustParse("-1.23"), "-1.23"},
+		{numeric.MustParse("-1,24"), "-1.24"},
+		{numeric.MustParse("-123456789.12345"), "-123456789.12345"},
+	}
+	for i := range tests {
+		test := tests[i]
+		t.Run(test.Result, func(t *testing.T) {
+			t.Parallel()
+			z := test.Value
+			result, err := z.MarshalJSON()
+			if err != nil {
+				t.Error(err)
+				return
+			}
+
+			if string(result) != test.Result {
+				t.Errorf("Expected %s, got %s", test.Result, string(result))
+				return
+			}
+		})
+	}
+}
+
+type TestCaseParse struct {
+	Result numeric.Numeric
+	Value  string
+}
+
+func TestParse(t *testing.T) {
+	t.Parallel()
+	tests := []TestCaseParse{
+		{numeric.FromInt64WithExp(0, 0), `0`},
+		{numeric.FromInt64WithExp(1, 0), `1`},
+		{numeric.FromInt64WithExp(1, 1), `10`},
+		{numeric.FromInt64WithExp(1, 2), `100`},
+		{numeric.FromInt64WithExp(1, 3), `1000`},
+		{numeric.FromInt64WithExp(1, -1), `0.1`},
+		{numeric.FromInt64WithExp(1, -2), `0.01`},
+		{numeric.FromInt64WithExp(1, -3), `0.001`},
+		{numeric.FromInt64WithExp(1, -4), `0.0001`},
+		{numeric.FromInt64WithExp(-1, 0), `-1`},
+		{numeric.FromInt64WithExp(-1, 1), `-10`},
+		{numeric.FromInt64WithExp(-1, 2), `-100`},
+		{numeric.FromInt64WithExp(-1, 3), `-1000`},
+		{numeric.FromInt64WithExp(-1, -1), `-0.1`},
+		{numeric.FromInt64WithExp(-1, -2), `-0.01`},
+		{numeric.FromInt64WithExp(-1, -3), `-0.001`},
+		{numeric.FromInt64WithExp(-1, -4), `-0.0001`},
+		{numeric.FromInt64WithExp(123, -2), "1.23"},
+		{numeric.FromInt64WithExp(124, -2), "1,24"},
+		{numeric.FromInt64WithExp(12345678912345, -5), "123456789.12345"},
+		{numeric.FromInt64WithExp(0, 0), `-0`},
+		{numeric.FromInt64WithExp(-1, 0), `-1`},
+		{numeric.FromInt64WithExp(-1, 1), `-10`},
+		{numeric.FromInt64WithExp(-1, 2), `-100`},
+		{numeric.FromInt64WithExp(-123, -2), "-1.23"},
+		{numeric.FromInt64WithExp(-124, -2), "-1,24"},
+		{numeric.FromInt64WithExp(-12345678912345, -5), "-123456789.12345"},
+	}
+	for i := range tests {
+		test := tests[i]
+		t.Run(test.Value, func(t *testing.T) {
+			t.Parallel()
+			result, err := numeric.Parse(test.Value)
+			if err != nil {
+				t.Error(err)
+				return
+			}
+
+			if test.Result.Int.Int64() != result.Int.Int64() {
+				t.Errorf("Expected int %d, got %d", test.Result.Int, result.Int)
+				return
+			}
+
+			if test.Result.Exp != result.Exp {
+				t.Errorf("Expected exp %d, got %d", test.Result.Exp, result.Exp)
+				return
+			}
+		})
+	}
+}

postgres/payees.sql.go

@@ -58,7 +58,7 @@ func (q *Queries) GetPayees(ctx context.Context, budgetID uuid.UUID) ([]Payee, e
 }
 
 const searchPayees = `-- name: SearchPayees :many
-SELECT payees.id, payees.budget_id, payees.name FROM payees 
+SELECT payees.id, payees.budget_id, payees.name, 'payee' as type FROM payees 
 WHERE payees.budget_id = $1
 AND payees.name LIKE $2
 ORDER BY payees.name
@@ -69,16 +69,28 @@ type SearchPayeesParams struct {
 	Search   string
 }
 
-func (q *Queries) SearchPayees(ctx context.Context, arg SearchPayeesParams) ([]Payee, error) {
+type SearchPayeesRow struct {
+	ID       uuid.UUID
+	BudgetID uuid.UUID
+	Name     string
+	Type     interface{}
+}
+
+func (q *Queries) SearchPayees(ctx context.Context, arg SearchPayeesParams) ([]SearchPayeesRow, error) {
 	rows, err := q.db.QueryContext(ctx, searchPayees, arg.BudgetID, arg.Search)
 	if err != nil {
 		return nil, err
 	}
 	defer rows.Close()
-	var items []Payee
+	var items []SearchPayeesRow
 	for rows.Next() {
-		var i Payee
-		if err := rows.Scan(&i.ID, &i.BudgetID, &i.Name); err != nil {
+		var i SearchPayeesRow
+		if err := rows.Scan(
+			&i.ID,
+			&i.BudgetID,
+			&i.Name,
+			&i.Type,
+		); err != nil {
 			return nil, err
 		}
 		items = append(items, i)

postgres/queries/accounts.sql

@@ -14,9 +14,24 @@ WHERE accounts.budget_id = $1
 ORDER BY accounts.name;
 
 -- name: GetAccountsWithBalance :many
-SELECT accounts.id, accounts.name, accounts.on_budget, SUM(transactions.amount)::decimal(12,2) as balance
+SELECT accounts.id, accounts.name, accounts.on_budget, 
+        (SELECT MAX(transactions.date) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.status = 'Reconciled')::date as last_reconciled,
+        (SELECT SUM(transactions.amount) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.date < NOW())::decimal(12,2) as working_balance,
+        (SELECT SUM(transactions.amount) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.date < NOW() AND transactions.status IN ('Cleared', 'Reconciled'))::decimal(12,2) as cleared_balance,
+        (SELECT SUM(transactions.amount) FROM transactions WHERE transactions.account_id = accounts.id AND transactions.date < NOW() AND transactions.status = 'Reconciled')::decimal(12,2) as reconciled_balance
 FROM accounts
-LEFT JOIN transactions ON transactions.account_id = accounts.id AND transactions.date < NOW()
 WHERE accounts.budget_id = $1
-GROUP BY accounts.id, accounts.name
 ORDER BY accounts.name;
+
+-- name: SearchAccounts :many
+SELECT accounts.id, accounts.budget_id, accounts.name, 'account' as type FROM accounts
+WHERE accounts.budget_id = @budget_id
+AND accounts.name LIKE @search
+ORDER BY accounts.name;
+
+-- name: UpdateAccount :one
+UPDATE accounts
+SET name = $1,
+    on_budget = $2
+WHERE accounts.id = $3
+RETURNING *;

postgres/queries/assignments.sql

@@ -16,3 +16,10 @@ WHERE categories.id = assignments.category_id AND category_groups.budget_id = @b
 SELECT *
 FROM assignments_by_month
 WHERE assignments_by_month.budget_id = @budget_id;
+
+-- name: GetAllAssignments :many
+SELECT assignments.date, categories.name as category, category_groups.name as group, assignments.amount
+FROM assignments
+INNER JOIN categories ON categories.id = assignments.category_id
+INNER JOIN category_groups ON categories.category_group_id = category_groups.id
+WHERE category_groups.budget_id = @budget_id;

postgres/queries/categories.sql

@@ -21,7 +21,8 @@ WHERE category_groups.budget_id = $1
 ORDER BY category_groups.name, categories.name;
 
 -- name: SearchCategories :many
-SELECT CONCAT(category_groups.name, ' : ', categories.name) as name, categories.id FROM categories
+SELECT CONCAT(category_groups.name, ' : ', categories.name) as name, categories.id, 'category' as type
+FROM categories
 INNER JOIN category_groups ON categories.category_group_id = category_groups.id
 WHERE category_groups.budget_id = @budget_id
 AND categories.name LIKE @search

postgres/queries/payees.sql

@@ -10,7 +10,7 @@ WHERE payees.budget_id = $1
 ORDER BY name;
 
 -- name: SearchPayees :many
-SELECT payees.* FROM payees 
+SELECT payees.*, 'payee' as type FROM payees 
 WHERE payees.budget_id = @budget_id
 AND payees.name LIKE @search
 ORDER BY payees.name;

postgres/queries/transactions.sql

@@ -1,60 +1,40 @@
 -- name: GetTransaction :one
-SELECT * FROM transactions
+SELECT * FROM display_transactions
 WHERE id = $1;
 
 -- name: CreateTransaction :one
 INSERT INTO transactions
 (date, memo, amount, account_id, payee_id, category_id, group_id, status)
 VALUES ($1, $2, $3, $4, $5, $6, $7, $8)
-RETURNING *;
+RETURNING id;
 
 -- name: UpdateTransaction :exec
 UPDATE transactions
 SET date = $1,
     memo = $2,
     amount = $3,
-    account_id = $4,
-    payee_id = $5,
-    category_id = $6
-WHERE id = $7;
+    payee_id = $4,
+    category_id = $5
+WHERE id = $6;
+
+-- name: SetTransactionReconciled :exec
+UPDATE transactions
+SET status = 'Reconciled'
+WHERE id = $1;
 
 -- name: DeleteTransaction :exec
 DELETE FROM transactions
 WHERE id = $1;
 
--- name: GetTransactionsForBudget :many
-SELECT  transactions.id, transactions.date, transactions.memo, transactions.amount, transactions.group_id, transactions.status,
-        accounts.name as account, COALESCE(payees.name, '') as payee, COALESCE(category_groups.name, '') as category_group, COALESCE(categories.name, '') as category
-FROM transactions 
-INNER JOIN accounts ON accounts.id = transactions.account_id
-LEFT JOIN payees ON payees.id = transactions.payee_id
-LEFT JOIN categories ON categories.id = transactions.category_id
-LEFT JOIN category_groups ON category_groups.id = categories.category_group_id
-WHERE accounts.budget_id = $1
-ORDER BY transactions.date DESC
-LIMIT 200;
+-- name: GetAllTransactionsForBudget :many
+SELECT  t.*
+FROM display_transactions AS t
+WHERE t.budget_id = $1;
 
 -- name: GetTransactionsForAccount :many
-SELECT  transactions.id, transactions.date, transactions.memo, 
-        transactions.amount, transactions.group_id, transactions.status,
-        accounts.name as account, 
-        COALESCE(payees.name, '') as payee, 
-        COALESCE(category_groups.name, '') as category_group, 
-        COALESCE(categories.name, '') as category,
-        (
-            SELECT CONCAT(otherAccounts.name) 
-            FROM transactions otherTransactions 
-            LEFT JOIN accounts otherAccounts ON otherAccounts.id = otherTransactions.account_id
-            WHERE otherTransactions.group_id = transactions.group_id 
-            AND otherTransactions.id != transactions.id
-        ) as transfer_account
-FROM transactions 
-INNER JOIN accounts ON accounts.id = transactions.account_id
-LEFT JOIN payees ON payees.id = transactions.payee_id
-LEFT JOIN categories ON categories.id = transactions.category_id
-LEFT JOIN category_groups ON category_groups.id = categories.category_group_id
-WHERE transactions.account_id = $1
-ORDER BY transactions.date DESC
+SELECT  t.*
+FROM display_transactions AS t
+WHERE t.account_id = $1
 LIMIT 200;
 
 -- name: DeleteAllTransactions :execrows

postgres/schema/0015_transactions-view.sql

@@ -0,0 +1,25 @@
+-- +goose Up
+CREATE VIEW display_transactions AS 
+        SELECT  transactions.id, transactions.date, transactions.memo, 
+                transactions.amount, transactions.group_id, transactions.status,
+                accounts.name as account, transactions.payee_id, transactions.category_id,
+                COALESCE(payees.name, '') as payee, 
+                COALESCE(category_groups.name, '') as category_group, 
+                COALESCE(categories.name, '') as category,
+                COALESCE((
+                SELECT CONCAT(otherAccounts.name) 
+                FROM transactions otherTransactions 
+                LEFT JOIN accounts otherAccounts ON otherAccounts.id = otherTransactions.account_id
+                WHERE otherTransactions.group_id = transactions.group_id 
+                AND otherTransactions.id != transactions.id
+                ), '')::text as transfer_account,
+                accounts.budget_id, transactions.account_id
+        FROM transactions 
+        INNER JOIN accounts ON accounts.id = transactions.account_id
+        LEFT JOIN payees ON payees.id = transactions.payee_id
+        LEFT JOIN categories ON categories.id = transactions.category_id
+        LEFT JOIN category_groups ON category_groups.id = categories.category_group_id
+        ORDER BY transactions.date DESC;
+
+-- +goose Down
+DROP VIEW display_transactions;

postgres/transactions.sql.go

@@ -7,6 +7,7 @@ import (
 	"context"
 	"time"
 
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
 )
 
@@ -14,13 +15,13 @@ const createTransaction = `-- name: CreateTransaction :one
 INSERT INTO transactions
 (date, memo, amount, account_id, payee_id, category_id, group_id, status)
 VALUES ($1, $2, $3, $4, $5, $6, $7, $8)
-RETURNING id, date, memo, amount, account_id, category_id, payee_id, group_id, status
+RETURNING id
 `
 
 type CreateTransactionParams struct {
 	Date       time.Time
 	Memo       string
-	Amount     Numeric
+	Amount     numeric.Numeric
 	AccountID  uuid.UUID
 	PayeeID    uuid.NullUUID
 	CategoryID uuid.NullUUID
@@ -28,7 +29,7 @@ type CreateTransactionParams struct {
 	Status     TransactionStatus
 }
 
-func (q *Queries) CreateTransaction(ctx context.Context, arg CreateTransactionParams) (Transaction, error) {
+func (q *Queries) CreateTransaction(ctx context.Context, arg CreateTransactionParams) (uuid.UUID, error) {
 	row := q.db.QueryRowContext(ctx, createTransaction,
 		arg.Date,
 		arg.Memo,
@@ -39,19 +40,9 @@ func (q *Queries) CreateTransaction(ctx context.Context, arg CreateTransactionPa
 		arg.GroupID,
 		arg.Status,
 	)
-	var i Transaction
-	err := row.Scan(
-		&i.ID,
-		&i.Date,
-		&i.Memo,
-		&i.Amount,
-		&i.AccountID,
-		&i.CategoryID,
-		&i.PayeeID,
-		&i.GroupID,
-		&i.Status,
-	)
-	return i, err
+	var id uuid.UUID
+	err := row.Scan(&id)
+	return id, err
 }
 
 const deleteAllTransactions = `-- name: DeleteAllTransactions :execrows
@@ -79,24 +70,75 @@ func (q *Queries) DeleteTransaction(ctx context.Context, id uuid.UUID) error {
 	return err
 }
 
+const getAllTransactionsForBudget = `-- name: GetAllTransactionsForBudget :many
+SELECT  t.id, t.date, t.memo, t.amount, t.group_id, t.status, t.account, t.payee_id, t.category_id, t.payee, t.category_group, t.category, t.transfer_account, t.budget_id, t.account_id
+FROM display_transactions AS t
+WHERE t.budget_id = $1
+`
+
+func (q *Queries) GetAllTransactionsForBudget(ctx context.Context, budgetID uuid.UUID) ([]DisplayTransaction, error) {
+	rows, err := q.db.QueryContext(ctx, getAllTransactionsForBudget, budgetID)
+	if err != nil {
+		return nil, err
+	}
+	defer rows.Close()
+	var items []DisplayTransaction
+	for rows.Next() {
+		var i DisplayTransaction
+		if err := rows.Scan(
+			&i.ID,
+			&i.Date,
+			&i.Memo,
+			&i.Amount,
+			&i.GroupID,
+			&i.Status,
+			&i.Account,
+			&i.PayeeID,
+			&i.CategoryID,
+			&i.Payee,
+			&i.CategoryGroup,
+			&i.Category,
+			&i.TransferAccount,
+			&i.BudgetID,
+			&i.AccountID,
+		); err != nil {
+			return nil, err
+		}
+		items = append(items, i)
+	}
+	if err := rows.Close(); err != nil {
+		return nil, err
+	}
+	if err := rows.Err(); err != nil {
+		return nil, err
+	}
+	return items, nil
+}
+
 const getTransaction = `-- name: GetTransaction :one
-SELECT id, date, memo, amount, account_id, category_id, payee_id, group_id, status FROM transactions
+SELECT id, date, memo, amount, group_id, status, account, payee_id, category_id, payee, category_group, category, transfer_account, budget_id, account_id FROM display_transactions
 WHERE id = $1
 `
 
-func (q *Queries) GetTransaction(ctx context.Context, id uuid.UUID) (Transaction, error) {
+func (q *Queries) GetTransaction(ctx context.Context, id uuid.UUID) (DisplayTransaction, error) {
 	row := q.db.QueryRowContext(ctx, getTransaction, id)
-	var i Transaction
+	var i DisplayTransaction
 	err := row.Scan(
 		&i.ID,
 		&i.Date,
 		&i.Memo,
 		&i.Amount,
-		&i.AccountID,
-		&i.CategoryID,
-		&i.PayeeID,
 		&i.GroupID,
 		&i.Status,
+		&i.Account,
+		&i.PayeeID,
+		&i.CategoryID,
+		&i.Payee,
+		&i.CategoryGroup,
+		&i.Category,
+		&i.TransferAccount,
+		&i.BudgetID,
+		&i.AccountID,
 	)
 	return i, err
 }
@@ -136,52 +178,21 @@ func (q *Queries) GetTransactionsByMonthAndCategory(ctx context.Context, budgetI
 }
 
 const getTransactionsForAccount = `-- name: GetTransactionsForAccount :many
-SELECT  transactions.id, transactions.date, transactions.memo, 
-        transactions.amount, transactions.group_id, transactions.status,
-        accounts.name as account, 
-        COALESCE(payees.name, '') as payee, 
-        COALESCE(category_groups.name, '') as category_group, 
-        COALESCE(categories.name, '') as category,
-        (
-            SELECT CONCAT(otherAccounts.name) 
-            FROM transactions otherTransactions 
-            LEFT JOIN accounts otherAccounts ON otherAccounts.id = otherTransactions.account_id
-            WHERE otherTransactions.group_id = transactions.group_id 
-            AND otherTransactions.id != transactions.id
-        ) as transfer_account
-FROM transactions 
-INNER JOIN accounts ON accounts.id = transactions.account_id
-LEFT JOIN payees ON payees.id = transactions.payee_id
-LEFT JOIN categories ON categories.id = transactions.category_id
-LEFT JOIN category_groups ON category_groups.id = categories.category_group_id
-WHERE transactions.account_id = $1
-ORDER BY transactions.date DESC
+SELECT  t.id, t.date, t.memo, t.amount, t.group_id, t.status, t.account, t.payee_id, t.category_id, t.payee, t.category_group, t.category, t.transfer_account, t.budget_id, t.account_id
+FROM display_transactions AS t
+WHERE t.account_id = $1
 LIMIT 200
 `
 
-type GetTransactionsForAccountRow struct {
-	ID              uuid.UUID
-	Date            time.Time
-	Memo            string
-	Amount          Numeric
-	GroupID         uuid.NullUUID
-	Status          TransactionStatus
-	Account         string
-	Payee           string
-	CategoryGroup   string
-	Category        string
-	TransferAccount interface{}
-}
-
-func (q *Queries) GetTransactionsForAccount(ctx context.Context, accountID uuid.UUID) ([]GetTransactionsForAccountRow, error) {
+func (q *Queries) GetTransactionsForAccount(ctx context.Context, accountID uuid.UUID) ([]DisplayTransaction, error) {
 	rows, err := q.db.QueryContext(ctx, getTransactionsForAccount, accountID)
 	if err != nil {
 		return nil, err
 	}
 	defer rows.Close()
-	var items []GetTransactionsForAccountRow
+	var items []DisplayTransaction
 	for rows.Next() {
-		var i GetTransactionsForAccountRow
+		var i DisplayTransaction
 		if err := rows.Scan(
 			&i.ID,
 			&i.Date,
@@ -190,10 +201,14 @@ func (q *Queries) GetTransactionsForAccount(ctx context.Context, accountID uuid.
 			&i.GroupID,
 			&i.Status,
 			&i.Account,
+			&i.PayeeID,
+			&i.CategoryID,
 			&i.Payee,
 			&i.CategoryGroup,
 			&i.Category,
 			&i.TransferAccount,
+			&i.BudgetID,
+			&i.AccountID,
 		); err != nil {
 			return nil, err
 		}
@@ -208,64 +223,15 @@ func (q *Queries) GetTransactionsForAccount(ctx context.Context, accountID uuid.
 	return items, nil
 }
 
-const getTransactionsForBudget = `-- name: GetTransactionsForBudget :many
-SELECT  transactions.id, transactions.date, transactions.memo, transactions.amount, transactions.group_id, transactions.status,
-        accounts.name as account, COALESCE(payees.name, '') as payee, COALESCE(category_groups.name, '') as category_group, COALESCE(categories.name, '') as category
-FROM transactions 
-INNER JOIN accounts ON accounts.id = transactions.account_id
-LEFT JOIN payees ON payees.id = transactions.payee_id
-LEFT JOIN categories ON categories.id = transactions.category_id
-LEFT JOIN category_groups ON category_groups.id = categories.category_group_id
-WHERE accounts.budget_id = $1
-ORDER BY transactions.date DESC
-LIMIT 200
+const setTransactionReconciled = `-- name: SetTransactionReconciled :exec
+UPDATE transactions
+SET status = 'Reconciled'
+WHERE id = $1
 `
 
-type GetTransactionsForBudgetRow struct {
-	ID            uuid.UUID
-	Date          time.Time
-	Memo          string
-	Amount        Numeric
-	GroupID       uuid.NullUUID
-	Status        TransactionStatus
-	Account       string
-	Payee         string
-	CategoryGroup string
-	Category      string
-}
-
-func (q *Queries) GetTransactionsForBudget(ctx context.Context, budgetID uuid.UUID) ([]GetTransactionsForBudgetRow, error) {
-	rows, err := q.db.QueryContext(ctx, getTransactionsForBudget, budgetID)
-	if err != nil {
-		return nil, err
-	}
-	defer rows.Close()
-	var items []GetTransactionsForBudgetRow
-	for rows.Next() {
-		var i GetTransactionsForBudgetRow
-		if err := rows.Scan(
-			&i.ID,
-			&i.Date,
-			&i.Memo,
-			&i.Amount,
-			&i.GroupID,
-			&i.Status,
-			&i.Account,
-			&i.Payee,
-			&i.CategoryGroup,
-			&i.Category,
-		); err != nil {
-			return nil, err
-		}
-		items = append(items, i)
-	}
-	if err := rows.Close(); err != nil {
-		return nil, err
-	}
-	if err := rows.Err(); err != nil {
-		return nil, err
-	}
-	return items, nil
+func (q *Queries) SetTransactionReconciled(ctx context.Context, id uuid.UUID) error {
+	_, err := q.db.ExecContext(ctx, setTransactionReconciled, id)
+	return err
 }
 
 const updateTransaction = `-- name: UpdateTransaction :exec
@@ -273,17 +239,15 @@ UPDATE transactions
 SET date = $1,
     memo = $2,
     amount = $3,
-    account_id = $4,
-    payee_id = $5,
-    category_id = $6
-WHERE id = $7
+    payee_id = $4,
+    category_id = $5
+WHERE id = $6
 `
 
 type UpdateTransactionParams struct {
 	Date       time.Time
 	Memo       string
-	Amount     Numeric
-	AccountID  uuid.UUID
+	Amount     numeric.Numeric
 	PayeeID    uuid.NullUUID
 	CategoryID uuid.NullUUID
 	ID         uuid.UUID
@@ -294,7 +258,6 @@ func (q *Queries) UpdateTransaction(ctx context.Context, arg UpdateTransactionPa
 		arg.Date,
 		arg.Memo,
 		arg.Amount,
-		arg.AccountID,
 		arg.PayeeID,
 		arg.CategoryID,
 		arg.ID,

postgres/ynab-export.go

@@ -0,0 +1,144 @@
+package postgres
+
+import (
+	"context"
+	"encoding/csv"
+	"fmt"
+	"io"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+	"github.com/google/uuid"
+)
+
+type YNABExport struct {
+	queries  *Queries
+	budgetID uuid.UUID
+}
+
+func NewYNABExport(context context.Context, queries *Queries, budgetID uuid.UUID) (*YNABExport, error) {
+	return &YNABExport{
+		queries:  queries,
+		budgetID: budgetID,
+	}, nil
+}
+
+// ImportAssignments expects a TSV-file as exported by YNAB in the following format:
+// "Month"	"Category Group/Category"	"Category Group"	"Category"	"Budgeted"	"Activity"	"Available"
+// "Apr 2019"	"Income: Next Month"	"Income"	"Next Month"	0,00€	0,00€	0,00€
+//
+// Activity and Available are not imported, since they are determined by the transactions and historic assignments.
+func (ynab *YNABExport) ExportAssignments(context context.Context, w io.Writer) error {
+	csv := csv.NewWriter(w)
+	csv.Comma = '\t'
+
+	assignments, err := ynab.queries.GetAllAssignments(context, ynab.budgetID)
+	if err != nil {
+		return fmt.Errorf("load assignments: %w", err)
+	}
+
+	count := 0
+	for _, assignment := range assignments {
+		row := []string{
+			assignment.Date.Format("Jan 2006"),
+			assignment.Group + ": " + assignment.Category,
+			assignment.Group,
+			assignment.Category,
+			assignment.Amount.String() + "€",
+			numeric.Zero().String() + "€",
+			numeric.Zero().String() + "€",
+		}
+
+		err := csv.Write(row)
+		if err != nil {
+			return fmt.Errorf("write assignment: %w", err)
+		}
+		count++
+	}
+	csv.Flush()
+
+	fmt.Printf("Exported %d assignments\n", count)
+
+	return nil
+}
+
+// ImportTransactions expects a TSV-file as exported by YNAB in the following format:
+// "Account"	"Flag"	"Date"	"Payee"	"Category Group/Category"	"Category Group"	"Category"	"Memo"	"Outflow"	"Inflow"	"Cleared"
+// "Cash"	""	"11.12.2021"	"Transfer : Checking"	""	""	""	"Brought to bank"	500,00€	0,00€	"Cleared".
+func (ynab *YNABExport) ExportTransactions(context context.Context, w io.Writer) error {
+	csv := csv.NewWriter(w)
+	csv.Comma = '\t'
+
+	transactions, err := ynab.queries.GetAllTransactionsForBudget(context, ynab.budgetID)
+	if err != nil {
+		return fmt.Errorf("load transactions: %w", err)
+	}
+
+	header := []string{
+		"Account",
+		"Flag",
+		"Date",
+		"Payee",
+		"Category Group/Category",
+		"Category Group",
+		"Category",
+		"Memo",
+		"Outflow",
+		"Inflow",
+		"Cleared",
+	}
+
+	err = csv.Write(header)
+	if err != nil {
+		return fmt.Errorf("write transaction: %w", err)
+	}
+
+	count := 0
+	for _, transaction := range transactions {
+		row := GetTransactionRow(transaction)
+
+		err := csv.Write(row)
+		if err != nil {
+			return fmt.Errorf("write transaction: %w", err)
+		}
+		count++
+	}
+
+	csv.Flush()
+
+	fmt.Printf("Exported %d transactions\n", count)
+
+	return nil
+}
+
+func GetTransactionRow(transaction DisplayTransaction) []string {
+	row := []string{
+		transaction.Account,
+		"", // Flag
+		transaction.Date.Format("02.01.2006"),
+	}
+
+	if transaction.TransferAccount != "" {
+		row = append(row, "Transfer : "+transaction.TransferAccount)
+	} else {
+		row = append(row, transaction.Payee)
+	}
+
+	if transaction.CategoryGroup != "" && transaction.Category != "" {
+		row = append(row,
+			transaction.CategoryGroup+": "+transaction.Category,
+			transaction.CategoryGroup,
+			transaction.Category)
+	} else {
+		row = append(row, "", "", "")
+	}
+
+	row = append(row, transaction.Memo)
+
+	if transaction.Amount.IsPositive() {
+		row = append(row, numeric.Zero().String()+"€", transaction.Amount.String()+"€")
+	} else {
+		row = append(row, transaction.Amount.String()[1:]+"€", numeric.Zero().String()+"€")
+	}
+
+	return append(row, string(transaction.Status))
+}

postgres/ynab-import.go

@@ -7,13 +7,12 @@ import (
 	"io"
 	"strings"
 	"time"
-	"unicode/utf8"
 
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
 )
 
 type YNABImport struct {
-	Context        context.Context
 	accounts       []Account
 	payees         []Payee
 	categories     []GetCategoriesRow
@@ -22,73 +21,70 @@ type YNABImport struct {
 	budgetID       uuid.UUID
 }
 
-func NewYNABImport(context context.Context, q *Queries, budgetID uuid.UUID) (*YNABImport, error) {
-	accounts, err := q.GetAccounts(context, budgetID)
+func NewYNABImport(context context.Context, queries *Queries, budgetID uuid.UUID) (*YNABImport, error) {
+	accounts, err := queries.GetAccounts(context, budgetID)
 	if err != nil {
 		return nil, err
 	}
 
-	payees, err := q.GetPayees(context, budgetID)
+	payees, err := queries.GetPayees(context, budgetID)
 	if err != nil {
 		return nil, err
 	}
 
-	categories, err := q.GetCategories(context, budgetID)
+	categories, err := queries.GetCategories(context, budgetID)
 	if err != nil {
 		return nil, err
 	}
 
-	categoryGroups, err := q.GetCategoryGroups(context, budgetID)
+	categoryGroups, err := queries.GetCategoryGroups(context, budgetID)
 	if err != nil {
 		return nil, err
 	}
 
 	return &YNABImport{
-		Context:        context,
 		accounts:       accounts,
 		payees:         payees,
 		categories:     categories,
 		categoryGroups: categoryGroups,
-		queries:        q,
+		queries:        queries,
 		budgetID:       budgetID,
 	}, nil
-
 }
 
 // ImportAssignments expects a TSV-file as exported by YNAB in the following format:
-//"Month"	"Category Group/Category"	"Category Group"	"Category"	"Budgeted"	"Activity"	"Available"
-//"Apr 2019"	"Income: Next Month"	"Income"	"Next Month"	0,00€	0,00€	0,00€
+// "Month"	"Category Group/Category"	"Category Group"	"Category"	"Budgeted"	"Activity"	"Available"
+// "Apr 2019"	"Income: Next Month"	"Income"	"Next Month"	0,00€	0,00€	0,00€
 //
-// Activity and Available are not imported, since they are determined by the transactions and historic assignments
-func (ynab *YNABImport) ImportAssignments(r io.Reader) error {
+// Activity and Available are not imported, since they are determined by the transactions and historic assignments.
+func (ynab *YNABImport) ImportAssignments(context context.Context, r io.Reader) error {
 	csv := csv.NewReader(r)
 	csv.Comma = '\t'
 	csv.LazyQuotes = true
 
 	csvData, err := csv.ReadAll()
 	if err != nil {
-		return fmt.Errorf("could not read from tsv: %w", err)
+		return fmt.Errorf("read from tsv: %w", err)
 	}
 
 	count := 0
 	for _, record := range csvData[1:] {
-
 		dateString := record[0]
 		date, err := time.Parse("Jan 2006", dateString)
 		if err != nil {
-			return fmt.Errorf("could not parse date %s: %w", dateString, err)
+			return fmt.Errorf("parse date %s: %w", dateString, err)
 		}
 
-		categoryGroup, categoryName := record[2], record[3] //also in 1 joined by :
-		category, err := ynab.GetCategory(categoryGroup, categoryName)
+		categoryGroup, categoryName := record[2], record[3] // also in 1 joined by :
+		category, err := ynab.GetCategory(context, categoryGroup, categoryName)
 		if err != nil {
-			return fmt.Errorf("could not get category %s/%s: %w", categoryGroup, categoryName, err)
+			return fmt.Errorf("get category %s/%s: %w", categoryGroup, categoryName, err)
 		}
 
 		amountString := record[4]
 		amount, err := GetAmount(amountString, "0,00€")
 		if err != nil {
-			return fmt.Errorf("could not parse amount %s: %w", amountString, err)
+			return fmt.Errorf("parse amount %s: %w", amountString, err)
 		}
 
 		if amount.Int.Int64() == 0 {
@@ -100,9 +96,9 @@ func (ynab *YNABImport) ImportAssignments(r io.Reader) error {
 			CategoryID: category.UUID,
 			Amount:     amount,
 		}
-		_, err = ynab.queries.CreateAssignment(ynab.Context, assignment)
+		_, err = ynab.queries.CreateAssignment(context, assignment)
 		if err != nil {
-			return fmt.Errorf("could not save assignment %v: %w", assignment, err)
+			return fmt.Errorf("save assignment %v: %w", assignment, err)
 		}
 
 		count++
@@ -121,39 +117,80 @@ type Transfer struct {
 }
 
 // ImportTransactions expects a TSV-file as exported by YNAB in the following format:
-
-func (ynab *YNABImport) ImportTransactions(r io.Reader) error {
+// "Account"	"Flag"	"Date"	"Payee"	"Category Group/Category"	"Category Group"	"Category"	"Memo"	"Outflow"	"Inflow"	"Cleared"
+// "Cash"	""	"11.12.2021"	"Transfer : Checking"	""	""	""	"Brought to bank"	500,00€	0,00€	"Cleared".
+func (ynab *YNABImport) ImportTransactions(context context.Context, r io.Reader) error {
 	csv := csv.NewReader(r)
 	csv.Comma = '\t'
 	csv.LazyQuotes = true
 
 	csvData, err := csv.ReadAll()
 	if err != nil {
-		return fmt.Errorf("could not read from tsv: %w", err)
+		return fmt.Errorf("read from tsv: %w", err)
 	}
 
 	var openTransfers []Transfer
 
 	count := 0
 	for _, record := range csvData[1:] {
-		accountName := record[0]
-		account, err := ynab.GetAccount(accountName)
+		transaction, err := ynab.GetTransaction(context, record)
 		if err != nil {
-			return fmt.Errorf("could not get account %s: %w", accountName, err)
+			return err
 		}
 
-		//flag := record[1]
+		payeeName := record[3]
+		// Transaction is a transfer
+		if strings.HasPrefix(payeeName, "Transfer : ") {
+			err = ynab.ImportTransferTransaction(context, payeeName, transaction.CreateTransactionParams,
+				&openTransfers, transaction.Account, transaction.Amount)
+		} else {
+			err = ynab.ImportRegularTransaction(context, payeeName, transaction.CreateTransactionParams)
+		}
+		if err != nil {
+			return err
+		}
+
+		count++
+	}
+
+	for _, openTransfer := range openTransfers {
+		fmt.Printf("Saving unmatched transfer from %s to %s on %s over %f as regular transaction\n",
+			openTransfer.FromAccount, openTransfer.ToAccount, openTransfer.Date, openTransfer.Amount.GetFloat64())
+		_, err = ynab.queries.CreateTransaction(context, openTransfer.CreateTransactionParams)
+		if err != nil {
+			return fmt.Errorf("save transaction %v: %w", openTransfer.CreateTransactionParams, err)
+		}
+	}
+
+	fmt.Printf("Imported %d transactions\n", count)
+
+	return nil
+}
+
+type NewTransaction struct {
+	CreateTransactionParams
+	Account *Account
+}
+
+func (ynab *YNABImport) GetTransaction(context context.Context, record []string) (NewTransaction, error) {
+	accountName := record[0]
+	account, err := ynab.GetAccount(context, accountName)
+	if err != nil {
+		return NewTransaction{}, fmt.Errorf("get account %s: %w", accountName, err)
+	}
+
+	// flag := record[1]
 
 	dateString := record[2]
 	date, err := time.Parse("02.01.2006", dateString)
 	if err != nil {
-			return fmt.Errorf("could not parse date %s: %w", dateString, err)
+		return NewTransaction{}, fmt.Errorf("parse date %s: %w", dateString, err)
 	}
 
-		categoryGroup, categoryName := record[5], record[6] //also in 4 joined by :
-		category, err := ynab.GetCategory(categoryGroup, categoryName)
+	categoryGroup, categoryName := record[5], record[6] // also in 4 joined by :
+	category, err := ynab.GetCategory(context, categoryGroup, categoryName)
 	if err != nil {
-			return fmt.Errorf("could not get category %s/%s: %w", categoryGroup, categoryName, err)
+		return NewTransaction{}, fmt.Errorf("get category %s/%s: %w", categoryGroup, categoryName, err)
 	}
 
 	memo := record[7]
@@ -162,7 +199,7 @@ func (ynab *YNABImport) ImportTransactions(r io.Reader) error {
 	inflow := record[9]
 	amount, err := GetAmount(inflow, outflow)
 	if err != nil {
-			return fmt.Errorf("could not parse amount from (%s/%s): %w", inflow, outflow, err)
+		return NewTransaction{}, fmt.Errorf("parse amount from (%s/%s): %w", inflow, outflow, err)
 	}
 
 	statusEnum := TransactionStatusUncleared
@@ -175,33 +212,52 @@ func (ynab *YNABImport) ImportTransactions(r io.Reader) error {
 	case "Uncleared":
 	}
 
-		transaction := CreateTransactionParams{
+	return NewTransaction{
+		CreateTransactionParams: CreateTransactionParams{
 			Date:       date,
 			Memo:       memo,
 			AccountID:  account.ID,
 			CategoryID: category,
 			Amount:     amount,
 			Status:     statusEnum,
-		}
+		},
+		Account: account,
+	}, nil
+}
 
-		payeeName := record[3]
-		if strings.HasPrefix(payeeName, "Transfer : ") {
-			// Transaction is a transfer to
-			transferToAccountName := payeeName[11:]
-			transferToAccount, err := ynab.GetAccount(transferToAccountName)
+func (ynab *YNABImport) ImportRegularTransaction(context context.Context, payeeName string,
+	transaction CreateTransactionParams) error {
+	payeeID, err := ynab.GetPayee(context, payeeName)
 	if err != nil {
-				return fmt.Errorf("Could not get transfer account %s: %w", transferToAccountName, err)
+		return fmt.Errorf("get payee %s: %w", payeeName, err)
+	}
+	transaction.PayeeID = payeeID
+
+	_, err = ynab.queries.CreateTransaction(context, transaction)
+	if err != nil {
+		return fmt.Errorf("save transaction %v: %w", transaction, err)
+	}
+	return nil
+}
+
+func (ynab *YNABImport) ImportTransferTransaction(context context.Context, payeeName string,
+	transaction CreateTransactionParams, openTransfers *[]Transfer,
+	account *Account, amount numeric.Numeric) error {
+	transferToAccountName := payeeName[11:]
+	transferToAccount, err := ynab.GetAccount(context, transferToAccountName)
+	if err != nil {
+		return fmt.Errorf("get transfer account %s: %w", transferToAccountName, err)
 	}
 
 	transfer := Transfer{
 		transaction,
 		transferToAccount,
-				accountName,
+		account.Name,
 		transferToAccountName,
 	}
 
 	found := false
-			for i, openTransfer := range openTransfers {
+	for i, openTransfer := range *openTransfers {
 		if openTransfer.TransferToAccount.ID != transfer.AccountID {
 			continue
 		}
@@ -213,96 +269,58 @@ func (ynab *YNABImport) ImportTransactions(r io.Reader) error {
 		}
 
 		fmt.Printf("Matched transfers from %s to %s over %f\n", account.Name, transferToAccount.Name, amount.GetFloat64())
-				openTransfers[i] = openTransfers[len(openTransfers)-1]
-				openTransfers = openTransfers[:len(openTransfers)-1]
+		transfers := *openTransfers
+		transfers[i] = transfers[len(transfers)-1]
+		*openTransfers = transfers[:len(transfers)-1]
 		found = true
 
 		groupID := uuid.New()
 		transfer.GroupID = uuid.NullUUID{UUID: groupID, Valid: true}
 		openTransfer.GroupID = uuid.NullUUID{UUID: groupID, Valid: true}
 
-				_, err = ynab.queries.CreateTransaction(ynab.Context, transfer.CreateTransactionParams)
+		_, err = ynab.queries.CreateTransaction(context, transfer.CreateTransactionParams)
 		if err != nil {
-					return fmt.Errorf("could not save transaction %v: %w", transfer.CreateTransactionParams, err)
+			return fmt.Errorf("save transaction %v: %w", transfer.CreateTransactionParams, err)
 		}
-				_, err = ynab.queries.CreateTransaction(ynab.Context, openTransfer.CreateTransactionParams)
+		_, err = ynab.queries.CreateTransaction(context, openTransfer.CreateTransactionParams)
 		if err != nil {
-					return fmt.Errorf("could not save transaction %v: %w", openTransfer.CreateTransactionParams, err)
+			return fmt.Errorf("save transaction %v: %w", openTransfer.CreateTransactionParams, err)
 		}
 		break
 	}
 
 	if !found {
-				openTransfers = append(openTransfers, transfer)
+		*openTransfers = append(*openTransfers, transfer)
 	}
-		} else {
-			payeeID, err := ynab.GetPayee(payeeName)
-			if err != nil {
-				return fmt.Errorf("could not get payee %s: %w", payeeName, err)
-			}
-			transaction.PayeeID = payeeID
-
-			_, err = ynab.queries.CreateTransaction(ynab.Context, transaction)
-			if err != nil {
-				return fmt.Errorf("could not save transaction %v: %w", transaction, err)
-			}
-		}
-
-		count++
-	}
-
-	for _, openTransfer := range openTransfers {
-		fmt.Printf("Saving unmatched transfer from %s to %s on %s over %f as regular transaction\n", openTransfer.FromAccount, openTransfer.ToAccount, openTransfer.Date, openTransfer.Amount.GetFloat64())
-		_, err = ynab.queries.CreateTransaction(ynab.Context, openTransfer.CreateTransactionParams)
-		if err != nil {
-			return fmt.Errorf("could not save transaction %v: %w", openTransfer.CreateTransactionParams, err)
-		}
-
-	}
-	fmt.Printf("Imported %d transactions\n", count)
-
 	return nil
 }
 
-func trimLastChar(s string) string {
-	r, size := utf8.DecodeLastRuneInString(s)
-	if r == utf8.RuneError && (size == 0 || size == 1) {
-		size = 0
-	}
-	return s[:len(s)-size]
-}
-
-func GetAmount(inflow string, outflow string) (Numeric, error) {
-	// Remove trailing currency
-	inflow = strings.Replace(trimLastChar(inflow), ",", ".", 1)
-	outflow = strings.Replace(trimLastChar(outflow), ",", ".", 1)
-
-	num := Numeric{}
-	err := num.Set(inflow)
+func GetAmount(inflow string, outflow string) (numeric.Numeric, error) {
+	in, err := numeric.ParseCurrency(inflow)
 	if err != nil {
-		return num, fmt.Errorf("Could not parse inflow %s: %w", inflow, err)
+		return in, fmt.Errorf("parse inflow: %w", err)
+	}
+
+	if !in.IsZero() {
+		return in, nil
 	}
 
 	// if inflow is zero, use outflow
-	if num.Int.Int64() != 0 {
-		return num, nil
-	}
-
-	err = num.Set("-" + outflow)
+	out, err := numeric.ParseCurrency("-" + outflow)
 	if err != nil {
-		return num, fmt.Errorf("Could not parse outflow %s: %w", inflow, err)
+		return out, fmt.Errorf("parse outflow: %w", err)
 	}
-	return num, nil
+	return out, nil
 }
 
-func (ynab *YNABImport) GetAccount(name string) (*Account, error) {
+func (ynab *YNABImport) GetAccount(context context.Context, name string) (*Account, error) {
 	for _, acc := range ynab.accounts {
 		if acc.Name == name {
 			return &acc, nil
 		}
 	}
 
-	account, err := ynab.queries.CreateAccount(ynab.Context, CreateAccountParams{Name: name, BudgetID: ynab.budgetID})
+	account, err := ynab.queries.CreateAccount(context, CreateAccountParams{Name: name, BudgetID: ynab.budgetID})
 	if err != nil {
 		return nil, err
 	}
@@ -311,7 +329,7 @@ func (ynab *YNABImport) GetAccount(name string) (*Account, error) {
 	return &account, nil
 }
 
-func (ynab *YNABImport) GetPayee(name string) (uuid.NullUUID, error) {
+func (ynab *YNABImport) GetPayee(context context.Context, name string) (uuid.NullUUID, error) {
 	if name == "" {
 		return uuid.NullUUID{}, nil
 	}
@@ -322,7 +340,7 @@ func (ynab *YNABImport) GetPayee(name string) (uuid.NullUUID, error) {
 		}
 	}
 
-	payee, err := ynab.queries.CreatePayee(ynab.Context, CreatePayeeParams{Name: name, BudgetID: ynab.budgetID})
+	payee, err := ynab.queries.CreatePayee(context, CreatePayeeParams{Name: name, BudgetID: ynab.budgetID})
 	if err != nil {
 		return uuid.NullUUID{}, err
 	}
@@ -331,7 +349,7 @@ func (ynab *YNABImport) GetPayee(name string) (uuid.NullUUID, error) {
 	return uuid.NullUUID{UUID: payee.ID, Valid: true}, nil
 }
 
-func (ynab *YNABImport) GetCategory(group string, name string) (uuid.NullUUID, error) {
+func (ynab *YNABImport) GetCategory(context context.Context, group string, name string) (uuid.NullUUID, error) { //nolint
 	if group == "" || name == "" {
 		return uuid.NullUUID{}, nil
 	}
@@ -342,32 +360,25 @@ func (ynab *YNABImport) GetCategory(group string, name string) (uuid.NullUUID, e
 		}
 	}
 
-	for _, categoryGroup := range ynab.categoryGroups {
-		if categoryGroup.Name == group {
-			createCategory := CreateCategoryParams{Name: name, CategoryGroupID: categoryGroup.ID}
-			category, err := ynab.queries.CreateCategory(ynab.Context, createCategory)
-			if err != nil {
-				return uuid.NullUUID{}, err
-			}
-
-			getCategory := GetCategoriesRow{
-				ID:              category.ID,
-				CategoryGroupID: category.CategoryGroupID,
-				Name:            category.Name,
-				Group:           categoryGroup.Name,
-			}
-			ynab.categories = append(ynab.categories, getCategory)
-			return uuid.NullUUID{UUID: category.ID, Valid: true}, nil
+	var categoryGroup CategoryGroup
+	for _, existingGroup := range ynab.categoryGroups {
+		if existingGroup.Name == group {
+			categoryGroup = existingGroup
 		}
 	}
 
-	categoryGroup, err := ynab.queries.CreateCategoryGroup(ynab.Context, CreateCategoryGroupParams{Name: group, BudgetID: ynab.budgetID})
+	if categoryGroup.Name == "" {
+		newGroup := CreateCategoryGroupParams{Name: group, BudgetID: ynab.budgetID}
+		var err error
+		categoryGroup, err = ynab.queries.CreateCategoryGroup(context, newGroup)
 		if err != nil {
 			return uuid.NullUUID{}, err
 		}
 		ynab.categoryGroups = append(ynab.categoryGroups, categoryGroup)
+	}
 
-	category, err := ynab.queries.CreateCategory(ynab.Context, CreateCategoryParams{Name: name, CategoryGroupID: categoryGroup.ID})
+	newCategory := CreateCategoryParams{Name: name, CategoryGroupID: categoryGroup.ID}
+	category, err := ynab.queries.CreateCategory(context, newCategory)
 	if err != nil {
 		return uuid.NullUUID{}, err
 	}

server/account.go

@@ -0,0 +1,71 @@
+package server
+
+import (
+	"net/http"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
+)
+
+func (h *Handler) transactionsForAccount(c *gin.Context) {
+	accountID := c.Param("accountid")
+	accountUUID, err := uuid.Parse(accountID)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	account, err := h.Service.GetAccount(c.Request.Context(), accountUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusNotFound, err)
+		return
+	}
+
+	transactions, err := h.Service.GetTransactionsForAccount(c.Request.Context(), accountUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusNotFound, err)
+		return
+	}
+
+	c.JSON(http.StatusOK, TransactionsResponse{account, transactions})
+}
+
+type TransactionsResponse struct {
+	Account      postgres.Account
+	Transactions []postgres.DisplayTransaction
+}
+
+type EditAccountRequest struct {
+	Name     string `json:"name"`
+	OnBudget bool   `json:"onBudget"`
+}
+
+func (h *Handler) editAccount(c *gin.Context) {
+	accountID := c.Param("accountid")
+	accountUUID, err := uuid.Parse(accountID)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	var request EditAccountRequest
+	err = c.BindJSON(&request)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	updateParams := postgres.UpdateAccountParams{
+		Name:     request.Name,
+		OnBudget: request.OnBudget,
+		ID:       accountUUID,
+	}
+	account, err := h.Service.UpdateAccount(c.Request.Context(), updateParams)
+	if err != nil {
+		c.AbortWithError(http.StatusNotFound, err)
+		return
+	}
+
+	h.returnBudgetingData(c, account.BudgetID)
+}

server/account_test.go

@@ -1,7 +1,8 @@
-package http
+package server
 
 import (
 	"encoding/json"
+	"fmt"
 	"net/http"
 	"net/http/httptest"
 	"strings"
@@ -10,47 +11,53 @@ import (
 	"git.javil.eu/jacob1123/budgeteer/bcrypt"
 	"git.javil.eu/jacob1123/budgeteer/jwt"
 	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"github.com/gin-gonic/gin"
-
 	txdb "github.com/DATA-DOG/go-txdb"
+	"github.com/gin-gonic/gin"
 )
 
-func init() {
+func init() { //nolint:gochecknoinits
 	txdb.Register("pgtx", "pgx", "postgres://budgeteer_test:budgeteer_test@localhost:5432/budgeteer_test")
 }
 
-func TestListTimezonesHandler(t *testing.T) {
-	db, err := postgres.Connect("pgtx", "example")
+func TestRegisterUser(t *testing.T) { //nolint:funlen
+	t.Parallel()
+	database, err := postgres.Connect("pgtx", "example")
 	if err != nil {
-		t.Errorf("could not connect to db: %s", err)
+		fmt.Printf("could not connect to db: %s\n", err)
+		t.Skip()
 		return
 	}
 
+	tokenVerifier, _ := jwt.NewTokenVerifier("this_is_my_demo_secret_for_unit_tests")
 	h := Handler{
-		Service:             db,
-		TokenVerifier:       &jwt.TokenVerifier{},
+		Service:             database,
+		TokenVerifier:       tokenVerifier,
 		CredentialsVerifier: &bcrypt.Verifier{},
 	}
 
-	rr := httptest.NewRecorder()
-	c, engine := gin.CreateTestContext(rr)
+	recorder := httptest.NewRecorder()
+	context, engine := gin.CreateTestContext(recorder)
 	h.LoadRoutes(engine)
 
 	t.Run("RegisterUser", func(t *testing.T) {
-		c.Request, err = http.NewRequest(http.MethodPost, "/api/v1/user/register", strings.NewReader(`{"password":"pass","email":"info@example.com","name":"Test"}`))
+		t.Parallel()
+		context.Request, err = http.NewRequest(
+			http.MethodPost,
+			"/api/v1/user/register",
+			strings.NewReader(`{"password":"pass","email":"info@example.com","name":"Test"}`))
 		if err != nil {
 			t.Errorf("error creating request: %s", err)
 			return
 		}
 
-		h.registerPost(c)
+		h.registerPost(context)
 
-		if rr.Code != http.StatusOK {
-			t.Errorf("handler returned wrong status code: got %v want %v", rr.Code, http.StatusOK)
+		if recorder.Code != http.StatusOK {
+			t.Errorf("handler returned wrong status code: got %v want %v", recorder.Code, http.StatusOK)
 		}
 
 		var response LoginResponse
-		err = json.NewDecoder(rr.Body).Decode(&response)
+		err = json.NewDecoder(recorder.Body).Decode(&response)
 		if err != nil {
 			t.Error(err.Error())
 			t.Error("Error registering")
@@ -61,13 +68,14 @@ func TestListTimezonesHandler(t *testing.T) {
 	})
 
 	t.Run("GetTransactions", func(t *testing.T) {
-		c.Request, err = http.NewRequest(http.MethodGet, "/account/accountid/transactions", nil)
-		if rr.Code != http.StatusOK {
-			t.Errorf("handler returned wrong status code: got %v want %v", rr.Code, http.StatusOK)
+		t.Parallel()
+		context.Request, err = http.NewRequest(http.MethodGet, "/account/accountid/transactions", nil)
+		if recorder.Code != http.StatusOK {
+			t.Errorf("handler returned wrong status code: got %v want %v", recorder.Code, http.StatusOK)
 		}
 
 		var response TransactionsResponse
-		err = json.NewDecoder(rr.Body).Decode(&response)
+		err = json.NewDecoder(recorder.Body).Decode(&response)
 		if err != nil {
 			t.Error(err.Error())
 			t.Error("Error retreiving list of transactions.")

server/admin.go

@@ -1,4 +1,4 @@
-package http
+package server
 
 import (
 	"fmt"

server/autocomplete.go

@@ -0,0 +1,72 @@
+package server
+
+import (
+	"net/http"
+	"strings"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
+)
+
+func (h *Handler) autocompleteCategories(c *gin.Context) {
+	budgetID := c.Param("budgetid")
+	budgetUUID, err := uuid.Parse(budgetID)
+	if err != nil {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"budgetid missing from URL"})
+		return
+	}
+
+	query := c.Request.URL.Query().Get("s")
+	searchParams := postgres.SearchCategoriesParams{
+		BudgetID: budgetUUID,
+		Search:   "%" + query + "%",
+	}
+	categories, err := h.Service.SearchCategories(c.Request.Context(), searchParams)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	c.JSON(http.StatusOK, categories)
+}
+
+func (h *Handler) autocompletePayee(c *gin.Context) {
+	budgetID := c.Param("budgetid")
+	budgetUUID, err := uuid.Parse(budgetID)
+	if err != nil {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"budgetid missing from URL"})
+		return
+	}
+
+	query := c.Request.URL.Query().Get("s")
+
+	transferPrefix := "Transfer"
+	if strings.HasPrefix(query, transferPrefix) {
+		searchParams := postgres.SearchAccountsParams{
+			BudgetID: budgetUUID,
+			Search:   "%" + strings.Trim(query[len(transferPrefix):], " \t\n:") + "%",
+		}
+
+		accounts, err := h.Service.SearchAccounts(c.Request.Context(), searchParams)
+		if err != nil {
+			c.AbortWithError(http.StatusInternalServerError, err)
+			return
+		}
+
+		c.JSON(http.StatusOK, accounts)
+	} else {
+		searchParams := postgres.SearchPayeesParams{
+			BudgetID: budgetUUID,
+			Search:   query + "%",
+		}
+
+		payees, err := h.Service.SearchPayees(c.Request.Context(), searchParams)
+		if err != nil {
+			c.AbortWithError(http.StatusInternalServerError, err)
+			return
+		}
+
+		c.JSON(http.StatusOK, payees)
+	}
+}

server/budget.go

@@ -1,10 +1,8 @@
-package http
+package server
 
 import (
-	"fmt"
 	"net/http"
 
-	"git.javil.eu/jacob1123/budgeteer"
 	"github.com/gin-gonic/gin"
 )
 
@@ -14,18 +12,17 @@ type newBudgetInformation struct {
 
 func (h *Handler) newBudget(c *gin.Context) {
 	var newBudget newBudgetInformation
-	err := c.BindJSON(&newBudget)
-	if err != nil {
+	if err := c.BindJSON(&newBudget); err != nil {
 		c.AbortWithError(http.StatusNotAcceptable, err)
 		return
 	}
 
 	if newBudget.Name == "" {
-		c.AbortWithError(http.StatusNotAcceptable, fmt.Errorf("Budget name is needed"))
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"budget name is required"})
 		return
 	}
 
-	userID := c.MustGet("token").(budgeteer.Token).GetID()
+	userID := MustGetToken(c).GetID()
 	budget, err := h.Service.NewBudget(c.Request.Context(), newBudget.Name, userID)
 	if err != nil {
 		c.AbortWithError(http.StatusInternalServerError, err)

server/budgeting.go

@@ -0,0 +1,222 @@
+package server
+
+import (
+	"fmt"
+	"net/http"
+	"strconv"
+	"time"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
+)
+
+func getFirstOfMonth(year, month int, location *time.Location) time.Time {
+	return time.Date(year, time.Month(month), 1, 0, 0, 0, 0, location)
+}
+
+func getFirstOfMonthTime(date time.Time) time.Time {
+	var monthM time.Month
+	year, monthM, _ := date.Date()
+	month := int(monthM)
+	return getFirstOfMonth(year, month, date.Location())
+}
+
+type CategoryWithBalance struct {
+	*postgres.GetCategoriesRow
+	Available          numeric.Numeric
+	AvailableLastMonth numeric.Numeric
+	Activity           numeric.Numeric
+	Assigned           numeric.Numeric
+}
+
+func NewCategoryWithBalance(category *postgres.GetCategoriesRow) CategoryWithBalance {
+	return CategoryWithBalance{
+		GetCategoriesRow:   category,
+		Available:          numeric.Zero(),
+		AvailableLastMonth: numeric.Zero(),
+		Activity:           numeric.Zero(),
+		Assigned:           numeric.Zero(),
+	}
+}
+
+func getDate(c *gin.Context) (time.Time, error) {
+	var year, month int
+	yearString := c.Param("year")
+	monthString := c.Param("month")
+	if yearString == "" && monthString == "" {
+		return getFirstOfMonthTime(time.Now()), nil
+	}
+
+	year, err := strconv.Atoi(yearString)
+	if err != nil {
+		return time.Time{}, fmt.Errorf("parse year: %w", err)
+	}
+
+	month, err = strconv.Atoi(monthString)
+	if err != nil {
+		return time.Time{}, fmt.Errorf("parse month: %w", err)
+	}
+
+	return getFirstOfMonth(year, month, time.Now().Location()), nil
+}
+
+func (h *Handler) budgetingForMonth(c *gin.Context) {
+	budgetID := c.Param("budgetid")
+	budgetUUID, err := uuid.Parse(budgetID)
+	if err != nil {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"budgetid missing from URL"})
+		return
+	}
+
+	budget, err := h.Service.GetBudget(c.Request.Context(), budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	firstOfMonth, err := getDate(c)
+	if err != nil {
+		c.Redirect(http.StatusTemporaryRedirect, "/budget/"+budgetUUID.String())
+		return
+	}
+
+	categories, err := h.Service.GetCategories(c.Request.Context(), budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	firstOfNextMonth := firstOfMonth.AddDate(0, 1, 0)
+	cumultativeBalances, err := h.Service.GetCumultativeBalances(c.Request.Context(), budgetUUID)
+	if err != nil {
+		c.AbortWithStatusJSON(http.StatusInternalServerError, ErrorResponse{fmt.Sprintf("error loading balances: %s", err)})
+		return
+	}
+
+	categoriesWithBalance, moneyUsed := h.calculateBalances(
+		budget, firstOfNextMonth, firstOfMonth, categories, cumultativeBalances)
+
+	availableBalance := h.getAvailableBalance(categories, budget, moneyUsed, cumultativeBalances, firstOfNextMonth)
+
+	data := struct {
+		Categories       []CategoryWithBalance
+		AvailableBalance numeric.Numeric
+	}{categoriesWithBalance, availableBalance}
+	c.JSON(http.StatusOK, data)
+}
+
+func (*Handler) getAvailableBalance(categories []postgres.GetCategoriesRow, budget postgres.Budget,
+	moneyUsed numeric.Numeric, cumultativeBalances []postgres.GetCumultativeBalancesRow,
+	firstOfNextMonth time.Time) numeric.Numeric {
+	availableBalance := numeric.Zero()
+	for _, cat := range categories {
+		if cat.ID != budget.IncomeCategoryID {
+			continue
+		}
+		availableBalance = moneyUsed
+
+		for _, bal := range cumultativeBalances {
+			if bal.CategoryID != cat.ID {
+				continue
+			}
+
+			if !bal.Date.Before(firstOfNextMonth) {
+				continue
+			}
+
+			availableBalance = availableBalance.Add(bal.Transactions)
+		}
+	}
+	return availableBalance
+}
+
+type BudgetingResponse struct {
+	Accounts []postgres.GetAccountsWithBalanceRow
+	Budget   postgres.Budget
+}
+
+func (h *Handler) budgeting(c *gin.Context) {
+	budgetID := c.Param("budgetid")
+	budgetUUID, err := uuid.Parse(budgetID)
+	if err != nil {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"budgetid missing from URL"})
+		return
+	}
+
+	h.returnBudgetingData(c, budgetUUID)
+}
+
+func (h *Handler) returnBudgetingData(c *gin.Context, budgetUUID uuid.UUID) {
+	budget, err := h.Service.GetBudget(c.Request.Context(), budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusNotFound, err)
+		return
+	}
+
+	accounts, err := h.Service.GetAccountsWithBalance(c.Request.Context(), budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	data := BudgetingResponse{accounts, budget}
+
+	c.JSON(http.StatusOK, data)
+}
+
+func (h *Handler) calculateBalances(budget postgres.Budget,
+	firstOfNextMonth time.Time, firstOfMonth time.Time, categories []postgres.GetCategoriesRow,
+	cumultativeBalances []postgres.GetCumultativeBalancesRow) ([]CategoryWithBalance, numeric.Numeric) {
+	categoriesWithBalance := []CategoryWithBalance{}
+
+	moneyUsed := numeric.Zero()
+	for i := range categories {
+		cat := &categories[i]
+		// do not show hidden categories
+		categoryWithBalance := h.CalculateCategoryBalances(cat, cumultativeBalances,
+			firstOfNextMonth, &moneyUsed, firstOfMonth, budget)
+
+		if cat.ID == budget.IncomeCategoryID {
+			continue
+		}
+
+		categoriesWithBalance = append(categoriesWithBalance, categoryWithBalance)
+	}
+
+	return categoriesWithBalance, moneyUsed
+}
+
+func (*Handler) CalculateCategoryBalances(cat *postgres.GetCategoriesRow,
+	cumultativeBalances []postgres.GetCumultativeBalancesRow, firstOfNextMonth time.Time,
+	moneyUsed *numeric.Numeric, firstOfMonth time.Time, budget postgres.Budget) CategoryWithBalance {
+	categoryWithBalance := NewCategoryWithBalance(cat)
+	for _, bal := range cumultativeBalances {
+		if bal.CategoryID != cat.ID {
+			continue
+		}
+
+		// skip everything in the future
+		if !bal.Date.Before(firstOfNextMonth) {
+			continue
+		}
+
+		*moneyUsed = moneyUsed.Sub(bal.Assignments)
+		categoryWithBalance.Available = categoryWithBalance.Available.Add(bal.Assignments)
+		categoryWithBalance.Available = categoryWithBalance.Available.Add(bal.Transactions)
+		if !categoryWithBalance.Available.IsPositive() && bal.Date.Before(firstOfMonth) {
+			*moneyUsed = moneyUsed.Add(categoryWithBalance.Available)
+			categoryWithBalance.Available = numeric.Zero()
+		}
+
+		if bal.Date.Before(firstOfMonth) {
+			categoryWithBalance.AvailableLastMonth = categoryWithBalance.Available
+		} else if bal.Date.Before(firstOfNextMonth) {
+			categoryWithBalance.Activity = bal.Transactions
+			categoryWithBalance.Assigned = bal.Assignments
+		}
+	}
+
+	return categoryWithBalance
+}

server/dashboard.go

@@ -1,15 +1,14 @@
-package http
+package server
 
 import (
 	"net/http"
 
-	"git.javil.eu/jacob1123/budgeteer"
 	"git.javil.eu/jacob1123/budgeteer/postgres"
 	"github.com/gin-gonic/gin"
 )
 
 func (h *Handler) dashboard(c *gin.Context) {
-	userID := c.MustGet("token").(budgeteer.Token).GetID()
+	userID := MustGetToken(c).GetID()
 	budgets, err := h.Service.GetBudgetsForUser(c.Request.Context(), userID)
 	if err != nil {
 		return

server/http.go

@@ -0,0 +1,121 @@
+package server
+
+import (
+	"errors"
+	"io"
+	"io/fs"
+	"net/http"
+	"path"
+	"strings"
+
+	"git.javil.eu/jacob1123/budgeteer"
+	"git.javil.eu/jacob1123/budgeteer/bcrypt"
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"github.com/gin-gonic/gin"
+)
+
+// Handler handles incoming requests.
+type Handler struct {
+	Service             *postgres.Database
+	TokenVerifier       budgeteer.TokenVerifier
+	CredentialsVerifier *bcrypt.Verifier
+	StaticFS            http.FileSystem
+}
+
+// Serve starts the http server.
+func (h *Handler) Serve() {
+	router := gin.Default()
+	h.LoadRoutes(router)
+
+	if err := router.Run(":1323"); err != nil {
+		panic(err)
+	}
+}
+
+type ErrorResponse struct {
+	Message string
+}
+
+type SuccessResponse struct {
+	Message string
+}
+
+// LoadRoutes initializes all the routes.
+func (h *Handler) LoadRoutes(router *gin.Engine) {
+	router.Use(enableCachingForStaticFiles())
+	router.NoRoute(h.ServeStatic)
+
+	api := router.Group("/api/v1")
+
+	anonymous := api.Group("/user")
+	anonymous.GET("/login", func(c *gin.Context) { c.Redirect(http.StatusPermanentRedirect, "/login") })
+	anonymous.POST("/login", h.loginPost)
+	anonymous.POST("/register", h.registerPost)
+
+	authenticated := api.Group("")
+	authenticated.Use(h.verifyLoginWithForbidden)
+	authenticated.GET("/dashboard", h.dashboard)
+	authenticated.GET("/account/:accountid/transactions", h.transactionsForAccount)
+	authenticated.POST("/account/:accountid/reconcile", h.reconcileTransactions)
+	authenticated.POST("/account/:accountid", h.editAccount)
+	authenticated.GET("/admin/clear-database", h.clearDatabase)
+
+	budget := authenticated.Group("/budget")
+	budget.POST("/new", h.newBudget)
+	budget.GET("/:budgetid", h.budgeting)
+	budget.GET("/:budgetid/:year/:month", h.budgetingForMonth)
+	budget.GET("/:budgetid/autocomplete/payees", h.autocompletePayee)
+	budget.GET("/:budgetid/autocomplete/categories", h.autocompleteCategories)
+	budget.DELETE("/:budgetid", h.deleteBudget)
+	budget.POST("/:budgetid/import/ynab", h.importYNAB)
+	budget.POST("/:budgetid/export/ynab/transactions", h.exportYNABTransactions)
+	budget.POST("/:budgetid/export/ynab/assignments", h.exportYNABAssignments)
+	budget.POST("/:budgetid/settings/clear", h.clearBudget)
+	budget.POST("/:budgetid/settings/clean-negative", h.cleanNegativeBudget)
+
+	transaction := authenticated.Group("/transaction")
+	transaction.POST("/new", h.newTransaction)
+	transaction.POST("/:transactionid", h.newTransaction)
+}
+
+func (h *Handler) ServeStatic(c *gin.Context) {
+	h.ServeStaticFile(c, c.Request.URL.Path)
+}
+
+func (h *Handler) ServeStaticFile(c *gin.Context, fullPath string) {
+	file, err := h.StaticFS.Open(fullPath)
+	if errors.Is(err, fs.ErrNotExist) {
+		h.ServeStaticFile(c, path.Join("/", "/index.html"))
+		return
+	}
+
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	stat, err := file.Stat()
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	if stat.IsDir() {
+		h.ServeStaticFile(c, path.Join(fullPath, "index.html"))
+		return
+	}
+
+	if file, ok := file.(io.ReadSeeker); ok {
+		http.ServeContent(c.Writer, c.Request, stat.Name(), stat.ModTime(), file)
+	} else {
+		panic("File does not implement ReadSeeker")
+	}
+}
+
+func enableCachingForStaticFiles() gin.HandlerFunc {
+	return func(c *gin.Context) {
+		if strings.HasPrefix(c.Request.RequestURI, "/static/") {
+			c.Header("Cache-Control", "max-age=86400")
+		}
+	}
+}

server/json-date.go

@@ -1,29 +1,36 @@
-package http
+package server
 
 import (
 	"encoding/json"
+	"fmt"
 	"strings"
 	"time"
 )
 
 type JSONDate time.Time
 
-// Implement Marshaler and Unmarshaler interface
+// UnmarshalJSON parses the JSONDate from a JSON input.
 func (j *JSONDate) UnmarshalJSON(b []byte) error {
 	s := strings.Trim(string(b), "\"")
 	t, err := time.Parse("2006-01-02", s)
 	if err != nil {
-		return err
+		return fmt.Errorf("parse date: %w", err)
 	}
 	*j = JSONDate(t)
 	return nil
 }
 
+// MarshalJSON converts the JSONDate to a JSON in ISO format.
 func (j JSONDate) MarshalJSON() ([]byte, error) {
-	return json.Marshal(time.Time(j))
+	result, err := json.Marshal(time.Time(j))
+	if err != nil {
+		return nil, fmt.Errorf("marshal date: %w", err)
+	}
+
+	return result, nil
 }
 
-// Maybe a Format function for printing your date
+// Format formats the time using the regular time.Time mechanics..
 func (j JSONDate) Format(s string) string {
 	t := time.Time(j)
 	return t.Format(s)

server/reconcile.go

@@ -0,0 +1,103 @@
+package server
+
+import (
+	"database/sql"
+	"fmt"
+	"net/http"
+	"time"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
+)
+
+type ReconcileTransactionsRequest struct {
+	TransactionIDs                 []uuid.UUID `json:"transactionIds"`
+	ReconcilationTransactionAmount string      `json:"reconciliationTransactionAmount"`
+}
+
+type ReconcileTransactionsResponse struct {
+	Message                   string
+	ReconciliationTransaction *postgres.DisplayTransaction
+}
+
+func (h *Handler) reconcileTransactions(c *gin.Context) {
+	accountID := c.Param("accountid")
+	accountUUID, err := uuid.Parse(accountID)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	var request ReconcileTransactionsRequest
+	err = c.BindJSON(&request)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("parse request: %w", err))
+		return
+	}
+
+	var amount numeric.Numeric
+	err = amount.Set(request.ReconcilationTransactionAmount)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("parse request: %w", err))
+		return
+	}
+
+	tx, err := h.Service.BeginTx(c.Request.Context(), &sql.TxOptions{})
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("begin tx: %w", err))
+		return
+	}
+
+	db := h.Service.WithTx(tx)
+	for _, transactionID := range request.TransactionIDs {
+		err := db.SetTransactionReconciled(c.Request.Context(), transactionID)
+		if err != nil {
+			c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("update transaction: %w", err))
+			return
+		}
+	}
+
+	reconciliationTransaction, err := h.CreateReconcilationTransaction(amount, accountUUID, db, c)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("insert new transaction: %w", err))
+		return
+	}
+
+	err = tx.Commit()
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("commit: %w", err))
+		return
+	}
+
+	c.JSON(http.StatusOK, ReconcileTransactionsResponse{
+		Message:                   fmt.Sprintf("Set status for %d transactions", len(request.TransactionIDs)),
+		ReconciliationTransaction: reconciliationTransaction,
+	})
+}
+
+func (*Handler) CreateReconcilationTransaction(amount numeric.Numeric, accountUUID uuid.UUID, db *postgres.Queries, c *gin.Context) (*postgres.DisplayTransaction, error) {
+	if amount.IsZero() {
+		return nil, nil //nolint: nilnil
+	}
+
+	createTransaction := postgres.CreateTransactionParams{
+		Date:      time.Now(),
+		Memo:      "Reconciliation Transaction",
+		Amount:    amount,
+		AccountID: accountUUID,
+		Status:    "Reconciled",
+	}
+	transactionUUID, err := db.CreateTransaction(c.Request.Context(), createTransaction)
+	if err != nil {
+		return nil, fmt.Errorf("insert new transaction: %w", err)
+	}
+
+	transaction, err := db.GetTransaction(c.Request.Context(), transactionUUID)
+	if err != nil {
+		return nil, fmt.Errorf("get created transaction: %w", err)
+	}
+
+	return &transaction, nil
+}

server/session.go

@@ -1,4 +1,4 @@
-package http
+package server
 
 import (
 	"context"
@@ -8,18 +8,34 @@ import (
 	"git.javil.eu/jacob1123/budgeteer"
 	"git.javil.eu/jacob1123/budgeteer/postgres"
 	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
 )
 
-func (h *Handler) verifyLogin(c *gin.Context) (budgeteer.Token, error) {
-	tokenString := c.GetHeader("Authorization")
-	if len(tokenString) < 8 {
-		return nil, fmt.Errorf("no authorization header supplied")
+const (
+	HeaderName = "Authorization"
+	Bearer     = "Bearer "
+	ParamName  = "token"
+)
+
+func MustGetToken(c *gin.Context) budgeteer.Token { //nolint:ireturn
+	token := c.MustGet(ParamName)
+	if token, ok := token.(budgeteer.Token); ok {
+		return token
+	}
+
+	panic("Token is not a valid Token")
+}
+
+func (h *Handler) verifyLogin(c *gin.Context) (budgeteer.Token, *ErrorResponse) { //nolint:ireturn
+	tokenString := c.GetHeader(HeaderName)
+	if len(tokenString) <= len(Bearer) {
+		return nil, &ErrorResponse{"no authorization header supplied"}
 	}
 
 	tokenString = tokenString[7:]
 	token, err := h.TokenVerifier.VerifyToken(tokenString)
 	if err != nil {
-		return nil, fmt.Errorf("verify token '%s': %w", tokenString, err)
+		return nil, &ErrorResponse{fmt.Sprintf("verify token '%s': %s", tokenString, err)}
 	}
 
 	return token, nil
@@ -28,24 +44,12 @@ func (h *Handler) verifyLogin(c *gin.Context) (budgeteer.Token, error) {
 func (h *Handler) verifyLoginWithForbidden(c *gin.Context) {
 	token, err := h.verifyLogin(c)
 	if err != nil {
-		//c.Header("WWW-Authenticate", "Bearer")
-		c.AbortWithError(http.StatusForbidden, err)
+		// c.Header("WWW-Authenticate", "Bearer")
+		c.AbortWithStatusJSON(http.StatusForbidden, err)
 		return
 	}
 
-	c.Set("token", token)
-	c.Next()
-}
-
-func (h *Handler) verifyLoginWithRedirect(c *gin.Context) {
-	token, err := h.verifyLogin(c)
-	if err != nil {
-		c.Redirect(http.StatusTemporaryRedirect, "/login")
-		c.Abort()
-		return
-	}
-
-	c.Set("token", token)
+	c.Set(ParamName, token)
 	c.Next()
 }
 
@@ -72,19 +76,19 @@ func (h *Handler) loginPost(c *gin.Context) {
 		return
 	}
 
-	t, err := h.TokenVerifier.CreateToken(&user)
+	token, err := h.TokenVerifier.CreateToken(&user)
 	if err != nil {
 		c.AbortWithError(http.StatusUnauthorized, err)
 	}
 
-	go h.Service.UpdateLastLogin(context.Background(), user.ID)
+	go h.UpdateLastLogin(user.ID)
 
 	budgets, err := h.Service.GetBudgetsForUser(c.Request.Context(), user.ID)
 	if err != nil {
 		return
 	}
 
-	c.JSON(http.StatusOK, LoginResponse{t, user, budgets})
+	c.JSON(http.StatusOK, LoginResponse{token, user, budgets})
 }
 
 type LoginResponse struct {
@@ -101,16 +105,20 @@ type registerInformation struct {
 
 func (h *Handler) registerPost(c *gin.Context) {
 	var register registerInformation
-	c.BindJSON(&register)
-
-	if register.Email == "" || register.Password == "" || register.Name == "" {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("e-mail, password and name are required"))
+	err := c.BindJSON(&register)
+	if err != nil {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"error parsing body"})
 		return
 	}
 
-	_, err := h.Service.GetUserByUsername(c.Request.Context(), register.Email)
+	if register.Email == "" || register.Password == "" || register.Name == "" {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"e-mail, password and name are required"})
+		return
+	}
+
+	_, err = h.Service.GetUserByUsername(c.Request.Context(), register.Email)
 	if err == nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("email is already taken"))
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"email is already taken"})
 		return
 	}
 
@@ -130,17 +138,24 @@ func (h *Handler) registerPost(c *gin.Context) {
 		c.AbortWithError(http.StatusInternalServerError, err)
 	}
 
-	t, err := h.TokenVerifier.CreateToken(&user)
+	token, err := h.TokenVerifier.CreateToken(&user)
 	if err != nil {
 		c.AbortWithError(http.StatusUnauthorized, err)
 	}
 
-	go h.Service.UpdateLastLogin(context.Background(), user.ID)
+	go h.UpdateLastLogin(user.ID)
 
 	budgets, err := h.Service.GetBudgetsForUser(c.Request.Context(), user.ID)
 	if err != nil {
 		return
 	}
 
-	c.JSON(http.StatusOK, LoginResponse{t, user, budgets})
+	c.JSON(http.StatusOK, LoginResponse{token, user, budgets})
+}
+
+func (h *Handler) UpdateLastLogin(userID uuid.UUID) {
+	_, err := h.Service.UpdateLastLogin(context.Background(), userID)
+	if err != nil {
+		fmt.Printf("Error updating last login: %s", err)
+	}
 }

server/transaction.go

@@ -0,0 +1,159 @@
+package server
+
+import (
+	"context"
+	"fmt"
+	"net/http"
+	"time"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
+)
+
+type NewTransactionPayload struct {
+	Date  JSONDate `json:"date"`
+	Payee struct {
+		ID   uuid.NullUUID
+		Name string
+		Type string
+	} `json:"payee"`
+	CategoryID uuid.NullUUID `json:"categoryId"`
+	Memo       string        `json:"memo"`
+	Amount     string        `json:"amount"`
+	BudgetID   uuid.UUID     `json:"budgetId"`
+	AccountID  uuid.UUID     `json:"accountId"`
+	State      string        `json:"state"`
+}
+
+func (h *Handler) newTransaction(c *gin.Context) {
+	var payload NewTransactionPayload
+	err := c.BindJSON(&payload)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	amount, err := numeric.Parse(payload.Amount)
+	if err != nil {
+		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("amount: %w", err))
+		return
+	}
+
+	transactionID := c.Param("transactionid")
+	if transactionID != "" {
+		h.UpdateTransaction(payload, amount, transactionID, c)
+		return
+	}
+
+	newTransaction := postgres.CreateTransactionParams{
+		Memo:       payload.Memo,
+		Date:       time.Time(payload.Date),
+		Amount:     amount,
+		Status:     postgres.TransactionStatus(payload.State),
+		CategoryID: payload.CategoryID,
+		AccountID:  payload.AccountID,
+	}
+
+	if payload.Payee.Type == "account" {
+		groupID, err := h.CreateTransferForOtherAccount(newTransaction, amount, payload, c)
+		if err != nil {
+			c.AbortWithError(http.StatusInternalServerError, err)
+			return
+		}
+
+		newTransaction.GroupID = groupID
+	} else {
+		payeeID, err := GetPayeeID(c.Request.Context(), payload, h)
+		if err != nil {
+			c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("create payee: %w", err))
+		}
+		newTransaction.PayeeID = payeeID
+	}
+
+	transactionUUID, err := h.Service.CreateTransaction(c.Request.Context(), newTransaction)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("create transaction: %w", err))
+		return
+	}
+
+	transaction, err := h.Service.GetTransaction(c.Request.Context(), transactionUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("get transaction: %w", err))
+		return
+	}
+
+	c.JSON(http.StatusOK, transaction)
+}
+
+func (h *Handler) UpdateTransaction(payload NewTransactionPayload, amount numeric.Numeric, transactionID string, c *gin.Context) {
+	transactionUUID := uuid.MustParse(transactionID)
+	if amount.IsZero() {
+		err := h.Service.DeleteTransaction(c.Request.Context(), transactionUUID)
+		if err != nil {
+			c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("delete transaction: %w", err))
+		}
+		return
+	}
+
+	editTransaction := postgres.UpdateTransactionParams{
+		Memo:       payload.Memo,
+		Date:       time.Time(payload.Date),
+		Amount:     amount,
+		PayeeID:    payload.Payee.ID,
+		CategoryID: payload.CategoryID,
+		ID:         transactionUUID,
+	}
+
+	err := h.Service.UpdateTransaction(c.Request.Context(), editTransaction)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("edit transaction: %w", err))
+		return
+	}
+
+	transaction, err := h.Service.GetTransaction(c.Request.Context(), transactionUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("get transaction: %w", err))
+		return
+	}
+
+	c.JSON(http.StatusOK, transaction)
+}
+
+func (h *Handler) CreateTransferForOtherAccount(newTransaction postgres.CreateTransactionParams, amount numeric.Numeric, payload NewTransactionPayload, c *gin.Context) (uuid.NullUUID, error) {
+	newTransaction.GroupID = uuid.NullUUID{UUID: uuid.New(), Valid: true}
+	newTransaction.Amount = amount.Neg()
+	newTransaction.AccountID = payload.Payee.ID.UUID
+
+	// transfer does not need category. Either it's account is off-budget or no category was supplied.
+	newTransaction.CategoryID = uuid.NullUUID{}
+
+	_, err := h.Service.CreateTransaction(c.Request.Context(), newTransaction)
+	if err != nil {
+		return uuid.NullUUID{}, fmt.Errorf("create transfer transaction: %w", err)
+	}
+	return newTransaction.GroupID, nil
+}
+
+func GetPayeeID(context context.Context, payload NewTransactionPayload, h *Handler) (uuid.NullUUID, error) {
+	payeeID := payload.Payee.ID
+	if payeeID.Valid {
+		return payeeID, nil
+	}
+
+	if payload.Payee.Name == "" {
+		return uuid.NullUUID{}, nil
+	}
+
+	newPayee := postgres.CreatePayeeParams{
+		Name:     payload.Payee.Name,
+		BudgetID: payload.BudgetID,
+	}
+	payee, err := h.Service.CreatePayee(context, newPayee)
+	if err != nil {
+		return uuid.NullUUID{}, fmt.Errorf("create payee: %w", err)
+	}
+
+	return uuid.NullUUID{UUID: payee.ID, Valid: true}, nil
+}

server/ynab-import.go

@@ -0,0 +1,117 @@
+package server
+
+import (
+	"net/http"
+
+	"git.javil.eu/jacob1123/budgeteer/postgres"
+	"github.com/gin-gonic/gin"
+	"github.com/google/uuid"
+)
+
+func (h *Handler) importYNAB(c *gin.Context) {
+	budgetID, succ := c.Params.Get("budgetid")
+	if !succ {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"no budget_id specified"})
+		return
+	}
+
+	budgetUUID, err := uuid.Parse(budgetID)
+	if !succ {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	ynab, err := postgres.NewYNABImport(c.Request.Context(), h.Service.Queries, budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	transactionsFile, err := c.FormFile("transactions")
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	transactions, err := transactionsFile.Open()
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	err = ynab.ImportTransactions(c.Request.Context(), transactions)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	assignmentsFile, err := c.FormFile("assignments")
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	assignments, err := assignmentsFile.Open()
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	err = ynab.ImportAssignments(c.Request.Context(), assignments)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+}
+
+func (h *Handler) exportYNABTransactions(c *gin.Context) {
+	budgetID, succ := c.Params.Get("budgetid")
+	if !succ {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"no budget_id specified"})
+		return
+	}
+
+	budgetUUID, err := uuid.Parse(budgetID)
+	if !succ {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	ynab, err := postgres.NewYNABExport(c.Request.Context(), h.Service.Queries, budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	err = ynab.ExportTransactions(c.Request.Context(), c.Writer)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+}
+
+func (h *Handler) exportYNABAssignments(c *gin.Context) {
+	budgetID, succ := c.Params.Get("budgetid")
+	if !succ {
+		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"no budget_id specified"})
+		return
+	}
+
+	budgetUUID, err := uuid.Parse(budgetID)
+	if !succ {
+		c.AbortWithError(http.StatusBadRequest, err)
+		return
+	}
+
+	ynab, err := postgres.NewYNABExport(c.Request.Context(), h.Service.Queries, budgetUUID)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+
+	err = ynab.ExportAssignments(c.Request.Context(), c.Writer)
+	if err != nil {
+		c.AbortWithError(http.StatusInternalServerError, err)
+		return
+	}
+}

sqlc.yaml

@@ -7,9 +7,11 @@ packages:
     queries: "postgres/queries/"
 overrides:
   - go_type: 
-      type: "Numeric"
+      import: "git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+      type: Numeric
     db_type: "pg_catalog.numeric"
   - go_type: 
-      type: "Numeric"
+      import: "git.javil.eu/jacob1123/budgeteer/postgres/numeric"
+      type: Numeric
     db_type: "pg_catalog.numeric"
     nullable: true

token.go

@@ -5,7 +5,7 @@ import (
 	"github.com/google/uuid"
 )
 
-// Token contains data that authenticates a user
+// Token contains data that authenticates a user.
 type Token interface {
 	GetUsername() string
 	GetName() string
@@ -13,7 +13,7 @@ type Token interface {
 	GetID() uuid.UUID
 }
 
-// TokenVerifier verifies a Token
+// TokenVerifier verifies a Token.
 type TokenVerifier interface {
 	VerifyToken(string) (Token, error)
 	CreateToken(*postgres.User) (string, error)

web/index.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vite App</title>
   </head>
-  <body>
+  <body class="bg-slate-200 text-slate-800 dark:bg-slate-800 dark:text-slate-200">
     <div id="app"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>

web/package.json

@@ -11,6 +11,7 @@
     "@mdi/font": "5.9.55",
     "@vueuse/core": "^7.6.1",
     "autoprefixer": "^10.4.2",
+    "file-saver": "^2.0.5",
     "pinia": "^2.0.11",
     "postcss": "^8.4.6",
     "tailwindcss": "^3.0.18",
@@ -18,13 +19,15 @@
     "vue-router": "^4.0.12"
   },
   "devDependencies": {
+    "@types/file-saver": "^2.0.5",
     "@vitejs/plugin-vue": "^2.0.0",
     "@vue/cli-plugin-babel": "5.0.0-beta.7",
     "@vue/cli-plugin-typescript": "~4.5.0",
     "@vue/cli-service": "5.0.0-beta.7",
     "sass": "^1.38.0",
     "sass-loader": "^10.0.0",
+    "typescript": "^4.5.5",
     "vite": "^2.7.2",
-    "vue-cli-plugin-vuetify": "~2.4.5"
+    "vue-tsc": "^0.32.0"
   }
 }

web/src/App.vue

@@ -28,7 +28,7 @@ export default defineComponent({
 
 <template>
     <div class="box-border w-full">
-        <div class="flex bg-gray-400 p-4 m-2 rounded-lg">
+        <div class="flex bg-gray-400 dark:bg-gray-600 p-4 m-2 rounded-lg">
             <span class="flex-1 font-bold text-5xl -my-3 hidden md:inline" @click="toggleMenuSize">≡</span>
             <span class="flex-1 font-bold text-5xl -my-3 md:hidden" @click="toggleMenu">≡</span>
 

web/src/api.ts

@@ -0,0 +1,26 @@
+import { useSessionStore } from "./stores/session";
+
+export const BASE_URL = "/api/v1"
+
+export function GET(path: string) {
+    const sessionStore = useSessionStore();
+    return fetch(BASE_URL + path, {
+        headers: sessionStore.AuthHeaders,
+    })
+};
+
+export function POST(path: string, body: FormData | string | null) {
+    const sessionStore = useSessionStore();
+    return fetch(BASE_URL + path, {
+        method: "POST",
+        headers: sessionStore.AuthHeaders,
+        body: body,
+    })
+}
+export function DELETE(path: string) {
+    const sessionStore = useSessionStore();
+    return fetch(BASE_URL + path, {
+        method: "DELETE",
+        headers: sessionStore.AuthHeaders,
+    })
+}

web/src/components/Autocomplete.vue

@@ -1,102 +1,102 @@
-<script lang="ts">
-import { defineComponent, PropType } from "vue"
-import { useAPI } from "../stores/api";
+<script lang="ts" setup>
+import { ref, watch } from "vue"
+import { GET } from "../api";
 import { useBudgetsStore } from "../stores/budget";
+import Input from "./Input.vue";
 
 export interface Suggestion {
-    ID : string
-    Name : string
+    ID: string
+    Name: string
+    Type: string
 }
 
-interface Data {
-    Selected: Suggestion | undefined
-    SearchQuery: String
-    Suggestions: Suggestion[]
-}
+const props = defineProps<{
+    text: String,
+    id: String | undefined,
+    model: String,
+    type?: string | undefined,
+}>();
 
-export default defineComponent({
-    data() {
-        return {
-            Selected: undefined,
-            SearchQuery: this.modelValue || "",
-            Suggestions: new Array<Suggestion>(),
-        } as Data
-    },
-    props: {
-        modelValue: Object as PropType<Suggestion>,
-        type: String
-    },
-    watch: {
-        SearchQuery() {
-            this.load(this.$data.SearchQuery);
-        }
-    },
-    methods: {
-        saveTransaction(e : MouseEvent) {
-            e.preventDefault();
-        },
-        load(text : String) {
-            this.$emit('update:modelValue', {ID: null, Name: text});
-            if (text == ""){
-                this.$data.Suggestions = [];
+const SearchQuery = ref(props.text || "");
+const Suggestions = ref<Array<Suggestion>>([]);
+const emit = defineEmits(["update:id", "update:text", "update:type"]);
+watch(SearchQuery, () => {
+    load(SearchQuery.value);
+});
+function load(text: String) {
+    emit('update:id', null);
+    emit('update:text', text);
+    emit('update:type', undefined);
+    if (text == "") {
+        Suggestions.value = [];
         return;
     }
 
-            const api = useAPI();
     const budgetStore = useBudgetsStore();
-            api.GET("/budget/" + budgetStore.CurrentBudgetID + "/autocomplete/" + this.type + "?s=" + text)
-                .then(x=>x.json())
+    GET("/budget/" + budgetStore.CurrentBudgetID + "/autocomplete/" + props.model + "?s=" + text)
+        .then(x => x.json())
         .then(x => {
             let suggestions = x || [];
-                    if(suggestions.length > 10){
+            if (suggestions.length > 10) {
                 suggestions = suggestions.slice(0, 10);
             }
-                    this.$data.Suggestions = suggestions;
+            Suggestions.value = suggestions;
         });
-        },
-        keypress(e : KeyboardEvent) {
-            console.log(e.key);
-            if(e.key == "Enter") {
-                const selected = this.$data.Suggestions[0];
-                this.selectElement(selected);
+};
+function keypress(e: KeyboardEvent) {
+    if (e.key != "Enter")
+        return;
+
+    const selected = Suggestions.value[0];
+    selectElement(selected);
     const el = (<HTMLInputElement>e.target);
     const inputElements = Array.from(el.ownerDocument.querySelectorAll('input:not([disabled]):not([readonly])'));
     const currentIndex = inputElements.indexOf(el);
     const nextElement = inputElements[currentIndex < inputElements.length - 1 ? currentIndex + 1 : 0];
     (<HTMLInputElement>nextElement).focus();
+};
 
-            }
-        },
-        selectElement(element : Suggestion) {
-            this.$data.Selected = element;
-            this.$data.Suggestions = [];
-            this.$emit('update:modelValue', element);
-        },
-        select(e : MouseEvent) {
+function selectElement(element: Suggestion) {
+    emit('update:id', element.ID);
+    emit('update:text', element.Name);
+    emit('update:type', element.Type);
+    Suggestions.value = [];
+};
+
+function select(e: MouseEvent) {
     const target = (<HTMLInputElement>e.target);
     const valueAttribute = target.attributes.getNamedItem("value");
     let selectedID = "";
-            if(valueAttribute != null)
+    if (valueAttribute != null)
         selectedID = valueAttribute.value;
-            const selected = this.$data.Suggestions.filter(x => x.ID == selectedID)[0];
-            this.selectElement(selected);
-        },
-        clear() {
-            this.$data.Selected = undefined;
-            this.$emit('update:modelValue', {ID: null, Name: this.$data.SearchQuery});
-        }
-    }
-})
+    const selected = Suggestions.value.filter(x => x.ID == selectedID)[0];
+    selectElement(selected);
+};
+
+function clear() {
+    emit('update:id', null);
+    emit('update:text', SearchQuery.value);
+    emit('update:type', undefined);
+};
 </script>
 
 <template>
     <div>
-        <input class="border-b-2 border-black" @keypress="keypress" v-if="Selected == undefined" v-model="SearchQuery" />
-        <span @click="clear" v-if="Selected != undefined" class="bg-gray-300">{{Selected.Name}}</span>
-        <div v-if="Suggestions.length > 0" class="absolute bg-gray-400 w-64 p-2">
-            <span v-for="suggestion in Suggestions" class="block" @click="select" :value="suggestion.ID">
-                {{suggestion.Name}}
-            </span>
+        <Input
+            type="text"
+            class="border-b-2 border-black"
+            @keypress="keypress"
+            v-if="id == undefined"
+            v-model="SearchQuery"
+        />
+        <span @click="clear" v-if="id != undefined" class="bg-gray-300 dark:bg-gray-700">{{ text }}</span>
+        <div v-if="Suggestions.length > 0" class="absolute bg-gray-400 dark:bg-gray-600 w-64 p-2">
+            <span
+                v-for="suggestion in Suggestions"
+                class="block"
+                @click="select"
+                :value="suggestion.ID"
+            >{{ suggestion.Name }}</span>
         </div>
     </div>
 </template>

web/src/components/Button.vue

@@ -0,0 +1,10 @@
+<script lang="ts" setup>
+</script>
+
+<template>
+    <button
+        class="px-4 rounded-md shadow-sm focus:outline-none focus:ring-2"
+    >
+        <slot></slot>
+    </button>
+</template>

web/src/components/Card.vue

@@ -1,13 +1,8 @@
-<script lang="ts">
-import { defineComponent } from "vue";
-
-export default defineComponent({
-
-})
+<script lang="ts" setup>
 </script>
 
 <template>
-    <div class="flex flex-row items-center bg-gray-300 h-32 rounded-lg">
+    <div class="flex flex-row items-center bg-gray-300 dark:bg-gray-700 rounded-lg">
         <slot></slot>
     </div>
 </template>

web/src/components/Currency.vue

@@ -1,19 +1,15 @@
-<script lang="ts">
-import { defineComponent } from "vue";
+<script lang="ts" setup>
+import { computed } from 'vue';
 
-export default defineComponent({
-    props: ["value"],
-    computed: {
-        formattedValue() {
-            return Number(this.value).toLocaleString(undefined, {
+const props = defineProps<{ value: number | undefined }>();
+
+const internalValue = computed(() => Number(props.value ?? 0));
+
+const formattedValue = computed(() => internalValue.value.toLocaleString(undefined, {
     minimumFractionDigits: 2,
-            });
-        }
-    }
-})
-
+}));
 </script>
 
 <template>
-    <span class="text-right" :class="value < 0 ? 'negative' : ''">{{formattedValue}} €</span>
+    <span class="text-right" :class="internalValue < 0 ? 'negative' : ''">{{ formattedValue }} €</span>
 </template>

web/src/components/DateInput.vue

@@ -0,0 +1,36 @@
+<script lang="ts" setup>
+import Input from './Input.vue';
+const props = defineProps(["modelValue"]);
+const emit = defineEmits(['update:modelValue']);
+
+function dateToYYYYMMDD(d: Date) : string {
+  if(d == null)
+    return "";
+  // alternative implementations in https://stackoverflow.com/q/23593052/1850609
+  //return new Date(d.getTime() - (d.getTimezoneOffset() * 60 * 1000)).toISOString().split('T')[0];
+  return d.toISOString().split('T')[0];
+}
+
+function updateValue(event: Event) {
+  const target = event.target as HTMLInputElement;
+  emit('update:modelValue', target.valueAsDate);
+}
+function selectAll(event: FocusEvent) {
+  // Workaround for Safari bug
+  // http://stackoverflow.com/questions/1269722/selecting-text-on-focus-using-jquery-not-working-in-safari-and-chrome
+  setTimeout(function () {
+    const target = event.target as HTMLInputElement;
+    target.select()
+  }, 0)
+}
+</script>
+
+<template>
+  <Input
+    type="date"
+    ref="input"
+    v-bind:value="dateToYYYYMMDD(modelValue)"
+    @input="updateValue"
+    @focus="selectAll"
+  />
+</template>

web/src/components/Input.vue

@@ -0,0 +1,10 @@
+<script lang="ts" setup>
+const props = defineProps(["modelValue"]);
+</script>
+
+<template>
+    <input 
+        v-model="modelValue"
+        @input="$emit('update:modelValue', ($event.target as HTMLInputElement)?.value)"
+        class="dark:bg-slate-900">
+</template>

web/src/components/Modal.vue

@@ -0,0 +1,58 @@
+<script lang="ts" setup>
+import Card from '../components/Card.vue';
+import { ref } from "vue";
+
+const props = defineProps<{
+    buttonText?: string,
+}>();
+
+const emit = defineEmits<{
+    (e: 'submit'): void,
+    (e: 'open'): void,
+}>();
+
+const visible = ref(false);
+function closeDialog() {
+    visible.value = false;
+};
+function openDialog() {
+    emit("open");
+    visible.value = true;
+};
+function submitDialog() {
+    visible.value = false;
+    emit("submit");
+}
+</script>
+
+<template>
+    <button @click="openDialog">
+        <slot name="placeholder">
+            <Card>
+                <p class="w-24 text-center text-6xl">+</p>
+                <span class="text-lg" dark>{{ buttonText }}</span>
+            </Card>
+        </slot>
+    </button>
+    <div
+        v-if="visible"
+        class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full"
+    >
+        <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
+            <div class="mt-3 text-center">
+                <h3 class="mt-3 text-lg leading-6 font-medium text-gray-900">{{ buttonText }}</h3>
+                <slot></slot>
+                <div class="grid grid-cols-2 gap-6">
+                    <button
+                        @click="closeDialog"
+                        class="px-4 py-2 bg-red-500 text-white text-base font-medium rounded-md shadow-sm hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-300"
+                    >Close</button>
+                    <button
+                        @click="submitDialog"
+                        class="px-4 py-2 bg-green-500 text-white text-base font-medium rounded-md shadow-sm hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-300"
+                    >Save</button>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>

web/src/components/TransactionEditRow.vue

@@ -0,0 +1,66 @@
+<script lang="ts" setup>
+import { computed, ref } from "vue";
+import Autocomplete from './Autocomplete.vue'
+import { useAccountStore } from '../stores/budget-account'
+import DateInput from "./DateInput.vue";
+import { useTransactionsStore } from "../stores/transactions";
+import Input from "./Input.vue";
+import Button from "./Button.vue";
+
+const props = defineProps<{
+    transactionid: string
+}>()
+
+const emit = defineEmits(["save"]);
+
+const transactionsStore = useTransactionsStore();
+const TX = transactionsStore.Transactions.get(props.transactionid)!;
+const payeeType = ref<string|undefined>(undefined);
+
+const payload = computed(() => JSON.stringify({
+    date: TX.Date.toISOString().split("T")[0],
+    payee: {
+        Name: TX.Payee,
+        ID: TX.PayeeID,
+        Type: payeeType.value,
+    },
+    categoryId: TX.CategoryID,
+    memo: TX.Memo,
+    amount: TX.Amount.toString(),
+    state: "Uncleared"
+}));
+
+function saveTransaction(e: MouseEvent) {
+    e.preventDefault();
+    transactionsStore.editTransaction(TX.ID, payload.value);
+    emit('save');
+}
+</script>
+
+<template>
+    <tr>
+        <td class="text-sm">
+            <DateInput class="border-b-2 border-black" v-model="TX.Date" />
+        </td>
+        <td>
+            <Autocomplete v-model:text="TX.Payee" v-model:id="TX.PayeeID" v-model:type="payeeType" model="payees" />
+        </td>
+        <td>
+            <Autocomplete v-model:text="TX.Category" v-model:id="TX.CategoryID" model="categories" />
+        </td>
+        <td>
+            <Input class="block w-full border-b-2 border-black" type="text" v-model="TX.Memo" />
+        </td>
+        <td class="text-right">
+            <Input
+                class="text-right block w-full border-b-2 border-black"
+                type="currency"
+                v-model="TX.Amount"
+            />
+        </td>
+        <td>
+            <Button class="bg-blue-500" @click="saveTransaction">Save</Button>
+        </td>
+        <td></td>
+    </tr>
+</template>

web/src/components/TransactionInputRow.vue

@@ -0,0 +1,83 @@
+<script lang="ts" setup>
+import { computed, ref } from "vue";
+import Autocomplete from '../components/Autocomplete.vue'
+import { Transaction, useTransactionsStore } from "../stores/transactions";
+import DateInput from "./DateInput.vue";
+import Button from "./Button.vue";
+import Input from "./Input.vue";
+
+const props = defineProps<{
+    budgetid: string
+    accountid: string
+}>()
+
+const TX = ref<Transaction>({
+    Date: new Date(),
+    Memo: "",
+    Amount: 0,
+    Payee: "",
+    PayeeID: undefined,
+    Category: "",
+    CategoryID: undefined,
+    CategoryGroup: "",
+    GroupID: "",
+    ID: "",
+    Status: "Uncleared",
+    TransferAccount: "",
+    Reconciled: false
+});
+
+const payeeType = ref<string|undefined>(undefined);
+
+const payload = computed(() => JSON.stringify({
+    budgetId: props.budgetid,
+    accountId: props.accountid,
+    date: TX.value.Date.toISOString().split("T")[0],
+    payee: {
+        Name: TX.value.Payee,
+        ID: TX.value.PayeeID,
+        Type: payeeType.value,
+    },
+    categoryId: TX.value.CategoryID,
+    memo: TX.value.Memo,
+    amount: TX.value.Amount.toString(),
+    state: "Uncleared"
+}));
+
+const transactionsStore = useTransactionsStore();
+function saveTransaction(e: MouseEvent) {
+    e.preventDefault();
+    transactionsStore.saveTransaction(payload.value);
+}
+</script>
+
+<template>
+    <tr>
+        <label class="md:hidden">Date</label>
+        <td class="text-sm">
+            <DateInput class="border-b-2 border-black" v-model="TX.Date" />
+        </td>
+        <label class="md:hidden">Payee</label>
+        <td>
+            <Autocomplete v-model:text="TX.Payee" v-model:id="TX.PayeeID" v-model:type="payeeType" model="payees" />
+        </td>
+        <label class="md:hidden">Category</label>
+        <td>
+            <Autocomplete v-model:text="TX.Category" v-model:id="TX.CategoryID" model="categories" />
+        </td>
+        <td class="col-span-2">
+            <Input class="block w-full border-b-2 border-black" type="text" v-model="TX.Memo" />
+        </td>
+        <label class="md:hidden">Amount</label>
+        <td class="text-right">
+            <Input
+                class="text-right block w-full border-b-2 border-black"
+                type="currency"
+                v-model="TX.Amount"
+            />
+        </td>
+        <td class="hidden md:table-cell">
+            <Button class="bg-blue-500" @click="saveTransaction">Save</Button>
+        </td>
+    </tr>
+</template>

web/src/components/TransactionRow.vue

@@ -1,40 +1,79 @@
-<script lang="ts">
-import { mapState } from "pinia";
-import { defineComponent } from "vue";
+<script lang="ts" setup>
+import { computed, ref } from "vue";
 import { useBudgetsStore } from "../stores/budget";
+import { useTransactionsStore } from "../stores/transactions";
 import Currency from "./Currency.vue";
+import TransactionEditRow from "./TransactionEditRow.vue";
+import { formatDate } from "../date";
+import { useAccountStore } from "../stores/budget-account";
+import Input from "./Input.vue";
 
-export default defineComponent({
-    props: [ "transaction", "index" ],
-    components: { Currency },
-    computed: {
-        ...mapState(useBudgetsStore, ["CurrentBudgetID"])
-    }
-})
+const props = defineProps<{
+    transactionid: string,
+    index: number,
+}>();
+
+const edit = ref(false);
+
+const CurrentBudgetID = computed(() => useBudgetsStore().CurrentBudgetID);
+const Reconciling = computed(() => useTransactionsStore().Reconciling);
+
+const transactionsStore = useTransactionsStore();
+const TX = transactionsStore.Transactions.get(props.transactionid)!;
+
+function dateChanged() {
+    const currentAccount = useAccountStore().CurrentAccount;
+    if (currentAccount == null)
+        return true;
+    const transactionIndex = currentAccount.Transactions.indexOf(props.transactionid);
+    if(transactionIndex<=0)
+        return true;
+
+    const previousTransactionId = currentAccount.Transactions[transactionIndex-1];
+    const previousTransaction = transactionsStore.Transactions.get(previousTransactionId);
+    return TX.Date.getTime() != previousTransaction?.Date.getTime();
+}
+
+function getStatusSymbol() {
+    if(TX.Status == "Reconciled")
+        return "✔";
+
+    if(TX.Status == "Uncleared")
+        return "*";
+
+    return "✘";
+}
 </script>
 
 <template>
-    <tr class="{{transaction.Date.After now ? 'future' : ''}}"
-        :class="[index % 6 < 3 ? 'bg-gray-300' : 'bg-gray-100']">
-        <!--:class="[index % 6 < 3 ? index % 6 === 1 ? 'bg-gray-400' : 'bg-gray-300' : index % 6 !== 4 ? 'bg-gray-100' : '']">-->
-        <td style="width: 90px;">{{ transaction.Date.substring(0, 10) }}</td>
-        <td style="max-width: 150px;">{{ transaction.TransferAccount ? "Transfer : " + transaction.TransferAccount : transaction.Payee }}</td>
-        <td style="max-width: 200px;">
-            {{ transaction.CategoryGroup ? transaction.CategoryGroup + " : " + transaction.Category : "" }}
-        </td>
-        <td>
-            <a :href="'/budget/' + CurrentBudgetID + '/transaction/' + transaction.ID">
-                {{ transaction.Memo }}
-            </a>
-        </td>
-        <td>
-            <Currency class="block" :value="transaction.Amount" />
-        </td>
-        <td style="width: 20px;">
-            {{ transaction.Status == "Reconciled" ? "✔" : (transaction.Status == "Uncleared" ? "" : "*") }}
-        </td>
-        <td style="width: 20px;">{{ transaction.GroupID ? "☀" : "" }}</td>
+    <tr v-if="dateChanged()" class="table-row md:hidden">
+        <td class="bg-gray-200 dark:bg-gray-800 rounded-lg p-2" colspan="5">{{ formatDate(TX.Date) }}</td>
     </tr>
+    <tr
+        v-if="!edit"
+        class="{{new Date(TX.Date) > new Date() ? 'future' : ''}}"
+        :class="[index % 6 < 3 ? 'md:bg-gray-300 dark:md:bg-gray-700' : 'md:bg-gray-100 dark:md:bg-gray-900']"
+    >
+        <!--:class="[index % 6 < 3 ? index % 6 === 1 ? 'bg-gray-400' : 'bg-gray-300' : index % 6 !== 4 ? 'bg-gray-100' : '']">-->
+        <td class="hidden md:block">{{ formatDate(TX.Date) }}</td>
+        <td class="pl-2 md:pl-0">{{ TX.TransferAccount ? "Transfer : " + TX.TransferAccount : TX.Payee }}</td>
+        <td>{{ TX.CategoryGroup ? TX.CategoryGroup + " : " + TX.Category : "" }}</td>
+        <td>
+            <a
+                :href="'/budget/' + CurrentBudgetID + '/transaction/' + TX.ID"
+            >{{ TX.Memo }}</a>
+        </td>
+        <td>
+            <Currency class="block" :value="TX.Amount" />
+        </td>
+        <td class="text-right">
+            {{ TX.GroupID ? "☀" : "" }}
+            {{ getStatusSymbol() }}
+            <a @click="edit = true;">✎</a>
+            <Input v-if="Reconciling && TX.Status != 'Reconciled'" type="checkbox" v-model="TX.Reconciled" />
+        </td>
+    </tr>
+    <TransactionEditRow v-if="edit" :transactionid="TX.ID" @save="edit = false" />
 </template>
 
 <style>

web/src/date.ts

@@ -0,0 +1,7 @@
+export function formatDate(date: Date): string {
+    return date.toLocaleDateString(undefined, { // you can use undefined as first argument
+        year: "numeric",
+        month: "2-digit",
+        day: "2-digit",
+    });
+}

web/src/dialogs/EditAccount.vue

@@ -0,0 +1,45 @@
+<script lang="ts" setup>
+import { computed, ref } from 'vue';
+import Modal from '../components/Modal.vue';
+import { useAccountStore } from '../stores/budget-account';
+import Input from '../components/Input.vue';
+
+const accountStore = useAccountStore();
+const CurrentAccount = computed(() => accountStore.CurrentAccount);
+
+const accountName = ref("");
+const accountOnBudget = ref(true);
+
+function editAccount(e : any) {
+    accountStore.EditAccount(CurrentAccount.value?.ID ?? "", accountName.value, accountOnBudget.value);
+}
+
+function openEditAccount(e : any) {
+    accountName.value = CurrentAccount.value?.Name ?? "";
+    accountOnBudget.value = CurrentAccount.value?.OnBudget ?? true;
+}
+</script>
+
+<template>
+    <Modal button-text="Edit Account" @open="openEditAccount" @submit="editAccount">
+        <template v-slot:placeholder>✎</template>
+        <div class="mt-2 px-7 py-3">
+            <Input
+                class="border-2"
+                type="text"
+                v-model="accountName"
+                placeholder="Account name"
+                required
+            />
+        </div>
+        <div class="mt-2 px-7 py-3">
+            <Input
+                class="border-2"
+                type="checkbox"
+                v-model="accountOnBudget"
+                required
+            />
+            <label>On Budget</label>
+        </div>
+    </Modal>
+</template>

web/src/dialogs/NewBudget.vue

@@ -1,45 +1,19 @@
-<script lang="ts">
-import Card from '../components/Card.vue';
-import { defineComponent } from "vue";
+<script lang="ts" setup>
+import Modal from '../components/Modal.vue';
+import { ref } from "vue";
 import { useBudgetsStore } from '../stores/budget';
+import Input from '../components/Input.vue';
 
-export default defineComponent({
-  data() {
-    return {
-      dialog: false,
-      budgetName: ""
-    }
-  },
-  components: { Card },
-  methods: {
-    saveBudget() {
-      useBudgetsStore().NewBudget(this.$data.budgetName);
-      this.$data.dialog = false;
-    },
-    newBudget() {
-      this.$data.dialog = true;
-    }
-  }
-})
+const budgetName = ref("");
+function saveBudget() {
+  useBudgetsStore().NewBudget(budgetName.value);
+};
 </script>
 
 <template>
-  <Card>
-    <p class="w-24 text-center text-6xl">+</p>
-    <button class="text-lg" dark @click="newBudget">New Budget</button>
-  </Card>
-  <div v-if="dialog" justify="center">
-    <div>
-      <div>
-        <span class="text-h5">New Budget</span>
-      </div>
-      <div>
-        <input type="text" v-model="budgetName" label="Budget name" required />
-      </div>
-      <div>
-        <button @click="dialog = false">Close</button>
-        <button @click="saveBudget">Save</button>
-      </div>
-    </div>
+  <Modal button-text="New Budget" @submit="saveBudget">
+    <div class="mt-2 px-7 py-3">
+      <Input class="border-2" type="text" v-model="budgetName" placeholder="Budget name" required />
     </div>
+  </Modal>
 </template>

web/src/main.ts

@@ -11,7 +11,10 @@ const app = createApp(App)
 app.use(router)
 
 const pinia = createPinia()
-pinia.use(PiniaLogger())
+pinia.use(PiniaLogger({
+  expanded: false,
+  showDuration: true
+}))
 app.use(pinia)
 app.mount('#app')
 

web/src/pages/Account.vue

@@ -1,89 +1,118 @@
-<script lang="ts">
-import { mapState } from "pinia";
-import { defineComponent } from "vue"
-import Autocomplete, { Suggestion } from '../components/Autocomplete.vue'
+<script lang="ts" setup>
+import { computed, ref } from "vue"
 import Currency from "../components/Currency.vue";
 import TransactionRow from "../components/TransactionRow.vue";
-import { useAPI } from "../stores/api";
+import TransactionInputRow from "../components/TransactionInputRow.vue";
 import { useAccountStore } from "../stores/budget-account";
-import { useSessionStore } from "../stores/session";
+import EditAccount from "../dialogs/EditAccount.vue";
+import Button from "../components/Button.vue";
+import { useTransactionsStore } from "../stores/transactions";
+import Modal from "../components/Modal.vue";
+import Input from "../components/Input.vue";
 
-export default defineComponent({
-    data() {
-        return {
-            TransactionDate: new Date().toISOString().substring(0, 10),
-            Payee: undefined as Suggestion | undefined,
-            Category: undefined as Suggestion | undefined,
-            Memo: "",
-            Amount: 0
-        }
-    },
-    components: { Autocomplete, Currency, TransactionRow },
-    props: ["budgetid", "accountid"],
-    computed: {
-        ...mapState(useAccountStore, ["CurrentAccount", "TransactionsList"]),
-    },
-    methods: {
-        saveTransaction(e : MouseEvent) {
-            e.preventDefault();
-            const api = useAPI();
-            api.POST("/transaction/new", JSON.stringify({
-                    budget_id: this.budgetid,
-                    account_id: this.accountid,
-                    date: this.$data.TransactionDate,
-                    payee: this.$data.Payee,
-                    category: this.$data.Category,
-                    memo: this.$data.Memo,
-                    amount: this.$data.Amount,
-                    state: "Uncleared"
-                }))
-                .then(x => x.json());
-        },
-    }
-})
+defineProps<{
+    budgetid: string
+    accountid: string
+}>()
+
+const accounts = useAccountStore();
+const transactions = useTransactionsStore();
+const TargetReconcilingBalance = ref(0);
+
+function setReconciled(event: Event) {
+    const target = event.target as HTMLInputElement;
+    transactions.SetReconciledForAllTransactions(target.checked);
+}
+
+function cancelReconcilation() {
+    transactions.SetReconciledForAllTransactions(false);
+    transactions.Reconciling = false;
+}
+
+function submitReconcilation() {
+    transactions.SubmitReconcilation(0);
+    transactions.Reconciling = false;
+}
+
+function createReconcilationTransaction() {
+    const diff = TargetReconcilingBalance.value - transactions.ReconcilingBalance;
+    transactions.SubmitReconcilation(diff);
+    transactions.Reconciling = false;
+}
 </script>
 
 <template>
-        <h1>{{ CurrentAccount?.Name }}</h1>
-        <p>
-            Current Balance:
-            <Currency :value="CurrentAccount?.Balance" />
-        </p>
+    <div class="grid grid-cols-[1fr_auto]">
+        <h1 class="inline">
+            {{ accounts.CurrentAccount?.Name }}
+            <EditAccount />
+        </h1>
+
+        <div class="text-right flex flex-wrap flex-col md:flex-row justify-end gap-2 max-w-sm">
+            <span class="border-2 rounded-lg p-1 whitespace-nowrap flex-1">
+                Working:
+                <Currency :value="accounts.CurrentAccount?.WorkingBalance" />
+            </span>
+
+            <span class="border-2 rounded-lg p-1 whitespace-nowrap flex-1">
+                Cleared:
+                <Currency :value="accounts.CurrentAccount?.ClearedBalance" />
+            </span>
+
+            <span
+                class="border-2 border-blue-500 rounded-lg bg-blue-500 p-1 whitespace-nowrap flex-1"
+                v-if="!transactions.Reconciling"
+                @click="transactions.Reconciling = true"
+            >
+                Reconciled:
+                <Currency :value="accounts.CurrentAccount?.ReconciledBalance" />
+            </span>
+        </div>
+
+        <span v-if="transactions.Reconciling" class="border-2 block bg-gray-200 dark:bg-gray-800 rounded-lg p-2">
+            Is
+            <Currency :value="transactions.ReconcilingBalance" />your current balance?
+            <Button class="bg-blue-500 mx-3 py-2" @click="submitReconcilation">Yes!</Button>
+            <br />No, it's:
+            <Input class="text-right" type="number" v-model="TargetReconcilingBalance" />
+            Difference:
+            <Currency :value="transactions.ReconcilingBalance - TargetReconcilingBalance" />
+            <Button
+                class="bg-orange-500 mx-3 py-2"
+                v-if="Math.abs(transactions.ReconcilingBalance - TargetReconcilingBalance) > 0.01"
+                @click="createReconcilationTransaction"
+            >Create reconciling Transaction</Button>
+            <Button class="bg-red-500 mx-3 py-2" @click="cancelReconcilation">Cancel</Button>
+        </span>
+    </div>
+
     <table>
         <tr class="font-bold">
-                <td style="width: 90px;">Date</td>
+            <td class="hidden md:block" style="width: 90px;">Date</td>
             <td style="max-width: 150px;">Payee</td>
             <td style="max-width: 200px;">Category</td>
             <td>Memo</td>
             <td class="text-right">Amount</td>
-                <td style="width: 20px;"></td>
-                <td style="width: 20px;"></td>
+            <td style="width: 80px;">
+                <Input v-if="transactions.Reconciling" type="checkbox" @input="setReconciled" />
+            </td>
         </tr>
-            <tr>
-                <td style="width: 90px;" class="text-sm">
-                    <input class="border-b-2 border-black" type="date" v-model="TransactionDate" />
-                </td>
-                <td style="max-width: 150px;">
-                    <Autocomplete v-model="Payee" type="payees" />
-                </td>
-                <td style="max-width: 200px;">
-                    <Autocomplete v-model="Category" type="categories" />
-                </td>
-                <td>
-                    <input class="block w-full border-b-2 border-black" type="text" v-model="Memo" />
-                </td>
-                <td style="width: 80px;" class="text-right">
-                    <input class="text-right block w-full border-b-2 border-black" type="currency" v-model="Amount" />
-                </td>
-                <td style="width: 20px;">
-                    <input type="submit" @click="saveTransaction" value="Save" />
-                </td>
-                <td style="width: 20px;"></td>
-            </tr>
-            <TransactionRow v-for="(transaction, index) in TransactionsList"
-                :transaction="transaction"
-                :index="index" />
+        <TransactionInputRow class="hidden md:table-row" :budgetid="budgetid" :accountid="accountid" />
+        <TransactionRow
+            v-for="(transaction, index) in transactions.TransactionsList"
+            :key="transaction.ID"
+            :transactionid="transaction.ID"
+            :index="index"
+        />
     </table>
+    <div class="md:hidden">
+        <Modal>
+            <template v-slot:placeholder>
+                <Button class="fixed right-4 bottom-4 font-bold text-lg bg-blue-500 py-2">+</Button>
+            </template>
+            <TransactionInputRow class="grid grid-cols-2" :budgetid="budgetid" :accountid="accountid" />
+        </Modal>
+    </div>
 </template>
 
 <style>

web/src/pages/Admin.vue

@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+import { onMounted } from 'vue';
+import { useSessionStore } from '../stores/session';
+
+onMounted(() => {
+    useSessionStore().setTitle("Admin");
+})
+</script>
+
+<template>
+    <h1>Danger Zone</h1>
+    <div class="budget-item">
+        <button>Clear database</button>
+        <p>This removes all data and starts from scratch. Not undoable!</p>
+    </div>
+</template>

web/src/pages/BudgetSidebar.vue

@@ -1,20 +1,33 @@
-<script lang="ts">
-import { mapState } from "pinia"
-import { defineComponent } from "vue"
+<script lang="ts" setup>
+import { computed } from "vue";
 import Currency from "../components/Currency.vue"
 import { useBudgetsStore } from "../stores/budget"
-import { useAccountStore } from "../stores/budget-account"
+import { Account, useAccountStore } from "../stores/budget-account"
 import { useSettingsStore } from "../stores/settings"
 
-export default defineComponent({
-    props: ["budgetid", "accountid"],
-    components: { Currency },
-    computed: {
-      ...mapState(useSettingsStore, ["ExpandMenu"]),
-      ...mapState(useBudgetsStore, ["CurrentBudgetName", "CurrentBudgetID"]),
-      ...mapState(useAccountStore, ["OnBudgetAccounts", "OnBudgetAccountsBalance", "OffBudgetAccounts", "OffBudgetAccountsBalance"])
-    }
-})
+const ExpandMenu = computed(() => useSettingsStore().Menu.Expand);
+
+const budgetStore = useBudgetsStore();
+const CurrentBudgetName = computed(() => budgetStore.CurrentBudgetName);
+const CurrentBudgetID = computed(() => budgetStore.CurrentBudgetID);
+
+const accountStore = useAccountStore();
+const OnBudgetAccounts = computed(() => accountStore.OnBudgetAccounts);
+const OffBudgetAccounts = computed(() => accountStore.OffBudgetAccounts);
+const OnBudgetAccountsBalance = computed(() => accountStore.OnBudgetAccountsBalance);
+const OffBudgetAccountsBalance = computed(() => accountStore.OffBudgetAccountsBalance);
+
+function isRecentlyReconciled(account : Account) {
+  const now = new Date().getTime();
+  const recently = 7 * 24 * 60 * 60 * 1000;
+  console.log(account.Name, account.LastReconciled, now, recently, new Date(now-recently));
+  return new Date(now - recently).getTime() < account.LastReconciled.getTime();
+}
+
+function getAccountName(account : Account) {
+  const reconciledMarker = isRecentlyReconciled(account) ? "" : " *";
+  return account.Name + reconciledMarker;
+}
 </script>
 
 <template>
@@ -23,41 +36,43 @@ export default defineComponent({
       <router-link to="/dashboard">⌂</router-link>
       {{CurrentBudgetName}}
     </span>
-    <span class="bg-orange-200 rounded-lg m-1 p-1 px-3 flex flex-col">
-      <router-link :to="'/budget/'+budgetid+'/budgeting'">Budget</router-link><br />
+    <span class="bg-orange-200 dark:bg-orange-700 rounded-lg m-1 p-1 px-3 flex flex-col">
+      <router-link :to="'/budget/'+CurrentBudgetID+'/budgeting'">Budget</router-link><br />
       <!--<router-link :to="'/budget/'+CurrentBudgetID+'/reports'">Reports</router-link>-->
       <!--<router-link :to="'/budget/'+CurrentBudgetID+'/all-accounts'">All Accounts</router-link>-->
     </span>
-    <li class="bg-orange-200 rounded-lg m-1 p-1 px-3">
+    <li class="bg-orange-200 dark:bg-orange-700 rounded-lg m-1 p-1 px-3">
       <div class="flex flex-row justify-between font-bold">
         <span>On-Budget Accounts</span>
         <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="OnBudgetAccountsBalance" />
       </div>
       <div v-for="account in OnBudgetAccounts" class="flex flex-row justify-between">
-        <router-link :to="'/budget/'+budgetid+'/account/'+account.ID">{{account.Name}}</router-link>
-        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="account.Balance" />
+        <router-link :to="'/budget/'+CurrentBudgetID+'/account/'+account.ID">{{getAccountName(account)}}</router-link>
+        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="account.ClearedBalance" />
       </div>
     </li>
-    <li class="bg-red-200 rounded-lg m-1 p-1 px-3">
+    <li class="bg-red-200 dark:bg-red-800 rounded-lg m-1 p-1 px-3">
       <div class="flex flex-row justify-between font-bold">
         <span>Off-Budget Accounts</span>
         <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="OffBudgetAccountsBalance" />
       </div>
       <div v-for="account in OffBudgetAccounts" class="flex flex-row justify-between">
-        <router-link :to="'/budget/'+budgetid+'/account/'+account.ID">{{account.Name}}</router-link>
-        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="account.Balance" />
+        <router-link :to="'/budget/'+CurrentBudgetID+'/account/'+account.ID">{{getAccountName(account)}}</router-link>
+        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="account.ClearedBalance" />
       </div>
     </li>
-    <li class="bg-red-200 rounded-lg m-1 p-1 px-3">
-      Closed Accounts
+    <li class="bg-red-200 dark:bg-red-800 rounded-lg m-1 p-1 px-3">
+      <div class="flex flex-row justify-between font-bold">
+        <span>Closed Accounts</span>
+      </div>
     </li>
     <!--<li>
       <router-link :to="'/budget/'+CurrentBudgetID+'/accounts'">Edit accounts</router-link>
     </li>-->
-    <li class="bg-red-200 rounded-lg m-1 p-1 px-3">
+    <li class="bg-red-200 dark:bg-red-800 rounded-lg m-1 p-1 px-3">
       + Add Account
     </li>
-    <li class="bg-red-200 rounded-lg m-1 p-1 px-3">
+    <li class="bg-red-200 dark:bg-red-800 rounded-lg m-1 p-1 px-3">
       <router-link :to="'/budget/'+CurrentBudgetID+'/settings'">Budget-Settings</router-link>
     </li>
     <!--<li><router-link to="/admin">Admin</router-link></li>-->

web/src/pages/Budgeting.vue

@@ -1,115 +1,102 @@
-<script lang="ts">
-import { mapState } from "pinia";
-import { defineComponent, PropType } from "vue";
+<script lang="ts" setup>
+import { computed, defineProps, onMounted, ref, watchEffect } from "vue";
 import Currency from "../components/Currency.vue";
 import { useBudgetsStore } from "../stores/budget";
-import { Category, useAccountStore } from "../stores/budget-account";
+import { useAccountStore } from "../stores/budget-account";
+import { useSessionStore } from "../stores/session";
 
-interface Date {
-    Year: number,
-    Month: number,
-}
+const props = defineProps<{
+    budgetid: string,
+    year: string,
+    month: string,
+}>()
 
-export default defineComponent({
-    props: {
-        budgetid: {} as PropType<string>, 
-        year: {} as PropType<number>,
-        month: {} as PropType<number>,
-    },
-    computed: {
-        ...mapState(useBudgetsStore, ["CurrentBudgetID"]),
-        Categories() : Category[] {
-            const accountStore = useAccountStore();
-            return [...accountStore.CategoriesForMonth(this.selected.Year, this.selected.Month)];
-        },
-        previous() : Date {
-            return {
-                Year: new Date(this.selected.Year, this.selected.Month - 1, 1).getFullYear(),
-                Month: new Date(this.selected.Year, this.selected.Month - 1, 1).getMonth(),
-            };
-        },
-        current() : Date {
-            return {
+const budgetsStore = useBudgetsStore();
+const CurrentBudgetID = computed(() => budgetsStore.CurrentBudgetID);
+
+const accountStore = useAccountStore();
+const categoriesForMonth = accountStore.CategoriesForMonthAndGroup;
+
+function GetCategories(group: string) {
+    return [...categoriesForMonth(selected.value.Year, selected.value.Month, group)];
+};
+
+const groupsForMonth = accountStore.CategoryGroupsForMonth;
+const GroupsForMonth = computed(() => {
+    return [...groupsForMonth(selected.value.Year, selected.value.Month)];
+});
+
+
+const previous = computed(() => ({
+    Year: new Date(selected.value.Year, selected.value.Month - 1, 1).getFullYear(),
+    Month: new Date(selected.value.Year, selected.value.Month - 1, 1).getMonth(),
+}));
+const current = computed(() => ({
     Year: new Date().getFullYear(),
     Month: new Date().getMonth(),
-            };
-        },
-        selected() : Date {
-            return {
-                Year: this.year ?? this.current.Year,
-                Month: Number(this.month ?? this.current.Month) + 1
-            }
-        },
-        next() : Date {
-            return {
-                Year: new Date(this.selected.Year, Number(this.month) + 1, 1).getFullYear(),
-                Month: new Date(this.selected.Year, Number(this.month) + 1, 1).getMonth(),
-            };
-        }
-    },
-    mounted() : Promise<void> {
-        document.title = "Budgeteer - Budget for " + this.selected.Month + "/" + this.selected.Year;
-        return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.selected.Year, this.selected.Month);
-    },
-    watch: {
-        year() {
-            if (this.year != undefined && this.month != undefined)
-                return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.year, this.month);
-        },
-        month() {
-            if (this.year != undefined && this.month != undefined)
-                return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.year, this.month);
-        },
-    },
-    components: { Currency }
+}));
+const selected = computed(() => ({
+    Year: Number(props.year) ?? current.value.Year,
+    Month: Number(props.month ?? current.value.Month)
+}));
+const next = computed(() => ({
+    Year: new Date(selected.value.Year, Number(props.month) + 1, 1).getFullYear(),
+    Month: new Date(selected.value.Year, Number(props.month) + 1, 1).getMonth(),
+}));
+
+watchEffect(() => {
+    if (props.year != undefined && props.month != undefined)
+        return useAccountStore().FetchMonthBudget(props.budgetid ?? "", Number(props.year), Number(props.month));
+});
+
+onMounted(() => {
+    useSessionStore().setTitle("Budget for " + selected.value.Month + "/" + selected.value.Year);
 })
 
-/*{{define "title"}}
-    {{printf "Budget for %s %d" .Date.Month .Date.Year}}
-{{end}}*/
+
+const expandedGroups = ref<Map<string, boolean>>(new Map<string, boolean>())
+
+function toggleGroup(group: { Name: string, Expand: boolean }) {
+    console.log(expandedGroups.value);
+    expandedGroups.value.set(group.Name, !(expandedGroups.value.get(group.Name) ?? group.Expand))
+}
+
+function getGroupState(group: { Name: string, Expand: boolean }): boolean {
+    return expandedGroups.value.get(group.Name) ?? group.Expand;
+}
 </script>
 
 <template>
-    <h1>Budget for {{ selected.Month }}/{{ selected.Year }}</h1>
+    <h1>Budget for {{ selected.Month + 1 }}/{{ selected.Year }}</h1>
     <div>
         <router-link
             :to="'/budget/' + CurrentBudgetID + '/budgeting/' + previous.Year + '/' + previous.Month"
-        >Previous Month</router-link>-
+        >&lt;&lt;</router-link>&nbsp;
         <router-link
             :to="'/budget/' + CurrentBudgetID + '/budgeting/' + current.Year + '/' + current.Month"
-        >Current Month</router-link>-
+        >Current Month</router-link>&nbsp;
         <router-link
             :to="'/budget/' + CurrentBudgetID + '/budgeting/' + next.Year + '/' + next.Month"
-        >Next Month</router-link>
+        >&gt;&gt;</router-link>
     </div>
-    <table class="container col-lg-12" id="content">
-        <tr>
-            <th>Group</th>
-            <th>Category</th>
-            <th></th>
-            <th></th>
-            <th>Leftover</th>
-            <th>Assigned</th>
-            <th>Activity</th>
-            <th>Available</th>
-        </tr>
-        <tr v-for="category in Categories">
-            <td>{{ category.Group }}</td>
-            <td>{{ category.Name }}</td>
-            <td></td>
-            <td></td>
-            <td class="text-right">
-                <Currency :value="category.AvailableLastMonth" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Assigned" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Activity" />
-            </td>
-            <td class="text-right">
+    <div class="container col-lg-12 grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-5" id="content">
+        <span class="hidden sm:block"></span>
+        <span class="hidden lg:block text-right">Leftover</span>
+        <span class="hidden sm:block text-right">Assigned</span>
+        <span class="hidden sm:block text-right">Activity</span>
+        <span class="hidden sm:block text-right">Available</span>
+        <template v-for="group in GroupsForMonth">
+            <a
+                class="text-lg font-bold col-span-2 sm:col-span-4 lg:col-span-5"
+                @click="toggleGroup(group)"
+            >{{ (getGroupState(group) ? "−" : "+") + " " + group.Name }}</a>
+            <template v-for="category in GetCategories(group.Name)" v-if="getGroupState(group)">
+                <span class="whitespace-nowrap overflow-hidden">{{ category.Name }}</span>
+                <Currency :value="category.AvailableLastMonth" class="hidden lg:block" />
+                <Currency :value="category.Assigned" class="hidden sm:block" />
+                <Currency :value="category.Activity" class="hidden sm:block" />
                 <Currency :value="category.Available" />
-            </td>
-        </tr>
-    </table>
+            </template>
+        </template>
+    </div>
 </template>

web/src/pages/Dashboard.vue

@@ -1,17 +1,13 @@
-<script lang="ts">
+<script lang="ts" setup>
 import NewBudget from '../dialogs/NewBudget.vue';
 import Card from '../components/Card.vue';
-import { defineComponent } from 'vue';
-import { mapState } from 'pinia';
 import { useSessionStore } from '../stores/session';
 
-export default defineComponent({
-    props: ["budgetid"],
-    components: { NewBudget, Card },
-    computed: {
-        ...mapState(useSessionStore, ["BudgetsList"]),
-    }
-})
+const props = defineProps<{
+    budgetid: string,
+}>();
+
+const BudgetsList = useSessionStore().BudgetsList;
 </script>
 
 <template>

web/src/pages/Index.vue

@@ -1,9 +1,4 @@
-<script lang="ts">
-import { defineComponent } from 'vue';
-
-export default defineComponent({
-	
-})
+<script lang="ts" setup>
 </script>
 
 <template>

web/src/pages/Login.vue

@@ -1,46 +1,45 @@
-<script lang="ts">
-import { defineComponent } from "vue";
+<script lang="ts" setup>
+import { onMounted, ref } from "vue";
+import { useRouter } from "vue-router";
 import { useSessionStore } from "../stores/session";
+import Input from "../components/Input.vue";
 
-export default defineComponent({
-    data() {
-        return {
-            error: "",
-            login: {
-                user: "",
-                password: ""
-            },
-            showPassword: false
-        }
-    },
-    mounted() {
-        document.title = "Budgeteer - Login";
-    },
-    methods: {
-        formSubmit(e : MouseEvent) {
+const error = ref("");
+const login = ref({ user: "", password: "" });
+const router = useRouter(); // has to be called in setup
+
+onMounted(() => {
+    useSessionStore().setTitle("Login");
+});
+
+function formSubmit(e: MouseEvent) {
     e.preventDefault();
-            useSessionStore().login(this.$data.login)
+    useSessionStore().login(login.value)
         .then(x => {
-                    this.$data.error = "";
-                    this.$router.replace("/dashboard");
+            error.value = "";
+            router.replace("/dashboard");
+            return x;
         })
-                .catch(x => this.$data.error = "The entered credentials are invalid!");
+        .catch(x => error.value = "The entered credentials are invalid!");
 
     // TODO display invalidCredentials
     // TODO redirect to dashboard on success
-        }
-    }
-})
+}
 </script>
 
 <template>
     <div>
-            <input type="text"      v-model="login.user"     placeholder="Username" class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
-            <input type="password"  v-model="login.password" placeholder="Password" class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
+        <Input type="text" v-model="login.user"
+            placeholder="Username"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
+        <Input type="password" v-model="login.password"
+            placeholder="Password"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
     </div>
     <div>{{ error }}</div>
     <button type="submit" @click="formSubmit" class="bg-blue-300 rounded-lg p-2 w-48">Login</button>
     <p>
-            New user? <router-link to="/register">Register</router-link> instead!
+        New user?
+        <router-link to="/register">Register</router-link> instead!
     </p>
 </template>

web/src/pages/Register.vue

@@ -1,67 +1,48 @@
-<script lang="ts">
-import { defineComponent } from 'vue';
-import { useSessionStore } from '../stores/session';
+<script lang="ts" setup>
+import { onMounted, ref } from "vue";
+import { useRouter } from "vue-router";
+import { useSessionStore } from "../stores/session";
+import Input from "../components/Input.vue";
 
-export default defineComponent({
-    data() {
-        return {
-            showPassword: false,
-            error: "",
-            login: {
-                email: "",
-                password: "",
-                name: "",
-            }
-        }
-    },
-    methods: {
-        formSubmit (e : FormDataEvent) {
+const error = ref("");
+const login = ref({ email: "", password: "", name: "" });
+const router = useRouter(); // has to be called in setup
+
+onMounted(() => {
+    useSessionStore().setTitle("Login");
+});
+
+function formSubmit(e: MouseEvent) {
     e.preventDefault();
-            useSessionStore().register(this.$data.login)
-                .then(() => this.$data.error = "")
-                .catch(() => this.$data.error = "Something went wrong!");
+    useSessionStore().register(login.value)
+        .then(x => {
+            error.value = "";
+            router.replace("/dashboard");
+            return x;
+        })
+        .catch(x => error.value = "The entered credentials are invalid!");
 
     // TODO display invalidCredentials
     // TODO redirect to dashboard on success
-        }
-    }
-})
+}
 </script>
 
 <template>
-    <v-container>
-        <v-row>
-            <v-col cols="12">
-                <v-text-field v-model="login.email" type="text" label="E-Mail" />
-            </v-col>
-            <v-col cols="12">
-                <v-text-field v-model="login.name" type="text" label="Name" />
-            </v-col>
-            <v-col cols="6">
-                <v-text-field v-model="login.password" label="Password"
-                    :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'" 
-                    :type="showPassword ? 'text' : 'password'"
-                    @click:append="showPassword = showPassword"
-                    :error-message="error"
-                    error-count="2"
-                    error />
-            </v-col>
-            <v-col cols="6">
-                <v-text-field v-model="login.password" label="Repeat password"
-                    :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'" 
-                    :type="showPassword ? 'text' : 'password'"
-                    @click:append="showPassword = showPassword"
-                    :error-message="error"
-                    error-count="2"
-                    error />
-            </v-col>
-        </v-row>
-        <div class="form-group">
-            {{ error }}
+    <div>
+        <Input type="text" v-model="login.name"
+            placeholder="Name"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
+        <Input type="text" v-model="login.email"
+            placeholder="Email"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
+        <Input type="password" v-model="login.password"
+            placeholder="Password"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
     </div>
-        <v-btn type="submit" @click="formSubmit">Register</v-btn>
+    <div>{{ error }}</div>
+    <button type="submit" @click="formSubmit" class="bg-blue-300 rounded-lg p-2 w-48">Register</button>
     <p>
-		    Existing user? <router-link to="/login">Login</router-link> instead!
+        Existing user?
+        <router-link to="/login">Login</router-link> instead!
     </p>
-    </v-container>
 </template>

web/src/pages/Settings.vue

@@ -1,120 +1,104 @@
-<script lang="ts">
-import { defineComponent } from "vue"
-import { useAPI } from "../stores/api";
+<script lang="ts" setup>
+import { computed, defineComponent, onMounted, ref } from "vue"
+import { useRouter } from "vue-router";
+import { DELETE, POST } from "../api";
 import { useBudgetsStore } from "../stores/budget";
 import { useSessionStore } from "../stores/session";
+import Card from "../components/Card.vue";
+import Button from "../components/Button.vue";
+import { saveAs } from 'file-saver';
+import Input from "../components/Input.vue";
 
-export default defineComponent({
-    data() {
-        return {
-            transactionsFile: undefined as File | undefined,
-            assignmentsFile: undefined as File | undefined
-        }
-    },
-    computed: {
-        filesIncomplete() : boolean {
-            return this.$data.transactionsFile == undefined || this.$data.assignmentsFile == undefined;
-        }
-    },
-    mounted() {
-        document.title = "Budgeteer - Settings";
-    },
-    methods: {
-        gotAssignments(e : Event) {
+const transactionsFile = ref<File | undefined>(undefined);
+const assignmentsFile = ref<File | undefined>(undefined);
+
+const filesIncomplete = computed(() => transactionsFile.value == undefined || assignmentsFile.value == undefined);
+onMounted(() => {
+    useSessionStore().setTitle("Settings");
+});
+
+const budgetStore = useBudgetsStore();
+const CurrentBudgetID = computed(() => budgetStore.CurrentBudgetID);
+const CurrentBudgetName = computed(() => budgetStore.CurrentBudgetName);
+
+function gotAssignments(e: Event) {
     const input = (<HTMLInputElement>e.target);
-            if(input.files != null)
-                this.$data.assignmentsFile = input.files[0];
-        },
-        gotTransactions(e : Event) {
+    if (input.files != null)
+        assignmentsFile.value = input.files[0];
+}
+function gotTransactions(e: Event) {
     const input = (<HTMLInputElement>e.target);
-            if(input.files != null)
-                this.$data.transactionsFile = input.files[0];
-        },
-        deleteBudget() {
-            const currentBudgetID = useBudgetsStore().CurrentBudgetID;
-            if (currentBudgetID == null)
+    if (input.files != null)
+        transactionsFile.value = input.files[0];
+};
+function deleteBudget() {
+    if (CurrentBudgetID.value == null)
         return;
 
-            const api = useAPI();
-            api.DELETE("/budget/" + currentBudgetID);
+    DELETE("/budget/" + CurrentBudgetID.value);
 
     const budgetStore = useSessionStore();
-            budgetStore.Budgets.delete(currentBudgetID);
-            this.$router.push("/")
-        },
-        clearBudget() {
-            const currentBudgetID = useBudgetsStore().CurrentBudgetID;
-            const api = useAPI();
-            api.POST("/budget/" + currentBudgetID + "/settings/clear", null)
-        },
-        cleanNegative() {
+    budgetStore.Budgets.delete(CurrentBudgetID.value);
+    useRouter().push("/")
+};
+function clearBudget() {
+    POST("/budget/" + CurrentBudgetID.value + "/settings/clear", null)
+};
+function cleanNegative() {
     // <a href="/budget/{{.Budget.ID}}/settings/clean-negative">Fix all historic negative category-balances</a>
-        },
-        ynabImport() {
-            if (this.$data.transactionsFile == undefined || this.$data.assignmentsFile == undefined)
+};
+function ynabImport() {
+    if (transactionsFile.value == undefined || assignmentsFile.value == undefined)
         return
 
     let formData = new FormData();
-            formData.append("transactions", this.$data.transactionsFile);
-            formData.append("assignments", this.$data.assignmentsFile);
+    formData.append("transactions", transactionsFile.value);
+    formData.append("assignments", assignmentsFile.value);
     const budgetStore = useBudgetsStore();
     budgetStore.ImportYNAB(formData);
-        }
-    }
-})
+};
+function ynabExport() {
+    const timeStamp = new Date().toISOString();
+    POST("/budget/"+CurrentBudgetID.value+"/export/ynab/assignments", "")
+        .then(x => x.text())
+        .then(x => {
+            var blob = new Blob([x], {type: "text/plain;charset=utf-8"});
+            saveAs(blob, timeStamp + " " + CurrentBudgetName.value + " - Budget.tsv");
+        })
+    POST("/budget/"+CurrentBudgetID.value+"/export/ynab/transactions", "")
+        .then(x => x.text())
+        .then(x => {
+            var blob = new Blob([x], {type: "text/plain;charset=utf-8"});
+            saveAs(blob, timeStamp + " " + CurrentBudgetName.value + " - Transactions.tsv");
+        })
+}
+
 </script>
 
 <template>
-    <v-container>
+    <div>
         <h1>Danger Zone</h1>
-        <v-row>
-            <v-col cols="12" md="6" xl="3">
-                <v-card>
-                    <v-card-header>
-                        <v-card-header-text>
-                            <v-card-title>Clear Budget</v-card-title>
-                            <v-card-subtitle>This removes transactions and assignments to start from scratch. Accounts and categories are kept. Not undoable!</v-card-subtitle>
-                        </v-card-header-text>
-                    </v-card-header>
-                    <v-card-actions class="justify-center">
-                        <v-btn @click="clearBudget">Clear budget</v-btn>
-                    </v-card-actions>
-                </v-card>
-            </v-col>
-            <v-col cols="12" md="6" xl="3">
-                <v-card>
-                    <v-card-header>
-                        <v-card-header-text>
-                            <v-card-title>Delete Budget</v-card-title>
-                            <v-card-subtitle>This deletes the whole bugdet including all transactions, assignments, accounts and categories. Not undoable!</v-card-subtitle>
-                        </v-card-header-text>
-                    </v-card-header>
-                    <v-card-actions class="justify-center">
-                        <v-btn @click="deleteBudget">Delete budget</v-btn>
-                    </v-card-actions>
-                </v-card>
-            </v-col>
-            <v-col cols="12" md="6" xl="3">
-                <v-card>
-                    <v-card-header>
-                        <v-card-header-text>
-                            <v-card-title>Fix all historic negative category-balances</v-card-title>
-                            <v-card-subtitle>This restores YNABs functionality, that would substract any overspent categories' balances from next months inflows.</v-card-subtitle>
-                        </v-card-header-text>
-                    </v-card-header>
-                    <v-card-actions class="justify-center">
-                        <v-btn @click="cleanNegative">Fix negative</v-btn>
-                    </v-card-actions>
-                </v-card>
-            </v-col>
-            <v-col cols="12" xl="6">
-                <v-card>
-                    <v-card-header>
-                        <v-card-header-text>
-                            <v-card-title>Import YNAB Budget</v-card-title>
-                        </v-card-header-text>
-                    </v-card-header>
+        <div class="grid md:grid-cols-2 gap-6">
+            <Card class="flex-col p-3">
+                <h2 class="text-lg font-bold">Clear Budget</h2>
+                <p>This removes transactions and assignments to start from scratch. Accounts and categories are kept. Not undoable!</p>
 
+                <Button class="bg-red-500 py-2" @click="clearBudget">Clear budget</Button>
+            </Card>
+            <Card class="flex-col p-3">
+                <h2 class="text-lg font-bold">Delete Budget</h2>
+                <p>This deletes the whole bugdet including all transactions, assignments, accounts and categories. Not undoable!</p>
+                <Button class="bg-red-500 py-2" @click="deleteBudget">Delete budget</button>
+            </Card>
+            <Card class="flex-col p-3">
+                <h2 class="text-lg font-bold">Fix all historic negative category-balances</h2>
+                <p>This restores YNABs functionality, that would substract any overspent categories' balances from next months inflows.</p>
+                <Button class="bg-orange-500 py-2" @click="cleanNegative">Fix negative</button>
+            </Card>
+            <Card class="flex-col p-3">
+                <h2 class="text-lg font-bold">Import YNAB Budget</h2>
+                
+                <div>
                     <label for="transactions_file">
                         Transaktionen:
                         <input type="file" @change="gotTransactions" accept="text/*" />
@@ -124,16 +108,17 @@ export default defineComponent({
                         Budget:
                         <input type="file" @change="gotAssignments" accept="text/*" />
                     </label>
+                </div>
 
-                    <v-card-actions class="justify-center">
-                        <v-btn
-                            :disabled="filesIncomplete"
-                            @click="ynabImport"
-                        >Importieren</v-btn>
-                    </v-card-actions>
-                </v-card>
-            </v-col>
-        </v-row>
-        <v-card></v-card>
-    </v-container>
+                <Button class="bg-blue-500 py-2" :disabled="filesIncomplete" @click="ynabImport">Importieren</Button>
+            </Card>
+            <Card class="flex-col p-3">
+                <h2 class="text-lg font-bold">Export as YNAB TSV</h2>
+
+                <div class="flex flex-row">
+                    <Button class="bg-blue-500 py-2" @click="ynabExport">Export</Button>
+                </div>
+            </Card>
+        </div>
+    </div>
 </template>

web/src/pinia-logger.ts

@@ -11,9 +11,8 @@ const formatTime = (date = new Date()) => {
   const hours = date.getHours().toString().padStart(2, '0');
   const minutes = date.getMinutes().toString().padStart(2, '0');
   const seconds = date.getSeconds().toString().padStart(2, '0');
-  const milliseconds = date.getMilliseconds().toString();
 
-  return `${hours}:${minutes}:${seconds}:${milliseconds}`;
+  return `${hours}:${minutes}:${seconds}`;
 };
 
 export interface PiniaLoggerOptions {
@@ -52,7 +51,7 @@ export const PiniaLogger = (config = defaultOptions) => (ctx: PiniaPluginContext
       const duration = endTime - startTime + 'ms';
       const nextState = cloneDeep(ctx.store.$state);
       const storeName = action.store.$id;
-      const title = `action 🍍 ${options.showStoreName ? `[${storeName}] ` : ''}${action.name} ${isError ? `failed after ${duration} ` : ''}@ ${formatTime()}`;
+      const title = `${formatTime()} action 🍍 ${options.showStoreName ? `[${storeName}] ` : ''}${action.name} ${isError ? `failed after ` : ''}in ${duration}`;
 
       console[options.expanded ? 'group' : 'groupCollapsed'](`%c${title}`, `font-weight: bold; ${isError ? 'color: #ed4981;' : ''}`);
       console.log('%cprev state', 'font-weight: bold; color: grey;', prevState);

web/src/stores/api.ts

@@ -1,28 +0,0 @@
-import { defineStore } from "pinia";
-import { useSessionStore } from "./session";
-
-export const useAPI = defineStore("api", {
-    actions: {
-        GET(path : string) {
-            const sessionStore = useSessionStore();
-            return fetch("/api/v1" + path, {
-                headers: sessionStore.AuthHeaders,
-            })
-        },
-        POST(path : string, body : FormData | string | null) {
-            const sessionStore = useSessionStore();
-            return fetch("/api/v1" + path, {
-                method: "POST",
-                headers: sessionStore.AuthHeaders,
-                body: body,
-            })
-        },
-        DELETE(path : string) {
-            const sessionStore = useSessionStore();
-            return fetch("/api/v1" + path, {
-                method: "DELETE",
-                headers: sessionStore.AuthHeaders,
-            })
-        },
-    }
-});

web/src/stores/budget-account.ts

@@ -1,13 +1,14 @@
 import { defineStore } from "pinia"
-import { useAPI } from "./api";
+import { GET, POST } from "../api";
+import { useBudgetsStore } from "./budget";
 import { useSessionStore } from "./session";
+import { useTransactionsStore } from "./transactions";
 
 interface State {
-    Accounts: Map<string, Account>,
-    CurrentAccountID: string | null,
-    Categories: Map<string, Category>,
-    Months: Map<number, Map<number, Map<string, Category>>>,
-    Transactions: [],
+    Accounts: Map<string, Account>
+    CurrentAccountID: string | null
+    Categories: Map<string, Category>
+    Months: Map<number, Map<number, Map<string, Category>>>
     Assignments: []
 }
 
@@ -15,7 +16,11 @@ export interface Account {
     ID: string
     Name: string
     OnBudget: boolean
-    Balance: Number
+    ClearedBalance: number
+    WorkingBalance: number
+    ReconciledBalance: number
+    Transactions: string[]
+    LastReconciled: Date
 }
 
 export interface Category {
@@ -34,74 +39,106 @@ export const useAccountStore = defineStore("budget/account", {
         CurrentAccountID: null,
         Months: new Map<number, Map<number, Map<string, Category>>>(),
         Categories: new Map<string, Category>(),
-        Transactions: [],
-        Assignments: []
+        Assignments: [],
     }),
     getters: {
         AccountsList(state) {
-            return [ ...state.Accounts.values() ];
+            return [...state.Accounts.values()];
         },
-        CategoriesForMonth: (state) => (year : number, month : number) => {
-            console.log("MTH", state.Months)
+        AllCategoriesForMonth: (state) => (year: number, month: number) => {
             const yearMap = state.Months.get(year);
-            return [ ...yearMap?.get(month)?.values() || [] ];
+            const monthMap = yearMap?.get(month);
+            return [...monthMap?.values() || []];
         },
-        CurrentAccount(state) : Account | undefined {
+        CategoryGroupsForMonth(state) {
+            return (year: number, month: number) => {
+                const categories = this.AllCategoriesForMonth(year, month);
+                const categoryGroups = [];
+                let prev = undefined;
+                for (const category of categories) {
+                    if (category.Group != prev)
+                        categoryGroups.push({
+                            Name: category.Group,
+                            Expand: category.Group != "Hidden Categories",
+                        });
+                    prev = category.Group;
+                }
+                return categoryGroups;
+            }
+        },
+        CategoriesForMonthAndGroup(state) {
+            return (year: number, month: number, group: string) => {
+                const categories = this.AllCategoriesForMonth(year, month);
+                return categories.filter(x => x.Group == group);
+            }
+        },
+        GetAccount(state) {
+            return (accountid: string) => {
+                return this.Accounts.get(accountid);
+            }
+        },
+        CurrentAccount(state): Account | undefined {
             if (state.CurrentAccountID == null)
                 return undefined;
 
-            return state.Accounts.get(state.CurrentAccountID);
+            return this.GetAccount(state.CurrentAccountID);
         },
         OnBudgetAccounts(state) {
-            return [ ...state.Accounts.values() ].filter(x => x.OnBudget);
+            return [...state.Accounts.values()].filter(x => x.OnBudget);
         },
-        OnBudgetAccountsBalance(state) : Number {
-            return this.OnBudgetAccounts.reduce((prev, curr) => prev + Number(curr.Balance), 0);
+        OnBudgetAccountsBalance(state): number {
+            return this.OnBudgetAccounts.reduce((prev, curr) => prev + Number(curr.ClearedBalance), 0);
         },
         OffBudgetAccounts(state) {
-            return [ ...state.Accounts.values() ].filter(x => !x.OnBudget);
+            return [...state.Accounts.values()].filter(x => !x.OnBudget);
         },
-        OffBudgetAccountsBalance(state) : Number {
-            return this.OffBudgetAccounts.reduce((prev, curr) => prev + Number(curr.Balance), 0);
+        OffBudgetAccountsBalance(state): number {
+            return this.OffBudgetAccounts.reduce((prev, curr) => prev + Number(curr.ClearedBalance), 0);
         },
-        TransactionsList(state) {
-            return (state.Transactions || []);
-        }
     },
     actions: {
-        async SetCurrentAccount(budgetid : string, accountid : string) {
+        async SetCurrentAccount(budgetid: string, accountid: string) {
             if (budgetid == null)
-                return
+                return;
 
             this.CurrentAccountID = accountid;
-            if (this.CurrentAccount == undefined)
-                return
 
-            useSessionStore().setTitle(this.CurrentAccount.Name);
-            await this.FetchAccount(accountid);
+            if (accountid == null)
+                return;
+            const account = this.GetAccount(accountid)!;
+            useSessionStore().setTitle(account.Name);
+            await this.FetchAccount(account);
         },
-        async FetchAccount(accountid : string) {
-            const api = useAPI();
-            const result = await api.GET("/account/" + accountid + "/transactions");
+        async FetchAccount(account: Account) {
+            const result = await GET("/account/" + account.ID + "/transactions");
             const response = await result.json();
-            this.Transactions = response.Transactions;
+            const transactionsStore = useTransactionsStore()
+            const transactions = transactionsStore.AddTransactions(response.Transactions);
+            account.Transactions = transactions;
         },
-        async FetchMonthBudget(budgetid : string, year : number, month : number) {
-            const api = useAPI();
-            const result = await api.GET("/budget/" + budgetid + "/" + year + "/" + month);
+        async FetchMonthBudget(budgetid: string, year: number, month: number) {
+            const result = await GET("/budget/" + budgetid + "/" + year + "/" + (month+1));
             const response = await result.json();
+            if (response.Categories == undefined || response.Categories.length <= 0)
+                return;
             this.addCategoriesForMonth(year, month, response.Categories);
         },
-        addCategoriesForMonth(year : number, month : number, categories : Category[]) : void {
-            const yearMap = this.Months.get(year) || new Map<number, Map<string, Category>>();
-            this.Months.set(year, yearMap);
-
+        async EditAccount(accountid: string, name: string, onBudget: boolean) {
+            const result = await POST("/account/" + accountid, JSON.stringify({ name: name, onBudget: onBudget }));
+            const response = await result.json();
+            useBudgetsStore().MergeBudgetingData(response);
+        },
+        addCategoriesForMonth(year: number, month: number, categories: Category[]): void {
+            this.$patch((state) => {
+                const yearMap = state.Months.get(year) || new Map<number, Map<string, Category>>();
                 const monthMap = yearMap.get(month) || new Map<string, Category>();
-            yearMap.set(month, monthMap);
-
-            for (const category of categories){
+                for (const category of categories) {
                     monthMap.set(category.ID, category);
                 }
+
+                yearMap.set(month, monthMap);
+                state.Months.set(year, yearMap);
+            });
         },
         logout() {
             this.$reset()

web/src/stores/budget.ts

@@ -1,5 +1,5 @@
 import { defineStore } from "pinia";
-import { useAPI } from "./api";
+import { GET, POST } from "../api";
 import { useAccountStore } from "./budget-account";
 import { Budget, useSessionStore } from "./session";
 
@@ -25,15 +25,13 @@ export const useBudgetsStore = defineStore('budget', {
     },
     actions: {
         ImportYNAB(formData: FormData) {
-            const api = useAPI();
-            return api.POST(
+            return POST(
                 "/budget/" + this.CurrentBudgetID + "/import/ynab",
                 formData,
             );
         },
         async NewBudget(budgetName: string): Promise<void> {
-            const api = useAPI();
-            const result = await api.POST(
+            const result = await POST(
                 "/budget/new",
                 JSON.stringify({ name: budgetName })
             );
@@ -51,14 +49,20 @@ export const useBudgetsStore = defineStore('budget', {
             await this.FetchBudget(budgetid);
         },
         async FetchBudget(budgetid: string) {
-            const api = useAPI();
-            const result = await api.GET("/budget/" + budgetid);
+            const result = await GET("/budget/" + budgetid);
             const response = await result.json();
+            this.MergeBudgetingData(response);
+        },
+        MergeBudgetingData(response: any) {
+            const accounts = useAccountStore();
             for (const account of response.Accounts || []) {
-                useAccountStore().Accounts.set(account.ID, account);
+                const existingAccount = accounts.Accounts.get(account.ID);
+                account.Transactions = existingAccount?.Transactions ?? [];
+                account.LastReconciled = new Date(account.LastReconciled);
+                accounts.Accounts.set(account.ID, account);
             }
             for (const category of response.Categories || []) {
-                useAccountStore().Categories.set(category.ID, category);
+                accounts.Categories.set(category.ID, category);
             }
         },
     }

web/src/stores/session.ts

@@ -1,6 +1,6 @@
 import { StorageSerializers, useStorage } from '@vueuse/core';
 import { defineStore } from 'pinia'
-import { useAPI } from './api';
+import { POST } from '../api';
 
 interface State {
     Session: Session | null
@@ -20,12 +20,12 @@ export interface Budget {
 
 export const useSessionStore = defineStore('session', {
     state: () => ({
-        Session: useStorage<Session>('session', null, undefined, { serializer: StorageSerializers.object }),
-        Budgets: useStorage<Map<string, Budget>>('budgets', new Map<string, Budget>()),
+        Session: useStorage<Session | null>('session', null, undefined, { serializer: StorageSerializers.object }),
+        Budgets: useStorage<Map<string, Budget>>('budgets', new Map<string, Budget>(), undefined, { serializer: StorageSerializers.map }),
     }),
     getters: {
         BudgetsList: (state) => [ ...state.Budgets.values() ],
-        AuthHeaders: (state) => ({'Authorization': 'Bearer ' + state.Session.Token}),
+        AuthHeaders: (state) => ({'Authorization': 'Bearer ' + state.Session?.Token}),
         LoggedIn: (state) => state.Session != null,
     },
     actions: {
@@ -36,23 +36,26 @@ export const useSessionStore = defineStore('session', {
             this.Session = {
                 User: x.User,
                 Token: x.Token,
-            },
-            this.Budgets = x.Budgets;
+            }
+            for (const budget of x.Budgets) {
+                this.Budgets.set(budget.ID, budget);
+            }
         },
         async login(login: any) {
-            const api = useAPI();
-            const response = await api.POST("/user/login", JSON.stringify(login));
+            const response = await POST("/user/login", JSON.stringify(login));
             const result = await response.json();
-            return this.loginSuccess(result);
+            this.loginSuccess(result);
+            return result;
         },
         async register(login : any) {
-            const api = useAPI();
-            const response = await api.POST("/user/register", JSON.stringify(login));
+            const response = await POST("/user/register", JSON.stringify(login));
             const result = await response.json();
-            return this.loginSuccess(result);
+            this.loginSuccess(result);
+            return result;
         },
         logout() {
-            this.$reset()
+            this.Session = null;
+            this.Budgets.clear();
         },
     }
 })

web/src/stores/transactions.ts

@@ -0,0 +1,106 @@
+import { defineStore } from "pinia"
+import { POST } from "../api";
+import { useAccountStore } from "./budget-account";
+
+interface State {
+    Transactions: Map<string, Transaction>
+    Reconciling: boolean
+}
+
+export interface Transaction {
+    ID: string
+    Date: Date
+    TransferAccount: string
+    CategoryGroup: string
+    Category: string
+    CategoryID: string | undefined
+    Memo: string
+    Status: string
+    GroupID: string
+    Payee: string
+    PayeeID: string | undefined
+    Amount: number
+    Reconciled: boolean
+}
+
+export const useTransactionsStore = defineStore("budget/transactions", {
+    state: (): State => ({
+        Transactions: new Map<string, Transaction>(),
+        Reconciling: false,
+    }),
+    getters: {
+        ReconcilingBalance(state): number {
+            const accountsStore = useAccountStore()
+            let reconciledBalance = accountsStore.CurrentAccount!.ReconciledBalance;
+            for (const transaction of this.TransactionsList) {
+                if (transaction.Reconciled)
+                    reconciledBalance += transaction.Amount;
+            }
+            return reconciledBalance;
+        },
+        TransactionsList(state): Transaction[] {
+                const accountsStore = useAccountStore()
+            return accountsStore.CurrentAccount!.Transactions.map(x => {
+                return this.Transactions.get(x)!
+            });
+        },
+    },
+    actions: {
+        AddTransactions(transactions: Array<Transaction>) {
+            const transactionIds = [] as Array<string>;
+            this.$patch(() => {
+                for (const transaction of transactions) {
+                    transaction.Date = new Date(transaction.Date);
+                    this.Transactions.set(transaction.ID, transaction);
+                    transactionIds.push(transaction.ID);
+                }
+            });
+            return transactionIds;
+        },
+        SetReconciledForAllTransactions(value: boolean) {
+            for (const transaction of this.TransactionsList) {
+                if (transaction.Status == "Reconciled")
+                    continue;
+
+                transaction.Reconciled = value;
+            }
+        },
+        async SubmitReconcilation(reconciliationTransactionAmount: number) {
+                const accountsStore = useAccountStore()
+            const account = accountsStore.CurrentAccount!;
+            const reconciledTransactions = this.TransactionsList.filter(x => x.Reconciled);
+            for (const transaction of reconciledTransactions) {
+                account.ReconciledBalance += transaction.Amount;
+                transaction.Status = "Reconciled";
+                transaction.Reconciled = false;
+            }
+            const result = await POST("/account/" + accountsStore.CurrentAccountID + "/reconcile", JSON.stringify({
+                transactionIDs: reconciledTransactions.map(x => x.ID),
+                reconciliationTransactionAmount: reconciliationTransactionAmount.toString(),
+            }));
+            const response = await result.json();
+            const recTrans = response.ReconciliationTransaction;
+            if (recTrans) {
+                this.AddTransactions([recTrans]);
+                account.Transactions.unshift(recTrans.ID);
+            }
+            console.log("Reconcile: " + response.message);
+        },
+        logout() {
+            this.$reset()
+        },
+        async saveTransaction(payload: string) {
+                const accountsStore = useAccountStore()
+            const result = await POST("/transaction/new", payload);
+            const response = await result.json() as Transaction;
+            this.AddTransactions([response]);
+            accountsStore.CurrentAccount?.Transactions.unshift(response.ID);
+        },
+        async editTransaction(transactionid: string, payload: string) {
+            const result = await POST("/transaction/" + transactionid, payload);
+            const response = await result.json() as Transaction;
+            this.AddTransactions([response]);
+        }
+    }
+
+})

web/yarn.lock

@@ -273,6 +273,11 @@
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.0.tgz#f0ac33eddbe214e4105363bb17c3341c5ffcc43c"
   integrity sha512-VKXSCQx5D8S04ej+Dqsr1CzYvvWgf20jIw2D+YhQCrIlr2UZGaDds23Y0xg75/skOxpLCRpUZvk/1EAVkGoDOw==
 
+"@babel/parser@^7.6.0", "@babel/parser@^7.9.6":
+  version "7.17.3"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.3.tgz#b07702b982990bf6fdc1da5049a23fece4c5c3d0"
+  integrity sha512-7yJPvPV+ESz2IUTPbOL+YkIGyCqOyNIzdguKQuJGnH7bg1WTIifuM21YqokFt/THWh1AkCRn9IgoykTRCBVpzA==
+
 "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.16.7":
   version "7.16.7"
   resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.16.7.tgz#4eda6d6c2a0aa79c70fa7b6da67763dfe2141050"
@@ -925,7 +930,7 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
-"@babel/types@^7.0.0", "@babel/types@^7.16.0", "@babel/types@^7.16.7", "@babel/types@^7.16.8", "@babel/types@^7.17.0", "@babel/types@^7.4.4":
+"@babel/types@^7.0.0", "@babel/types@^7.16.0", "@babel/types@^7.16.7", "@babel/types@^7.16.8", "@babel/types@^7.17.0", "@babel/types@^7.4.4", "@babel/types@^7.6.1", "@babel/types@^7.9.6":
   version "7.17.0"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.17.0.tgz#a826e368bccb6b3d84acd76acad5c0d87342390b"
   integrity sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==
@@ -933,6 +938,25 @@
     "@babel/helper-validator-identifier" "^7.16.7"
     to-fast-properties "^2.0.0"
 
+"@emmetio/abbreviation@^2.2.3":
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/@emmetio/abbreviation/-/abbreviation-2.2.3.tgz#2b3c0383c1a4652f677d5b56fb3f1616fe16ef10"
+  integrity sha512-87pltuCPt99aL+y9xS6GPZ+Wmmyhll2WXH73gG/xpGcQ84DRnptBsI2r0BeIQ0EB/SQTOe2ANPqFqj3Rj5FOGA==
+  dependencies:
+    "@emmetio/scanner" "^1.0.0"
+
+"@emmetio/css-abbreviation@^2.1.4":
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/@emmetio/css-abbreviation/-/css-abbreviation-2.1.4.tgz#90362e8a1122ce3b76f6c3157907d30182f53f54"
+  integrity sha512-qk9L60Y+uRtM5CPbB0y+QNl/1XKE09mSO+AhhSauIfr2YOx/ta3NJw2d8RtCFxgzHeRqFRr8jgyzThbu+MZ4Uw==
+  dependencies:
+    "@emmetio/scanner" "^1.0.0"
+
+"@emmetio/scanner@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@emmetio/scanner/-/scanner-1.0.0.tgz#065b2af6233fe7474d44823e3deb89724af42b5f"
+  integrity sha512-8HqW8EVqjnCmWXVpqAOZf+EGESdkR27odcMMMGefgKXtar00SoYNSryGv//TELI4T3QFsECo78p+0lmalk/CFA==
+
 "@hapi/address@2.x.x":
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5"
@@ -1141,6 +1165,11 @@
     "@types/qs" "*"
     "@types/serve-static" "*"
 
+"@types/file-saver@^2.0.5":
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/@types/file-saver/-/file-saver-2.0.5.tgz#9ee342a5d1314bb0928375424a2f162f97c310c7"
+  integrity sha512-zv9kNf3keYegP5oThGLaPk8E081DFDuwfqjtiTzm6PoxChdJ1raSuADf2YGCVIyrSynLrgc8JWv296s7Q7pQSQ==
+
 "@types/glob@^7.1.1":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@types/glob/-/glob-7.2.0.tgz#bc1b5bf3aa92f25bd5dd39f35c57361bdce5b2eb"
@@ -1257,6 +1286,75 @@
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-2.1.0.tgz#ddf5e0059f84f2ff649afc25ce5a59211e670542"
   integrity sha512-AZ78WxvFMYd8JmM/GBV6a6SGGTU0GgN/0/4T+FnMMsLzFEzTeAUwuraapy50ifHZsC+G5SvWs86bvaCPTneFlA==
 
+"@volar/code-gen@0.32.0":
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/@volar/code-gen/-/code-gen-0.32.0.tgz#05bcb66e21b72a9ed632524d320323b1d9d0e579"
+  integrity sha512-vxXKzZs9DMf/iBEAFJRwPVCk6CQFYZjul9iQ9GZCAjmy2lotSvv5jBQm5unzIAQQpKv4HH3jfA0YD0aT58S4eQ==
+  dependencies:
+    "@volar/shared" "0.32.0"
+    "@volar/source-map" "0.32.0"
+
+"@volar/html2pug@0.32.0":
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/@volar/html2pug/-/html2pug-0.32.0.tgz#aaa7026d8162a0a54df0eb19ecfc20acf56ae813"
+  integrity sha512-VPu7O7x74KbUSOofpOH4dxH4jUpKF+9VmsY9ehXftOcuknlBV8v7o0RlIYDrirjq5kUINGJwalKJF33tjR5kTA==
+  dependencies:
+    domelementtype "^2.2.0"
+    domhandler "^4.3.0"
+    htmlparser2 "^7.2.0"
+    pug "^3.0.2"
+
+"@volar/shared@0.32.0":
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/@volar/shared/-/shared-0.32.0.tgz#98b96ac23be2388c4817dcefd92285d99eebdb12"
+  integrity sha512-RzpoyRAJlEjqAi0rsrqHn5aRJ+xi58JrXa+NCNuJOuGLhUKbPyR9n8JUI+mF4h01opYl3C/s8qYmWQQBOpBUUg==
+  dependencies:
+    upath "^2.0.1"
+    vscode-html-languageservice "^4.2.1"
+    vscode-jsonrpc "^8.0.0-next.5"
+    vscode-uri "^3.0.3"
+
+"@volar/source-map@0.32.0":
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/@volar/source-map/-/source-map-0.32.0.tgz#b93438d39aaca8b518d30c9a54e0362ea854803c"
+  integrity sha512-DRDRvgPZtF/2Me+NBpGQ/bdK0uro7qOneoU1Xhrjmx7dwFB2QNxwEF2BXndmo7BNIc9Rc7g1AYvMRw3y80IhnQ==
+  dependencies:
+    "@volar/shared" "0.32.0"
+    vscode-languageserver-textdocument "^1.0.3"
+
+"@volar/transforms@0.32.0":
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/@volar/transforms/-/transforms-0.32.0.tgz#a161a3f921f87a400d87cbb9a1e25d81648d1e4d"
+  integrity sha512-F1ppg60SmPEaJmUfTTP0ZtXFe2u0HURklhFGaKnZ608yIBHq4EGW/kzH8xGc8TjrdGjrWpKkr9D+SHLpq5tirQ==
+  dependencies:
+    "@volar/shared" "0.32.0"
+    vscode-languageserver-types "^3.17.0-next.6"
+
+"@volar/vue-code-gen@0.32.0":
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/@volar/vue-code-gen/-/vue-code-gen-0.32.0.tgz#aba86b056d70e8a2076c75b53c081a9b3fdb178c"
+  integrity sha512-NxSYTvCEIDRj6kym/HSa4XIqA473emyVaWApFmg7mpd7ZoadyfhHPd7UuYB90uwMBj0oNQ53+BnvDhCgUMj+Tw==
+  dependencies:
+    "@volar/code-gen" "0.32.0"
+    "@volar/shared" "0.32.0"
+    "@volar/source-map" "0.32.0"
+    "@vue/compiler-core" "^3.2.27"
+    "@vue/compiler-dom" "^3.2.27"
+    "@vue/shared" "^3.2.27"
+    upath "^2.0.1"
+
+"@vscode/emmet-helper@^2.8.3":
+  version "2.8.4"
+  resolved "https://registry.yarnpkg.com/@vscode/emmet-helper/-/emmet-helper-2.8.4.tgz#ab937e3ce79b0873c604d1ad50a9eeb7abae2937"
+  integrity sha512-lUki5QLS47bz/U8IlG9VQ+1lfxMtxMZENmU5nu4Z71eOD5j9FK0SmYGL5NiVJg9WBWeAU0VxRADMY2Qpq7BfVg==
+  dependencies:
+    emmet "^2.3.0"
+    jsonc-parser "^2.3.0"
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-languageserver-types "^3.15.1"
+    vscode-nls "^5.0.0"
+    vscode-uri "^2.1.2"
+
 "@vue/babel-helper-vue-jsx-merge-props@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz#31624a7a505fb14da1d58023725a4c5f270e6a81"
@@ -1535,6 +1633,16 @@
     estree-walker "^2.0.2"
     source-map "^0.6.1"
 
+"@vue/compiler-core@3.2.31", "@vue/compiler-core@^3.2.27":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.31.tgz#d38f06c2cf845742403b523ab4596a3fda152e89"
+  integrity sha512-aKno00qoA4o+V/kR6i/pE+aP+esng5siNAVQ422TkBNM6qA4veXiZbSe8OTXHXquEi/f6Akc+nLfB4JGfe4/WQ==
+  dependencies:
+    "@babel/parser" "^7.16.4"
+    "@vue/shared" "3.2.31"
+    estree-walker "^2.0.2"
+    source-map "^0.6.1"
+
 "@vue/compiler-dom@3.2.29":
   version "3.2.29"
   resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.29.tgz#ad0ead405bd2f2754161335aad9758aa12430715"
@@ -1543,6 +1651,14 @@
     "@vue/compiler-core" "3.2.29"
     "@vue/shared" "3.2.29"
 
+"@vue/compiler-dom@^3.2.27":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.31.tgz#b1b7dfad55c96c8cc2b919cd7eb5fd7e4ddbf00e"
+  integrity sha512-60zIlFfzIDf3u91cqfqy9KhCKIJgPeqxgveH2L+87RcGU/alT6BRrk5JtUso0OibH3O7NXuNOQ0cDc9beT0wrg==
+  dependencies:
+    "@vue/compiler-core" "3.2.31"
+    "@vue/shared" "3.2.31"
+
 "@vue/compiler-sfc@3.2.29":
   version "3.2.29"
   resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.29.tgz#f76d556cd5fca6a55a3ea84c88db1a2a53a36ead"
@@ -1611,6 +1727,13 @@
   dependencies:
     "@vue/shared" "3.2.29"
 
+"@vue/reactivity@^3.2.27":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.31.tgz#fc90aa2cdf695418b79e534783aca90d63a46bbd"
+  integrity sha512-HVr0l211gbhpEKYr2hYe7hRsV91uIVGFYNHj73njbARVGHQvIojkImKMaZNDdoDZOIkMsBc9a1sMqR+WZwfSCw==
+  dependencies:
+    "@vue/shared" "3.2.31"
+
 "@vue/runtime-core@3.2.29":
   version "3.2.29"
   resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.29.tgz#fb8577b2fcf52e8d967bd91cdf49ab9fb91f9417"
@@ -1641,6 +1764,11 @@
   resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.29.tgz#07dac7051117236431d2f737d16932aa38bbb925"
   integrity sha512-BjNpU8OK6Z0LVzGUppEk0CMYm/hKDnZfYdjSmPOs0N+TR1cLKJAkDwW8ASZUvaaSLEi6d3hVM7jnWnX+6yWnHw==
 
+"@vue/shared@3.2.31", "@vue/shared@^3.2.27":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e"
+  integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==
+
 "@vue/vue-loader-v15@npm:vue-loader@^15.9.7":
   version "15.9.8"
   resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.9.8.tgz#4b0f602afaf66a996be1e534fb9609dc4ab10e61"
@@ -1985,7 +2113,7 @@ acorn@^6.4.1:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.4.2.tgz#35866fd710528e92de10cf06016498e47e39e1e6"
   integrity sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==
 
-acorn@^7.0.0:
+acorn@^7.0.0, acorn@^7.1.1:
   version "7.4.1"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
   integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
@@ -2196,6 +2324,11 @@ array-unique@^0.3.2:
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
   integrity sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=
 
+asap@~2.0.3:
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
+  integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
+
 asn1.js@^5.2.0:
   version "5.4.1"
   resolved "https://registry.yarnpkg.com/asn1.js/-/asn1.js-5.4.1.tgz#11a980b84ebb91781ce35b0fdc2ee294e3783f07"
@@ -2213,6 +2346,11 @@ asn1@~0.2.3:
   dependencies:
     safer-buffer "~2.1.0"
 
+assert-never@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/assert-never/-/assert-never-1.2.1.tgz#11f0e363bf146205fb08193b5c7b90f4d1cf44fe"
+  integrity sha512-TaTivMB6pYI1kXwrFlEhLeGfOqoDNdTxjCdwRfFFkEA30Eu+k48W34nlok2EYWJfFFzqaEmichdNM7th6M5HNw==
+
 assert-plus@1.0.0, assert-plus@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/assert-plus/-/assert-plus-1.0.0.tgz#f12e0f3c5d77b0b1cdd9146942e4e96c1e4dd525"
@@ -2330,6 +2468,13 @@ babel-plugin-polyfill-regenerator@^0.3.0:
   dependencies:
     "@babel/helper-define-polyfill-provider" "^0.3.1"
 
+babel-walk@3.0.0-canary-5:
+  version "3.0.0-canary-5"
+  resolved "https://registry.yarnpkg.com/babel-walk/-/babel-walk-3.0.0-canary-5.tgz#f66ecd7298357aee44955f235a6ef54219104b11"
+  integrity sha512-GAwkz0AihzY5bkwIY5QDR+LvsRQgB/B+1foMPvi0FZPMl5fjD7ICiznUiBdLYMH1QYe6vqu4gWYytZOccLouFw==
+  dependencies:
+    "@babel/types" "^7.9.6"
+
 balanced-match@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
@@ -2759,6 +2904,13 @@ chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.2:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
+character-parser@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/character-parser/-/character-parser-2.2.0.tgz#c7ce28f36d4bcd9744e5ffc2c5fcde1c73261fc0"
+  integrity sha1-x84o821LzZdE5f/CxfzeHHMmH8A=
+  dependencies:
+    is-regex "^1.0.3"
+
 charcodes@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/charcodes/-/charcodes-0.2.0.tgz#5208d327e6cc05f99eb80ffc814707572d1f14e4"
@@ -3032,6 +3184,14 @@ consolidate@^0.15.1:
   dependencies:
     bluebird "^3.1.1"
 
+constantinople@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/constantinople/-/constantinople-4.0.1.tgz#0def113fa0e4dc8de83331a5cf79c8b325213151"
+  integrity sha512-vCrqcSIq4//Gx74TXXCGnHpulY1dskqLTFGDmhrGxzeXL8lF8kvXv6mpNWlJj1uD4DW23D4ljAqbY4RRaaUZIw==
+  dependencies:
+    "@babel/parser" "^7.6.0"
+    "@babel/types" "^7.6.1"
+
 constants-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
@@ -3564,6 +3724,11 @@ dns-txt@^2.0.2:
   dependencies:
     buffer-indexof "^1.0.0"
 
+doctypes@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/doctypes/-/doctypes-1.1.0.tgz#ea80b106a87538774e8a3a4a5afe293de489e0a9"
+  integrity sha1-6oCxBqh1OHdOijpKWv4pPeSJ4Kk=
+
 dom-converter@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@@ -3590,7 +3755,7 @@ domelementtype@^2.0.1, domelementtype@^2.2.0:
   resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.2.0.tgz#9a0b6c2782ed6a1c7323d42267183df9bd8b1d57"
   integrity sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==
 
-domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.3.0:
+domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.2.2, domhandler@^4.3.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-4.3.0.tgz#16c658c626cf966967e306f966b431f77d4a5626"
   integrity sha512-fC0aXNQXqKSFTr2wDNZDhsEYjCiYsDWl3D01kwt25hm1YIPyDGHvvi3rw+PLqHAl/m71MaiF7d5zvBr0p5UB2g==
@@ -3675,6 +3840,14 @@ elliptic@^6.5.3:
     minimalistic-assert "^1.0.1"
     minimalistic-crypto-utils "^1.0.1"
 
+emmet@^2.3.0:
+  version "2.3.6"
+  resolved "https://registry.yarnpkg.com/emmet/-/emmet-2.3.6.tgz#1d93c1ac03164da9ddf74864c1f341ed6ff6c336"
+  integrity sha512-pLS4PBPDdxuUAmw7Me7+TcHbykTsBKN/S9XJbUOMFQrNv9MoshzyMFK/R57JBm94/6HSL4vHnDeEmxlC82NQ4A==
+  dependencies:
+    "@emmetio/abbreviation" "^2.2.3"
+    "@emmetio/css-abbreviation" "^2.1.4"
+
 emoji-regex@^8.0.0:
   version "8.0.0"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-8.0.0.tgz#e818fd69ce5ccfcb404594f842963bf53164cc37"
@@ -3719,6 +3892,11 @@ entities@^2.0.0:
   resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55"
   integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
 
+entities@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-3.0.1.tgz#2b887ca62585e96db3903482d336c1006c3001d4"
+  integrity sha512-WiyBqoomrwMdFG1e0kqvASYfnlb0lp8M5o5Fw2OFq1hNZxxcNk8Ik0Xm7LxzBhuidnZB/UtBqVCgUz3kBOP51Q==
+
 errno@^0.1.3, errno@~0.1.7:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.8.tgz#8bb3e9c7d463be4976ff888f76b4809ebc2e811f"
@@ -4137,6 +4315,11 @@ figures@^2.0.0:
   dependencies:
     escape-string-regexp "^1.0.5"
 
+file-saver@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/file-saver/-/file-saver-2.0.5.tgz#d61cfe2ce059f414d899e9dd6d4107ee25670c38"
+  integrity sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==
+
 file-uri-to-path@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd"
@@ -4426,7 +4609,7 @@ glob-to-regexp@^0.4.1:
   resolved "https://registry.yarnpkg.com/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz#c75297087c851b9a578bd217dd59a92f59fe546e"
   integrity sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==
 
-glob@^7.0.0, glob@^7.1.1, glob@^7.1.3, glob@^7.1.4:
+glob@^7.1.1, glob@^7.1.3, glob@^7.1.4:
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.0.tgz#d15535af7732e02e948f4c41628bd910293f6023"
   integrity sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==
@@ -4676,6 +4859,16 @@ htmlparser2@^6.1.0:
     domutils "^2.5.2"
     entities "^2.0.0"
 
+htmlparser2@^7.2.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-7.2.0.tgz#8817cdea38bbc324392a90b1990908e81a65f5a5"
+  integrity sha512-H7MImA4MS6cw7nbyURtLPO1Tms7C5H602LRETv95z1MxO/7CP7rDVROehUYeYBUYEON94NXXDEPmZuq+hX4sog==
+  dependencies:
+    domelementtype "^2.0.1"
+    domhandler "^4.2.2"
+    domutils "^2.8.0"
+    entities "^3.0.1"
+
 http-deceiver@^1.2.7:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/http-deceiver/-/http-deceiver-1.2.7.tgz#fa7168944ab9a519d337cb0bec7284dc3e723d87"
@@ -4829,11 +5022,6 @@ inherits@2.0.3:
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
   integrity sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=
 
-interpret@^1.0.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e"
-  integrity sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==
-
 ip@^1.1.0:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/ip/-/ip-1.1.5.tgz#bdded70114290828c0a039e72ef25f5aaec4354a"
@@ -4953,6 +5141,14 @@ is-docker@^2.0.0, is-docker@^2.1.1:
   resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-2.2.1.tgz#33eeabe23cfe86f14bde4408a02c0cfb853acdaa"
   integrity sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==
 
+is-expression@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/is-expression/-/is-expression-4.0.0.tgz#c33155962abf21d0afd2552514d67d2ec16fd2ab"
+  integrity sha512-zMIXX63sxzG3XrkHkrAPvm/OVZVSCPNkwMHU8oTX7/U3AL78I0QXCEICXUM13BIa8TYGZ68PiTKfQz3yaTNr4A==
+  dependencies:
+    acorn "^7.1.1"
+    object-assign "^4.1.1"
+
 is-extendable@^0.1.0, is-extendable@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
@@ -5040,7 +5236,12 @@ is-plain-object@^2.0.3, is-plain-object@^2.0.4:
   dependencies:
     isobject "^3.0.1"
 
-is-regex@^1.0.4:
+is-promise@^2.0.0:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.2.2.tgz#39ab959ccbf9a774cf079f7b40c7a26f763135f1"
+  integrity sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==
+
+is-regex@^1.0.3, is-regex@^1.0.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958"
   integrity sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==
@@ -5149,6 +5350,11 @@ js-queue@2.0.2:
   dependencies:
     easy-stack "^1.0.1"
 
+js-stringify@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/js-stringify/-/js-stringify-1.0.2.tgz#1736fddfd9724f28a3682adc6230ae7e4e9679db"
+  integrity sha1-Fzb939lyTyijaCrcYjCufk6Weds=
+
 js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
@@ -5226,6 +5432,16 @@ json5@^2.1.2:
   dependencies:
     minimist "^1.2.5"
 
+jsonc-parser@^2.3.0:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/jsonc-parser/-/jsonc-parser-2.3.1.tgz#59549150b133f2efacca48fe9ce1ec0659af2342"
+  integrity sha512-H8jvkz1O50L3dMZCsLqiuB2tA7muqbSg1AtGEkN0leAqGjsUzDJir3Zwr02BhqdcITPg3ei3mZ+HjMocAknhhg==
+
+jsonc-parser@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/jsonc-parser/-/jsonc-parser-3.0.0.tgz#abdd785701c7e7eaca8a9ec8cf070ca51a745a22"
+  integrity sha512-fQzRfAbIBnR0IQvftw9FJveWiHp72Fg20giDrHz6TdfB12UH/uue0D3hm57UB5KgAVuniLMCaS8P1IMj9NR7cA==
+
 jsonfile@^6.0.1:
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-6.1.0.tgz#bc55b2634793c679ec6403094eb13698a6ec0aae"
@@ -5245,6 +5461,14 @@ jsprim@^1.2.2:
     json-schema "0.4.0"
     verror "1.10.0"
 
+jstransformer@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/jstransformer/-/jstransformer-1.0.0.tgz#ed8bf0921e2f3f1ed4d5c1a44f68709ed24722c3"
+  integrity sha1-7Yvwkh4vPx7U1cGkT2hwntJHIsM=
+  dependencies:
+    is-promise "^2.0.0"
+    promise "^7.0.1"
+
 kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-3.2.2.tgz#31ea21a734bab9bbb0f32466d893aea51e4a3c64"
@@ -5891,14 +6115,6 @@ nth-check@^2.0.1:
   dependencies:
     boolbase "^1.0.0"
 
-null-loader@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/null-loader/-/null-loader-4.0.1.tgz#8e63bd3a2dd3c64236a4679428632edd0a6dbc6a"
-  integrity sha512-pxqVbi4U6N26lq+LmgIbB5XATP0VdZKOG25DhHi8btMmJJefGArFyDg1yc4U3hWCJbMqSrw0qyrz1UQX+qYXqg==
-  dependencies:
-    loader-utils "^2.0.0"
-    schema-utils "^3.0.0"
-
 oauth-sign@~0.9.0:
   version "0.9.0"
   resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.9.0.tgz#47a7b016baa68b5fa0ecf3dee08a85c679ac6455"
@@ -6638,6 +6854,13 @@ promise-inflight@^1.0.1:
   resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
   integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=
 
+promise@^7.0.1:
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
+  integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
+  dependencies:
+    asap "~2.0.3"
+
 proxy-addr@~2.0.7:
   version "2.0.7"
   resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.7.tgz#f19fe69ceab311eeb94b42e70e8c2070f9ba1025"
@@ -6673,6 +6896,109 @@ public-encrypt@^4.0.0:
     randombytes "^2.0.1"
     safe-buffer "^5.1.2"
 
+pug-attrs@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/pug-attrs/-/pug-attrs-3.0.0.tgz#b10451e0348165e31fad1cc23ebddd9dc7347c41"
+  integrity sha512-azINV9dUtzPMFQktvTXciNAfAuVh/L/JCl0vtPCwvOA21uZrC08K/UnmrL+SXGEVc1FwzjW62+xw5S/uaLj6cA==
+  dependencies:
+    constantinople "^4.0.1"
+    js-stringify "^1.0.2"
+    pug-runtime "^3.0.0"
+
+pug-code-gen@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/pug-code-gen/-/pug-code-gen-3.0.2.tgz#ad190f4943133bf186b60b80de483100e132e2ce"
+  integrity sha512-nJMhW16MbiGRiyR4miDTQMRWDgKplnHyeLvioEJYbk1RsPI3FuA3saEP8uwnTb2nTJEKBU90NFVWJBk4OU5qyg==
+  dependencies:
+    constantinople "^4.0.1"
+    doctypes "^1.1.0"
+    js-stringify "^1.0.2"
+    pug-attrs "^3.0.0"
+    pug-error "^2.0.0"
+    pug-runtime "^3.0.0"
+    void-elements "^3.1.0"
+    with "^7.0.0"
+
+pug-error@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pug-error/-/pug-error-2.0.0.tgz#5c62173cb09c34de2a2ce04f17b8adfec74d8ca5"
+  integrity sha512-sjiUsi9M4RAGHktC1drQfCr5C5eriu24Lfbt4s+7SykztEOwVZtbFk1RRq0tzLxcMxMYTBR+zMQaG07J/btayQ==
+
+pug-filters@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/pug-filters/-/pug-filters-4.0.0.tgz#d3e49af5ba8472e9b7a66d980e707ce9d2cc9b5e"
+  integrity sha512-yeNFtq5Yxmfz0f9z2rMXGw/8/4i1cCFecw/Q7+D0V2DdtII5UvqE12VaZ2AY7ri6o5RNXiweGH79OCq+2RQU4A==
+  dependencies:
+    constantinople "^4.0.1"
+    jstransformer "1.0.0"
+    pug-error "^2.0.0"
+    pug-walk "^2.0.0"
+    resolve "^1.15.1"
+
+pug-lexer@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/pug-lexer/-/pug-lexer-5.0.1.tgz#ae44628c5bef9b190b665683b288ca9024b8b0d5"
+  integrity sha512-0I6C62+keXlZPZkOJeVam9aBLVP2EnbeDw3An+k0/QlqdwH6rv8284nko14Na7c0TtqtogfWXcRoFE4O4Ff20w==
+  dependencies:
+    character-parser "^2.2.0"
+    is-expression "^4.0.0"
+    pug-error "^2.0.0"
+
+pug-linker@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/pug-linker/-/pug-linker-4.0.0.tgz#12cbc0594fc5a3e06b9fc59e6f93c146962a7708"
+  integrity sha512-gjD1yzp0yxbQqnzBAdlhbgoJL5qIFJw78juN1NpTLt/mfPJ5VgC4BvkoD3G23qKzJtIIXBbcCt6FioLSFLOHdw==
+  dependencies:
+    pug-error "^2.0.0"
+    pug-walk "^2.0.0"
+
+pug-load@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/pug-load/-/pug-load-3.0.0.tgz#9fd9cda52202b08adb11d25681fb9f34bd41b662"
+  integrity sha512-OCjTEnhLWZBvS4zni/WUMjH2YSUosnsmjGBB1An7CsKQarYSWQ0GCVyd4eQPMFJqZ8w9xgs01QdiZXKVjk92EQ==
+  dependencies:
+    object-assign "^4.1.1"
+    pug-walk "^2.0.0"
+
+pug-parser@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/pug-parser/-/pug-parser-6.0.0.tgz#a8fdc035863a95b2c1dc5ebf4ecf80b4e76a1260"
+  integrity sha512-ukiYM/9cH6Cml+AOl5kETtM9NR3WulyVP2y4HOU45DyMim1IeP/OOiyEWRr6qk5I5klpsBnbuHpwKmTx6WURnw==
+  dependencies:
+    pug-error "^2.0.0"
+    token-stream "1.0.0"
+
+pug-runtime@^3.0.0, pug-runtime@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/pug-runtime/-/pug-runtime-3.0.1.tgz#f636976204723f35a8c5f6fad6acda2a191b83d7"
+  integrity sha512-L50zbvrQ35TkpHwv0G6aLSuueDRwc/97XdY8kL3tOT0FmhgG7UypU3VztfV/LATAvmUfYi4wNxSajhSAeNN+Kg==
+
+pug-strip-comments@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pug-strip-comments/-/pug-strip-comments-2.0.0.tgz#f94b07fd6b495523330f490a7f554b4ff876303e"
+  integrity sha512-zo8DsDpH7eTkPHCXFeAk1xZXJbyoTfdPlNR0bK7rpOMuhBYb0f5qUVCO1xlsitYd3w5FQTK7zpNVKb3rZoUrrQ==
+  dependencies:
+    pug-error "^2.0.0"
+
+pug-walk@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pug-walk/-/pug-walk-2.0.0.tgz#417aabc29232bb4499b5b5069a2b2d2a24d5f5fe"
+  integrity sha512-yYELe9Q5q9IQhuvqsZNwA5hfPkMJ8u92bQLIMcsMxf/VADjNtEYptU+inlufAFYcWdHlwNfZOEnOOQrZrcyJCQ==
+
+pug@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/pug/-/pug-3.0.2.tgz#f35c7107343454e43bc27ae0ff76c731b78ea535"
+  integrity sha512-bp0I/hiK1D1vChHh6EfDxtndHji55XP/ZJKwsRqrz6lRia6ZC2OZbdAymlxdVFwd1L70ebrVJw4/eZ79skrIaw==
+  dependencies:
+    pug-code-gen "^3.0.2"
+    pug-filters "^4.0.0"
+    pug-lexer "^5.0.1"
+    pug-linker "^4.0.0"
+    pug-load "^3.0.0"
+    pug-parser "^6.0.0"
+    pug-runtime "^3.0.1"
+    pug-strip-comments "^2.0.0"
+
 pump@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/pump/-/pump-2.0.1.tgz#12399add6e4cf7526d973cbc8b5ce2e2908b3909"
@@ -6830,13 +7156,6 @@ readdirp@~3.6.0:
   dependencies:
     picomatch "^2.2.1"
 
-rechoir@^0.6.2:
-  version "0.6.2"
-  resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
-  integrity sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=
-  dependencies:
-    resolve "^1.1.6"
-
 regenerate-unicode-properties@^10.0.1:
   version "10.0.1"
   resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-10.0.1.tgz#7f442732aa7934a3740c779bb9b3340dccc1fb56"
@@ -6983,7 +7302,7 @@ resolve-url@^0.2.1:
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
   integrity sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=
 
-resolve@^1.1.6, resolve@^1.10.0, resolve@^1.14.2, resolve@^1.20.0, resolve@^1.21.0, resolve@^1.3.2:
+resolve@^1.10.0, resolve@^1.14.2, resolve@^1.15.1, resolve@^1.20.0, resolve@^1.21.0, resolve@^1.3.2:
   version "1.22.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.0.tgz#5e0b8c67c15df57a89bdbabe603a002f21731198"
   integrity sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==
@@ -7181,7 +7500,7 @@ semver@^6.0.0, semver@^6.1.0, semver@^6.1.1, semver@^6.1.2, semver@^6.3.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
   integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
 
-semver@^7.1.2, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5:
+semver@^7.3.2, semver@^7.3.4, semver@^7.3.5:
   version "7.3.5"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
   integrity sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==
@@ -7313,15 +7632,6 @@ shell-quote@^1.6.1:
   resolved "https://registry.yarnpkg.com/shell-quote/-/shell-quote-1.7.3.tgz#aa40edac170445b9a431e17bb62c0b881b9c4123"
   integrity sha512-Vpfqwm4EnqGdlsBFNmHhxhElJYrdfcxPThu+ryKS5J8L/fhAwLazFZtq+S+TWZ9ANj2piSQLGj6NQg+lKPmxrw==
 
-shelljs@^0.8.3:
-  version "0.8.5"
-  resolved "https://registry.yarnpkg.com/shelljs/-/shelljs-0.8.5.tgz#de055408d8361bed66c669d2f000538ced8ee20c"
-  integrity sha512-TiwcRcrkhHvbrZbnRcFYMLl30Dfov3HKqzp5tO5b4pt6G/SezKcYhmDg15zXVBswHmctSAQKznqNW2LO5tTDow==
-  dependencies:
-    glob "^7.0.0"
-    interpret "^1.0.0"
-    rechoir "^0.6.2"
-
 signal-exit@^3.0.0, signal-exit@^3.0.2, signal-exit@^3.0.3:
   version "3.0.7"
   resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9"
@@ -7908,6 +8218,11 @@ toidentifier@1.0.1:
   resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.1.tgz#3be34321a88a820ed1bd80dfaa33e479fbb8dd35"
   integrity sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==
 
+token-stream@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/token-stream/-/token-stream-1.0.0.tgz#cc200eab2613f4166d27ff9afc7ca56d49df6eb4"
+  integrity sha1-zCAOqyYT9BZtJ/+a/HylbUnfbrQ=
+
 totalist@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/totalist/-/totalist-1.1.0.tgz#a4d65a3e546517701e3e5c37a47a70ac97fe56df"
@@ -8013,6 +8328,11 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
+typescript@^4.5.5:
+  version "4.5.5"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.5.5.tgz#d8c953832d28924a9e3d37c73d729c846c5896f3"
+  integrity sha512-TCTIul70LyWe6IJWT8QSYeA54WQe8EjQFU4wY52Fasj5UKx88LNYKCgBEHcOMOrFF1rKGbD8v/xcNWVUq9SymA==
+
 unicode-canonical-property-names-ecmascript@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz#301acdc525631670d39f6146e0e77ff6bbdebddc"
@@ -8083,6 +8403,11 @@ upath@^1.1.1:
   resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894"
   integrity sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==
 
+upath@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/upath/-/upath-2.0.1.tgz#50c73dea68d6f6b990f51d279ce6081665d61a8b"
+  integrity sha512-1uEe95xksV1O0CYKXo8vQvN1JEbtJp7lb7C5U9HMsIp6IVwntkH/oNUzyVNQSd4S1sYk2FpSSW44FqMc8qee5w==
+
 uri-js@^4.2.2:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
@@ -8186,14 +8511,133 @@ vm-browserify@^1.0.1:
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
   integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
 
-vue-cli-plugin-vuetify@~2.4.5:
-  version "2.4.5"
-  resolved "https://registry.yarnpkg.com/vue-cli-plugin-vuetify/-/vue-cli-plugin-vuetify-2.4.5.tgz#5dfae4d78c717c400530731f0b75c0350c3b6add"
-  integrity sha512-CnCVzG6iZAsMMqTkijZ0gRkPB6s4zHPWyFX1VpBBKVyxZESayQhUoMCZRZUOZNjvvZpq1LPgviq+8zcliSu73g==
+void-elements@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
+  integrity sha1-YU9/v42AHwu18GYfWy9XhXUOTwk=
+
+vscode-css-languageservice@^5.1.9:
+  version "5.1.13"
+  resolved "https://registry.yarnpkg.com/vscode-css-languageservice/-/vscode-css-languageservice-5.1.13.tgz#debc7c8368223b211a734cb7eb7789c586d3e2d9"
+  integrity sha512-FA0foqMzMmEoO0WJP+MjoD4dRERhKS+Ag+yBrtmWQDmw2OuZ1R/5FkvI/XdTkCpHmTD9VMczugpHRejQyTXCNQ==
   dependencies:
-    null-loader "^4.0.1"
-    semver "^7.1.2"
-    shelljs "^0.8.3"
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-languageserver-types "^3.16.0"
+    vscode-nls "^5.0.0"
+    vscode-uri "^3.0.2"
+
+vscode-html-languageservice@^4.2.1:
+  version "4.2.2"
+  resolved "https://registry.yarnpkg.com/vscode-html-languageservice/-/vscode-html-languageservice-4.2.2.tgz#e580b8f22b1b8c1dc0d6aaeda5a861f8b4120e4e"
+  integrity sha512-4ICwlpplGbiNQq6D/LZr4qLbPZuMmnSQeX/57UAYP7jD1LOvKeru4lVI+f6d6Eyd7uS46nLJ5DUY4AAlq35C0g==
+  dependencies:
+    vscode-languageserver-textdocument "^1.0.3"
+    vscode-languageserver-types "^3.16.0"
+    vscode-nls "^5.0.0"
+    vscode-uri "^3.0.3"
+
+vscode-json-languageservice@^4.1.10:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/vscode-json-languageservice/-/vscode-json-languageservice-4.2.0.tgz#df0693b69ba2fbf0a6add896087b6f1c9c38f06a"
+  integrity sha512-XNawv0Vdy/sUK0S+hGf7cq/qsVAbIniGJr89TvZOqMCNJmpgKTy1e8PL1aWW0uy6BfWMG7vxa5lZb3ypuFtuGQ==
+  dependencies:
+    jsonc-parser "^3.0.0"
+    vscode-languageserver-textdocument "^1.0.3"
+    vscode-languageserver-types "^3.16.0"
+    vscode-nls "^5.0.0"
+    vscode-uri "^3.0.3"
+
+vscode-jsonrpc@8.0.0-next.6, vscode-jsonrpc@^8.0.0-next.5:
+  version "8.0.0-next.6"
+  resolved "https://registry.yarnpkg.com/vscode-jsonrpc/-/vscode-jsonrpc-8.0.0-next.6.tgz#981f7c065ecc7e7e8595f9da6d073ac592b34114"
+  integrity sha512-6Ld3RYjygn5Ih7CkAtcAwiDQC+rakj2O+PnASfNyYv3sLmm44eJpEKzuPUN30Iy2UB09AZg8T6LBKWTJTEJDVw==
+
+vscode-languageserver-protocol@^3.17.0-next.12:
+  version "3.17.0-next.14"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.17.0-next.14.tgz#d3500bef2ad2889385cda4802acfe6549842164d"
+  integrity sha512-iangobY8dL6sFZkOx4OhRPJM9gN0I1caUsOVR+MnPozsqQUtwMXmbIcfaIf0Akp0pd3KhJDPf/tdwRX68QGeeA==
+  dependencies:
+    vscode-jsonrpc "8.0.0-next.6"
+    vscode-languageserver-types "3.17.0-next.7"
+
+vscode-languageserver-textdocument@^1.0.1, vscode-languageserver-textdocument@^1.0.3:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-textdocument/-/vscode-languageserver-textdocument-1.0.4.tgz#3cd56dd14cec1d09e86c4bb04b09a246cb3df157"
+  integrity sha512-/xhqXP/2A2RSs+J8JNXpiiNVvvNM0oTosNVmQnunlKvq9o4mupHOBAnnzH0lwIPKazXKvAKsVp1kr+H/K4lgoQ==
+
+vscode-languageserver-types@3.17.0-next.7, vscode-languageserver-types@^3.17.0-next.6:
+  version "3.17.0-next.7"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.17.0-next.7.tgz#3e41ebb290c95bb38595f568a9963212626290cc"
+  integrity sha512-KH4zdG1qBXxoso61ChgpeoZYyHGJo8bV7Jv4I+fwQ1Ryy59JAxoZ9GAbhR5TeeafHctLcg6RFvY3m8Jqfu17cg==
+
+vscode-languageserver-types@^3.15.1, vscode-languageserver-types@^3.16.0:
+  version "3.16.0"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.16.0.tgz#ecf393fc121ec6974b2da3efb3155644c514e247"
+  integrity sha512-k8luDIWJWyenLc5ToFQQMaSrqCHiLwyKPHKPQZ5zz21vM+vIVUSvsRpcbiECH4WR88K2XZqc4ScRcZ7nk/jbeA==
+
+vscode-nls@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/vscode-nls/-/vscode-nls-5.0.0.tgz#99f0da0bd9ea7cda44e565a74c54b1f2bc257840"
+  integrity sha512-u0Lw+IYlgbEJFF6/qAqG2d1jQmJl0eyAGJHoAJqr2HT4M2BNuQYSEiSE75f52pXHSJm8AlTjnLLbBFPrdz2hpA==
+
+vscode-pug-languageservice@0.32.0:
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/vscode-pug-languageservice/-/vscode-pug-languageservice-0.32.0.tgz#1aea3cad4736014001260b946c67d95d44693d7e"
+  integrity sha512-6ACeoDERB0PZNEj9ZwHVRQl084PKw48CYLq2nWSzgpZNwg+bxH/D5CLE7wyRWnF1s78tHCa8gpIKcWlTPL8jgA==
+  dependencies:
+    "@volar/code-gen" "0.32.0"
+    "@volar/shared" "0.32.0"
+    "@volar/source-map" "0.32.0"
+    "@volar/transforms" "0.32.0"
+    pug-lexer "^5.0.1"
+    pug-parser "^6.0.0"
+    vscode-languageserver-textdocument "^1.0.3"
+    vscode-languageserver-types "^3.17.0-next.6"
+
+vscode-typescript-languageservice@0.32.0:
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/vscode-typescript-languageservice/-/vscode-typescript-languageservice-0.32.0.tgz#6911c77ee966a9c4c5ddd7939267735627adce2c"
+  integrity sha512-RdFJKbQcN6FQ3Vpx3ggM7XJpTDmmMG3MTAJy+IHn9RpuoQLF8z8gKpTsLAJeiPKXi1WTJjHnl1PT+ndNA3ujig==
+  dependencies:
+    "@volar/shared" "0.32.0"
+    semver "^7.3.5"
+    upath "^2.0.1"
+    vscode-languageserver-protocol "^3.17.0-next.12"
+    vscode-languageserver-textdocument "^1.0.3"
+    vscode-nls "^5.0.0"
+
+vscode-uri@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-2.1.2.tgz#c8d40de93eb57af31f3c715dd650e2ca2c096f1c"
+  integrity sha512-8TEXQxlldWAuIODdukIb+TR5s+9Ds40eSJrw+1iDDA9IFORPjMELarNQE3myz5XIkWWpdprmJjm1/SxMlWOC8A==
+
+vscode-uri@^3.0.2, vscode-uri@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-3.0.3.tgz#a95c1ce2e6f41b7549f86279d19f47951e4f4d84"
+  integrity sha512-EcswR2S8bpR7fD0YPeS7r2xXExrScVMxg4MedACaWHEtx9ftCF/qHG1xGkolzTPcEmjTavCQgbVzHUIdTMzFGA==
+
+vscode-vue-languageservice@0.32.0:
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/vscode-vue-languageservice/-/vscode-vue-languageservice-0.32.0.tgz#926fb67b5b083181bde715ef7b160a1a0704c126"
+  integrity sha512-D9mOE6mCH7uZ9RpXVJBWXi32R/9bcpZmfhJwxbHzXlU8oBowY36qtbiZJoI/rcXTF0tB51MXmHeLsXhAi52HVA==
+  dependencies:
+    "@volar/code-gen" "0.32.0"
+    "@volar/html2pug" "0.32.0"
+    "@volar/shared" "0.32.0"
+    "@volar/source-map" "0.32.0"
+    "@volar/transforms" "0.32.0"
+    "@volar/vue-code-gen" "0.32.0"
+    "@vscode/emmet-helper" "^2.8.3"
+    "@vue/reactivity" "^3.2.27"
+    "@vue/shared" "^3.2.27"
+    upath "^2.0.1"
+    vscode-css-languageservice "^5.1.9"
+    vscode-html-languageservice "^4.2.1"
+    vscode-json-languageservice "^4.1.10"
+    vscode-languageserver-protocol "^3.17.0-next.12"
+    vscode-languageserver-textdocument "^1.0.3"
+    vscode-pug-languageservice "0.32.0"
+    vscode-typescript-languageservice "0.32.0"
 
 vue-demi@*:
   version "0.12.1"
@@ -8234,6 +8678,14 @@ vue-template-es2015-compiler@^1.9.0:
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
   integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
 
+vue-tsc@^0.32.0:
+  version "0.32.0"
+  resolved "https://registry.yarnpkg.com/vue-tsc/-/vue-tsc-0.32.0.tgz#dc200cba0d601ad0c25d6e85e96957fdc94911b8"
+  integrity sha512-ILmlPwpDM+f6fZGQgRnu/wx1xrbmyy7ovYBUoFcyO1/Lz4rs+FaDtl8KP0loMWFljuFu39sHHdHMv2BlEIPLWA==
+  dependencies:
+    "@volar/shared" "0.32.0"
+    vscode-vue-languageservice "0.32.0"
+
 vue@^3.2.25:
   version "3.2.29"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.29.tgz#3571b65dbd796d3a6347e2fd45a8e6e11c13d56a"
@@ -8491,6 +8943,16 @@ wildcard@^2.0.0:
   resolved "https://registry.yarnpkg.com/wildcard/-/wildcard-2.0.0.tgz#a77d20e5200c6faaac979e4b3aadc7b3dd7f8fec"
   integrity sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==
 
+with@^7.0.0:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/with/-/with-7.0.2.tgz#ccee3ad542d25538a7a7a80aad212b9828495bac"
+  integrity sha512-RNGKj82nUPg3g5ygxkQl0R937xLyho1J24ItRCBTr/m1YnZkzJy1hUiHUJrc/VlsDQzsCnInEGSg3bci0Lmd4w==
+  dependencies:
+    "@babel/parser" "^7.9.6"
+    "@babel/types" "^7.9.6"
+    assert-never "^1.2.1"
+    babel-walk "3.0.0-canary-5"
+
 worker-farm@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/worker-farm/-/worker-farm-1.7.0.tgz#26a94c5391bbca926152002f69b84a4bf772e5a8"