From f56a3fa1b64c96cfa98643286d7411757a9135a9 Mon Sep 17 00:00:00 2001
From: Cioraneanu Mihai <cioraneanumihai@gmail.com>
Date: Tue, 17 Dec 2024 16:03:27 +0200
Subject: [PATCH] - add user defined substring, which when present in assistant
 automatically adds your todo tag (ex. "electricit 22 !!") - created new
 settings page for assistant configs

---
 front/assets/styles/theme-dark.css            |  4 ++
 front/assets/styles/theme.css                 |  2 +-
 .../transaction/transaction-assistant.vue     | 22 +++++---
 front/constants/RouteConstants.js             |  1 +
 front/constants/TablerIconConstants.js        |  2 +
 front/pages/settings/assistant.vue            | 52 +++++++++++++++++++
 front/pages/settings/formatting.vue           |  2 +-
 front/pages/settings/index.vue                |  1 +
 front/pages/transactions/[[id]].vue           |  7 ++-
 front/plugins/register-tabler-icons.js        |  4 +-
 front/stores/profileStore.js                  |  2 +
 11 files changed, 87 insertions(+), 12 deletions(-)
 create mode 100644 front/pages/settings/assistant.vue

diff --git a/front/assets/styles/theme-dark.css b/front/assets/styles/theme-dark.css
index e6613da..f7db4ca 100644
--- a/front/assets/styles/theme-dark.css
+++ b/front/assets/styles/theme-dark.css
@@ -366,4 +366,8 @@
 
 .van-theme-dark .split-transaction-badge {
   background: #B71C1C;
+}
+
+.van-theme-dark .assistant-tag {
+  box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.65);
 }
\ No newline at end of file
diff --git a/front/assets/styles/theme.css b/front/assets/styles/theme.css
index 9774c87..f018f8f 100644
--- a/front/assets/styles/theme.css
+++ b/front/assets/styles/theme.css
@@ -725,7 +725,7 @@ body {
 
 .assistant-tag {
     padding: 10px;
-    box-shadow: 0 4px 15px 0 rgba(45, 54, 65, 0.75);
+    box-shadow: 0 2px 6px 0px rgba(45, 54, 65, 0.45);
     display: flex;
     align-items: center;
     gap: 5px;
diff --git a/front/components/transaction/transaction-assistant.vue b/front/components/transaction/transaction-assistant.vue
index 72f278a..85311e8 100644
--- a/front/components/transaction/transaction-assistant.vue
+++ b/front/components/transaction/transaction-assistant.vue
@@ -42,7 +42,6 @@
 
           <template v-if="foundTag">
             <van-tag round class="assistant-tag" size="medium" type="primary">
-              <!--              <app-icon :icon="TablerIconConstants.tag" color="#fff" class="" :size="15"/>-->
               <span>Tag</span>
               <span>|</span>
               {{ Tag.getDisplayNameEllipsized(foundTag) }}
@@ -51,7 +50,6 @@
 
           <template v-if="foundCategory">
             <van-tag round class="assistant-tag" size="medium" type="primary">
-              <!--              <app-icon :icon="TablerIconConstants.category" color="#fff" class="mr-5" :size="15"/>-->
               <span>Category:</span>
               <span>|</span>
               {{ Category.getDisplayName(foundCategory) }}
@@ -74,7 +72,12 @@
             </van-tag>
           </template>
 
-          <!--          <div class="flex-1" />-->
+          <template v-if="isTodo">
+            <div class="assistant-tag tag-todo">
+              <span>Todo</span>
+            </div>
+          </template>
+
         </div>
       </template>
     </div>
@@ -112,6 +115,7 @@ const foundTag = ref(null)
 const foundTemplate = ref(null)
 const foundAmount = ref(null)
 const foundDescription = ref(null)
+const isTodo = ref(false)
 
 const hasAmount = computed(() => {
   return foundAmount.value && foundAmount.value > 0
@@ -179,12 +183,16 @@ const processAssistantText = () => {
 
   text = RomanianLanguageUtils.fixBadWordNumbers(text)
   text = text.replace(',', '.')
-  // let words = text.split(' ')
+
+  isTodo.value = profileStore.assistantTodoTagMatcher && text.endsWith(profileStore.assistantTodoTagMatcher)
+  text = isTodo.value ? text.slice(0, text.length - profileStore.assistantTodoTagMatcher.length) : text
 
   // 3 groups: <template> <amount> <description>
   const regex = /^(\D+)?(?:\s*(\d[\.\d\s\+\-\*\/]*))?(?:\s+(.*))?$/
   const match = text.match(regex)
 
+  console.log('text', { text, match })
+
   let searchWords = match[1] || ''
   searchWords = LanguageUtils.removeAccents(searchWords).trim()
 
@@ -192,7 +200,6 @@ const processAssistantText = () => {
   let { wasSuccessful, value } = evalMath(numerical)
   foundAmount.value = numerical && wasSuccessful ? value : null
 
-
   foundDescription.value = match[3] || ''
 
   const fuseTemplateResults = fuseTransactionTemplate.search(searchWords)
@@ -265,13 +272,14 @@ const onShow = () => {
   show.value = true
 }
 
-watch([foundTemplate, foundTag, foundCategory, foundAmount, foundDescription], ([newTemplate, newTag, newCategory, newAmount, foundDescription]) => {
+watch([foundTemplate, foundTag, foundCategory, foundAmount, foundDescription, isTodo], ([newTemplate, newTag, newCategory, newAmount, newDescription, newIsTodo]) => {
   emit('change', {
     transactionTemplate: newTemplate,
     amount: newAmount,
     tag: newTag,
     category: newCategory,
-    description: foundDescription,
+    description: newDescription,
+    isTodo: newIsTodo,
   })
 
   // If you selected a template and didn't write anything => write the text
diff --git a/front/constants/RouteConstants.js b/front/constants/RouteConstants.js
index 26ae186..b06073f 100644
--- a/front/constants/RouteConstants.js
+++ b/front/constants/RouteConstants.js
@@ -10,6 +10,7 @@ export default {
   ROUTE_SETTINGS: '/settings',
   ROUTE_SETTINGS_SETUP: '/settings/setup',
   ROUTE_SETTINGS_UI: '/settings/ui',
+  ROUTE_SETTINGS_ASSISTANT: '/settings/assistant',
   ROUTE_SETTINGS_FORMATTING: '/settings/formatting',
   ROUTE_SETTINGS_DASHBOARD: '/settings/dashboard',
   ROUTE_SETTINGS_DASHBOARD_CARDS_ORDER: '/settings/dashboard/cards',
diff --git a/front/constants/TablerIconConstants.js b/front/constants/TablerIconConstants.js
index 2573d19..e70c566 100644
--- a/front/constants/TablerIconConstants.js
+++ b/front/constants/TablerIconConstants.js
@@ -14,6 +14,8 @@ export const icons = {
   transactionTemplate: 'IconTemplate',
   dashboard: 'IconDeviceDesktopAnalytics',
   exchangeRates: 'IconReplace',
+  assistant: 'IconMessageChatbot',
+
 
   settingsAppConfig: 'IconTool',
   settingsUserPreferences: 'IconMoodCog',
diff --git a/front/pages/settings/assistant.vue b/front/pages/settings/assistant.vue
new file mode 100644
index 0000000..90c5c32
--- /dev/null
+++ b/front/pages/settings/assistant.vue
@@ -0,0 +1,52 @@
+<template>
+  <div class="app-form">
+    <app-top-toolbar />
+
+    <van-form @submit="onSave" class="">
+      <van-cell-group inset>
+        <div class="van-cell-group-title">General:</div>
+
+        <app-field left-icon="link-o" v-model="assistantTodoTagMatcher" label="Trailing substring to auto add the todo tag" :rules="[{ required: true, message: 'This field is required' }]" required />
+      </van-cell-group>
+
+      <app-button-form-save />
+    </van-form>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useProfileStore } from '~/stores/profileStore'
+import { useDataStore } from '~/stores/dataStore'
+import UIUtils from '~/utils/UIUtils'
+import { useToolbar } from '~/composables/useToolbar'
+import RouteConstants from '~/constants/RouteConstants'
+import { NUMBER_FORMAT } from '~/utils/MathUtils.js'
+import TablerIconConstants from '~/constants/TablerIconConstants.js'
+import { saveSettingsToStore, watchSettingsStore } from '~/utils/SettingUtils.js'
+
+const profileStore = useProfileStore()
+const dataStore = useDataStore()
+
+const assistantTodoTagMatcher = ref('')
+
+const syncedSettings = [{ store: profileStore, path: 'assistantTodoTagMatcher', ref: assistantTodoTagMatcher }]
+
+watchSettingsStore(syncedSettings)
+
+const onSave = async () => {
+  saveSettingsToStore(syncedSettings)
+  await profileStore.writeProfile()
+  UIUtils.showToastSuccess('Settings saved')
+}
+
+const toolbar = useToolbar()
+toolbar.init({
+  title: 'Assistant settings',
+  backRoute: RouteConstants.ROUTE_SETTINGS,
+})
+
+onMounted(() => {
+  animateSettings()
+})
+</script>
diff --git a/front/pages/settings/formatting.vue b/front/pages/settings/formatting.vue
index c85422b..197bb43 100644
--- a/front/pages/settings/formatting.vue
+++ b/front/pages/settings/formatting.vue
@@ -106,7 +106,7 @@ watchSettingsStore(syncedSettings)
 const onSave = async () => {
   saveSettingsToStore(syncedSettings)
   await profileStore.writeProfile()
-  UIUtils.showToastSuccess('Formatting')
+  UIUtils.showToastSuccess('Settings saved')
 }
 
 const toolbar = useToolbar()
diff --git a/front/pages/settings/index.vue b/front/pages/settings/index.vue
index a311684..6fe5186 100644
--- a/front/pages/settings/index.vue
+++ b/front/pages/settings/index.vue
@@ -5,6 +5,7 @@
     <van-cell-group inset style="overflow: auto">
       <app-field-link label="Setup" :icon="TablerIconConstants.settings" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_SETUP)" />
       <app-field-link label="User interface" :icon="TablerIconConstants.settingsUI" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_UI)" />
+      <app-field-link label="Assistant" :icon="TablerIconConstants.assistant" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_ASSISTANT)" />
       <app-field-link label="Formatting" :icon="TablerIconConstants.settingsUserPreferences" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_FORMATTING)" />
       <app-field-link label="Dashboard" :icon="TablerIconConstants.dashboard" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_DASHBOARD)" />
       <app-field-link label="Transactions" :icon="TablerIconConstants.transaction" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_TRANSACTION)" />
diff --git a/front/pages/transactions/[[id]].vue b/front/pages/transactions/[[id]].vue
index af70655..32caaf3 100644
--- a/front/pages/transactions/[[id]].vue
+++ b/front/pages/transactions/[[id]].vue
@@ -294,12 +294,15 @@ const resetFormFields = () => {
   description.value = ''
 }
 
-const onAssistant = async ({ tag: newTag, category: newCategory, transactionTemplate: transactionTemplate, amount: newAmount, description: newDescription }) => {
+const onAssistant = async ({ tag: newTag, category: newCategory, transactionTemplate: transactionTemplate, amount: newAmount, description: newDescription, isTodo: newIsTodo }) => {
   resetFormFields()
 
   if (newTag) {
     tags.value = Tag.getTagWithParents(newTag)
-    // tags.value = [newTag]
+  }
+
+  if (newIsTodo && dataStore.tagTodo) {
+    tags.value = [...tags.value, dataStore.tagTodo]
   }
 
   if (newCategory) {
diff --git a/front/plugins/register-tabler-icons.js b/front/plugins/register-tabler-icons.js
index 053ccb0..5932a1f 100644
--- a/front/plugins/register-tabler-icons.js
+++ b/front/plugins/register-tabler-icons.js
@@ -53,7 +53,8 @@ import {
   IconMoneybag,
   IconBasket,
   IconCopy,
-  IconLock
+  IconLock,
+  IconMessageChatbot
 } from '@tabler/icons-vue'
 
 export default defineNuxtPlugin((nuxtApp) => {
@@ -111,6 +112,7 @@ export default defineNuxtPlugin((nuxtApp) => {
   nuxtApp.vueApp.component('IconBasket', IconBasket)
   nuxtApp.vueApp.component('IconCopy', IconCopy)
   nuxtApp.vueApp.component('IconLock', IconLock)
+  nuxtApp.vueApp.component('IconMessageChatbot', IconMessageChatbot)
 
   // for (let iconName in tablerIcons) {
   //   nuxtApp.vueApp.component(iconName, tablerIcons[iconName])
diff --git a/front/stores/profileStore.js b/front/stores/profileStore.js
index a79a367..f70aeb5 100644
--- a/front/stores/profileStore.js
+++ b/front/stores/profileStore.js
@@ -24,6 +24,8 @@ export const useProfileStore = defineStore('profile', {
       darkTheme: useLocalStorage('darkTheme', false),
       startingPage: useLocalStorage('startingPage', Page.types.transactionNew),
 
+      assistantTodoTagMatcher: useLocalStorage('assistantTodoTagMatcher', '!!'),
+
       defaultAccountSource: useLocalStorage('defaultAccountSource', null, { serializer: StorageSerializers.object }),
       defaultAccountDestination: useLocalStorage('defaultAccountDestination', null, { serializer: StorageSerializers.object }),
       defaultCategory: useLocalStorage('defaultCategory', null, { serializer: StorageSerializers.object }),