Fix app bar for small screens

.drone.yml

@@ -32,7 +32,7 @@ steps:
       from_secret: docker_password
     repo: hub.javil.eu/budgeteer
     context: build
-    dockerfile: docker/Dockerfile
+    dockerfile: build/Dockerfile
     tags: 
       - latest
   when:
@@ -51,7 +51,7 @@ steps:
       from_secret: docker_password
     repo: hub.javil.eu/budgeteer
     context: build
-    dockerfile: docker/Dockerfile
+    dockerfile: build/Dockerfile
     auto_tag: true
   when:
     event:

Taskfile.yml

@@ -78,7 +78,6 @@ tasks:
       - yarn
       - yarn build
       - yarn run vue-tsc --noEmit
-      - yarn run eslint "./src/**"
 
   docker:
     desc: Build budgeeter:latest

postgres/accounts.sql.go

@@ -5,7 +5,7 @@ package postgres
 
 import (
 	"context"
-	"database/sql"
+	"time"
 
 	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
 	"github.com/google/uuid"
@@ -15,7 +15,7 @@ const createAccount = `-- name: CreateAccount :one
 INSERT INTO accounts
 (name, budget_id)
 VALUES ($1, $2)
-RETURNING id, budget_id, name, on_budget, is_open, last_reconciled
+RETURNING id, budget_id, name, on_budget
 `
 
 type CreateAccountParams struct {
@@ -31,14 +31,12 @@ func (q *Queries) CreateAccount(ctx context.Context, arg CreateAccountParams) (A
 		&i.BudgetID,
 		&i.Name,
 		&i.OnBudget,
-		&i.IsOpen,
-		&i.LastReconciled,
 	)
 	return i, err
 }
 
 const getAccount = `-- name: GetAccount :one
-SELECT accounts.id, accounts.budget_id, accounts.name, accounts.on_budget, accounts.is_open, accounts.last_reconciled FROM accounts
+SELECT accounts.id, accounts.budget_id, accounts.name, accounts.on_budget FROM accounts
 WHERE accounts.id = $1
 `
 
@@ -50,16 +48,13 @@ func (q *Queries) GetAccount(ctx context.Context, id uuid.UUID) (Account, error)
 		&i.BudgetID,
 		&i.Name,
 		&i.OnBudget,
-		&i.IsOpen,
-		&i.LastReconciled,
 	)
 	return i, err
 }
 
 const getAccounts = `-- name: GetAccounts :many
-SELECT accounts.id, accounts.budget_id, accounts.name, accounts.on_budget, accounts.is_open, accounts.last_reconciled FROM accounts
+SELECT accounts.id, accounts.budget_id, accounts.name, accounts.on_budget FROM accounts
 WHERE accounts.budget_id = $1
-AND accounts.is_open = TRUE
 ORDER BY accounts.name
 `
 
@@ -77,8 +72,6 @@ func (q *Queries) GetAccounts(ctx context.Context, budgetID uuid.UUID) ([]Accoun
 			&i.BudgetID,
 			&i.Name,
 			&i.OnBudget,
-			&i.IsOpen,
-			&i.LastReconciled,
 		); err != nil {
 			return nil, err
 		}
@@ -94,13 +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, accounts.is_open, accounts.last_reconciled,
+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
 WHERE accounts.budget_id = $1
-AND accounts.is_open = TRUE
 ORDER BY accounts.name
 `
 
@@ -108,8 +101,7 @@ type GetAccountsWithBalanceRow struct {
 	ID                uuid.UUID
 	Name              string
 	OnBudget          bool
-	IsOpen            bool
+	LastReconciled    time.Time
-	LastReconciled    sql.NullTime
 	WorkingBalance    numeric.Numeric
 	ClearedBalance    numeric.Numeric
 	ReconciledBalance numeric.Numeric
@@ -128,7 +120,6 @@ func (q *Queries) GetAccountsWithBalance(ctx context.Context, budgetID uuid.UUID
 			&i.ID,
 			&i.Name,
 			&i.OnBudget,
-			&i.IsOpen,
 			&i.LastReconciled,
 			&i.WorkingBalance,
 			&i.ClearedBalance,
@@ -150,8 +141,7 @@ func (q *Queries) GetAccountsWithBalance(ctx context.Context, budgetID uuid.UUID
 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.is_open = TRUE
+AND accounts.name LIKE $2
-AND accounts.name ILIKE $2
 ORDER BY accounts.name
 `
 
@@ -195,48 +185,28 @@ func (q *Queries) SearchAccounts(ctx context.Context, arg SearchAccountsParams)
 	return items, nil
 }
 
-const setLastReconciled = `-- name: SetLastReconciled :exec
-UPDATE accounts
-SET last_reconciled = NOW()
-WHERE accounts.id = $1
-`
-
-func (q *Queries) SetLastReconciled(ctx context.Context, id uuid.UUID) error {
-	_, err := q.db.ExecContext(ctx, setLastReconciled, id)
-	return err
-}
-
 const updateAccount = `-- name: UpdateAccount :one
 UPDATE accounts
 SET name = $1,
-    on_budget = $2,
+    on_budget = $2
-    is_open = $3
+WHERE accounts.id = $3
-WHERE accounts.id = $4
+RETURNING id, budget_id, name, on_budget
-RETURNING id, budget_id, name, on_budget, is_open, last_reconciled
 `
 
 type UpdateAccountParams struct {
 	Name     string
 	OnBudget bool
-	IsOpen   bool
 	ID       uuid.UUID
 }
 
 func (q *Queries) UpdateAccount(ctx context.Context, arg UpdateAccountParams) (Account, error) {
-	row := q.db.QueryRowContext(ctx, updateAccount,
+	row := q.db.QueryRowContext(ctx, updateAccount, arg.Name, arg.OnBudget, arg.ID)
-		arg.Name,
-		arg.OnBudget,
-		arg.IsOpen,
-		arg.ID,
-	)
 	var i Account
 	err := row.Scan(
 		&i.ID,
 		&i.BudgetID,
 		&i.Name,
 		&i.OnBudget,
-		&i.IsOpen,
-		&i.LastReconciled,
 	)
 	return i, err
 }

postgres/assignments.sql.go

@@ -17,7 +17,7 @@ INSERT INTO assignments (
 ) VALUES (
         $1, $2, $3
 )
-RETURNING category_id, date, memo, amount
+RETURNING id, category_id, date, memo, amount
 `
 
 type CreateAssignmentParams struct {
@@ -30,6 +30,7 @@ func (q *Queries) CreateAssignment(ctx context.Context, arg CreateAssignmentPara
 	row := q.db.QueryRowContext(ctx, createAssignment, arg.Date, arg.Amount, arg.CategoryID)
 	var i Assignment
 	err := row.Scan(
+		&i.ID,
 		&i.CategoryID,
 		&i.Date,
 		&i.Memo,
@@ -129,41 +130,3 @@ func (q *Queries) GetAssignmentsByMonthAndCategory(ctx context.Context, budgetID
 	}
 	return items, nil
 }
-
-const updateAssignment = `-- name: UpdateAssignment :exec
-INSERT INTO assignments (category_id, date, amount)
-VALUES($1, $2, $3) 
-ON CONFLICT (category_id, date) 
-DO 
-   UPDATE SET amount = $3
-`
-
-type UpdateAssignmentParams struct {
-	CategoryID uuid.UUID
-	Date       time.Time
-	Amount     numeric.Numeric
-}
-
-func (q *Queries) UpdateAssignment(ctx context.Context, arg UpdateAssignmentParams) error {
-	_, err := q.db.ExecContext(ctx, updateAssignment, arg.CategoryID, arg.Date, arg.Amount)
-	return err
-}
-
-const updateAssignmentWithDifference = `-- name: UpdateAssignmentWithDifference :exec
-INSERT INTO assignments (category_id, date, amount)
-VALUES($1, $2, $3) 
-ON CONFLICT (category_id, date) 
-DO 
-   UPDATE SET amount = assignments.amount + $3
-`
-
-type UpdateAssignmentWithDifferenceParams struct {
-	CategoryID uuid.UUID
-	Date       time.Time
-	Amount     numeric.Numeric
-}
-
-func (q *Queries) UpdateAssignmentWithDifference(ctx context.Context, arg UpdateAssignmentWithDifferenceParams) error {
-	_, err := q.db.ExecContext(ctx, updateAssignmentWithDifference, arg.CategoryID, arg.Date, arg.Amount)
-	return err
-}

postgres/categories.sql.go

@@ -122,8 +122,7 @@ SELECT CONCAT(category_groups.name, ' : ', categories.name) as name, categories.
 FROM categories
 INNER JOIN category_groups ON categories.category_group_id = category_groups.id
 WHERE category_groups.budget_id = $1
-AND categories.name ILIKE $2
+AND categories.name LIKE $2
-AND category_groups.name != 'Hidden Categories'
 ORDER BY category_groups.name, categories.name
 `
 

postgres/models.go

@@ -36,11 +36,10 @@ type Account struct {
 	BudgetID uuid.UUID
 	Name     string
 	OnBudget bool
-	IsOpen         bool
-	LastReconciled sql.NullTime
 }
 
 type Assignment struct {
+	ID         uuid.UUID
 	CategoryID uuid.UUID
 	Date       time.Time
 	Memo       sql.NullString

postgres/numeric/numeric.go

@@ -53,13 +53,6 @@ func (n Numeric) IsZero() bool {
 	return float == 0
 }
 
-func (n *Numeric) MatchExpI(exp int32) {
-	diffExp := n.Exp - exp
-	factor := big.NewInt(0).Exp(big.NewInt(10), big.NewInt(int64(diffExp)), nil) //nolint:gomnd
-	n.Exp = exp
-	n.Int = big.NewInt(0).Mul(n.Int, factor)
-}
-
 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
@@ -71,22 +64,6 @@ func (n Numeric) MatchExp(exp int32) Numeric {
 	}}
 }
 
-func (n *Numeric) SubI(other Numeric) *Numeric {
-	right := other
-	if n.Exp < other.Exp {
-		right = other.MatchExp(n.Exp)
-	} else if n.Exp > other.Exp {
-		n.MatchExpI(other.Exp)
-	}
-
-	if n.Exp == right.Exp {
-		n.Int = big.NewInt(0).Sub(n.Int, right.Int)
-		return n
-	}
-
-	panic("Cannot subtract with different exponents")
-}
-
 func (n Numeric) Sub(other Numeric) Numeric {
 	left := n
 	right := other
@@ -129,22 +106,6 @@ func (n Numeric) Add(other Numeric) Numeric {
 	panic("Cannot add with different exponents")
 }
 
-func (n *Numeric) AddI(other Numeric) *Numeric {
-	right := other
-	if n.Exp < other.Exp {
-		right = other.MatchExp(n.Exp)
-	} else if n.Exp > other.Exp {
-		n.MatchExpI(other.Exp)
-	}
-
-	if n.Exp == right.Exp {
-		n.Int = big.NewInt(0).Add(n.Int, right.Int)
-		return n
-	}
-
-	panic("Cannot add with different exponents")
-}
-
 func (n Numeric) String() string {
 	if n.Int == nil || n.Int.Int64() == 0 {
 		return "0"

postgres/payees.sql.go

@@ -60,7 +60,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, 'payee' as type FROM payees 
 WHERE payees.budget_id = $1
-AND payees.name ILIKE $2
+AND payees.name LIKE $2
 ORDER BY payees.name
 `
 

postgres/queries/accounts.sql

@@ -11,35 +11,27 @@ WHERE accounts.id = $1;
 -- name: GetAccounts :many
 SELECT accounts.* FROM accounts
 WHERE accounts.budget_id = $1
-AND accounts.is_open = TRUE
 ORDER BY accounts.name;
 
 -- name: GetAccountsWithBalance :many
-SELECT accounts.id, accounts.name, accounts.on_budget, accounts.is_open, accounts.last_reconciled,
+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
 WHERE accounts.budget_id = $1
-AND accounts.is_open = TRUE
 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.is_open = TRUE
+AND accounts.name LIKE @search
-AND accounts.name ILIKE @search
 ORDER BY accounts.name;
 
 -- name: UpdateAccount :one
 UPDATE accounts
 SET name = $1,
-    on_budget = $2,
+    on_budget = $2
-    is_open = $3
+WHERE accounts.id = $3
-WHERE accounts.id = $4
 RETURNING *;
-
--- name: SetLastReconciled :exec
-UPDATE accounts
-SET last_reconciled = NOW()
-WHERE accounts.id = $1;

postgres/queries/assignments.sql

@@ -23,17 +23,3 @@ 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;
-
--- name: UpdateAssignment :exec
-INSERT INTO assignments (category_id, date, amount)
-VALUES($1, $2, $3) 
-ON CONFLICT (category_id, date) 
-DO 
-   UPDATE SET amount = $3;
-
--- name: UpdateAssignmentWithDifference :exec
-INSERT INTO assignments (category_id, date, amount)
-VALUES($1, $2, $3) 
-ON CONFLICT (category_id, date) 
-DO 
-   UPDATE SET amount = assignments.amount + $3;

postgres/queries/categories.sql

@@ -25,7 +25,6 @@ SELECT CONCAT(category_groups.name, ' : ', categories.name) as name, categories.
 FROM categories
 INNER JOIN category_groups ON categories.category_group_id = category_groups.id
 WHERE category_groups.budget_id = @budget_id
-AND categories.name ILIKE @search
+AND categories.name LIKE @search
-AND category_groups.name != 'Hidden Categories'
 ORDER BY category_groups.name, categories.name;
 --ORDER BY levenshtein(payees.name, $2);

postgres/queries/payees.sql

@@ -12,6 +12,6 @@ ORDER BY name;
 -- name: SearchPayees :many
 SELECT payees.*, 'payee' as type FROM payees 
 WHERE payees.budget_id = @budget_id
-AND payees.name ILIKE @search
+AND payees.name LIKE @search
 ORDER BY payees.name;
 --ORDER BY levenshtein(payees.name, $2);

postgres/schema/0016_closed-accounts.sql

@@ -1,5 +0,0 @@
--- +goose Up
-ALTER TABLE accounts ADD COLUMN is_open BOOLEAN NOT NULL DEFAULT TRUE;
-
--- +goose Down
-ALTER TABLE accounts DROP COLUMN is_open;

postgres/schema/0017_natural-key-assignments.sql

@@ -1,6 +0,0 @@
--- +goose Up
-ALTER TABLE assignments DROP id;
-ALTER TABLE assignments ADD PRIMARY KEY (category_id, date);
-
--- +goose Down
-ALTER TABLE assignments ADD COLUMN id uuid DEFAULT uuid_generate_v4() PRIMARY KEY;

postgres/schema/0018_reconciled-on.sql

@@ -1,12 +0,0 @@
--- +goose Up
-ALTER TABLE accounts ADD COLUMN last_reconciled date NULL;
-UPDATE accounts
-SET last_reconciled = (
-    SELECT MAX(transactions.date)
-    FROM transactions
-    WHERE transactions.account_id = accounts.id
-    AND transactions.status = 'Reconciled'
-);
-
--- +goose Down
-ALTER TABLE accounts DROP COLUMN last_reconciled;

postgres/ynab-import.go

@@ -91,12 +91,12 @@ func (ynab *YNABImport) ImportAssignments(context context.Context, r io.Reader)
 			continue
 		}
 
-		assignment := UpdateAssignmentWithDifferenceParams{
+		assignment := CreateAssignmentParams{
 			Date:       date,
 			CategoryID: category.UUID,
 			Amount:     amount,
 		}
-		err = ynab.queries.UpdateAssignmentWithDifference(context, assignment)
+		_, err = ynab.queries.CreateAssignment(context, assignment)
 		if err != nil {
 			return fmt.Errorf("save assignment %v: %w", assignment, err)
 		}
@@ -226,8 +226,7 @@ func (ynab *YNABImport) GetTransaction(context context.Context, record []string)
 }
 
 func (ynab *YNABImport) ImportRegularTransaction(context context.Context, payeeName string,
-	transaction CreateTransactionParams,
+	transaction CreateTransactionParams) error {
-) error {
 	payeeID, err := ynab.GetPayee(context, payeeName)
 	if err != nil {
 		return fmt.Errorf("get payee %s: %w", payeeName, err)
@@ -243,8 +242,7 @@ func (ynab *YNABImport) ImportRegularTransaction(context context.Context, payeeN
 
 func (ynab *YNABImport) ImportTransferTransaction(context context.Context, payeeName string,
 	transaction CreateTransactionParams, openTransfers *[]Transfer,
-	account *Account, amount numeric.Numeric,
+	account *Account, amount numeric.Numeric) error {
-) error {
 	transferToAccountName := payeeName[11:]
 	transferToAccount, err := ynab.GetAccount(context, transferToAccountName)
 	if err != nil {

server/account.go

@@ -39,7 +39,6 @@ type TransactionsResponse struct {
 type EditAccountRequest struct {
 	Name     string `json:"name"`
 	OnBudget bool   `json:"onBudget"`
-	IsOpen   bool   `json:"isOpen"`
 }
 
 func (h *Handler) editAccount(c *gin.Context) {
@@ -60,7 +59,6 @@ func (h *Handler) editAccount(c *gin.Context) {
 	updateParams := postgres.UpdateAccountParams{
 		Name:     request.Name,
 		OnBudget: request.OnBudget,
-		IsOpen:   request.IsOpen,
 		ID:       accountUUID,
 	}
 	account, err := h.Service.UpdateAccount(c.Request.Context(), updateParams)

server/budgeting.go

@@ -3,6 +3,7 @@ package server
 import (
 	"fmt"
 	"net/http"
+	"strconv"
 	"time"
 
 	"git.javil.eu/jacob1123/budgeteer/postgres"
@@ -40,6 +41,27 @@ func NewCategoryWithBalance(category *postgres.GetCategoriesRow) CategoryWithBal
 	}
 }
 
+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)
@@ -75,16 +97,8 @@ func (h *Handler) budgetingForMonth(c *gin.Context) {
 
 	categoriesWithBalance, moneyUsed := h.calculateBalances(
 		budget, firstOfNextMonth, firstOfMonth, categories, cumultativeBalances)
-	availableBalance := h.getAvailableBalance(budget, moneyUsed, cumultativeBalances, firstOfNextMonth)
-	for i := range categoriesWithBalance {
-		cat := &categoriesWithBalance[i]
-		if cat.ID != budget.IncomeCategoryID {
-			continue
-		}
 
-		cat.Available = availableBalance
+	availableBalance := h.getAvailableBalance(categories, budget, moneyUsed, cumultativeBalances, firstOfNextMonth)
-		cat.AvailableLastMonth = availableBalance
-	}
 
 	data := struct {
 		Categories       []CategoryWithBalance
@@ -93,13 +107,18 @@ func (h *Handler) budgetingForMonth(c *gin.Context) {
 	c.JSON(http.StatusOK, data)
 }
 
-func (*Handler) getAvailableBalance(budget postgres.Budget,
+func (*Handler) getAvailableBalance(categories []postgres.GetCategoriesRow, budget postgres.Budget,
 	moneyUsed numeric.Numeric, cumultativeBalances []postgres.GetCumultativeBalancesRow,
 	firstOfNextMonth time.Time) numeric.Numeric {
-	availableBalance := moneyUsed
+	availableBalance := numeric.Zero()
+	for _, cat := range categories {
+		if cat.ID != budget.IncomeCategoryID {
+			continue
+		}
+		availableBalance = moneyUsed
 
 		for _, bal := range cumultativeBalances {
-		if bal.CategoryID != budget.IncomeCategoryID {
+			if bal.CategoryID != cat.ID {
 				continue
 			}
 
@@ -107,8 +126,8 @@ func (*Handler) getAvailableBalance(budget postgres.Budget,
 				continue
 			}
 
-		availableBalance.AddI(bal.Transactions)
+			availableBalance = availableBalance.Add(bal.Transactions)
-		availableBalance.AddI(bal.Assignments)
+		}
 	}
 	return availableBalance
 }
@@ -152,18 +171,21 @@ func (h *Handler) calculateBalances(budget postgres.Budget,
 	cumultativeBalances []postgres.GetCumultativeBalancesRow) ([]CategoryWithBalance, numeric.Numeric) {
 	categoriesWithBalance := []CategoryWithBalance{}
 
-	moneyUsed2 := numeric.Zero()
+	moneyUsed := numeric.Zero()
-	moneyUsed := &moneyUsed2
 	for i := range categories {
 		cat := &categories[i]
 		// do not show hidden categories
 		categoryWithBalance := h.CalculateCategoryBalances(cat, cumultativeBalances,
-			firstOfNextMonth, moneyUsed, firstOfMonth, budget)
+			firstOfNextMonth, &moneyUsed, firstOfMonth, budget)
+
+		if cat.ID == budget.IncomeCategoryID {
+			continue
+		}
 
 		categoriesWithBalance = append(categoriesWithBalance, categoryWithBalance)
 	}
 
-	return categoriesWithBalance, *moneyUsed
+	return categoriesWithBalance, moneyUsed
 }
 
 func (*Handler) CalculateCategoryBalances(cat *postgres.GetCategoriesRow,
@@ -180,11 +202,11 @@ func (*Handler) CalculateCategoryBalances(cat *postgres.GetCategoriesRow,
 			continue
 		}
 
-		moneyUsed.SubI(bal.Assignments)
+		*moneyUsed = moneyUsed.Sub(bal.Assignments)
-		categoryWithBalance.Available.AddI(bal.Assignments)
+		categoryWithBalance.Available = categoryWithBalance.Available.Add(bal.Assignments)
-		categoryWithBalance.Available.AddI(bal.Transactions)
+		categoryWithBalance.Available = categoryWithBalance.Available.Add(bal.Transactions)
 		if !categoryWithBalance.Available.IsPositive() && bal.Date.Before(firstOfMonth) {
-			moneyUsed.AddI(categoryWithBalance.Available)
+			*moneyUsed = moneyUsed.Add(categoryWithBalance.Available)
 			categoryWithBalance.Available = numeric.Zero()
 		}
 

server/category.go

@@ -1,55 +0,0 @@
-package server
-
-import (
-	"fmt"
-	"net/http"
-
-	"git.javil.eu/jacob1123/budgeteer/postgres"
-	"git.javil.eu/jacob1123/budgeteer/postgres/numeric"
-	"github.com/gin-gonic/gin"
-	"github.com/google/uuid"
-)
-
-type SetCategoryAssignmentRequest struct {
-	Assigned string
-}
-
-func (h *Handler) setCategoryAssignment(c *gin.Context) {
-	categoryID := c.Param("categoryid")
-	categoryUUID, err := uuid.Parse(categoryID)
-	if err != nil {
-		c.AbortWithStatusJSON(http.StatusBadRequest, ErrorResponse{"categoryid missing from URL"})
-		return
-	}
-
-	var request SetCategoryAssignmentRequest
-	err = c.BindJSON(&request)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("invalid payload: %w", err))
-		return
-	}
-
-	date, err := getDate(c)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("date invalid: %w", err))
-		return
-	}
-
-	var amount numeric.Numeric
-	err = amount.Set(request.Assigned)
-	if err != nil {
-		c.AbortWithError(http.StatusBadRequest, fmt.Errorf("parse amount: %w", err))
-		return
-	}
-
-	updateArgs := postgres.UpdateAssignmentParams{
-		CategoryID: categoryUUID,
-		Date:       date,
-		Amount:     amount,
-	}
-	err = h.Service.UpdateAssignment(c.Request.Context(), updateArgs)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("update assignment: %w", err))
-		return
-	}
-}

server/http.go

@@ -64,7 +64,6 @@ func (h *Handler) LoadRoutes(router *gin.Engine) {
 	budget.POST("/new", h.newBudget)
 	budget.GET("/:budgetid", h.budgeting)
 	budget.GET("/:budgetid/:year/:month", h.budgetingForMonth)
-	budget.POST("/:budgetid/category/:categoryid/:year/:month", h.setCategoryAssignment)
 	budget.GET("/:budgetid/autocomplete/payees", h.autocompletePayee)
 	budget.GET("/:budgetid/autocomplete/categories", h.autocompleteCategories)
 	budget.DELETE("/:budgetid", h.deleteBudget)

server/reconcile.go

@@ -65,12 +65,6 @@ func (h *Handler) reconcileTransactions(c *gin.Context) {
 		return
 	}
 
-	err = h.Service.SetLastReconciled(c.Request.Context(), accountUUID)
-	if err != nil {
-		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("set last reconciled: %w", err))
-		return
-	}
-
 	err = tx.Commit()
 	if err != nil {
 		c.AbortWithError(http.StatusInternalServerError, fmt.Errorf("commit: %w", err))

server/util.go

@@ -1,30 +0,0 @@
-package server
-
-import (
-	"fmt"
-	"strconv"
-	"time"
-
-	"github.com/gin-gonic/gin"
-)
-
-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
-}

web/.eslintrc.js

@@ -1,17 +0,0 @@
-module.exports = {
-    extends: [
-        // add more generic rulesets here, such as:
-        // 'eslint:recommended',
-        "plugin:vue/vue3-recommended",
-        // 'plugin:vue/recommended' // Use this if you are using Vue.js 2.x.
-    ],
-    rules: {
-        // override/add rules settings here, such as:
-        // 'vue/no-unused-vars': 'error'
-    },
-    parser: "vue-eslint-parser",
-    parserOptions: {
-        parser: "@typescript-eslint/parser",
-        sourceType: "module",
-    },
-};

web/index.html

@@ -6,8 +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 box-border w-full">
-        class="bg-slate-200 text-slate-800 dark:bg-slate-800 dark:text-slate-200 box-border w-full">
     <div id="app"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>

web/package.json

@@ -20,25 +20,14 @@
   },
   "devDependencies": {
     "@types/file-saver": "^2.0.5",
-        "@typescript-eslint/parser": "^5.13.0",
     "@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",
-        "eslint": "^8.10.0",
-        "eslint-plugin-vue": "^8.5.0",
-        "prettier": "2.5.1",
     "sass": "^1.38.0",
     "sass-loader": "^10.0.0",
     "typescript": "^4.5.5",
     "vite": "^2.7.2",
     "vue-tsc": "^0.32.0"
-    },
+  }
-    "prettier": {
-        "bracketSameLine": true,
-        "embeddedLanguageFormatting": "off",
-        "tabWidth": 4,
-        "useTabs": false
-    },
-    "eslintIgnore": ["index.css"]
 }

web/postcss.config.js

@@ -3,4 +3,4 @@ module.exports = {
     tailwindcss: {},
     autoprefixer: {},
   },
-};
+}

web/src/App.vue

@@ -8,6 +8,7 @@ import { useSettingsStore } from "./stores/settings";
 export default defineComponent({
     computed: {
         ...mapState(useBudgetsStore, ["CurrentBudgetName"]),
+        ...mapState(useSettingsStore, ["Menu"]),
         ...mapState(useSessionStore, ["LoggedIn"]),
     },
     methods: {
@@ -26,49 +27,33 @@ export default defineComponent({
 </script>
 
 <template>
-  <div class="flex flex-col md:flex-row flex-1 h-screen">
+    <div class="flex flex-col md:flex-row flex-1">
-    <router-view name="sidebar" />
-
-    <div class="flex-1 overflow-auto">
         <div
-        class="flex bg-gray-400 dark:bg-gray-600 p-4 fixed md:static top-0 left-0 w-full h-14"
+            :class="[Menu.Expand ? 'md:w-72' : 'md:w-36', Menu.Show ? '' : 'hidden']"
+            class="md:block flex-shrink-0 w-full bg-gray-500 border-r-4 border-black"
         >
+            <router-view name="sidebar"></router-view>
+        </div>
+
+        <div class="flex-1">
+            <div class="flex bg-gray-400 dark:bg-gray-600 p-4 fixed md:static top-0 left-0 w-full h-14">
                 <span
                     class="flex-1 font-bold text-5xl -my-3 hidden md:inline"
                     @click="toggleMenuSize"
                 >≡</span>
-        <span
+                <span class="flex-1 font-bold text-5xl -my-3 md:hidden" @click="toggleMenu">≡</span>
-          class="flex-1 font-bold text-5xl -my-3 md:hidden"
-          @click="toggleMenu"
-        >≡</span>
 
                 <span class="flex-1">{{ CurrentBudgetName }}</span>
 
                 <div class="flex flex-1 flex-row justify-end -mx-4">
-          <router-link
+                    <router-link class="mx-4" v-if="LoggedIn" to="/dashboard">Dashboard</router-link>
-            v-if="LoggedIn"
+                    <router-link class="mx-4" v-if="!LoggedIn" to="/login">Login</router-link>
-            class="mx-4"
+                    <a class="mx-4" v-if="LoggedIn" @click="logout">Logout</a>
-            to="/dashboard"
-          >
-            Dashboard
-          </router-link>
-          <router-link
-            v-if="!LoggedIn"
-            class="mx-4"
-            to="/login"
-          >
-            Login
-          </router-link>
-          <a
-            v-if="LoggedIn"
-            class="mx-4"
-            @click="logout"
-          >Logout</a>
                 </div>
             </div>
 
             <div class="p-3 pl-6">
-        <router-view />
+                <router-view></router-view>
             </div>
         </div>
     </div>

web/src/api.ts

@@ -1,13 +1,13 @@
 import { useSessionStore } from "./stores/session";
 
-export const BASE_URL = "/api/v1";
+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();
@@ -15,12 +15,12 @@ export function POST(path: string, body: FormData | string | null) {
         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/AccountWithReconciled.vue

@@ -1,35 +0,0 @@
-<script lang="ts" setup>
-import { computed } from 'vue';
-import { useBudgetsStore } from '../stores/budget';
-import { Account } from '../stores/budget-account';
-
-const props = defineProps<{
-  account: Account
-}>();
-
-const budgetStore = useBudgetsStore();
-const CurrentBudgetID = computed(() => budgetStore.CurrentBudgetID);
-
-const days = 24 * 60 * 60 * 1000;
-function daysSinceLastReconciled() {
-  const now = new Date().getTime();
-  const diff = new Date(now).getTime() - props.account.LastReconciled.Time.getTime();
-  return Math.floor(diff / days);
-}
-</script>
-
-<template>
-  <span>
-    <router-link
-      :to="'/budget/' + CurrentBudgetID + '/account/' + account.ID"
-    >
-      {{ account.Name }}
-    </router-link>
-    <span
-      v-if="props.account.LastReconciled.Valid && daysSinceLastReconciled() > 7"
-      class="font-bold bg-gray-500 rounded-md text-sm px-2 mx-2 py-1 no-underline"
-    >
-      {{ daysSinceLastReconciled() }}
-    </span>
-  </span>
-</template>

web/src/components/Autocomplete.vue

@@ -11,9 +11,9 @@ export interface Suggestion {
 }
 
 const props = defineProps<{
-    text: string,
+    text: String,
-    id: string | undefined,
+    id: String | undefined,
-    model: string,
+    model: String,
     type?: string | undefined,
 }>();
 
@@ -83,27 +83,19 @@ function clear() {
 <template>
     <div>
         <Input
-      v-if="id == undefined"
-      v-model="SearchQuery"
             type="text"
             class="border-b-2 border-black"
             @keypress="keypress"
+            v-if="id == undefined"
+            v-model="SearchQuery"
         />
-    <span
+        <span @click="clear" v-if="id != undefined" class="bg-gray-300 dark:bg-gray-700">{{ text }}</span>
-      v-if="id != undefined"
+        <div v-if="Suggestions.length > 0" class="absolute bg-gray-400 dark:bg-gray-600 w-64 p-2">
-      class="bg-gray-300 dark:bg-gray-700"
-      @click="clear"
-    >{{ 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"
-        :key="suggestion.ID"
                 class="block"
-        :value="suggestion.ID"
                 @click="select"
+                :value="suggestion.ID"
             >{{ suggestion.Name }}</span>
         </div>
     </div>

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

@@ -0,0 +1,8 @@
+<script lang="ts" setup>
+</script>
+
+<template>
+    <div class="flex flex-row items-center bg-gray-300 dark:bg-gray-700 rounded-lg">
+        <slot></slot>
+    </div>
+</template>

web/src/components/Checkbox.vue

@@ -1,15 +1,11 @@
 <script lang="ts" setup>
-const props = defineProps<{modelValue?: boolean}>();
+const props = defineProps(["modelValue"]);
-const emits = defineEmits<{
-  (e: "update:modelValue", value: boolean): void
-}>();
 </script>
 
 <template>
     <input 
         type="checkbox"
         :checked="modelValue"
-    class="dark:bg-slate-900"
+        @change="$emit('update:modelValue', ($event.target as HTMLInputElement)?.checked)"
-    @change="emits('update:modelValue', ($event.target as HTMLInputElement)?.checked)"
+        class="dark:bg-slate-900">
-  >
 </template>

web/src/components/Currency.vue

@@ -1,11 +1,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 
-const props = defineProps<{
+const props = defineProps<{ value: number | undefined }>();
-    value: number | undefined
-    negativeClass?: string
-    positiveClass?: string
-}>();
 
 const internalValue = computed(() => Number(props.value ?? 0));
 
@@ -15,8 +11,5 @@ const formattedValue = computed(() => internalValue.value.toLocaleString(undefin
 </script>
 
 <template>
-  <span
+    <span class="text-right" :class="internalValue < 0 ? 'negative' : ''">{{ formattedValue }} €</span>
-    class="text-right"
-    :class="internalValue < 0 ? (negativeClass ?? 'negative') : positiveClass"
-  >{{ formattedValue }} €</span>
 </template>

web/src/components/DateInput.vue

@@ -1,11 +1,9 @@
 <script lang="ts" setup>
 import Input from './Input.vue';
-const props = defineProps<{
+const props = defineProps(["modelValue"]);
-  modelValue?: Date
-}>();
 const emit = defineEmits(['update:modelValue']);
 
-function dateToYYYYMMDD(d: Date | undefined) : string {
+function dateToYYYYMMDD(d: Date) : string {
   if(d == null)
     return "";
   // alternative implementations in https://stackoverflow.com/q/23593052/1850609
@@ -29,9 +27,9 @@ function selectAll(event: FocusEvent) {
 
 <template>
   <Input
-    ref="input"
     type="date"
-    :value="dateToYYYYMMDD(modelValue)"
+    ref="input"
+    v-bind:value="dateToYYYYMMDD(modelValue)"
     @input="updateValue"
     @focus="selectAll"
   />

web/src/components/Input.vue

@@ -1,17 +1,10 @@
 <script lang="ts" setup>
-const props = defineProps<{
+const props = defineProps(["modelValue"]);
-  modelValue?: number | string
-}>();
-
-const emits = defineEmits<{
-  (e: "update:modelValue", value: number | string): void
-}>();
 </script>
 
 <template>
     <input 
         :value="modelValue"
-    class="dark:bg-slate-900"
+        @input="$emit('update:modelValue', ($event.target as HTMLInputElement)?.value)"
-    @input="emits('update:modelValue', ($event.target as HTMLInputElement)?.value)"
+        class="dark:bg-slate-900">
-  >
 </template>

web/src/components/Modal.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import RowCard from './RowCard.vue';
+import Card from '../components/Card.vue';
 import { ref } from "vue";
 
 const props = defineProps<{
@@ -7,7 +7,7 @@ const props = defineProps<{
 }>();
 
 const emit = defineEmits<{
-    (e: 'submit', event : {cancel:boolean}): boolean,
+    (e: 'submit'): void,
     (e: 'open'): void,
 }>();
 
@@ -20,56 +20,37 @@ function openDialog() {
     visible.value = true;
 };
 function submitDialog() {
-    const e = {cancel: false};
-    emit("submit", e);
-    if(e.cancel)
-        return;
-
     visible.value = false;
+    emit("submit");
 }
 </script>
 
 <template>
     <button @click="openDialog">
         <slot name="placeholder">
-      <RowCard>
+            <Card>
-        <p class="w-24 text-center text-6xl">
+                <p class="w-24 text-center text-6xl">+</p>
-          +
+                <span class="text-lg" dark>{{ buttonText }}</span>
-        </p>
+            </Card>
-        <span
-          class="text-lg"
-          dark
-        >{{ buttonText }}</span>
-      </RowCard>
         </slot>
     </button>
     <div
         v-if="visible"
         class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full"
     >
-    <div
+        <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
-      class="relative top-20 mx-auto p-5 w-96 shadow-lg rounded-md bg-white dark:bg-black"
-    >
             <div class="mt-3 text-center">
-        <h3
+                <h3 class="mt-3 text-lg leading-6 font-medium text-gray-900">{{ buttonText }}</h3>
-          class="mt-3 text-lg leading-6 font-medium text-gray-900 dark:text-gray-100"
+                <slot></slot>
-        >
-          {{ buttonText }}
-        </h3>
-        <slot />
                 <div class="grid grid-cols-2 gap-6">
                     <button
-            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"
                         @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
+                    >Close</button>
-          </button>
                     <button
-            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"
                         @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
+                    >Save</button>
-          </button>
                 </div>
             </div>
         </div>

web/src/components/RowCard.vue

@@ -1,9 +0,0 @@
-<script lang="ts" setup></script>
-
-<template>
-  <div
-    class="flex flex-row items-center bg-gray-300 dark:bg-gray-700 rounded-lg"
-  >
-    <slot />
-  </div>
-</template>

web/src/components/SimpleButton.vue

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

web/src/components/TransactionEditRow.vue

@@ -5,7 +5,7 @@ import { useAccountStore } from '../stores/budget-account'
 import DateInput from "./DateInput.vue";
 import { useTransactionsStore } from "../stores/transactions";
 import Input from "./Input.vue";
-import Button from "./SimpleButton.vue";
+import Button from "./Button.vue";
 
 const props = defineProps<{
     transactionid: string
@@ -40,48 +40,27 @@ function saveTransaction(e: MouseEvent) {
 <template>
     <tr>
         <td class="text-sm">
-      <DateInput
+            <DateInput class="border-b-2 border-black" v-model="TX.Date" />
-        v-model="TX.Date"
-        class="border-b-2 border-black"
-      />
         </td>
         <td>
-      <Autocomplete
+            <Autocomplete v-model:text="TX.Payee" v-model:id="TX.PayeeID" v-model:type="payeeType" model="payees" />
-        v-model:text="TX.Payee"
-        v-model:id="TX.PayeeID"
-        v-model:type="payeeType"
-        model="payees"
-      />
         </td>
         <td>
-      <Autocomplete
+            <Autocomplete v-model:text="TX.Category" v-model:id="TX.CategoryID" model="categories" />
-        v-model:text="TX.Category"
-        v-model:id="TX.CategoryID"
-        model="categories"
-      />
         </td>
         <td>
-      <Input
+            <Input class="block w-full border-b-2 border-black" type="text" v-model="TX.Memo" />
-        v-model="TX.Memo"
-        class="block w-full border-b-2 border-black"
-        type="text"
-      />
         </td>
         <td class="text-right">
             <Input
-        v-model="TX.Amount"
                 class="text-right block w-full border-b-2 border-black"
                 type="currency"
+                v-model="TX.Amount"
             />
         </td>
         <td>
-      <Button
+            <Button class="bg-blue-500" @click="saveTransaction">Save</Button>
-        class="bg-blue-500"
-        @click="saveTransaction"
-      >
-        Save
-      </Button>
         </td>
-    <td />
+        <td></td>
     </tr>
 </template>

web/src/components/TransactionInputRow.vue

@@ -3,7 +3,7 @@ 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 "./SimpleButton.vue";
+import Button from "./Button.vue";
 import Input from "./Input.vue";
 
 const props = defineProps<{
@@ -47,64 +47,37 @@ const payload = computed(() => JSON.stringify({
 const transactionsStore = useTransactionsStore();
 function saveTransaction(e: MouseEvent) {
     e.preventDefault();
-    Save();
-}
-
-function Save() {
     transactionsStore.saveTransaction(payload.value);
 }
-
-defineExpose({Save});
 </script>
 
 <template>
     <tr>
         <label class="md:hidden">Date</label>
         <td class="text-sm">
-      <DateInput
+            <DateInput class="border-b-2 border-black" v-model="TX.Date" />
-        v-model="TX.Date"
-        class="border-b-2 border-black"
-      />
         </td>
         <label class="md:hidden">Payee</label>
         <td>
-      <Autocomplete
+            <Autocomplete v-model:text="TX.Payee" v-model:id="TX.PayeeID" v-model:type="payeeType" model="payees" />
-        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
+            <Autocomplete v-model:text="TX.Category" v-model:id="TX.CategoryID" model="categories" />
-        v-model:text="TX.Category"
-        v-model:id="TX.CategoryID"
-        model="categories"
-      />
         </td>
         <td class="col-span-2">
-      <Input
+            <Input class="block w-full border-b-2 border-black" type="text" v-model="TX.Memo" />
-        v-model="TX.Memo"
-        class="block w-full border-b-2 border-black"
-        type="text"
-      />
         </td>
         <label class="md:hidden">Amount</label>
         <td class="text-right">
             <Input
-        v-model="TX.Amount"
                 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
+            <Button class="bg-blue-500" @click="saveTransaction">Save</Button>
-        class="bg-blue-500"
-        @click="saveTransaction"
-      >
-        Save
-      </Button>
         </td>
     </tr>
 </template>

web/src/components/TransactionRow.vue

@@ -48,11 +48,7 @@ function getStatusSymbol() {
 
 <template>
     <tr v-if="dateChanged()" class="table-row md:hidden">
-    <td class="py-2" colspan="5">
+        <td class="bg-gray-200 dark:bg-gray-800 rounded-lg p-2" colspan="5">{{ formatDate(TX.Date) }}</td>
-      <span class="bg-gray-400 dark:bg-slate-600 rounded-lg p-1 px-2 w-full block">
-        {{ formatDate(TX.Date) }}
-      </span>
-    </td>
     </tr>
     <tr
         v-if="!edit"
@@ -60,41 +56,25 @@ function getStatusSymbol() {
         :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">
+        <td class="hidden md:block">{{ formatDate(TX.Date) }}</td>
-      {{ formatDate(TX.Date) }}
+        <td class="pl-2 md:pl-0">{{ TX.TransferAccount ? "Transfer : " + TX.TransferAccount : TX.Payee }}</td>
-    </td>
+        <td>{{ TX.CategoryGroup ? TX.CategoryGroup + " : " + TX.Category : "" }}</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
+            <Currency class="block" :value="TX.Amount" />
-        class="block"
-        :value="TX.Amount"
-      />
         </td>
         <td class="text-right">
             {{ TX.GroupID ? "☀" : "" }}
             {{ getStatusSymbol() }}
             <a @click="edit = true;">✎</a>
-      <Checkbox
+            <Checkbox v-if="Reconciling && TX.Status != 'Reconciled'" v-model="TX.Reconciled" />
-        v-if="Reconciling && TX.Status != 'Reconciled'"
-        v-model="TX.Reconciled"
-      />
         </td>
     </tr>
-  <TransactionEditRow
+    <TransactionEditRow v-if="edit" :transactionid="TX.ID" @save="edit = false" />
-    v-if="edit"
-    :transactionid="TX.ID"
-    @save="edit = false"
-  />
 </template>
 
 <style>

web/src/date.ts

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

web/src/dialogs/EditAccount.vue

@@ -3,83 +3,43 @@ import { computed, ref } from 'vue';
 import Modal from '../components/Modal.vue';
 import { useAccountStore } from '../stores/budget-account';
 import Input from '../components/Input.vue';
-import Checkbox from '../components/Checkbox.vue';
-import { useRouter } from 'vue-router';
-import { useBudgetsStore } from '../stores/budget';
 
-const router = useRouter();
 const accountStore = useAccountStore();
 const CurrentAccount = computed(() => accountStore.CurrentAccount);
 
 const accountName = ref("");
 const accountOnBudget = ref(true);
-const accountOpen = ref(true);
-const error = ref("");
 
-function editAccount(e : {cancel:boolean}) : boolean {
+function editAccount(e : any) {
-    if(CurrentAccount.value?.ClearedBalance != 0 && !accountOpen.value){
+    accountStore.EditAccount(CurrentAccount.value?.ID ?? "", accountName.value, accountOnBudget.value);
-        e.cancel = true;
-        error.value = "Cannot close account with balance";
-        return false;
-    }
-
-    error.value = "";
-    accountStore.EditAccount(CurrentAccount.value?.ID ?? "", accountName.value, accountOnBudget.value, accountOpen.value);
-
-    // account closed, move to Budget
-    if(!accountOpen.value){
-        const currentBudgetID = useBudgetsStore().CurrentBudgetID;
-        router.replace('/budget/'+currentBudgetID+'/budgeting');
-    }
-    return true;
 }
 
 function openEditAccount(e : any) {
     accountName.value = CurrentAccount.value?.Name ?? "";
     accountOnBudget.value = CurrentAccount.value?.OnBudget ?? true;
-    accountOpen.value = CurrentAccount.value?.IsOpen ?? true;
 }
 </script>
 
 <template>
-  <Modal
+    <Modal button-text="Edit Account" @open="openEditAccount" @submit="editAccount">
-    button-text="Edit Account"
+        <template v-slot:placeholder>✎</template>
-    @open="openEditAccount"
-    @submit="editAccount"
-  >
-    <template #placeholder>
-      <span class="ml-2">✎</span>
-    </template>
         <div class="mt-2 px-7 py-3">
             <Input
-        v-model="accountName"
+                class="border-2"
-        class="border-2 dark:border-gray-700"
                 type="text"
+                v-model="accountName"
                 placeholder="Account name"
                 required
             />
         </div>
         <div class="mt-2 px-7 py-3">
-      <Checkbox
+            <Input
-        v-model="accountOnBudget"
                 class="border-2"
+                type="checkbox"
+                v-model="accountOnBudget"
                 required
             />
             <label>On Budget</label>
         </div>
-    <div class="mt-2 px-7 py-3">
-      <Checkbox
-        v-model="accountOpen"
-        class="border-2"
-        required
-      />
-      <label>Open</label>
-    </div>
-    <div
-      v-if="error != ''"
-      class="dark:text-red-300 text-red-700"
-    >
-      {{ error }}
-    </div>
     </Modal>
 </template>

web/src/dialogs/NewBudget.vue

@@ -11,18 +11,9 @@ function saveBudget() {
 </script>
 
 <template>
-  <Modal
+  <Modal button-text="New Budget" @submit="saveBudget">
-    button-text="New Budget"
-    @submit="saveBudget"
-  >
     <div class="mt-2 px-7 py-3">
-      <Input
+      <Input class="border-2" type="text" v-model="budgetName" placeholder="Budget name" required />
-        v-model="budgetName"
-        class="border-2"
-        type="text"
-        placeholder="Budget name"
-        required
-      />
     </div>
   </Modal>
 </template>

web/src/main.ts

@@ -1,79 +1,28 @@
-import { createApp } from "vue";
+import { createApp } from 'vue'
-import App from "./App.vue";
+import App from './App.vue'
-import "./index.css";
+import './index.css'
-import router from "./router";
+import router from './router'
-import { createPinia } from "pinia";
+import { createPinia } from 'pinia'
-import { useBudgetsStore } from "./stores/budget";
+import { useBudgetsStore } from './stores/budget';
-import { useAccountStore } from "./stores/budget-account";
+import { useAccountStore } from './stores/budget-account'
-import PiniaLogger from "./pinia-logger";
+import PiniaLogger from './pinia-logger'
-import { useSessionStore } from "./stores/session";
 
-const app = createApp(App);
+const app = createApp(App)
-app.use(router);
+app.use(router)
 
-const pinia = createPinia();
+const pinia = createPinia()
-pinia.use(
+pinia.use(PiniaLogger({
-    PiniaLogger({
   expanded: false,
-        showDuration: true,
+  showDuration: true
-    })
+}))
-);
+app.use(pinia)
-app.use(pinia);
+app.mount('#app')
-app.mount("#app");
 
 router.beforeEach(async (to, from, next) => {
   const budgetStore = useBudgetsStore();
-    await budgetStore.SetCurrentBudget(<string>to.params.budgetid);
+  await budgetStore.SetCurrentBudget((<string>to.params.budgetid));
 
   const accountStore = useAccountStore();
-    await accountStore.SetCurrentAccount(
+  await accountStore.SetCurrentAccount((<string>to.params.budgetid), (<string>to.params.accountid));
-        <string>to.params.budgetid,
-        <string>to.params.accountid
-    );
   next();
-});
-
-router.beforeEach((to, from, next) => {
-    const sessionStore = useSessionStore();
-    const token = sessionStore.Session?.Token;
-    let loggedIn = false;
-
-    if (token != null) {
-        const jwt = parseJwt(token);
-        if (jwt.exp > Date.now() / 1000) loggedIn = true;
-    }
-
-    if (to.matched.some((record) => record.meta.requiresAuth)) {
-        if (!loggedIn) {
-            next({ path: "/login" });
-        } else {
-            next();
-        }
-    } else if (to.matched.some((record) => record.meta.hideForAuth)) {
-        if (loggedIn) {
-            next({ path: "/dashboard" });
-        } else {
-            next();
-        }
-    } else {
-        next();
-    }
-});
-
-function parseJwt(token: string) {
-    var base64Url = token.split(".")[1];
-    var base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
-    var jsonPayload = decodeURIComponent(
-        atob(base64)
-            .split("")
-            .map(function (c) {
-                return "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2);
 })
-            .join("")
-    );
-
-    return JSON.parse(jsonPayload);
-}
-
-1646426130;
-1646512855755;

web/src/pages/Account.vue

@@ -5,23 +5,16 @@ import TransactionRow from "../components/TransactionRow.vue";
 import TransactionInputRow from "../components/TransactionInputRow.vue";
 import { useAccountStore } from "../stores/budget-account";
 import EditAccount from "../dialogs/EditAccount.vue";
-import Button from "../components/SimpleButton.vue";
+import Button from "../components/Button.vue";
 import { useTransactionsStore } from "../stores/transactions";
 import Modal from "../components/Modal.vue";
 import Input from "../components/Input.vue";
-import Checkbox from "../components/Checkbox.vue";
 
 defineProps<{
     budgetid: string
     accountid: string
 }>()
 
-const modalInputRow = ref<typeof TransactionInputRow | null>(null);
-
-function submitModal() {
-  modalInputRow.value!.Save();
-}
-
 const accounts = useAccountStore();
 const transactions = useTransactionsStore();
 const TargetReconcilingBalance = ref(0);
@@ -50,16 +43,12 @@ function createReconcilationTransaction() {
 
 <template>
     <div class="grid grid-cols-[1fr_auto]">
-    <div>
         <h1 class="inline">
             {{ accounts.CurrentAccount?.Name }}
-      </h1>
             <EditAccount />
-    </div>
+        </h1>
 
-    <div
+        <div class="text-right flex flex-wrap flex-col md:flex-row justify-end gap-2 max-w-sm">
-      class="text-right flex flex-wrap flex-col md:flex-row justify-end gap-2 max-w-sm"
-    >
             <span class="rounded-lg p-1 whitespace-nowrap flex-1">
                 Working:
                 <Currency :value="accounts.CurrentAccount?.WorkingBalance" />
@@ -71,72 +60,48 @@ function createReconcilationTransaction() {
             </span>
 
             <span
-        v-if="!transactions.Reconciling"
                 class="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>
 
-      <span
+            <span v-if="transactions.Reconciling" class="contents">
-        v-if="transactions.Reconciling"
+                <Button @click="submitReconcilation"
-        class="contents"
+                    class="bg-blue-500 p-1 whitespace-nowrap flex-1">
-      >
-        <Button
-          class="bg-blue-500 p-1 whitespace-nowrap flex-1"
-          @click="submitReconcilation"
-        >
                     My current balance is&nbsp;
                     <Currency :value="transactions.ReconcilingBalance" />
                 </Button>
 
-        <Button
+                <Button @click="createReconcilationTransaction"
-          class="bg-orange-500 p-1 whitespace-nowrap flex-1"
+                    class="bg-orange-500 p-1 whitespace-nowrap flex-1">
-          @click="createReconcilationTransaction"
-        >
                     No, it's:
                     <Input
-            v-model="TargetReconcilingBalance"
                         class="text-right w-20 bg-transparent dark:bg-transparent border-b-2"
                         type="number"
+                        v-model="TargetReconcilingBalance"
                     />
                     (Difference
                     <Currency
                         :value="transactions.ReconcilingBalance - TargetReconcilingBalance"
                     />)
                 </Button>
-        <Button
+                <Button class="bg-red-500 p-1 flex-1" @click="cancelReconcilation">Cancel</Button>
-          class="bg-red-500 p-1 flex-1"
-          @click="cancelReconcilation"
-        >Cancel</Button>
             </span>
         </div>
     </div>
 
     <table>
         <tr class="font-bold">
-      <td
+            <td class="hidden md:block" style="width: 90px;">Date</td>
-        class="hidden md:block"
+            <td style="max-width: 150px;">Payee</td>
-        style="width: 90px;"
+            <td style="max-width: 200px;">Category</td>
-      >
-        Date
-      </td>
-      <td style="max-width: 150px;">
-        Payee
-      </td>
-      <td style="max-width: 200px;">
-        Category
-      </td>
             <td>Memo</td>
-      <td class="text-right">
+            <td class="text-right">Amount</td>
-        Amount
-      </td>
             <td style="width: 80px;">
-        <Checkbox
+                <Input v-if="transactions.Reconciling" type="checkbox" @input="setReconciled" />
-          v-if="transactions.Reconciling"
-          @input="setReconciled"
-        />
             </td>
         </tr>
         <TransactionInputRow
@@ -152,16 +117,11 @@ function createReconcilationTransaction() {
         />
     </table>
     <div class="md:hidden">
-    <Modal @submit="submitModal">
+        <Modal>
-      <template #placeholder>
+            <template v-slot:placeholder>
-        <Button
+                <Button class="fixed right-4 bottom-4 font-bold text-lg bg-blue-500 py-2">+</Button>
-          class="fixed right-4 bottom-4 font-bold text-lg bg-blue-500 py-2"
-        >
-          +
-        </Button>
             </template>
             <TransactionInputRow
-        ref="modalInputRow"
                 class="grid grid-cols-2"
                 :budgetid="budgetid"
                 :accountid="accountid"

web/src/pages/BudgetSidebar.vue

@@ -1,14 +1,11 @@
 <script lang="ts" setup>
 import { computed } from "vue";
-import Currency from "../components/Currency.vue";
+import Currency from "../components/Currency.vue"
-import { useBudgetsStore } from "../stores/budget";
+import { useBudgetsStore } from "../stores/budget"
-import { Account, useAccountStore } from "../stores/budget-account";
+import { Account, useAccountStore } from "../stores/budget-account"
-import { useSettingsStore } from "../stores/settings";
+import { useSettingsStore } from "../stores/settings"
-import AccountWithReconciled from "../components/AccountWithReconciled.vue";
 
-const settings = useSettingsStore();
+const ExpandMenu = computed(() => useSettingsStore().Menu.Expand);
-const ExpandMenu = computed(() => settings.Menu.Expand);
-const ShowMenu = computed(() => settings.Menu.Show);
 
 const budgetStore = useBudgetsStore();
 const CurrentBudgetName = computed(() => budgetStore.CurrentBudgetName);
@@ -19,87 +16,62 @@ 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;
+  return new Date(now - recently).getTime() < account.LastReconciled.getTime();
+}
+
+function getAccountName(account : Account) {
+  const reconciledMarker = isRecentlyReconciled(account) ? "" : " *";
+  return account.Name + reconciledMarker;
+}
 </script>
 
 <template>
-  <div
-    :class="[ExpandMenu ? 'md:w-72' : 'md:w-36', ShowMenu ? '' : 'hidden']"
-    class="md:block flex-shrink-0 w-full bg-gray-500 border-r-4 border-black"
-  >
   <div class="flex flex-col mt-14 md:mt-0">
-      <span
+    <span class="m-2 p-1 px-3 h-10 overflow-hidden" :class="[ExpandMenu ? 'text-2xl' : 'text-md']">
-        class="m-2 p-1 px-3 h-10 overflow-hidden"
+      <router-link to="/dashboard" style="font-size:150%">⌂</router-link>
-        :class="[ExpandMenu ? 'text-2xl' : 'text-md']"
-      >
-        <router-link
-          to="/dashboard"
-          style="font-size: 150%"
-        >⌂</router-link>
       {{CurrentBudgetName}}
     </span>
     <span class="bg-gray-100 dark:bg-gray-700 p-2 px-3 flex flex-col">
-        <router-link :to="'/budget/' + CurrentBudgetID + '/budgeting'">Budget</router-link>
+      <router-link :to="'/budget/'+CurrentBudgetID+'/budgeting'">Budget</router-link><br />
-        <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-slate-200 dark:bg-slate-700 my-2 p-2 px-3">
       <div class="flex flex-row justify-between font-bold">
         <span>On-Budget Accounts</span>
-          <Currency
+        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="OnBudgetAccountsBalance" />
-            :class="ExpandMenu ? 'md:inline' : 'md:hidden'"
-            :value="OnBudgetAccountsBalance"
-          />
       </div>
-        <div
+      <div v-for="account in OnBudgetAccounts" class="flex flex-row justify-between">
-          v-for="account in OnBudgetAccounts"
+        <router-link :to="'/budget/'+CurrentBudgetID+'/account/'+account.ID">{{getAccountName(account)}}</router-link>
-          :key="account.ID"
+        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="account.ClearedBalance" />
-          class="flex flex-row justify-between"
-        >
-          <AccountWithReconciled :account="account" />
-          <Currency
-            :class="ExpandMenu ? 'md:inline' : 'md:hidden'"
-            :value="account.ClearedBalance"
-          />
       </div>
     </li>
     <li class="bg-slate-200 dark:bg-slate-700 my-2 p-2 px-3">
       <div class="flex flex-row justify-between font-bold">
         <span>Off-Budget Accounts</span>
-          <Currency
+        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="OffBudgetAccountsBalance" />
-            :class="ExpandMenu ? 'md:inline' : 'md:hidden'"
-            :value="OffBudgetAccountsBalance"
-          />
       </div>
-        <div
+      <div v-for="account in OffBudgetAccounts" class="flex flex-row justify-between">
-          v-for="account in OffBudgetAccounts"
+        <router-link :to="'/budget/'+CurrentBudgetID+'/account/'+account.ID">{{getAccountName(account)}}</router-link>
-          :key="account.ID"
+        <Currency :class="ExpandMenu?'md:inline':'md:hidden'" :value="account.ClearedBalance" />
-          class="flex flex-row justify-between"
-        >
-          <AccountWithReconciled :account="account" />
-          <Currency
-            :class="ExpandMenu ? 'md:inline' : 'md:hidden'"
-            :value="account.ClearedBalance"
-          />
       </div>
     </li>
-      <!--
     <li class="bg-slate-100 dark:bg-slate-800 my-2 p-2 px-3">
       <div class="flex flex-row justify-between font-bold">
         <span>Closed Accounts</span>
       </div>
       + Add Account
     </li>
-      -->
     <!--<li>
       <router-link :to="'/budget/'+CurrentBudgetID+'/accounts'">Edit accounts</router-link>
     </li>-->
     <li class="bg-red-100 dark:bg-slate-600 my-2 p-2 px-3">
-        <router-link :to="'/budget/' + CurrentBudgetID + '/settings'">
+      <router-link :to="'/budget/'+CurrentBudgetID+'/settings'">Budget-Settings</router-link>
-          Budget-Settings
-        </router-link>
     </li>
     <!--<li><router-link to="/admin">Admin</router-link></li>-->
   </div>        
-  </div>
 </template>

web/src/pages/Budgeting.vue

@@ -2,10 +2,8 @@
 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";
-import Input from "../components/Input.vue";
-import { POST } from "../api";
 
 const props = defineProps<{
     budgetid: string,
@@ -65,108 +63,38 @@ function toggleGroup(group: { Name: string, Expand: boolean }) {
 function getGroupState(group: { Name: string, Expand: boolean }): boolean {
     return expandedGroups.value.get(group.Name) ?? group.Expand;
 }
-
-function assignedChanged(e : Event, category : Category){
-    const target = e.target as HTMLInputElement;
-    const value = target.valueAsNumber;
-    POST("/budget/"+CurrentBudgetID.value+"/category/" + category.ID + "/" + selected.value.Year + "/" + (selected.value.Month+1),
-    JSON.stringify({Assigned: category.Assigned}));
-}
 </script>
 
 <template>
     <h1>Budget for {{ selected.Month + 1 }}/{{ selected.Year }}</h1>
-  <span>Available balance:
-    <Currency
-      :value="accountStore.GetIncomeAvailable(selected.Year, selected.Month)"
-    /></span>
     <div>
         <router-link
             :to="'/budget/' + CurrentBudgetID + '/budgeting/' + previous.Year + '/' + previous.Month"
-    >
+        >&lt;&lt;</router-link>&nbsp;
-      &lt;&lt;
-    </router-link>&nbsp;
         <router-link
             :to="'/budget/' + CurrentBudgetID + '/budgeting/' + current.Year + '/' + current.Month"
-    >
+        >Current Month</router-link>&nbsp;
-      Current Month
-    </router-link>&nbsp;
         <router-link
             :to="'/budget/' + CurrentBudgetID + '/budgeting/' + next.Year + '/' + next.Month"
-    >
+        >&gt;&gt;</router-link>
-      &gt;&gt;
-    </router-link>
     </div>
-  <div
+    <div class="container col-lg-12 grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-5" id="content">
-    id="content"
+        <span class="hidden sm:block"></span>
-    class="container col-lg-12 grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-5"
-  >
-    <span class="hidden sm:block" />
         <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
+        <template v-for="group in GroupsForMonth">
-      v-for="group in GroupsForMonth"
+            <a
-      :key="group.Name"
+                class="text-lg font-bold col-span-2 sm:col-span-4 lg:col-span-5"
-    >
-      <span
-        class="text-lg font-bold mt-2"
                 @click="toggleGroup(group)"
-      >{{ (getGroupState(group) ? "−" : "+") + " " + group.Name }}</span>
+            >{{ (getGroupState(group) ? "−" : "+") + " " + group.Name }}</a>
-      <Currency
+            <template v-for="category in GetCategories(group.Name)" v-if="getGroupState(group)">
-        :value="group.AvailableLastMonth"
+                <span class="whitespace-nowrap overflow-hidden">{{ category.Name }}</span>
-        class="hidden lg:block mt-2"
+                <Currency :value="category.AvailableLastMonth" class="hidden lg:block" />
-        positive-class="text-slate-500"
+                <Currency :value="category.Assigned" class="hidden sm:block" />
-        negative-class="text-red-700 dark:text-red-400"
+                <Currency :value="category.Activity" class="hidden sm:block" />
-      />
+                <Currency :value="category.Available" />
-      <Currency
-        :value="group.Assigned"
-        class="hidden sm:block mx-2 mt-2 text-right"
-        positive-class="text-slate-500"
-        negative-class="text-red-700 dark:text-red-400"
-      />
-      <Currency
-        :value="group.Activity"
-        class="hidden sm:block mt-2"
-        positive-class="text-slate-500"
-        negative-class="text-red-700 dark:text-red-400"
-      />
-      <Currency
-        :value="group.Available"
-        class="mt-2"
-        positive-class="text-slate-500"
-        negative-class="text-red-700 dark:text-red-400"
-      />
-      <template
-        v-for="category in GetCategories(group.Name)"
-        :key="category.ID"
-      >
-        <div
-          v-if="getGroupState(group)"
-          class="contents"
-        >
-          <span
-            class="whitespace-nowrap overflow-hidden"
-          >{{ category.Name }}</span>
-          <Currency
-            :value="category.AvailableLastMonth"
-            class="hidden lg:block"
-          />
-          <Input
-            v-model="category.Assigned"
-            type="number"
-            class="hidden sm:block mx-2 text-right"
-            @input="(evt) => assignedChanged(evt, category)"
-          />
-          <Currency
-            :value="category.Activity"
-            class="hidden sm:block"
-          />
-          <Currency
-            :value="accountStore.GetCategoryAvailable(category)"
-          />
-        </div>
             </template>
         </template>
     </div>

web/src/pages/Dashboard.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import NewBudget from '../dialogs/NewBudget.vue';
-import RowCard from '../components/RowCard.vue';
+import Card from '../components/Card.vue';
 import { useSessionStore } from '../stores/session';
 
 const props = defineProps<{
@@ -13,20 +13,13 @@ const BudgetsList = useSessionStore().BudgetsList;
 <template>
     <h1>Budgets</h1>
     <div class="grid md:grid-cols-2 gap-6">
-    <RowCard
+        <Card v-for="budget in BudgetsList">
-      v-for="budget in BudgetsList"
+            <router-link v-bind:to="'/budget/'+budget.ID+'/budgeting'" class="contents">
-      :key="budget.ID"
-    >
-      <router-link
-        :to="'/budget/'+budget.ID+'/budgeting'"
-        class="contents"
-      >
             <!--<svg class="w-24"></svg>-->
-        <p class="w-24 text-center text-6xl" />
+                <p class="w-24 text-center text-6xl"></p>
-        <span class="text-lg">{{ budget.Name
+                <span class="text-lg">{{budget.Name}}{{budget.ID == budgetid ? " *" : ""}}</span>
-        }}{{ budget.ID == budgetid ? " *" : "" }}</span>
             </router-link>
-    </RowCard>
+        </Card>
         <NewBudget />
     </div>
 </template>

web/src/pages/Index.vue

@@ -0,0 +1,13 @@
+<script lang="ts" setup>
+</script>
+
+<template>
+  <div>
+    <div class="font-bold" id="content">
+      Willkommen bei Budgeteer, der neuen App für's Budget!
+    </div>
+    <div class="container col-md-4" id="login">
+      <router-link to="/login">Login</router-link> or <router-link to="/login">register</router-link>
+    </div>
+  </div>
+</template>

web/src/pages/Login.vue

@@ -29,31 +29,17 @@ function formSubmit(e: MouseEvent) {
 
 <template>
     <div>
-    <Input
+        <Input type="text" v-model="login.user"
-      v-model="login.user"
-      type="text"
             placeholder="Username"
-      class="border-2 border-black rounded-lg block px-2 my-2 w-48"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
-    />
+        <Input type="password" v-model="login.password"
-    <Input
-      v-model="login.password"
-      type="password"
             placeholder="Password"
-      class="border-2 border-black rounded-lg block px-2 my-2 w-48"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
-    />
     </div>
     <div>{{ error }}</div>
-  <button
+    <button type="submit" @click="formSubmit" class="bg-blue-300 rounded-lg p-2 w-48">Login</button>
-    type="submit"
-    class="bg-blue-300 rounded-lg p-2 w-48"
-    @click="formSubmit"
-  >
-    Login
-  </button>
     <p>
         New user?
-    <router-link to="/register">
+        <router-link to="/register">Register</router-link> instead!
-      Register
-    </router-link> instead!
     </p>
 </template>

web/src/pages/Register.vue

@@ -29,37 +29,20 @@ function formSubmit(e: MouseEvent) {
 
 <template>
     <div>
-    <Input
+        <Input type="text" v-model="login.name"
-      v-model="login.name"
-      type="text"
             placeholder="Name"
-      class="border-2 border-black rounded-lg block px-2 my-2 w-48"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
-    />
+        <Input type="text" v-model="login.email"
-    <Input
-      v-model="login.email"
-      type="text"
             placeholder="Email"
-      class="border-2 border-black rounded-lg block px-2 my-2 w-48"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
-    />
+        <Input type="password" v-model="login.password"
-    <Input
-      v-model="login.password"
-      type="password"
             placeholder="Password"
-      class="border-2 border-black rounded-lg block px-2 my-2 w-48"
+            class="border-2 border-black rounded-lg block px-2 my-2 w-48" />
-    />
     </div>
     <div>{{ error }}</div>
-  <button
+    <button type="submit" @click="formSubmit" class="bg-blue-300 rounded-lg p-2 w-48">Register</button>
-    type="submit"
-    class="bg-blue-300 rounded-lg p-2 w-48"
-    @click="formSubmit"
-  >
-    Register
-  </button>
     <p>
         Existing user?
-    <router-link to="/login">
+        <router-link to="/login">Login</router-link> instead!
-      Login
-    </router-link> instead!
     </p>
 </template>

web/src/pages/Settings.vue

@@ -4,8 +4,8 @@ import { useRouter } from "vue-router";
 import { DELETE, POST } from "../api";
 import { useBudgetsStore } from "../stores/budget";
 import { useSessionStore } from "../stores/session";
-import RowCard from "../components/RowCard.vue";
+import Card from "../components/Card.vue";
-import Button from "../components/SimpleButton.vue";
+import Button from "../components/Button.vue";
 import { saveAs } from 'file-saver';
 import Input from "../components/Input.vue";
 
@@ -72,105 +72,53 @@ function ynabExport() {
             saveAs(blob, timeStamp + " " + CurrentBudgetName.value + " - Transactions.tsv");
         })
 }
+
 </script>
 
 <template>
     <div>
         <h1>Danger Zone</h1>
         <div class="grid md:grid-cols-2 gap-6">
-      <RowCard class="flex-col p-3">
+            <Card class="flex-col p-3">
-        <h2 class="text-lg font-bold">
+                <h2 class="text-lg font-bold">Clear Budget</h2>
-          Clear Budget
+                <p>This removes transactions and assignments to start from scratch. Accounts and categories are kept. Not undoable!</p>
-        </h2>
-        <p>
-          This removes transactions and assignments to start from
-          scratch. Accounts and categories are kept. Not undoable!
-        </p>
 
-        <Button
+                <Button class="bg-red-500 py-2" @click="clearBudget">Clear budget</Button>
-          class="bg-red-500 py-2"
+            </Card>
-          @click="clearBudget"
+            <Card class="flex-col p-3">
-        >
+                <h2 class="text-lg font-bold">Delete Budget</h2>
-          Clear budget
+                <p>This deletes the whole bugdet including all transactions, assignments, accounts and categories. Not undoable!</p>
-        </Button>
+                <Button class="bg-red-500 py-2" @click="deleteBudget">Delete budget</button>
-      </RowCard>
+            </Card>
-      <RowCard class="flex-col p-3">
+            <Card class="flex-col p-3">
-        <h2 class="text-lg font-bold">
+                <h2 class="text-lg font-bold">Fix all historic negative category-balances</h2>
-          Delete Budget
+                <p>This restores YNABs functionality, that would substract any overspent categories' balances from next months inflows.</p>
-        </h2>
+                <Button class="bg-orange-500 py-2" @click="cleanNegative">Fix negative</button>
-        <p>
+            </Card>
-          This deletes the whole bugdet including all transactions,
+            <Card class="flex-col p-3">
-          assignments, accounts and categories. Not undoable!
+                <h2 class="text-lg font-bold">Import YNAB Budget</h2>
-        </p>
-        <Button
-          class="bg-red-500 py-2"
-          @click="deleteBudget"
-        >
-          Delete budget
-        </Button>
-      </RowCard>
-      <RowCard 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>
-      </RowCard>
-      <RowCard class="flex-col p-3">
-        <h2 class="text-lg font-bold">
-          Import YNAB Budget
-        </h2>
                 
                 <div>
                     <label for="transactions_file">
                         Transaktionen:
-            <input
+                        <input type="file" @change="gotTransactions" accept="text/*" />
-              type="file"
-              accept="text/*"
-              @change="gotTransactions"
-            >
                     </label>
-          <br>
+                    <br />
                     <label for="assignments_file">
                         Budget:
-            <input
+                        <input type="file" @change="gotAssignments" accept="text/*" />
-              type="file"
-              accept="text/*"
-              @change="gotAssignments"
-            >
                     </label>
                 </div>
 
-        <Button
+                <Button class="bg-blue-500 py-2" :disabled="filesIncomplete" @click="ynabImport">Importieren</Button>
-          class="bg-blue-500 py-2"
+            </Card>
-          :disabled="filesIncomplete"
+            <Card class="flex-col p-3">
-          @click="ynabImport"
+                <h2 class="text-lg font-bold">Export as YNAB TSV</h2>
-        >
-          Importieren
-        </Button>
-      </RowCard>
-      <RowCard class="flex-col p-3">
-        <h2 class="text-lg font-bold">
-          Export as YNAB TSV
-        </h2>
 
                 <div class="flex flex-row">
-          <Button
+                    <Button class="bg-blue-500 py-2" @click="ynabExport">Export</Button>
-            class="bg-blue-500 py-2"
-            @click="ynabExport"
-          >
-            Export
-          </Button>
                 </div>
-      </RowCard>
+            </Card>
         </div>
     </div>
 </template>

web/src/pages/WelcomePage.vue

@@ -1,24 +0,0 @@
-<script lang="ts" setup>
-</script>
-
-<template>
-  <div>
-    <div
-      id="content"
-      class="font-bold"
-    >
-      Willkommen bei Budgeteer, der neuen App für's Budget!
-    </div>
-    <div
-      id="login"
-      class="container col-md-4"
-    >
-      <router-link to="/login">
-        Login
-      </router-link> or
-      <router-link to="/login">
-        register
-      </router-link>
-    </div>
-  </div>
-</template>

web/src/pinia-logger.ts

@@ -1,9 +1,4 @@
-import {
+import { PiniaPluginContext, StoreGeneric, _ActionsTree, _StoreOnActionListenerContext } from 'pinia';
-    PiniaPluginContext,
-    StoreGeneric,
-    _ActionsTree,
-    _StoreOnActionListenerContext,
-} from "pinia";
 
 const cloneDeep = <T>(obj: T): T => {
   try {
@@ -13,9 +8,9 @@ const cloneDeep = <T>(obj: T): T => {
   }
 };
 const formatTime = (date = new Date()) => {
-    const hours = date.getHours().toString().padStart(2, "0");
+  const hours = date.getHours().toString().padStart(2, '0');
-    const minutes = date.getMinutes().toString().padStart(2, "0");
+  const minutes = date.getMinutes().toString().padStart(2, '0');
-    const seconds = date.getSeconds().toString().padStart(2, "0");
+  const seconds = date.getSeconds().toString().padStart(2, '0');
 
   return `${hours}:${minutes}:${seconds}`;
 };
@@ -23,16 +18,12 @@ const formatTime = (date = new Date()) => {
 export interface PiniaLoggerOptions {
   disabled?: boolean;
   expanded?: boolean;
-    showDuration?: boolean;
+  showDuration?: boolean
   showStoreName?: boolean;
   logErrors?: boolean;
 }
 
-export type PiniaActionListenerContext = _StoreOnActionListenerContext<
+export type PiniaActionListenerContext = _StoreOnActionListenerContext<StoreGeneric, string, _ActionsTree>;
-    StoreGeneric,
-    string,
-    _ActionsTree
->;
 
 const defaultOptions: PiniaLoggerOptions = {
   logErrors: true,
@@ -42,9 +33,7 @@ const defaultOptions: PiniaLoggerOptions = {
   showDuration: false,
 };
 
-export const PiniaLogger =
+export const PiniaLogger = (config = defaultOptions) => (ctx: PiniaPluginContext) => {
-    (config = defaultOptions) =>
-    (ctx: PiniaPluginContext) => {
   const options = {
     ...defaultOptions,
     ...config,
@@ -52,43 +41,28 @@ export const PiniaLogger =
 
   if (options.disabled) return;
 
+
   ctx.store.$onAction((action: PiniaActionListenerContext) => {
     const startTime = Date.now();
     const prevState = cloneDeep(ctx.store.$state);
 
     const log = (isError?: boolean, error?: any) => {
       const endTime = Date.now();
-                const duration = endTime - startTime + "ms";
+      const duration = endTime - startTime + 'ms';
       const nextState = cloneDeep(ctx.store.$state);
       const storeName = action.store.$id;
-                const title = `${formatTime()} action 🍍 ${
+      const title = `${formatTime()} action 🍍 ${options.showStoreName ? `[${storeName}] ` : ''}${action.name} ${isError ? `failed after ` : ''}in ${duration}`;
-                    options.showStoreName ? `[${storeName}] ` : ""
-                }${action.name} ${
-                    isError ? `failed after ` : ""
-                }in ${duration}`;
 
-                console[options.expanded ? "group" : "groupCollapsed"](
+      console[options.expanded ? 'group' : 'groupCollapsed'](`%c${title}`, `font-weight: bold; ${isError ? 'color: #ed4981;' : ''}`);
-                    `%c${title}`,
+      console.log('%cprev state', 'font-weight: bold; color: grey;', prevState);
-                    `font-weight: bold; ${isError ? "color: #ed4981;" : ""}`
+      console.log('%caction', 'font-weight: bold; color: #69B7FF;', {
-                );
-                console.log(
-                    "%cprev state",
-                    "font-weight: bold; color: grey;",
-                    prevState
-                );
-                console.log("%caction", "font-weight: bold; color: #69B7FF;", {
         type: action.name,
-                    args:
+        args: action.args.length > 0 ? { ...action.args } : undefined,
-                        action.args.length > 0 ? { ...action.args } : undefined,
         ...(options.showStoreName && { store: action.store.$id }),
         ...(options.showDuration && { duration }),
         ...(isError && { error }),
       });
-                console.log(
+      console.log('%cnext state', 'font-weight: bold; color: #4caf50;', nextState);
-                    "%cnext state",
-                    "font-weight: bold; color: #4caf50;",
-                    nextState
-                );
       console.groupEnd();
     };
 

web/src/router/index.ts

@@ -1,75 +1,29 @@
-import {
+import { createRouter, createWebHistory, RouteLocationNormalized } from 'vue-router'
-    createRouter,
+import Dashboard from '../pages/Dashboard.vue';
-    createWebHistory,
+import Login from '../pages/Login.vue';
-    RouteLocationNormalized,
+import Index from '../pages/Index.vue';
-} from "vue-router";
+import Register from '../pages/Register.vue';
-import Account from "@/pages/Account.vue";
+import Account from '@/pages/Account.vue';
-import Budgeting from "../pages/Budgeting.vue";
+import Settings from '../pages/Settings.vue';
-import BudgetSidebar from "../pages/BudgetSidebar.vue";
+import Budgeting from '../pages/Budgeting.vue';
-import Dashboard from "../pages/Dashboard.vue";
+import BudgetSidebar from '../pages/BudgetSidebar.vue';
-import Login from "../pages/Login.vue";
-import Register from "../pages/Register.vue";
-import Settings from "../pages/Settings.vue";
-import WelcomePage from "../pages/WelcomePage.vue";
 
 const routes = [
-    { path: "/", name: "Index", component: WelcomePage },
+  { path: "/", name: "Index", component: Index },
-    {
+  { path: "/dashboard", name: "Dashboard", component: Dashboard },
-        path: "/dashboard",
+  { path: "/login", name: "Login", component: Login },
-        name: "Dashboard",
+  { path: "/register", name: "Register", component: Register },
-        component: Dashboard,
+  { path: "/budget/:budgetid/budgeting", name: "Budget", redirect: (to : RouteLocationNormalized) => 
-        meta: { requiresAuth: true },
+    '/budget/' + to.params.budgetid + '/budgeting/' + new Date().getFullYear() + '/' + new Date().getMonth() 
   },
-    {
+  { path: "/budget/:budgetid/budgeting/:year/:month", name: "Budget with date", components: { default: Budgeting, sidebar: BudgetSidebar }, props: true },
-        path: "/login",
+  { path: "/budget/:budgetid/Settings", name: "Budget Settings", components: { default: Settings, sidebar: BudgetSidebar }, props: true },
-        name: "Login",
+  { path: "/budget/:budgetid/account/:accountid", name: "Account", components: { default: Account, sidebar: BudgetSidebar }, props: true },
-        component: Login,
+]
-        meta: { hideForAuth: true },
-    },
-    {
-        path: "/register",
-        name: "Register",
-        component: Register,
-        meta: { hideForAuth: true },
-    },
-    {
-        path: "/budget/:budgetid/budgeting",
-        name: "Budget",
-        redirect: (to: RouteLocationNormalized) =>
-            "/budget/" +
-            to.params.budgetid +
-            "/budgeting/" +
-            new Date().getFullYear() +
-            "/" +
-            new Date().getMonth(),
-        meta: { requiresAuth: true },
-    },
-    {
-        path: "/budget/:budgetid/budgeting/:year/:month",
-        name: "Budget with date",
-        components: { default: Budgeting, sidebar: BudgetSidebar },
-        props: true,
-        meta: { requiresAuth: true },
-    },
-    {
-        path: "/budget/:budgetid/Settings",
-        name: "Budget Settings",
-        components: { default: Settings, sidebar: BudgetSidebar },
-        props: true,
-        meta: { requiresAuth: true },
-    },
-    {
-        path: "/budget/:budgetid/account/:accountid",
-        name: "Account",
-        components: { default: Account, sidebar: BudgetSidebar },
-        props: true,
-        meta: { requiresAuth: true },
-    },
-];
 
 const router = createRouter({
   history: createWebHistory(),
   routes,
-});
+})
 
-export default router;
+export default router

web/src/stores/budget-account.ts

@@ -1,41 +1,36 @@
-import { defineStore } from "pinia";
+import { defineStore } from "pinia"
 import { GET, POST } from "../api";
 import { useBudgetsStore } from "./budget";
 import { useSessionStore } from "./session";
 import { useTransactionsStore } from "./transactions";
 
 interface State {
-    Accounts: Map<string, Account>;
+    Accounts: Map<string, Account>
-    CurrentAccountID: string | null;
+    CurrentAccountID: string | null
-    Categories: Map<string, Category>;
+    Categories: Map<string, Category>
-    Months: Map<number, Map<number, Map<string, Category>>>;
+    Months: Map<number, Map<number, Map<string, Category>>>
-    Assignments: [];
+    Assignments: []
 }
 
 export interface Account {
-    ID: string;
+    ID: string
-    Name: string;
+    Name: string
-    OnBudget: boolean;
+    OnBudget: boolean
-    IsOpen: boolean;
+    ClearedBalance: number
-    ClearedBalance: number;
+    WorkingBalance: number
-    WorkingBalance: number;
+    ReconciledBalance: number
-    ReconciledBalance: number;
+    Transactions: string[]
-    Transactions: string[];
+    LastReconciled: Date
-    LastReconciled: NullDate;
-}
-
-interface NullDate {
-    Valid: boolean;
-    Time: Date;
 }
 
 export interface Category {
-    ID: string;
+    ID: string
-    Group: string;
+    Group: string
-    Name: string;
+    Name: string
-    AvailableLastMonth: number;
+    AvailableLastMonth: number
-    Assigned: number;
+    Assigned: number
-    Activity: number;
+    Activity: number
+    Available: number
 }
 
 export const useAccountStore = defineStore("budget/account", {
@@ -53,33 +48,7 @@ export const useAccountStore = defineStore("budget/account", {
         AllCategoriesForMonth: (state) => (year: number, month: number) => {
             const yearMap = state.Months.get(year);
             const monthMap = yearMap?.get(month);
-            return [...(monthMap?.values() || [])];
+            return [...monthMap?.values() || []];
-        },
-        GetCategoryAvailable(state) {
-            return (category: Category): number => {
-                return (
-                    category.AvailableLastMonth +
-                    Number(category.Assigned) +
-                    category.Activity
-                );
-            };
-        },
-        GetIncomeCategoryID(state) {
-            const budget = useBudgetsStore();
-            return budget.CurrentBudget?.IncomeCategoryID;
-        },
-        GetIncomeAvailable(state) {
-            return (year: number, month: number) => {
-                const IncomeCategoryID = this.GetIncomeCategoryID;
-                if (IncomeCategoryID == null) return 0;
-
-                const categories = this.AllCategoriesForMonth(year, month);
-                const category = categories.filter(
-                    (x) => x.ID == IncomeCategoryID
-                )[0];
-                if (category == null) return 0;
-                return category.AvailableLastMonth;
-            };
         },
         CategoryGroupsForMonth(state) {
             return (year: number, month: number) => {
@@ -87,137 +56,82 @@ export const useAccountStore = defineStore("budget/account", {
                 const categoryGroups = [];
                 let prev = undefined;
                 for (const category of categories) {
-                    if (category.ID == this.GetIncomeCategoryID) continue;
+                    if (category.Group != prev)
-
-                    if (prev == undefined || category.Group != prev.Name) {
-                        prev = {
-                            Name: category.Group,
-                            Available: this.GetCategoryAvailable(category),
-                            AvailableLastMonth: category.AvailableLastMonth,
-                            Activity: category.Activity,
-                            Assigned: category.Assigned,
-                        };
                         categoryGroups.push({
-                            ...prev,
+                            Name: category.Group,
-                            Expand: prev.Name != "Hidden Categories",
+                            Expand: category.Group != "Hidden Categories",
                         });
-                    } else {
+                    prev = category.Group;
-                        categoryGroups[categoryGroups.length - 1].Available +=
-                            this.GetCategoryAvailable(category);
-                        categoryGroups[
-                            categoryGroups.length - 1
-                        ].AvailableLastMonth += category.AvailableLastMonth;
-                        categoryGroups[categoryGroups.length - 1].Activity +=
-                            category.Activity;
-                        categoryGroups[categoryGroups.length - 1].Assigned +=
-                            category.Assigned;
-                        continue;
-                    }
                 }
                 return categoryGroups;
-            };
+            }
         },
         CategoriesForMonthAndGroup(state) {
             return (year: number, month: number, group: string) => {
                 const categories = this.AllCategoriesForMonth(year, month);
-                return categories.filter((x) => x.Group == group);
+                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;
+            if (state.CurrentAccountID == null)
+                return undefined;
 
             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(
+            return this.OnBudgetAccounts.reduce((prev, curr) => prev + Number(curr.ClearedBalance), 0);
-                (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(
+            return this.OffBudgetAccounts.reduce((prev, curr) => prev + Number(curr.ClearedBalance), 0);
-                (prev, curr) => prev + Number(curr.ClearedBalance),
-                0
-            );
         },
     },
     actions: {
         async SetCurrentAccount(budgetid: string, accountid: string) {
-            if (budgetid == null) return;
+            if (budgetid == null)
+                return;
 
             this.CurrentAccountID = accountid;
 
-            if (accountid == null) return;
+            if (accountid == null)
+                return;
             const account = this.GetAccount(accountid)!;
             useSessionStore().setTitle(account.Name);
             await this.FetchAccount(account);
         },
         async FetchAccount(account: Account) {
-            const result = await GET(
+            const result = await GET("/account/" + account.ID + "/transactions");
-                "/account/" + account.ID + "/transactions"
-            );
             const response = await result.json();
-            const transactionsStore = useTransactionsStore();
+            const transactionsStore = useTransactionsStore()
-            const transactions = transactionsStore.AddTransactions(
+            const transactions = transactionsStore.AddTransactions(response.Transactions);
-                response.Transactions
-            );
             account.Transactions = transactions;
         },
         async FetchMonthBudget(budgetid: string, year: number, month: number) {
-            const result = await GET(
+            const result = await GET("/budget/" + budgetid + "/" + year + "/" + (month+1));
-                "/budget/" + budgetid + "/" + year + "/" + (month + 1)
-            );
             const response = await result.json();
-            if (
+            if (response.Categories == undefined || response.Categories.length <= 0)
-                response.Categories == undefined ||
-                response.Categories.length <= 0
-            )
                 return;
             this.addCategoriesForMonth(year, month, response.Categories);
         },
-        async EditAccount(
+        async EditAccount(accountid: string, name: string, onBudget: boolean) {
-            accountid: string,
+            const result = await POST("/account/" + accountid, JSON.stringify({ name: name, onBudget: onBudget }));
-            name: string,
-            onBudget: boolean,
-            isOpen: boolean
-        ) {
-            const result = await POST(
-                "/account/" + accountid,
-                JSON.stringify({
-                    name: name,
-                    onBudget: onBudget,
-                    isOpen: isOpen,
-                })
-            );
             const response = await result.json();
             useBudgetsStore().MergeBudgetingData(response);
-
-            if (!isOpen) {
-                this.Accounts.delete(accountid);
-            }
         },
-        addCategoriesForMonth(
+        addCategoriesForMonth(year: number, month: number, categories: Category[]): void {
-            year: number,
-            month: number,
-            categories: Category[]
-        ): void {
             this.$patch((state) => {
-                const yearMap =
+                const yearMap = state.Months.get(year) || new Map<number, Map<string, Category>>();
-                    state.Months.get(year) ||
+                const monthMap = yearMap.get(month) || new Map<string, Category>();
-                    new Map<number, Map<string, Category>>();
-                const monthMap =
-                    yearMap.get(month) || new Map<string, Category>();
                 for (const category of categories) {
                     monthMap.set(category.ID, category);
                 }
@@ -227,7 +141,8 @@ export const useAccountStore = defineStore("budget/account", {
             });
         },
         logout() {
-            this.$reset();
+            this.$reset()
         },
-    },
+    }
-});
+
+})

web/src/stores/budget.ts

@@ -4,16 +4,17 @@ import { useAccountStore } from "./budget-account";
 import { Budget, useSessionStore } from "./session";
 
 interface State {
-    CurrentBudgetID: string | null;
+    CurrentBudgetID: string | null,
 }
 
-export const useBudgetsStore = defineStore("budget", {
+export const useBudgetsStore = defineStore('budget', {
     state: (): State => ({
         CurrentBudgetID: null,
     }),
     getters: {
         CurrentBudget(): Budget | undefined {
-            if (this.CurrentBudgetID == null) return undefined;
+            if (this.CurrentBudgetID == null)
+                return undefined;
 
             const sessionStore = useSessionStore();
             return sessionStore.Budgets.get(this.CurrentBudgetID);
@@ -26,7 +27,7 @@ export const useBudgetsStore = defineStore("budget", {
         ImportYNAB(formData: FormData) {
             return POST(
                 "/budget/" + this.CurrentBudgetID + "/import/ynab",
-                formData
+                formData,
             );
         },
         async NewBudget(budgetName: string): Promise<void> {
@@ -42,7 +43,8 @@ export const useBudgetsStore = defineStore("budget", {
         async SetCurrentBudget(budgetid: string): Promise<void> {
             this.CurrentBudgetID = budgetid;
 
-            if (budgetid == null) return;
+            if (budgetid == null)
+                return
 
             await this.FetchBudget(budgetid);
         },
@@ -56,15 +58,12 @@ export const useBudgetsStore = defineStore("budget", {
             for (const account of response.Accounts || []) {
                 const existingAccount = accounts.Accounts.get(account.ID);
                 account.Transactions = existingAccount?.Transactions ?? [];
-                if (account.LastReconciled.Valid)
+                account.LastReconciled = new Date(account.LastReconciled);
-                    account.LastReconciled.Time = new Date(
-                        account.LastReconciled.Time
-                    );
                 accounts.Accounts.set(account.ID, account);
             }
             for (const category of response.Categories || []) {
                 accounts.Categories.set(category.ID, category);
             }
         },
-    },
+    }
-});
+})

web/src/stores/session.ts

@@ -1,41 +1,31 @@
-import { StorageSerializers, useStorage } from "@vueuse/core";
+import { StorageSerializers, useStorage } from '@vueuse/core';
-import { defineStore } from "pinia";
+import { defineStore } from 'pinia'
-import { POST } from "../api";
+import { POST } from '../api';
 
 interface State {
-    Session: Session | null;
+    Session: Session | null
-    Budgets: Map<string, Budget>;
+    Budgets: Map<string, Budget>,
 }
 
 interface Session {
-    Token: string;
+    Token: string
-    User: string;
+    User: string
 }
 
 export interface Budget {
-    ID: string;
+    ID: string
-    Name: string;
+    Name: string
-    AvailableBalance: number;
+    AvailableBalance: number
-    IncomeCategoryID: string;
 }
 
-export const useSessionStore = defineStore("session", {
+export const useSessionStore = defineStore('session', {
     state: () => ({
-        Session: useStorage<Session | null>("session", null, undefined, {
+        Session: useStorage<Session | null>('session', null, undefined, { serializer: StorageSerializers.object }),
-            serializer: StorageSerializers.object,
+        Budgets: useStorage<Map<string, Budget>>('budgets', new Map<string, Budget>(), undefined, { serializer: StorageSerializers.map }),
-        }),
-        Budgets: useStorage<Map<string, Budget>>(
-            "budgets",
-            new Map<string, Budget>(),
-            undefined,
-            { serializer: StorageSerializers.map }
-        ),
     }),
     getters: {
         BudgetsList: (state) => [ ...state.Budgets.values() ],
-        AuthHeaders: (state) => ({
+        AuthHeaders: (state) => ({'Authorization': 'Bearer ' + state.Session?.Token}),
-            Authorization: "Bearer " + state.Session?.Token,
-        }),
         LoggedIn: (state) => state.Session != null,
     },
     actions: {
@@ -46,7 +36,7 @@ export const useSessionStore = defineStore("session", {
             this.Session = {
                 User: x.User,
                 Token: x.Token,
-            };
+            }
             for (const budget of x.Budgets) {
                 this.Budgets.set(budget.ID, budget);
             }
@@ -58,10 +48,7 @@ export const useSessionStore = defineStore("session", {
             return result;
         },
         async register(login : any) {
-            const response = await POST(
+            const response = await POST("/user/register", JSON.stringify(login));
-                "/user/register",
-                JSON.stringify(login)
-            );
             const result = await response.json();
             this.loginSuccess(result);
             return result;
@@ -70,5 +57,5 @@ export const useSessionStore = defineStore("session", {
             this.Session = null;
             this.Budgets.clear();
         },
-    },
+    }
-});
+})

web/src/stores/settings.ts

@@ -2,17 +2,17 @@ import { useStorage } from "@vueuse/core";
 import { defineStore } from "pinia";
 
 interface State {
-    Menu: MenuSettings;
+    Menu: MenuSettings
 }
 
 interface MenuSettings {
-    Show: boolean | null;
+    Show: boolean | null,
-    Expand: boolean | null;
+    Expand: boolean | null,
 }
 
-export const useSettingsStore = defineStore("settings", {
+export const useSettingsStore = defineStore('settings', {
     state: () => ({
-        Menu: useStorage<MenuSettings>("settings", {
+        Menu: useStorage<MenuSettings>('settings', {
             Show: null,
             Expand: false,
         }),
@@ -24,5 +24,5 @@ export const useSettingsStore = defineStore("settings", {
         toggleMenuSize() {
             this.Menu.Expand = !this.Menu.Expand;
         },
-    },
+    }
 });

web/src/stores/transactions.ts

@@ -1,26 +1,26 @@
-import { defineStore } from "pinia";
+import { defineStore } from "pinia"
 import { POST } from "../api";
 import { useAccountStore } from "./budget-account";
 
 interface State {
-    Transactions: Map<string, Transaction>;
+    Transactions: Map<string, Transaction>
-    Reconciling: boolean;
+    Reconciling: boolean
 }
 
 export interface Transaction {
-    ID: string;
+    ID: string
-    Date: Date;
+    Date: Date
-    TransferAccount: string;
+    TransferAccount: string
-    CategoryGroup: string;
+    CategoryGroup: string
-    Category: string;
+    Category: string
-    CategoryID: string | undefined;
+    CategoryID: string | undefined
-    Memo: string;
+    Memo: string
-    Status: string;
+    Status: string
-    GroupID: string;
+    GroupID: string
-    Payee: string;
+    Payee: string
-    PayeeID: string | undefined;
+    PayeeID: string | undefined
-    Amount: number;
+    Amount: number
-    Reconciled: boolean;
+    Reconciled: boolean
 }
 
 export const useTransactionsStore = defineStore("budget/transactions", {
@@ -30,9 +30,8 @@ export const useTransactionsStore = defineStore("budget/transactions", {
     }),
     getters: {
         ReconcilingBalance(state): number {
-            const accountsStore = useAccountStore();
+            const accountsStore = useAccountStore()
-            let reconciledBalance =
+            let reconciledBalance = accountsStore.CurrentAccount!.ReconciledBalance;
-                accountsStore.CurrentAccount!.ReconciledBalance;
             for (const transaction of this.TransactionsList) {
                 if (transaction.Reconciled)
                     reconciledBalance += transaction.Amount;
@@ -40,9 +39,9 @@ export const useTransactionsStore = defineStore("budget/transactions", {
             return reconciledBalance;
         },
         TransactionsList(state): Transaction[] {
-            const accountsStore = useAccountStore();
+                const accountsStore = useAccountStore()
-            return accountsStore.CurrentAccount!.Transactions.map((x) => {
+            return accountsStore.CurrentAccount!.Transactions.map(x => {
-                return this.Transactions.get(x)!;
+                return this.Transactions.get(x)!
             });
         },
     },
@@ -60,30 +59,25 @@ export const useTransactionsStore = defineStore("budget/transactions", {
         },
         SetReconciledForAllTransactions(value: boolean) {
             for (const transaction of this.TransactionsList) {
-                if (transaction.Status == "Reconciled") continue;
+                if (transaction.Status == "Reconciled")
+                    continue;
 
                 transaction.Reconciled = value;
             }
         },
         async SubmitReconcilation(reconciliationTransactionAmount: number) {
-            const accountsStore = useAccountStore();
+                const accountsStore = useAccountStore()
             const account = accountsStore.CurrentAccount!;
-            const reconciledTransactions = this.TransactionsList.filter(
+            const reconciledTransactions = this.TransactionsList.filter(x => x.Reconciled);
-                (x) => x.Reconciled
-            );
             for (const transaction of reconciledTransactions) {
                 account.ReconciledBalance += transaction.Amount;
                 transaction.Status = "Reconciled";
                 transaction.Reconciled = false;
             }
-            const result = await POST(
+            const result = await POST("/account/" + accountsStore.CurrentAccountID + "/reconcile", JSON.stringify({
-                "/account/" + accountsStore.CurrentAccountID + "/reconcile",
+                transactionIDs: reconciledTransactions.map(x => x.ID),
-                JSON.stringify({
+                reconciliationTransactionAmount: reconciliationTransactionAmount.toString(),
-                    transactionIDs: reconciledTransactions.map((x) => x.ID),
+            }));
-                    reconciliationTransactionAmount:
-                        reconciliationTransactionAmount.toString(),
-                })
-            );
             const response = await result.json();
             const recTrans = response.ReconciliationTransaction;
             if (recTrans) {
@@ -92,19 +86,20 @@ export const useTransactionsStore = defineStore("budget/transactions", {
             }
         },
         logout() {
-            this.$reset();
+            this.$reset()
         },
         async saveTransaction(payload: string) {
-            const accountsStore = useAccountStore();
+                const accountsStore = useAccountStore()
             const result = await POST("/transaction/new", payload);
-            const response = (await result.json()) as Transaction;
+            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;
+            const response = await result.json() as Transaction;
             this.AddTransactions([response]);
-        },
+        }
-    },
+    }
-});
+
+})

web/tailwind.config.js

@@ -1,7 +1,10 @@
 module.exports = {
-    content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
+  content: [
+    "./index.html",
+    "./src/**/*.{vue,js,ts,jsx,tsx}"
+  ],
   theme: {
     extend: {},
   },
   plugins: [],
-};
+}

web/vite.config.js

@@ -1,7 +1,7 @@
-import { defineConfig } from "vite";
+import { defineConfig } from 'vite'
-import vue from "@vitejs/plugin-vue";
+import vue from '@vitejs/plugin-vue'
 
-import path from "path";
+import path from 'path'
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -9,21 +9,21 @@ export default defineConfig({
     vue(),
     // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
   ],
-    define: { "process.env": {} },
+  define: { 'process.env': {} },
   resolve: {
     alias: {
-            "@": path.resolve(__dirname, "src"),
+      '@': path.resolve(__dirname, 'src'),
     },
   },
   server: {                                      
-        host: "0.0.0.0",
+    host: '0.0.0.0',                             
     proxy: {                                     
-            "/api": {
+      '/api': {                                  
-                target: "http://10.0.0.162:1323/",
+        target: 'http://10.0.0.162:1323/',       
-                changeOrigin: true,
+        changeOrigin: true                        
-            },
+      }                                          
-        },
+    }                                            
-    },
+  }                                              
   /* remove the need to specify .vue files https://vitejs.dev/config/#resolve-extensions
   resolve: {
     extensions: [
@@ -37,4 +37,4 @@ export default defineConfig({
     ]
   },
   */
-});
+})

web/yarn.lock

@@ -957,21 +957,6 @@
   resolved "https://registry.yarnpkg.com/@emmetio/scanner/-/scanner-1.0.0.tgz#065b2af6233fe7474d44823e3deb89724af42b5f"
   integrity sha512-8HqW8EVqjnCmWXVpqAOZf+EGESdkR27odcMMMGefgKXtar00SoYNSryGv//TELI4T3QFsECo78p+0lmalk/CFA==
 
-"@eslint/eslintrc@^1.2.0":
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-1.2.0.tgz#7ce1547a5c46dfe56e1e45c3c9ed18038c721c6a"
-  integrity sha512-igm9SjJHNEJRiUnecP/1R5T3wKLEJ7pL6e2P+GUSfCd0dGjPYYZve08uzw8L2J8foVHFz+NGu12JxRcU2gGo6w==
-  dependencies:
-    ajv "^6.12.4"
-    debug "^4.3.2"
-    espree "^9.3.1"
-    globals "^13.9.0"
-    ignore "^4.0.6"
-    import-fresh "^3.2.1"
-    js-yaml "^4.1.0"
-    minimatch "^3.0.4"
-    strip-json-comments "^3.1.1"
-
 "@hapi/address@2.x.x":
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5"
@@ -1016,20 +1001,6 @@
   dependencies:
     "@hapi/hoek" "^9.0.0"
 
-"@humanwhocodes/config-array@^0.9.2":
-  version "0.9.5"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.5.tgz#2cbaf9a89460da24b5ca6531b8bbfc23e1df50c7"
-  integrity sha512-ObyMyWxZiCu/yTisA7uzx81s40xR2fD5Cg/2Kq7G02ajkNubJf6BopgDTmDyc3U7sXpNKM8cYOw7s7Tyr+DnCw==
-  dependencies:
-    "@humanwhocodes/object-schema" "^1.2.1"
-    debug "^4.1.1"
-    minimatch "^3.0.4"
-
-"@humanwhocodes/object-schema@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
-  integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
-
 "@jridgewell/resolve-uri@^3.0.3":
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.0.4.tgz#b876e3feefb9c8d3aa84014da28b5e52a0640d72"
@@ -1310,50 +1281,6 @@
   dependencies:
     "@types/node" "*"
 
-"@typescript-eslint/parser@^5.13.0":
-  version "5.13.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.13.0.tgz#0394ed8f2f849273c0bf4b811994d177112ced5c"
-  integrity sha512-GdrU4GvBE29tm2RqWOM0P5QfCtgCyN4hXICj/X9ibKED16136l9ZpoJvCL5pSKtmJzA+NRDzQ312wWMejCVVfg==
-  dependencies:
-    "@typescript-eslint/scope-manager" "5.13.0"
-    "@typescript-eslint/types" "5.13.0"
-    "@typescript-eslint/typescript-estree" "5.13.0"
-    debug "^4.3.2"
-
-"@typescript-eslint/scope-manager@5.13.0":
-  version "5.13.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.13.0.tgz#cf6aff61ca497cb19f0397eea8444a58f46156b6"
-  integrity sha512-T4N8UvKYDSfVYdmJq7g2IPJYCRzwtp74KyDZytkR4OL3NRupvswvmJQJ4CX5tDSurW2cvCc1Ia1qM7d0jpa7IA==
-  dependencies:
-    "@typescript-eslint/types" "5.13.0"
-    "@typescript-eslint/visitor-keys" "5.13.0"
-
-"@typescript-eslint/types@5.13.0":
-  version "5.13.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.13.0.tgz#da1de4ae905b1b9ff682cab0bed6b2e3be9c04e5"
-  integrity sha512-LmE/KO6DUy0nFY/OoQU0XelnmDt+V8lPQhh8MOVa7Y5k2gGRd6U9Kp3wAjhB4OHg57tUO0nOnwYQhRRyEAyOyg==
-
-"@typescript-eslint/typescript-estree@5.13.0":
-  version "5.13.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.13.0.tgz#b37c07b748ff030a3e93d87c842714e020b78141"
-  integrity sha512-Q9cQow0DeLjnp5DuEDjLZ6JIkwGx3oYZe+BfcNuw/POhtpcxMTy18Icl6BJqTSd+3ftsrfuVb7mNHRZf7xiaNA==
-  dependencies:
-    "@typescript-eslint/types" "5.13.0"
-    "@typescript-eslint/visitor-keys" "5.13.0"
-    debug "^4.3.2"
-    globby "^11.0.4"
-    is-glob "^4.0.3"
-    semver "^7.3.5"
-    tsutils "^3.21.0"
-
-"@typescript-eslint/visitor-keys@5.13.0":
-  version "5.13.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.13.0.tgz#f45ff55bcce16403b221ac9240fbeeae4764f0fd"
-  integrity sha512-HLKEAS/qA1V7d9EzcpLFykTePmOQqOFim8oCvhY3pZgQ8Hi38hYpHd9e5GN6nQBFQNecNhws5wkS9Y5XIO0s/g==
-  dependencies:
-    "@typescript-eslint/types" "5.13.0"
-    eslint-visitor-keys "^3.0.0"
-
 "@vitejs/plugin-vue@^2.0.0":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-2.1.0.tgz#ddf5e0059f84f2ff649afc25ce5a59211e670542"
@@ -2162,11 +2089,6 @@ acorn-import-assertions@^1.7.6:
   resolved "https://registry.yarnpkg.com/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz#ba2b5939ce62c238db6d93d81c9b111b29b855e9"
   integrity sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==
 
-acorn-jsx@^5.3.1:
-  version "5.3.2"
-  resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
-  integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
-
 acorn-node@^1.6.1:
   version "1.8.2"
   resolved "https://registry.yarnpkg.com/acorn-node/-/acorn-node-1.8.2.tgz#114c95d64539e53dede23de8b9d96df7c7ae2af8"
@@ -2196,7 +2118,7 @@ acorn@^7.0.0, acorn@^7.1.1:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
   integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
 
-acorn@^8.0.4, acorn@^8.0.5, acorn@^8.4.1, acorn@^8.7.0:
+acorn@^8.0.4, acorn@^8.0.5, acorn@^8.4.1:
   version "8.7.0"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.7.0.tgz#90951fde0f8f09df93549481e5fc141445b791cf"
   integrity sha512-V/LGr1APy+PXIwKebEWrkZPwoeoF+w1jiOBUmuxuiUIaOHtob8Qc9BTrYo7VuI5fR8tqsy+buA2WFooR5olqvQ==
@@ -2238,7 +2160,7 @@ ajv-keywords@^5.0.0:
   dependencies:
     fast-deep-equal "^3.1.3"
 
-ajv@^6.1.0, ajv@^6.10.0, ajv@^6.10.2, ajv@^6.12.2, ajv@^6.12.3, ajv@^6.12.4, ajv@^6.12.5:
+ajv@^6.1.0, ajv@^6.10.2, ajv@^6.12.2, ajv@^6.12.3, ajv@^6.12.4, ajv@^6.12.5:
   version "6.12.6"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
   integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==
@@ -2355,11 +2277,6 @@ argparse@^1.0.7:
   dependencies:
     sprintf-js "~1.0.2"
 
-argparse@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
-  integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
-
 arr-diff@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
@@ -3434,7 +3351,7 @@ cross-spawn@^6.0.0:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
-cross-spawn@^7.0.2, cross-spawn@^7.0.3:
+cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
   integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
@@ -3611,7 +3528,7 @@ debug@^3.1.1:
   dependencies:
     ms "^2.1.1"
 
-debug@^4.1.0, debug@^4.1.1, debug@^4.3.2:
+debug@^4.1.0, debug@^4.1.1:
   version "4.3.3"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.3.tgz#04266e0b70a98d4462e6e288e38259213332b664"
   integrity sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==
@@ -3635,11 +3552,6 @@ deep-equal@^1.0.1:
     object-keys "^1.1.1"
     regexp.prototype.flags "^1.2.0"
 
-deep-is@^0.1.3:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831"
-  integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==
-
 deepmerge@^1.5.2:
   version "1.5.2"
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-1.5.2.tgz#10499d868844cdad4fee0842df8c7f6f0c95a753"
@@ -3812,13 +3724,6 @@ dns-txt@^2.0.2:
   dependencies:
     buffer-indexof "^1.0.0"
 
-doctrine@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
-  integrity sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==
-  dependencies:
-    esutils "^2.0.2"
-
 doctypes@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/doctypes/-/doctypes-1.1.0.tgz#ea80b106a87538774e8a3a4a5afe293de489e0a9"
@@ -4141,21 +4046,6 @@ escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
   integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=
 
-escape-string-regexp@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
-  integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
-
-eslint-plugin-vue@^8.5.0:
-  version "8.5.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-8.5.0.tgz#65832bba43ca713fa5da16bdfcf55d0095677f6f"
-  integrity sha512-i1uHCTAKOoEj12RDvdtONWrGzjFm/djkzqfhmQ0d6M/W8KM81mhswd/z+iTZ0jCpdUedW3YRgcVfQ37/J4zoYQ==
-  dependencies:
-    eslint-utils "^3.0.0"
-    natural-compare "^1.4.0"
-    semver "^7.3.5"
-    vue-eslint-parser "^8.0.1"
-
 eslint-scope@5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c"
@@ -4172,93 +4062,11 @@ eslint-scope@^4.0.3:
     esrecurse "^4.1.0"
     estraverse "^4.1.1"
 
-eslint-scope@^7.0.0, eslint-scope@^7.1.1:
-  version "7.1.1"
-  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-7.1.1.tgz#fff34894c2f65e5226d3041ac480b4513a163642"
-  integrity sha512-QKQM/UXpIiHcLqJ5AOyIW7XZmzjkzQXYE54n1++wb0u9V/abW3l9uQnxX8Z5Xd18xyKIMTUAyQ0k1e8pz6LUrw==
-  dependencies:
-    esrecurse "^4.3.0"
-    estraverse "^5.2.0"
-
-eslint-utils@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672"
-  integrity sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==
-  dependencies:
-    eslint-visitor-keys "^2.0.0"
-
-eslint-visitor-keys@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303"
-  integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==
-
-eslint-visitor-keys@^3.0.0, eslint-visitor-keys@^3.1.0, eslint-visitor-keys@^3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.3.0.tgz#f6480fa6b1f30efe2d1968aa8ac745b862469826"
-  integrity sha512-mQ+suqKJVyeuwGYHAdjMFqjCyfl8+Ldnxuyp3ldiMBFKkvytrXUZWaiPCEav8qDHKty44bD+qV1IP4T+w+xXRA==
-
-eslint@^8.10.0:
-  version "8.10.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.10.0.tgz#931be395eb60f900c01658b278e05b6dae47199d"
-  integrity sha512-tcI1D9lfVec+R4LE1mNDnzoJ/f71Kl/9Cv4nG47jOueCMBrCCKYXr4AUVS7go6mWYGFD4+EoN6+eXSrEbRzXVw==
-  dependencies:
-    "@eslint/eslintrc" "^1.2.0"
-    "@humanwhocodes/config-array" "^0.9.2"
-    ajv "^6.10.0"
-    chalk "^4.0.0"
-    cross-spawn "^7.0.2"
-    debug "^4.3.2"
-    doctrine "^3.0.0"
-    escape-string-regexp "^4.0.0"
-    eslint-scope "^7.1.1"
-    eslint-utils "^3.0.0"
-    eslint-visitor-keys "^3.3.0"
-    espree "^9.3.1"
-    esquery "^1.4.0"
-    esutils "^2.0.2"
-    fast-deep-equal "^3.1.3"
-    file-entry-cache "^6.0.1"
-    functional-red-black-tree "^1.0.1"
-    glob-parent "^6.0.1"
-    globals "^13.6.0"
-    ignore "^5.2.0"
-    import-fresh "^3.0.0"
-    imurmurhash "^0.1.4"
-    is-glob "^4.0.0"
-    js-yaml "^4.1.0"
-    json-stable-stringify-without-jsonify "^1.0.1"
-    levn "^0.4.1"
-    lodash.merge "^4.6.2"
-    minimatch "^3.0.4"
-    natural-compare "^1.4.0"
-    optionator "^0.9.1"
-    regexpp "^3.2.0"
-    strip-ansi "^6.0.1"
-    strip-json-comments "^3.1.0"
-    text-table "^0.2.0"
-    v8-compile-cache "^2.0.3"
-
-espree@^9.0.0, espree@^9.3.1:
-  version "9.3.1"
-  resolved "https://registry.yarnpkg.com/espree/-/espree-9.3.1.tgz#8793b4bc27ea4c778c19908e0719e7b8f4115bcd"
-  integrity sha512-bvdyLmJMfwkV3NCRl5ZhJf22zBFo1y8bYh3VYb+bfzqNB4Je68P2sSuXyuFquzWLebHpNd2/d5uv7yoP9ISnGQ==
-  dependencies:
-    acorn "^8.7.0"
-    acorn-jsx "^5.3.1"
-    eslint-visitor-keys "^3.3.0"
-
 esprima@^4.0.0:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
   integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
 
-esquery@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.4.0.tgz#2148ffc38b82e8c7057dfed48425b3e61f0f24a5"
-  integrity sha512-cCDispWt5vHHtwMY2YrAQ4ibFkAL8RbH5YGBnZBc90MolvvfkkQcJro/aZiAQUlQ3qgrYS6D6v8Gc5G5CQsc9w==
-  dependencies:
-    estraverse "^5.1.0"
-
 esrecurse@^4.1.0, esrecurse@^4.3.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/esrecurse/-/esrecurse-4.3.0.tgz#7ad7964d679abb28bee72cec63758b1c5d2c9921"
@@ -4271,7 +4079,7 @@ estraverse@^4.1.1:
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d"
   integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==
 
-estraverse@^5.1.0, estraverse@^5.2.0:
+estraverse@^5.2.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.3.0.tgz#2eea5290702f26ab8fe5370370ff86c965d21123"
   integrity sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==
@@ -4481,11 +4289,6 @@ fast-json-stable-stringify@^2.0.0:
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
   integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
 
-fast-levenshtein@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
-  integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
-
 fastq@^1.6.0:
   version "1.13.0"
   resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.13.0.tgz#616760f88a7526bdfc596b7cab8c18938c36b98c"
@@ -4512,13 +4315,6 @@ figures@^2.0.0:
   dependencies:
     escape-string-regexp "^1.0.5"
 
-file-entry-cache@^6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"
-  integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==
-  dependencies:
-    flat-cache "^3.0.4"
-
 file-saver@^2.0.5:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/file-saver/-/file-saver-2.0.5.tgz#d61cfe2ce059f414d899e9dd6d4107ee25670c38"
@@ -4592,19 +4388,6 @@ find-up@^4.0.0, find-up@^4.1.0:
     locate-path "^5.0.0"
     path-exists "^4.0.0"
 
-flat-cache@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11"
-  integrity sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg==
-  dependencies:
-    flatted "^3.1.0"
-    rimraf "^3.0.2"
-
-flatted@^3.1.0:
-  version "3.2.5"
-  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.5.tgz#76c8584f4fc843db64702a6bd04ab7a8bd666da3"
-  integrity sha512-WIWGi2L3DyTUvUrwRKgGi9TwxQMUEqPOPQBVi71R96jZXJdFskXEmf54BoZaS1kknGODoIGASGEzBUYdyMCBJg==
-
 flush-write-stream@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.1.1.tgz#8dd7d873a1babc207d94ead0c2e0e44276ebf2e8"
@@ -4746,11 +4529,6 @@ function-bind@^1.1.1:
   resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
   integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
 
-functional-red-black-tree@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz#1b0ab3bd553b2a0d6399d29c0e3ea0b252078327"
-  integrity sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc=
-
 gensync@^1.0.0-beta.2:
   version "1.0.0-beta.2"
   resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.2.tgz#32a6ee76c3d7f52d46b2b1ae5d93fea8580a25e0"
@@ -4848,14 +4626,7 @@ globals@^11.1.0:
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
   integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==
 
-globals@^13.6.0, globals@^13.9.0:
+globby@^11.0.1, globby@^11.0.2, globby@^11.0.3:
-  version "13.12.1"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-13.12.1.tgz#ec206be932e6c77236677127577aa8e50bf1c5cb"
-  integrity sha512-317dFlgY2pdJZ9rspXDks7073GpDmXdfbM3vYYp0HAMKGDh1FfWPleI2ljVNLQX5M5lXcAslTcPTrOrMEFOjyw==
-  dependencies:
-    type-fest "^0.20.2"
-
-globby@^11.0.1, globby@^11.0.2, globby@^11.0.3, globby@^11.0.4:
   version "11.1.0"
   resolved "https://registry.yarnpkg.com/globby/-/globby-11.1.0.tgz#bd4be98bb042f83d796f7e3811991fbe82a0d34b"
   integrity sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==
@@ -5190,7 +4961,7 @@ iferr@^0.1.5:
   resolved "https://registry.yarnpkg.com/iferr/-/iferr-0.1.5.tgz#c60eed69e6d8fdb6b3104a1fcbca1c192dc5b501"
   integrity sha1-xg7taebY/bazEEofy8ocGS3FtQE=
 
-ignore@^4.0.3, ignore@^4.0.6:
+ignore@^4.0.3:
   version "4.0.6"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
   integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
@@ -5205,7 +4976,7 @@ immutable@^4.0.0:
   resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.0.0.tgz#b86f78de6adef3608395efb269a91462797e2c23"
   integrity sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==
 
-import-fresh@^3.0.0, import-fresh@^3.1.0, import-fresh@^3.2.1:
+import-fresh@^3.1.0, import-fresh@^3.2.1:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
   integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==
@@ -5602,13 +5373,6 @@ js-yaml@^3.13.1:
     argparse "^1.0.7"
     esprima "^4.0.0"
 
-js-yaml@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-4.1.0.tgz#c1fb65f8f5017901cdd2c951864ba18458a10602"
-  integrity sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==
-  dependencies:
-    argparse "^2.0.1"
-
 jsbn@~0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
@@ -5649,11 +5413,6 @@ json-schema@0.4.0:
   resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.4.0.tgz#f7de4cf6efab838ebaeb3236474cbba5a1930ab5"
   integrity sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA==
 
-json-stable-stringify-without-jsonify@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
-  integrity sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=
-
 json-stringify-safe@~5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
@@ -5754,14 +5513,6 @@ launch-editor@^2.2.1, launch-editor@^2.3.0:
     picocolors "^1.0.0"
     shell-quote "^1.6.1"
 
-levn@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade"
-  integrity sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==
-  dependencies:
-    prelude-ls "^1.2.1"
-    type-check "~0.4.0"
-
 lilconfig@^2.0.3, lilconfig@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.0.4.tgz#f4507d043d7058b380b6a8f5cb7bcd4b34cee082"
@@ -5840,11 +5591,6 @@ lodash.memoize@^4.1.2:
   resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
   integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
 
-lodash.merge@^4.6.2:
-  version "4.6.2"
-  resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
-  integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
-
 lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
@@ -6233,11 +5979,6 @@ nanomatch@^1.2.9:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
-natural-compare@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
-  integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=
-
 negotiator@0.6.3:
   version "0.6.3"
   resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.3.tgz#58e323a72fedc0d6f9cd4d31fe49f51479590ccd"
@@ -6494,18 +6235,6 @@ opener@^1.5.2:
   resolved "https://registry.yarnpkg.com/opener/-/opener-1.5.2.tgz#5d37e1f35077b9dcac4301372271afdeb2a13598"
   integrity sha512-ur5UIdyw5Y7yEj9wLzhqXiy6GZ3Mwx0yGI+5sMn2r0N0v3cKJvUmFH5yPP+WXh9e0xfyzyJX95D8l088DNFj7A==
 
-optionator@^0.9.1:
-  version "0.9.1"
-  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.1.tgz#4f236a6373dae0566a6d43e1326674f50c291499"
-  integrity sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==
-  dependencies:
-    deep-is "^0.1.3"
-    fast-levenshtein "^2.0.6"
-    levn "^0.4.1"
-    prelude-ls "^1.2.1"
-    type-check "^0.4.0"
-    word-wrap "^1.2.3"
-
 ora@^3.4.0:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/ora/-/ora-3.4.0.tgz#bf0752491059a3ef3ed4c85097531de9fdbcd318"
@@ -7088,12 +6817,7 @@ postcss@^8.1.10, postcss@^8.2.15, postcss@^8.2.6, postcss@^8.3.5, postcss@^8.4.5
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
-prelude-ls@^1.2.1:
+"prettier@^1.18.2 || ^2.0.0":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
-  integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
-
-prettier@2.5.1, "prettier@^1.18.2 || ^2.0.0":
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.5.1.tgz#fff75fa9d519c54cf0fce328c1017d94546bc56a"
   integrity sha512-vBZcPRUR5MZJwoyi3ZoyQlc1rXeEck8KgeC9AwwOn+exuxLxq5toTRDTSaVrXHxelDMHy9zlicw8u66yxoSUFg==
@@ -7472,11 +7196,6 @@ regexp.prototype.flags@^1.2.0:
     call-bind "^1.0.2"
     define-properties "^1.1.3"
 
-regexpp@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2"
-  integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==
-
 regexpu-core@^5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.0.1.tgz#c531122a7840de743dcf9c83e923b5560323ced3"
@@ -8256,11 +7975,6 @@ strip-indent@^2.0.0:
   resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-2.0.0.tgz#5ef8db295d01e6ed6cbf7aab96998d7822527b68"
   integrity sha1-XvjbKV0B5u1sv3qrlpmNeCJSe2g=
 
-strip-json-comments@^3.1.0, strip-json-comments@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
-  integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
-
 stylehacks@^5.0.2:
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-5.0.2.tgz#fa10e5181c6e8dc0bddb4a3fb372e9ac42bba2ad"
@@ -8398,11 +8112,6 @@ terser@^5.10.0, terser@^5.7.2:
     source-map "~0.7.2"
     source-map-support "~0.5.20"
 
-text-table@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
-  integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=
-
 thenify-all@^1.0.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/thenify-all/-/thenify-all-1.6.0.tgz#1a1918d402d8fc3f98fbf234db0bcc8cc10e9726"
@@ -8579,13 +8288,6 @@ tsutils@^2.29.0:
   dependencies:
     tslib "^1.8.1"
 
-tsutils@^3.21.0:
-  version "3.21.0"
-  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623"
-  integrity sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==
-  dependencies:
-    tslib "^1.8.1"
-
 tty-browserify@0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
@@ -8603,18 +8305,6 @@ tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
   integrity sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=
 
-type-check@^0.4.0, type-check@~0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1"
-  integrity sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==
-  dependencies:
-    prelude-ls "^1.2.1"
-
-type-fest@^0.20.2:
-  version "0.20.2"
-  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
-  integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
-
 type-fest@^0.6.0:
   version "0.6.0"
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.6.0.tgz#8d2a2370d3df886eb5c90ada1c5bf6188acf838b"
@@ -8782,11 +8472,6 @@ uuid@^8.3.2:
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
   integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==
 
-v8-compile-cache@^2.0.3:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"
-  integrity sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==
-
 validate-npm-package-license@^3.0.1:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a"
@@ -8959,19 +8644,6 @@ vue-demi@*:
   resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.12.1.tgz#f7e18efbecffd11ab069d1472d7a06e319b4174c"
   integrity sha512-QL3ny+wX8c6Xm1/EZylbgzdoDolye+VpCXRhI2hug9dJTP3OUJ3lmiKN3CsVV3mOJKwFi0nsstbgob0vG7aoIw==
 
-vue-eslint-parser@^8.0.1:
-  version "8.3.0"
-  resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz#5d31129a1b3dd89c0069ca0a1c88f970c360bd0d"
-  integrity sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==
-  dependencies:
-    debug "^4.3.2"
-    eslint-scope "^7.0.0"
-    eslint-visitor-keys "^3.1.0"
-    espree "^9.0.0"
-    esquery "^1.4.0"
-    lodash "^4.17.21"
-    semver "^7.3.5"
-
 vue-hot-reload-api@^2.3.0:
   version "2.3.4"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2"
@@ -9281,11 +8953,6 @@ with@^7.0.0:
     assert-never "^1.2.1"
     babel-walk "3.0.0-canary-5"
 
-word-wrap@^1.2.3:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c"
-  integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==
-
 worker-farm@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/worker-farm/-/worker-farm-1.7.0.tgz#26a94c5391bbca926152002f69b84a4bf772e5a8"