Develop

.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
+  "[vue]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
+}

.yarnrc.yml

@@ -3,4 +3,6 @@ approvedGitRepositories:
 
 nodeLinker: node-modules
 
+npmMinimalAgeGate: 14
+
 yarnPath: .yarn/releases/yarn-4.17.1.cjs

frontend/App.vue

@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { ref } from "vue"
-import ControlBlock from "./organisms/ControlBlock.vue"
-import SchedulesBlock from "./organisms/SchedulesBlock.vue"
-import RolesBlock from "./organisms/RolesBlock.vue"
-import CategoryBlock from "./organisms/CategoryBlock.vue"
-import AboutBlock from "./organisms/AboutBlock.vue"
-import NotifiersBlock from "./organisms/NotifiersBlock.vue"
 import { Config } from "../src/endpoints/config.ts"
+import AboutBlock from "./organisms/AboutBlock.vue"
+import CategoryBlock from "./organisms/CategoryBlock.vue"
+import ControlBlock from "./organisms/ControlBlock.vue"
 import CurrentAccountsBlock from "./organisms/CurrentAccountsBlock.vue"
+import NotifiersBlock from "./organisms/NotifiersBlock.vue"
+import RolesBlock from "./organisms/RolesBlock.vue"
+import SchedulesBlock from "./organisms/SchedulesBlock.vue"
 import UserLocaleBlock from "./organisms/UserLocaleBlock.vue"
 
 const config = ref<Config | undefined>()

frontend/atoms/ActionButton.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, ref } from "vue"
-import { Method } from "../types/method"
 import { activeBg, disabledBg, loadingBg } from "../types/btnBg"
+import { Method } from "../types/method"
 
 const {
   method = Method.POST,

frontend/molecules/CronInput.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, watch } from "vue"
+import { computed } from "vue"
 import ActionButton from "../atoms/ActionButton.vue"
 
 const props = defineProps<{

frontend/organisms/AboutBlock.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import BlockContainer from "../molecules/BlockContainer.vue"
-import LabeledValue from "../atoms/LabeledValue.vue"
 import { About } from "../../src/endpoints/config.ts"
+import LabeledValue from "../atoms/LabeledValue.vue"
+import BlockContainer from "../molecules/BlockContainer.vue"
 
 const props = defineProps<{ about?: About }>()
 </script>

frontend/organisms/CategoryBlock.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
+import { BudgetRead } from "@billos/firefly-iii-sdk"
+import { Config } from "../../src/endpoints/config.ts"
+import ActionButton from "../atoms/ActionButton.vue"
 import BlockContainer from "../molecules/BlockContainer.vue"
 import ButtonList from "../molecules/ButtonList.vue"
-import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
 import { blueishBg, greyBg } from "../types/btnBg.ts"
-import { BudgetRead } from "@billos/firefly-iii-sdk"
-import { Config } from "../../src/endpoints/config.ts"
+import { Method } from "../types/method.ts"
 
 const props = defineProps<{
   config?: Config

frontend/organisms/ControlBlock.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import BlockContainer from "../molecules/BlockContainer.vue"
-import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
 import { Config } from "../../src/endpoints/config.ts"
+import ActionButton from "../atoms/ActionButton.vue"
+import BlockContainer from "../molecules/BlockContainer.vue"
 import ButtonList from "../molecules/ButtonList.vue"
+import { Method } from "../types/method.ts"
 
 const props = defineProps<{
   config?: Config

frontend/organisms/CurrentAccountsBlock.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
+import { AccountRead } from "@billos/firefly-iii-sdk"
+import { Config } from "../../src/endpoints/config.ts"
+import ActionButton from "../atoms/ActionButton.vue"
 import BlockContainer from "../molecules/BlockContainer.vue"
 import ButtonList from "../molecules/ButtonList.vue"
-import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
 import { blueishBg, greyBg } from "../types/btnBg.ts"
-import { AccountRead } from "@billos/firefly-iii-sdk"
-import { Config } from "../../src/endpoints/config.ts"
+import { Method } from "../types/method.ts"
 
 const props = defineProps<{
   config?: Config

frontend/organisms/GotifyBlock.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
-import BlockContainer from "../molecules/BlockContainer.vue"
-import TextInput from "../molecules/TextInput.vue"
 import { Config } from "../../src/endpoints/config.ts"
+import TextInput from "../molecules/TextInput.vue"
 
 const props = defineProps<{
   config?: Config

frontend/organisms/NotifiersBlock.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import BlockContainer from "../molecules/BlockContainer.vue"
 import { Config } from "../../src/endpoints/config.ts"
 import { Notifiers } from "../../src/modules/notifiers/types.ts"
 import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
+import BlockContainer from "../molecules/BlockContainer.vue"
 import { blueishBg, greyBg } from "../types/btnBg.ts"
+import { Method } from "../types/method.ts"
 import GotifyBlock from "./GotifyBlock.vue"
 
 const props = defineProps<{

frontend/organisms/RolesBlock.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import BlockContainer from "../molecules/BlockContainer.vue"
-import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
-import { blueishBg, greyBg } from "../types/btnBg.ts"
 import { BudgetRead } from "@billos/firefly-iii-sdk"
 import { Config } from "../../src/endpoints/config.ts"
+import ActionButton from "../atoms/ActionButton.vue"
+import BlockContainer from "../molecules/BlockContainer.vue"
 import ButtonList from "../molecules/ButtonList.vue"
+import { blueishBg, greyBg } from "../types/btnBg.ts"
+import { Method } from "../types/method.ts"
 
 const props = defineProps<{
   config?: Config

frontend/organisms/SchedulesBlock.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
+import { BudgetRead } from "@billos/firefly-iii-sdk"
+import { Config } from "../../src/endpoints/config.ts"
+import ActionButton from "../atoms/ActionButton.vue"
 import BlockContainer from "../molecules/BlockContainer.vue"
-import CronInput from "../molecules/CronInput.vue"
 import ButtonList from "../molecules/ButtonList.vue"
-import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
+import CronInput from "../molecules/CronInput.vue"
 import { greyBg } from "../types/btnBg.ts"
-import { BudgetRead } from "@billos/firefly-iii-sdk"
-import { Config } from "../../src/endpoints/config.ts"
+import { Method } from "../types/method.ts"
 
 const props = defineProps<{
   config?: Config

frontend/organisms/UserLocaleBlock.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
+import { Config } from "../../src/endpoints/config.ts"
+import ActionButton from "../atoms/ActionButton.vue"
 import BlockContainer from "../molecules/BlockContainer.vue"
 import ButtonList from "../molecules/ButtonList.vue"
-import ActionButton from "../atoms/ActionButton.vue"
-import { Method } from "../types/method.ts"
 import { blueishBg, greyBg } from "../types/btnBg.ts"
-import { Config } from "../../src/endpoints/config.ts"
+import { Method } from "../types/method.ts"
 
 const props = defineProps<{
   config?: Config

locales/en.json

@@ -57,5 +57,6 @@
   "notif_title_budget_sumup": "Budgets Sum Up",
   "notif_title_unbudgeted_transaction": "Unbudgeted Transaction",
   "notif_title_uncategorized_transaction": "Uncategorized Transaction",
-  "precolon": ""
+  "precolon": "",
+  "days_left": "Days left"
 }

locales/fr-FR.json

@@ -57,5 +57,6 @@
   "notif_title_budget_sumup": "Résumé des budgets",
   "notif_title_unbudgeted_transaction": "Transaction sans budget",
   "notif_title_uncategorized_transaction": "Transaction sans catégorie",
-  "precolon": " "
+  "precolon": " ",
+  "days_left": "Jours restants"
 }

package.json

@@ -65,7 +65,8 @@
     "vite": "^8.1.3",
     "vitest": "^4.1.10",
     "vue": "^3.5.39",
-    "vue-i18n": "11.4.6"
+    "vue-i18n": "11.4.6",
+    "vue-tsc": "^3.3.7"
   },
   "packageManager": "yarn@4.17.1"
 }

src/queues/jobs/budgetSumUp.ts

@@ -2,7 +2,7 @@ import { AccountsService, BudgetsService } from "@billos/firefly-iii-sdk"
 
 import { client } from "../../client"
 import DynamicConfig, { AConfig, VConfig } from "../../modules/config/dynamic"
-import { getEndOfCurrentMonth, getStartOfCurrentMonth } from "../../utils/date"
+import { getEndOfCurrentMonth, getStartOfCurrentMonth, getTodayDate } from "../../utils/date"
 import { TemplateName } from "../../utils/renderTemplate"
 import { BudgetSumUpData } from "../../utils/types/budgetSumUp"
 import { SimpleJob } from "./BaseJob"
@@ -69,6 +69,13 @@ export class BudgetSumUpJob extends SimpleJob {
     const accountBalance = currentAccount.data.attributes.current_balance || "0"
     const accountCurrency = currentAccount.data.attributes.currency_symbol || "€"
 
-    await this.sendUniqueNotification(TemplateName.BudgetSumUp, { insights, accountBalance, accountCurrency })
+    await this.sendUniqueNotification(TemplateName.BudgetSumUp, {
+      insights,
+      accountBalance,
+      accountCurrency,
+      remainingDays,
+      startDay: getTodayDate(),
+      endDay: end,
+    })
   }
 }

src/utils/date.ts

@@ -10,6 +10,12 @@ export function getStartOfCurrentMonth(): string {
   return start.toPlainDate().toString()
 }
 
+export function getTodayDate(): string {
+  const now = Temporal.Now.zonedDateTimeISO(env.timezone)
+  const today = now.startOfDay()
+  return today.toPlainDate().toString()
+}
+
 export function getEndOfCurrentMonth(): string {
   const now = Temporal.Now.zonedDateTimeISO(env.timezone)
   const end = now.with({ day: now.daysInMonth }).with({ hour: 23, minute: 59, second: 59, millisecond: 999 })

src/utils/renderTemplate.ts

@@ -44,6 +44,9 @@ export type BudgetSumUpContext = {
   insights: BudgetSumUpData[]
   accountBalance: string
   accountCurrency: string
+  remainingDays: number
+  startDay: string
+  endDay: string
 }
 
 export type UnbudgetedTransactionContext = {

templates/notifications/budget-sumup.njk

@@ -1,3 +1,5 @@
+{{ "days_left" | i18n }}{{ "precolon" | i18n }}: {{ remainingDays }} ({{ startDay }} -> {{ endDay }})
+
 | {{ "notif_name" | i18n }} | {{ "notif_limit" | i18n }} | {{ "notif_spent" | i18n }} | {{ "notif_left" | i18n }} |
 |-----|-------|-------|----------|
 {% for budget in insights %}