From 01fb8b22e68a573f5f86ab9b0c5af14aecaf9a75 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Wed, 4 Feb 2026 16:04:25 -0500
Subject: [PATCH 01/44] feat(timesheet): add backend and frontend logic to
 display paid time off

---
 .../components/shift-list-weekly-overview.vue | 16 +++++++++++----
 .../timesheets/services/timesheet-service.ts  | 11 ++++++++++
 src/stores/timesheet-store.ts                 | 20 +++++++++++++++++--
 3 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/src/modules/timesheets/components/shift-list-weekly-overview.vue b/src/modules/timesheets/components/shift-list-weekly-overview.vue
index 7ef4ca6..7693c3c 100644
--- a/src/modules/timesheets/components/shift-list-weekly-overview.vue
+++ b/src/modules/timesheets/components/shift-list-weekly-overview.vue
@@ -2,21 +2,29 @@
     setup
     lang="ts"
 >
+    import { computed, onMounted } from 'vue';
     import { useAuthStore } from 'src/stores/auth-store';
+    import { useTimesheetStore } from 'src/stores/timesheet-store';
     import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-utils';
 
-    const { mode = 'totals', timesheetMode = 'normal', totalHours = 0, vacationHours = 0, sickHours = 0, bankedHours = 0, totalExpenses = 0 } = defineProps<{
+    const { mode = 'totals', timesheetMode = 'normal', totalHours = 0, totalExpenses = 0 } = defineProps<{
         mode: 'total-hours' | 'off-hours';
         timesheetMode: 'approval' | 'normal';
         totalHours?: number;
-        vacationHours?: number;
-        sickHours?: number;
-        bankedHours?: number;
         totalExpenses?: number;
     }>();
 
     const auth_store = useAuthStore();
+    const timesheetStore = useTimesheetStore();
     const is_management = auth_store.user?.user_module_access.includes('timesheets_approval');
+
+    const vacationHours = computed(() => timesheetStore.paid_time_off_totals.vacation_hours); 
+    const sickHours = computed(() => timesheetStore.paid_time_off_totals.sick_hours); 
+    const bankedHours = computed(() => timesheetStore.paid_time_off_totals.banked_hours);
+
+    onMounted(async () => {
+        await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail();
+    })
 </script>
 
 <template>
diff --git a/src/modules/timesheets/services/timesheet-service.ts b/src/modules/timesheets/services/timesheet-service.ts
index 583f027..4a965b2 100644
--- a/src/modules/timesheets/services/timesheet-service.ts
+++ b/src/modules/timesheets/services/timesheet-service.ts
@@ -4,6 +4,7 @@ import type { TimesheetResponse } from "src/modules/timesheets/models/timesheet.
 import type { TimesheetApprovalOverview } from "src/modules/timesheet-approval/models/timesheet-overview.models";
 import type { BackendResponse } from "src/modules/shared/models/backend-response.models";
 import type { FederalHoliday } from "src/modules/timesheets/models/federal-holidays.models";
+import type { PaidTimeOff } from "src/modules/employee-list/models/employee-profile.models";
 
 export const timesheetService = {
     getAllFederalHolidays: async (year?: number): Promise<FederalHoliday[]> => {
@@ -36,6 +37,16 @@ export const timesheetService = {
         }
     },
 
+    getPaidTimeOffTotalsWithOptionalEmployeeEmail: async (email?: string): Promise<BackendResponse<PaidTimeOff>> => {
+        if (email) {
+            const response = await api.get<BackendResponse<PaidTimeOff>>(`paid-time-off/totals?email=${email}`);
+            return response.data;
+        }
+
+        const response = await api.get<BackendResponse<PaidTimeOff>>('paid-time-off/totals');
+        return response.data;
+    },
+
     applyPresetToWeek: async (timesheet_id: number, employeeEmail?: string): Promise<BackendResponse<boolean>> => {
         if (employeeEmail) {
             const response = await api.post<BackendResponse<boolean>>(`schedule-presets/apply-preset/${employeeEmail}`, { timesheet_id });
diff --git a/src/stores/timesheet-store.ts b/src/stores/timesheet-store.ts
index f6f1841..dc16499 100644
--- a/src/stores/timesheet-store.ts
+++ b/src/stores/timesheet-store.ts
@@ -1,3 +1,5 @@
+import { Notify } from 'quasar';
+import { useI18n } from 'vue-i18n';
 import { computed, ref } from 'vue';
 import { defineStore } from 'pinia';
 import { unwrapAndClone } from 'src/utils/unwrap-and-clone';
@@ -6,11 +8,10 @@ import { timesheetService } from 'src/modules/timesheets/services/timesheet-serv
 import type { PayPeriodOverviewResponse, TimesheetApprovalOverview } from "src/modules/timesheet-approval/models/timesheet-overview.models";
 import type { PayPeriod } from 'src/modules/shared/models/pay-period.models';
 import type { Timesheet } from 'src/modules/timesheets/models/timesheet.models';
+import type { PaidTimeOff } from 'src/modules/employee-list/models/employee-profile.models';
 import type { PayPeriodEvent } from 'src/modules/timesheet-approval/models/pay-period-event.models';
 import type { TimesheetApprovalCSVReportFilters } from 'src/modules/timesheet-approval/models/timesheet-approval-csv-report.models';
 import { type FederalHoliday, TARGO_HOLIDAY_NAMES_FR } from 'src/modules/timesheets/models/federal-holidays.models';
-import { Notify } from 'quasar';
-import { useI18n } from 'vue-i18n';
 
 
 export const useTimesheetStore = defineStore('timesheet', () => {
@@ -20,6 +21,7 @@ export const useTimesheetStore = defineStore('timesheet', () => {
     const timesheets = ref<Timesheet[]>([]);
     const all_current_shifts = computed(() => timesheets.value.flatMap(week => week.days.flatMap(day => day.shifts)) ?? []);
     const initial_timesheets = ref<Timesheet[]>([]);
+    const paid_time_off_totals = ref<PaidTimeOff>({ sick_hours: 0, vacation_hours: 0, banked_hours: 0 });
 
     const pay_period_overviews = ref<TimesheetApprovalOverview[]>([]);
     const pay_period_infos = ref<PayPeriodOverviewResponse>();
@@ -135,6 +137,18 @@ export const useTimesheetStore = defineStore('timesheet', () => {
         }
     };
 
+    const getPaidTimeOffTotalsWithOptionalEmployeeEmail = async (email?: string) => {
+        try {
+            const response = await timesheetService.getPaidTimeOffTotalsWithOptionalEmployeeEmail(email);
+
+            if (response.success && response.data)
+                paid_time_off_totals.value = response.data;
+
+        } catch (error) {
+            console.error('error getting paid time off totals: ', error);
+        }
+    };
+
     const toggleTimesheetsApprovalByEmployeeEmail = async (email: string, approval_status: boolean): Promise<boolean> => {
         try {
             const timesheet_ids = timesheets.value.map(timesheet => timesheet.timesheet_id);
@@ -230,6 +244,7 @@ export const useTimesheetStore = defineStore('timesheet', () => {
         all_current_shifts,
         initial_timesheets,
         federal_holidays,
+        paid_time_off_totals,
         getCurrentFederalHolidays,
         getNextOrPreviousPayPeriod,
         getPayPeriodByDateOrYearAndNumber,
@@ -241,5 +256,6 @@ export const useTimesheetStore = defineStore('timesheet', () => {
         closeReportDialog,
         subscribeToPayPeriodObservable,
         unsubscribeToPayPeriodObservable,
+        getPaidTimeOffTotalsWithOptionalEmployeeEmail,
     };
 });
\ No newline at end of file

From 041e76c9067bde1af137da4e42dea5e233f629b8 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 10:54:22 -0500
Subject: [PATCH 02/44] adding first workflow

---
 .gitea/workflows/node-ci.yaml | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)
 create mode 100644 .gitea/workflows/node-ci.yaml

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
new file mode 100644
index 0000000..070b6e3
--- /dev/null
+++ b/.gitea/workflows/node-ci.yaml
@@ -0,0 +1,18 @@
+name: Node-CI
+
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+permissions:
+  contents: read
+
+jobs:
+  test:
+    runs-on: ubuntu-24.04
+    steps:
+      - name: Gitea Checkout
+        uses: gitea.com/actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
\ No newline at end of file

From c4dc5656790db851525fbcdb71fc5dd3288869ae Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 10:57:17 -0500
Subject: [PATCH 03/44] adding README for workflows

---
 .gitea/workflows/README.md | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 .gitea/workflows/README.md

diff --git a/.gitea/workflows/README.md b/.gitea/workflows/README.md
new file mode 100644
index 0000000..adc5379
--- /dev/null
+++ b/.gitea/workflows/README.md
@@ -0,0 +1 @@
+Workflows to be compliant with CI/CD pipelines
\ No newline at end of file

From e57d90ab7336510885bf339f236558fb67190406 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 10:59:53 -0500
Subject: [PATCH 04/44] fixed issues with workflow not starting

---
 .gitea/workflows/node-ci.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 070b6e3..e131201 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -15,4 +15,4 @@ jobs:
     runs-on: ubuntu-24.04
     steps:
       - name: Gitea Checkout
-        uses: gitea.com/actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
\ No newline at end of file
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
\ No newline at end of file

From 314f7d1a8c9cc2ab308243eb3ca0665d850da128 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 11:09:39 -0500
Subject: [PATCH 05/44] adding more tests in workflow

---
 .gitea/workflows/node-ci.yaml | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index e131201..696ae20 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -15,4 +15,19 @@ jobs:
     runs-on: ubuntu-24.04
     steps:
       - name: Gitea Checkout
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
\ No newline at end of file
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Setup Node.js
+        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        with:
+          node-version: '22'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run linter
+        run: npm run lint
+
+      - name: Run tests
+        run: npm test
\ No newline at end of file

From 5e052b1d6218d05d80c782884f8885b9c35b9ce3 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 11:47:05 -0500
Subject: [PATCH 06/44] adding more tests in workflow

---
 .gitea/workflows/node-ci.yaml | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 696ae20..5df486f 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -30,4 +30,15 @@ jobs:
         run: npm run lint
 
       - name: Run tests
-        run: npm test
\ No newline at end of file
+        run: npm test
+
+  alert_on_failure:
+    needs: test
+    runs-on: ubuntu-24.04
+    #if: ${{ needs.test.result == 'failure' }}
+    steps:
+      - name: Notify Google Chat
+        if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
\ No newline at end of file

From d9783fd835fb9d0a50382e120ea8fd212013989b Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 13:02:31 -0500
Subject: [PATCH 07/44] adding Google Chat notification changes in workflow

---
 .gitea/workflows/node-ci.yaml | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 5df486f..f9a2cba 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -41,4 +41,7 @@ jobs:
         if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
         uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
         with:
-          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
\ No newline at end of file
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Google Chat GitHub Action
+          subtitle: ${{ job.status }}
\ No newline at end of file

From 017f34ade7a10b47b9e3f699eabeeffb7dad92ce Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 13:21:13 -0500
Subject: [PATCH 08/44] Optimizing Google Chat notification in workflow

---
 .gitea/workflows/node-ci.yaml | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index f9a2cba..86570f9 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -44,4 +44,6 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Google Chat GitHub Action
-          subtitle: ${{ job.status }}
\ No newline at end of file
+          subtitle: ${{ job.status }}
+          createDefaultSection: false
+          collapsibleDefaultSection: false
\ No newline at end of file

From 4b9bb6157aeac3b382020814d8f7097cc133738c Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Thu, 5 Feb 2026 13:23:43 -0500
Subject: [PATCH 09/44] fix(auth): change logout behavior, now sends success
 code when logout request is processed

---
 src/layouts/components/main-layout-left-drawer.vue        | 8 +++-----
 src/modules/auth/composables/use-auth-api.ts              | 6 ++++--
 src/modules/auth/services/services-auth.ts                | 4 ++--
 src/modules/timesheets/components/expense-dialog-form.vue | 2 ++
 src/stores/auth-store.ts                                  | 8 ++------
 5 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/src/layouts/components/main-layout-left-drawer.vue b/src/layouts/components/main-layout-left-drawer.vue
index 498d4cf..61cd63b 100644
--- a/src/layouts/components/main-layout-left-drawer.vue
+++ b/src/layouts/components/main-layout-left-drawer.vue
@@ -9,6 +9,7 @@
     import { useUiStore } from 'src/stores/ui-store';
     import { RouteNames } from 'src/router/router-constants';
     import { ModuleNames, type UserModuleAccess } from 'src/modules/shared/models/user.models';
+import { useAuthApi } from 'src/modules/auth/composables/use-auth-api';
 
     const DRAWER_BUTTONS: { i18n_key: string, icon: string, route: RouteNames, required_module?: UserModuleAccess }[] = [
         { i18n_key: 'nav_bar.home', icon: "home", route: RouteNames.DASHBOARD, required_module: ModuleNames.DASHBOARD },
@@ -21,6 +22,7 @@
 
     const q = useQuasar();
     const auth_store = useAuthStore();
+    const authApi = useAuthApi();
     const ui_store = useUiStore();
     const router = useRouter();
     const is_mini = ref(true);
@@ -34,11 +36,7 @@
     };
 
     const handleLogout = () => {
-        auth_store.logout();
-
-        router.push({ name: 'login' }).catch(err => {
-            console.error('could not log you out: ', err);
-        })
+        authApi.logout();
     };
 
     onMounted(() => {
diff --git a/src/modules/auth/composables/use-auth-api.ts b/src/modules/auth/composables/use-auth-api.ts
index 531c3a5..1cea1e2 100644
--- a/src/modules/auth/composables/use-auth-api.ts
+++ b/src/modules/auth/composables/use-auth-api.ts
@@ -11,8 +11,10 @@ export const useAuthApi = () => {
         authStore.oidcLogin();
     };
 
-    const logout = () => {
-        authStore.logout();
+    const logout = async () => {
+        authStore.user = undefined;
+        await authStore.logout();
+        window.location.href = "https://auth.targo.ca/application/o/montargo/end-session/";
     };
 
     return {
diff --git a/src/modules/auth/services/services-auth.ts b/src/modules/auth/services/services-auth.ts
index 5caaa4f..5dfc2e2 100644
--- a/src/modules/auth/services/services-auth.ts
+++ b/src/modules/auth/services/services-auth.ts
@@ -8,9 +8,9 @@ export const AuthService = {
         //TODO: OIDC customer sign-in, eventually
     },
 
-    logout: () => {
+    logout: async () => {
         // TODO: logout logic
-        api.post('/auth/logout')
+        await api.post('/auth/logout');
     },
 
     refreshToken: () => {
diff --git a/src/modules/timesheets/components/expense-dialog-form.vue b/src/modules/timesheets/components/expense-dialog-form.vue
index 8324b65..197b938 100644
--- a/src/modules/timesheets/components/expense-dialog-form.vue
+++ b/src/modules/timesheets/components/expense-dialog-form.vue
@@ -258,6 +258,8 @@
                     dense
                     stack-label
                     label-slot
+                    type="file"
+                    accept="image/*"
                 >
                     <template #prepend>
                         <q-icon
diff --git a/src/stores/auth-store.ts b/src/stores/auth-store.ts
index cee85c7..db573a2 100644
--- a/src/stores/auth-store.ts
+++ b/src/stores/auth-store.ts
@@ -29,12 +29,8 @@ export const useAuthStore = defineStore('auth', () => {
             });
     };
 
-    const logout = () => {
-        user.value = undefined;
-        AuthService.logout();
-        const logout_popup = window.open('https://auth.targo.ca/application/o/montargo/end-session/', 'logoutPopup', 'width=200,height=200');
-        
-        setInterval(() => logout_popup?.close(), 2000);
+    const logout = async () => {
+        await AuthService.logout();
     };
 
     const handleAuthMessage = async (event: MessageEvent) => {

From 618c980ee7170cd181ae79afb7feb064bf82deee Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 13:31:09 -0500
Subject: [PATCH 10/44] Splitting jobs in workflow to test faster

---
 .gitea/workflows/node-ci.yaml | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 86570f9..247204c 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -11,7 +11,7 @@ permissions:
   contents: read
 
 jobs:
-  test:
+  lint:
     runs-on: ubuntu-24.04
     steps:
       - name: Gitea Checkout
@@ -28,6 +28,21 @@ jobs:
 
       - name: Run linter
         run: npm run lint
+        
+  test:
+    runs-on: ubuntu-24.04
+    steps:
+      - name: Gitea Checkout
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Setup Node.js
+        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        with:
+          node-version: '22'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
 
       - name: Run tests
         run: npm test

From 94712c6cdab792068e1a86e75dda2d585b8dcb09 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 13:42:35 -0500
Subject: [PATCH 11/44] test  workflow

---
 .gitea/workflows/node-ci.yaml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 247204c..f60b6cd 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -28,7 +28,7 @@ jobs:
 
       - name: Run linter
         run: npm run lint
-        
+
   test:
     runs-on: ubuntu-24.04
     steps:
@@ -50,7 +50,7 @@ jobs:
   alert_on_failure:
     needs: test
     runs-on: ubuntu-24.04
-    #if: ${{ needs.test.result == 'failure' }}
+    #if: ${{ needs.test.result == 'failure' }} ##
     steps:
       - name: Notify Google Chat
         if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps

From f4e69cd79fd651f0b39bf27176752e7c920087d2 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 13:55:11 -0500
Subject: [PATCH 12/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index f60b6cd..507d156 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -47,8 +47,8 @@ jobs:
       - name: Run tests
         run: npm test
 
-  alert_on_failure:
-    needs: test
+  Is_Linting_Succeeded:
+    needs: lint
     runs-on: ubuntu-24.04
     #if: ${{ needs.test.result == 'failure' }} ##
     steps:
@@ -58,7 +58,19 @@ jobs:
         with:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
-          title: Google Chat GitHub Action
+          title: Lint failed
           subtitle: ${{ job.status }}
-          createDefaultSection: false
-          collapsibleDefaultSection: false
\ No newline at end of file
+
+  Is_Test_Succeeded:
+    needs: lint
+    runs-on: ubuntu-24.04
+    #if: ${{ needs.test.result == 'failure' }} ##
+    steps:
+      - name: Notify Google Chat
+        if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Test failed
+          subtitle: ${{ job.status }}
\ No newline at end of file

From c24bd37b5cf98a74dcd86b3381d122b49dd3d54d Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:01:31 -0500
Subject: [PATCH 13/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 44 +++++++++++++++++++----------------
 1 file changed, 24 insertions(+), 20 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 507d156..beb9edb 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -29,6 +29,15 @@ jobs:
       - name: Run linter
         run: npm run lint
 
+      - name: Notify Google Chat
+        if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Lint failed
+          subtitle: ${{ job.status }}
+
   test:
     runs-on: ubuntu-24.04
     steps:
@@ -47,25 +56,6 @@ jobs:
       - name: Run tests
         run: npm test
 
-  Is_Linting_Succeeded:
-    needs: lint
-    runs-on: ubuntu-24.04
-    #if: ${{ needs.test.result == 'failure' }} ##
-    steps:
-      - name: Notify Google Chat
-        if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
-        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-        with:
-          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-          jobStatus: ${{ job.status }}
-          title: Lint failed
-          subtitle: ${{ job.status }}
-
-  Is_Test_Succeeded:
-    needs: lint
-    runs-on: ubuntu-24.04
-    #if: ${{ needs.test.result == 'failure' }} ##
-    steps:
       - name: Notify Google Chat
         if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
         uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
@@ -73,4 +63,18 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Test failed
-          subtitle: ${{ job.status }}
\ No newline at end of file
+          subtitle: ${{ job.status }}
+
+  #Alert_On_Failed:
+  #  needs: lint
+  #  runs-on: ubuntu-24.04
+  #  #if: ${{ needs.test.result == 'failure' }} ##
+  #  steps:
+  #    - name: Notify Google Chat
+  #      if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
+  #      uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+  #      with:
+  #        webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+  #        jobStatus: ${{ job.status }}
+  #        title: Lint failed
+  #        subtitle: ${{ job.status }}
\ No newline at end of file

From 3e12cc6424d7ed640f6d288baa3b5a1a64682ee3 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:12:17 -0500
Subject: [PATCH 14/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 21 ++++-----------------
 1 file changed, 4 insertions(+), 17 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index beb9edb..24f92aa 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -30,13 +30,14 @@ jobs:
         run: npm run lint
 
       - name: Notify Google Chat
-        if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
+        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
         uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
         with:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Lint failed
           subtitle: ${{ job.status }}
+          additionalSections: '[{"header": "Additional Section", "collapsible": true, "widgets": [{"decoratedText": {"startIcon": {"knownIcon": "STAR"},"text": "${{ github.event.pull_request.html_url }}"}}] }]'
 
   test:
     runs-on: ubuntu-24.04
@@ -57,24 +58,10 @@ jobs:
         run: npm test
 
       - name: Notify Google Chat
-        if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
+        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
         uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
         with:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Test failed
-          subtitle: ${{ job.status }}
-
-  #Alert_On_Failed:
-  #  needs: lint
-  #  runs-on: ubuntu-24.04
-  #  #if: ${{ needs.test.result == 'failure' }} ##
-  #  steps:
-  #    - name: Notify Google Chat
-  #      if: ${{ always() }} # Use always to ensure that the notification is also send on failure of former steps
-  #      uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-  #      with:
-  #        webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-  #        jobStatus: ${{ job.status }}
-  #        title: Lint failed
-  #        subtitle: ${{ job.status }}
\ No newline at end of file
+          subtitle: ${{ job.status }}
\ No newline at end of file

From 5a69febe60a0b840e419eedf0a4701c8fbc673a5 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:19:08 -0500
Subject: [PATCH 15/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 24f92aa..4bb31ba 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -36,8 +36,7 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Lint failed
-          subtitle: ${{ job.status }}
-          additionalSections: '[{"header": "Additional Section", "collapsible": true, "widgets": [{"decoratedText": {"startIcon": {"knownIcon": "STAR"},"text": "${{ github.event.pull_request.html_url }}"}}] }]'
+          subtitle: ${{ github.job }}
 
   test:
     runs-on: ubuntu-24.04

From c50adb820dfc6028a367bb290967c08fb7f11c3d Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:20:56 -0500
Subject: [PATCH 16/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 4bb31ba..05ee4b5 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -36,7 +36,7 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Lint failed
-          subtitle: ${{ github.job }}
+          subtitle: ${{ github.event.pull_request.html_url }}
 
   test:
     runs-on: ubuntu-24.04

From 3bf6b071da3b63ee0e4dc43710d3fdab205b43ad Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:23:39 -0500
Subject: [PATCH 17/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 05ee4b5..0736c3e 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -36,7 +36,7 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Lint failed
-          subtitle: ${{ github.event.pull_request.html_url }}
+          subtitle: ${{ github.repository }}
 
   test:
     runs-on: ubuntu-24.04

From 2148f218e501d8026699bf5d47a181fada745991 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:26:29 -0500
Subject: [PATCH 18/44] Rewrote Google Chat notification

---
 .gitea/workflows/node-ci.yaml | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 0736c3e..e880086 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -36,7 +36,6 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Lint failed
-          subtitle: ${{ github.repository }}
 
   test:
     runs-on: ubuntu-24.04
@@ -62,5 +61,4 @@ jobs:
         with:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
-          title: Test failed
-          subtitle: ${{ job.status }}
\ No newline at end of file
+          title: Test failed
\ No newline at end of file

From 450fc28782ac4fc3c24cecafd371cbe60443419d Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Thu, 5 Feb 2026 14:29:09 -0500
Subject: [PATCH 19/44] fix(auth): fix async oversight in vue file

---
 src/layouts/components/main-layout-left-drawer.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/layouts/components/main-layout-left-drawer.vue b/src/layouts/components/main-layout-left-drawer.vue
index 61cd63b..5c567bb 100644
--- a/src/layouts/components/main-layout-left-drawer.vue
+++ b/src/layouts/components/main-layout-left-drawer.vue
@@ -35,8 +35,8 @@ import { useAuthApi } from 'src/modules/auth/composables/use-auth-api';
         });
     };
 
-    const handleLogout = () => {
-        authApi.logout();
+    const handleLogout = async () => {
+        await authApi.logout();
     };
 
     onMounted(() => {

From 7e3676bae00e1cc19ff717dbcd7d7ae3c9715b11 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 14:29:58 -0500
Subject: [PATCH 20/44] Move workflow to prod

---
 .gitea/workflows/node-ci.yaml | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index e880086..ee66728 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -4,9 +4,16 @@ name: Node-CI
 on:
   push:
     branches: [main]
+    paths-ignore:
+      - '**.md'
+      - 'docs/**'
   pull_request:
     branches: [main]
 
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
 permissions:
   contents: read
 

From d0b3bd80c2ca7cf9a71c58dd5923a12bd1e8a005 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 15:16:39 -0500
Subject: [PATCH 21/44] Added docker image building

---
 .gitea/workflows/node-ci.yaml | 57 ++++++++++++++++++++++++++++++++++-
 1 file changed, 56 insertions(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index ee66728..26e868e 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -68,4 +68,59 @@ jobs:
         with:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
-          title: Test failed
\ No newline at end of file
+          title: Test failed
+
+  build:
+    runs-on: ubuntu-24.04
+    steps:
+      - name: Gitea Checkout
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Setup Node.js
+        uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0
+        with:
+          node-version: '22'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run build
+        run: npm run build
+
+      # Partage du build via artifact
+      - uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
+        with:
+          name: spa
+          path: dist/spa/
+          retention-days: 1
+      #Partage du dossier src
+      - uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
+        with:
+          name: src
+          path: src/
+          retention-days: 1
+
+      - name: Notify Google Chat
+        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Test failed
+
+  deploy:
+    needs: [lint, test, build]
+    runs-on: ubuntu-24.04
+    if: github.ref == 'refs/heads/main'
+    permissions:
+      contents: read
+      id-token: write
+    steps:
+      - uses: actions/download-artifact@37930b1c2abaa49bbe596cd826c3c89aef350131 # v7.0.0
+        with:
+          name: spa
+      - uses: actions/download-artifact@37930b1c2abaa49bbe596cd826c3c89aef350131 # v7.0.0
+        with:
+          name: src
+      - run: docker build -t targo_frontend .
\ No newline at end of file

From 003be92abadfa5b03d340472d18149ece25d8bd1 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 15:19:41 -0500
Subject: [PATCH 22/44] Added docker image building

---
 .gitea/workflows/node-ci.yaml | 21 +--------------------
 1 file changed, 1 insertion(+), 20 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 26e868e..0025baf 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -88,26 +88,13 @@ jobs:
       - name: Run build
         run: npm run build
 
-      # Partage du build via artifact
-      - uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
-        with:
-          name: spa
-          path: dist/spa/
-          retention-days: 1
-      #Partage du dossier src
-      - uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
-        with:
-          name: src
-          path: src/
-          retention-days: 1
-
       - name: Notify Google Chat
         if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
         uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
         with:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
-          title: Test failed
+          title: Build failed
 
   deploy:
     needs: [lint, test, build]
@@ -117,10 +104,4 @@ jobs:
       contents: read
       id-token: write
     steps:
-      - uses: actions/download-artifact@37930b1c2abaa49bbe596cd826c3c89aef350131 # v7.0.0
-        with:
-          name: spa
-      - uses: actions/download-artifact@37930b1c2abaa49bbe596cd826c3c89aef350131 # v7.0.0
-        with:
-          name: src
       - run: docker build -t targo_frontend .
\ No newline at end of file

From 0e5982ec622be42ed824b3b3ffd41f8b7d0175b0 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 15:25:15 -0500
Subject: [PATCH 23/44] Added docker image building

---
 .gitea/workflows/node-ci.yaml | 22 +++++++++++++---------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 0025baf..bddace7 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -95,13 +95,17 @@ jobs:
           webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
           jobStatus: ${{ job.status }}
           title: Build failed
+      
+      - name: deploy
+        if: ${{ success() }}
+        run: docker build -t targo_frontend .
 
-  deploy:
-    needs: [lint, test, build]
-    runs-on: ubuntu-24.04
-    if: github.ref == 'refs/heads/main'
-    permissions:
-      contents: read
-      id-token: write
-    steps:
-      - run: docker build -t targo_frontend .
\ No newline at end of file
+  #deploy:
+  #  needs: [lint, test, build]
+  #  runs-on: ubuntu-24.04
+  #  if: github.ref == 'refs/heads/main'
+  #  permissions:
+  #    contents: read
+  #    id-token: write
+  #  steps:
+  #    - run: docker build -t targo_frontend .
\ No newline at end of file

From 319d7b2471f33bb6a55fb7769ac22caf52beb4bb Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 15:29:29 -0500
Subject: [PATCH 24/44] Added docker image building

---
 .gitea/workflows/node-ci.yaml | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index bddace7..836ab5d 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -11,7 +11,7 @@ on:
     branches: [main]
 
 concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
+  group: ${{ gitea.workflow }}-${{ gitea.ref }}
   cancel-in-progress: true
 
 permissions:
@@ -96,9 +96,9 @@ jobs:
           jobStatus: ${{ job.status }}
           title: Build failed
       
-      - name: deploy
-        if: ${{ success() }}
-        run: docker build -t targo_frontend .
+      #- name: deploy
+      #  if: ${{ success() }}
+      #  run: docker build -t targo_frontend .
 
   #deploy:
   #  needs: [lint, test, build]

From 6d16dc099a215a9aae431587123aa7a367882e33 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Thu, 5 Feb 2026 15:30:16 -0500
Subject: [PATCH 25/44] Added docker image building

---
 .gitea/workflows/node-ci.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 836ab5d..c49964f 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -11,7 +11,7 @@ on:
     branches: [main]
 
 concurrency:
-  group: ${{ gitea.workflow }}-${{ gitea.ref }}
+  group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
 permissions:

From e8eb633810510b2c1681a9724b4d91cf53c7ab79 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Mon, 9 Feb 2026 09:50:42 -0500
Subject: [PATCH 26/44] fix(timesheet): fix expense submit issue in timesheet.
 Fix save button missing in approval dialog.

---
 src/i18n/en-ca/index.ts                       |  2 ++
 src/i18n/fr-ca/index.ts                       |  2 ++
 .../components/expense-dialog-form.vue        |  6 ++--
 .../components/expense-dialog-header.vue      | 16 ++++++++-
 .../components/expense-dialog-list-item.vue   | 33 +++++++++++++++----
 .../mobile/expense-dialog-form-mobile.vue     |  3 +-
 .../expense-dialog-list-item-mobile.vue       |  1 -
 .../components/timesheet-wrapper.vue          | 25 +++++++++++---
 .../timesheets/composables/use-expense-api.ts |  9 +++--
 .../timesheets/composables/use-shift-api.ts   | 15 +++++----
 10 files changed, 86 insertions(+), 26 deletions(-)

diff --git a/src/i18n/en-ca/index.ts b/src/i18n/en-ca/index.ts
index db4d786..33ff984 100644
--- a/src/i18n/en-ca/index.ts
+++ b/src/i18n/en-ca/index.ts
@@ -331,6 +331,8 @@ export default {
             empty_list: 'No registered expenses',
             employee_comment: 'Comment',
             supervisor_comment: 'Supervisor note',
+            no_attachment: "no image attached",
+            temp_attachment_msg: "attachments are temporarily down, you can omit them from submissions and forward them to the finance department",
             actions: {
                 delete_confirm: "Delete this expense?",
             },
diff --git a/src/i18n/fr-ca/index.ts b/src/i18n/fr-ca/index.ts
index 935cdb4..c2e0e28 100644
--- a/src/i18n/fr-ca/index.ts
+++ b/src/i18n/fr-ca/index.ts
@@ -331,6 +331,8 @@ export default {
             empty_list: 'Aucun dépense enregistrée',
             employee_comment: 'Commentaire',
             supervisor_comment: 'Note du Superviseur',
+            no_attachment: "aucune pièce jointe",
+            temp_attachment_msg: "Les pièces jointes sont désactivés temporairement, vous pouvez laisser le champ vide et acheminez vos recus au département de la comptabilité",
             actions: {
                 delete_confirm: "Supprimer cette dépense?",
             },
diff --git a/src/modules/timesheets/components/expense-dialog-form.vue b/src/modules/timesheets/components/expense-dialog-form.vue
index 197b938..68b96c0 100644
--- a/src/modules/timesheets/components/expense-dialog-form.vue
+++ b/src/modules/timesheets/components/expense-dialog-form.vue
@@ -60,8 +60,10 @@
 
     const requestExpenseCreationOrUpdate = async () => {
         if (file.value)
-            await expenses_api.upsertExpense(expenses_store.current_expense, file.value, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL');
-
+            await expenses_api.upsertExpense(expenses_store.current_expense, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL', file.value);
+        else
+            await expenses_api.upsertExpense(expenses_store.current_expense, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL');
+        
         expenses_store.is_showing_create_form = true;
         expenses_store.mode = 'create';
         expenses_store.current_expense = new Expense(date.formatDate(new Date(), 'YYYY-MM-DD'));
diff --git a/src/modules/timesheets/components/expense-dialog-header.vue b/src/modules/timesheets/components/expense-dialog-header.vue
index 0602f5e..d15945f 100644
--- a/src/modules/timesheets/components/expense-dialog-header.vue
+++ b/src/modules/timesheets/components/expense-dialog-header.vue
@@ -24,6 +24,7 @@
 
 <template>
     <div class="column items-center q-pa-none">
+        <!-- title bar with close button -->
         <div class="col row full-width bg-primary">
             <q-item-label class="col text-h6 text-weight-bolder text-uppercase text-white q-py-sm q-px-md">
                 {{ $t('timesheet.expense.title') }}
@@ -41,6 +42,19 @@
             />
         </div>
 
+        <!-- REMOVE: ONCE ATTACHMENTS ARE FULLY IMPLEMENTED -->
+        <div class="col-auto row bg-warning flex-center q-px-md q-py-xs full-width">
+            <q-icon 
+                name="las la-exclamation-triangle"
+                size="md"
+                class="q-px-md"
+            />
+
+            <span class="text-bold text-center">
+                {{ $t('timesheet.expense.temp_attachment_msg') }}
+            </span>
+        </div>
+
         <div class="col row flex-center full-width q-pt-sm q-px-md">
             <div class="col-auto row items-center q-px-md">
                 <span
@@ -80,7 +94,7 @@
                 >
                     {{ weekly_totals.mileage.toFixed(1) }}
                 </span>
-                
+
                 <q-icon
                     v-if="$q.screen.lt.md"
                     name="commute"
diff --git a/src/modules/timesheets/components/expense-dialog-list-item.vue b/src/modules/timesheets/components/expense-dialog-list-item.vue
index 0973c58..0d74415 100644
--- a/src/modules/timesheets/components/expense-dialog-list-item.vue
+++ b/src/modules/timesheets/components/expense-dialog-list-item.vue
@@ -4,7 +4,7 @@
 >
     import ExpenseDialogForm from 'src/modules/timesheets/components/expense-dialog-form.vue';
 
-    import { ref } from 'vue';
+    import { computed, ref } from 'vue';
     import { useI18n } from 'vue-i18n';
     import { date, Notify } from 'quasar';
     import { unwrapAndClone } from 'src/utils/unwrap-and-clone';
@@ -21,13 +21,19 @@
     const { mode = 'normal' } = defineProps<{
         mode?: 'approval' | 'normal';
     }>();
-    
+
     const { t } = useI18n();
     const expenses_api = useExpensesApi();
     const expenses_store = useExpensesStore();
     const timesheet_store = useTimesheetStore();
     const is_showing_update_form = ref(false);
-    
+
+    // ========== computed ===================================
+
+    const attachmentButtonColor = computed(() => expense.value.attachment_name ? 
+        (expense.value.is_approved ? 'white' : 'accent') : 
+        'grey-5');
+
     // ===================== methods =========================
 
     const requestExpenseDeletion = async () => {
@@ -46,7 +52,11 @@
         expenses_store.current_expense = unwrapAndClone(expense.value);
         expenses_store.current_expense.is_approved = !expenses_store.current_expense.is_approved;
 
-        const success = await expenses_store.upsertExpense(expenses_store.current_expense, timesheet_store.current_pay_period_overview?.email);
+        const success = await expenses_store.upsertExpense(
+            expenses_store.current_expense, 
+            timesheet_store.current_pay_period_overview?.email
+        );
+
         if (success) {
             expense.value.is_approved = !expense.value.is_approved;
         } else {
@@ -75,7 +85,6 @@
                 <div class="col-auto">
                     <q-icon
                         :name="getExpenseIcon(expense.type)"
-                        :color="expense.is_approved ? 'white' : ($q.dark.isActive ? 'white' : 'blue-grey-8')"
                         size="lg"
                         class="q-pr-md"
                     />
@@ -117,14 +126,24 @@
                 <div class="col row items-center justify-start">
                     <q-btn
                         push
-                        :color="expense.is_approved ? 'white' : 'accent'"
+                        :disable="expense.attachment_name === undefined"
+                        :color="attachmentButtonColor"
                         :text-color="expense.is_approved ? 'accent' : 'white'"
                         class="col-auto q-px-sm q-mr-sm"
                         icon="attach_file"
                     />
 
                     <q-item-label class="col">
-                        attachment_name.jpg
+                        <span v-if="expense.attachment_name">
+                            {{ expense.attachment_name }}
+                        </span>
+
+                        <span
+                            v-else
+                            class="text-italic text-blue-grey-5 text-uppercase"
+                        >
+                            {{ $t('timesheet.expense.no_attachment') }}
+                        </span>
                     </q-item-label>
                 </div>
 
diff --git a/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue b/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
index 5dea2bd..eb1e466 100644
--- a/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
+++ b/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
@@ -58,7 +58,8 @@
         if (file.value)
             await expenses_api.upsertExpense(
                 expenses_store.current_expense, 
-                file.value, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL'
+                employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL',
+                file.value
             );
             
             emit('onUpdateClicked');
diff --git a/src/modules/timesheets/components/mobile/expense-dialog-list-item-mobile.vue b/src/modules/timesheets/components/mobile/expense-dialog-list-item-mobile.vue
index b663748..f39a7b7 100644
--- a/src/modules/timesheets/components/mobile/expense-dialog-list-item-mobile.vue
+++ b/src/modules/timesheets/components/mobile/expense-dialog-list-item-mobile.vue
@@ -134,7 +134,6 @@
                             <!-- avatar type icon section -->
                             <q-icon
                                 :name="getExpenseIcon(expense.type)"
-                                :color="expense.is_approved ? 'white' : ($q.dark.isActive ? 'white' : 'primary')"
                                 size="lg"
                                 class="col-auto q-pr-sm"
                             />
diff --git a/src/modules/timesheets/components/timesheet-wrapper.vue b/src/modules/timesheets/components/timesheet-wrapper.vue
index a9a8f67..daa5d19 100644
--- a/src/modules/timesheets/components/timesheet-wrapper.vue
+++ b/src/modules/timesheets/components/timesheet-wrapper.vue
@@ -81,12 +81,29 @@
         <LoadingOverlay v-model="timesheet_store.is_loading" />
 
         <!-- label for approval mode to delimit that this is the timesheet -->
-        <span
+        <div
             v-if="mode === 'approval'"
-            class="col-auto text-uppercase text-bold text-h5"
+            class="col-auto row full-width q-px-xl"
         >
-            {{ $t('timesheet.page_header') }}
-        </span>
+            <span class="col-auto text-uppercase text-bold text-h5">
+                {{ $t('timesheet.page_header') }}
+            </span>
+
+            <q-space />
+
+            <!-- desktop save timesheet changes button -->
+            <q-btn
+                v-if="!is_timesheets_approved && $q.screen.width > $q.screen.height"
+                push
+                rounded
+                :disable="timesheet_store.is_loading || has_shift_errors"
+                :color="timesheet_store.is_loading || has_shift_errors ? 'grey-5' : 'accent'"
+                icon="upload"
+                :label="$t('shared.label.save')"
+                :class="$q.platform.is.mobile && ($q.screen.width < $q.screen.height) ? 'full-width' : 'q-ml-md'"
+                @click="onClickSaveTimesheets"
+            />
+        </div>
 
 
         <!-- weekly overview -->
diff --git a/src/modules/timesheets/composables/use-expense-api.ts b/src/modules/timesheets/composables/use-expense-api.ts
index 75ace4e..18a204e 100644
--- a/src/modules/timesheets/composables/use-expense-api.ts
+++ b/src/modules/timesheets/composables/use-expense-api.ts
@@ -8,9 +8,12 @@ export const useExpensesApi = () => {
     const expenses_store = useExpensesStore();
     const timesheet_store = useTimesheetStore();
 
-    const upsertExpense = async (expense: Expense, file: File, employee_email: string): Promise<string> => {
-        const presignedURL = expenses_store.uploadAttachment(file);
-        if (!presignedURL) return 'PRESIGN_FAILED';
+    const upsertExpense = async (expense: Expense, employee_email: string, file?: File): Promise<string> => {
+        if (file) {
+            const presignedURL = expenses_store.uploadAttachment(file);
+
+            if (!presignedURL) return 'PRESIGN_FAILED';
+        }
 
         const success = await expenses_store.upsertExpense(expense, employee_email);
         
diff --git a/src/modules/timesheets/composables/use-shift-api.ts b/src/modules/timesheets/composables/use-shift-api.ts
index 2696836..1b3da43 100644
--- a/src/modules/timesheets/composables/use-shift-api.ts
+++ b/src/modules/timesheets/composables/use-shift-api.ts
@@ -2,31 +2,32 @@ import { useShiftStore } from "src/stores/shift-store";
 import { useTimesheetStore } from "src/stores/timesheet-store";
 
 export const useShiftApi = () => {
-    const timesheet_store = useTimesheetStore();
+    const timesheetStore = useTimesheetStore();
     const shift_store = useShiftStore();
 
     const deleteShiftById = async (shift_id: number, employee_email?: string) => {
-        timesheet_store.is_loading = true;
+        timesheetStore.is_loading = true;
         const success = await shift_store.deleteShiftById(shift_id, employee_email);
 
         if (success) {
-            await timesheet_store.getTimesheetsByOptionalEmployeeEmail(employee_email);
+            await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employee_email);
         }
 
-        timesheet_store.is_loading = false;
+        timesheetStore.is_loading = false;
     };
 
     const saveShiftChanges = async (employee_email?: string) => {
-        timesheet_store.is_loading = true;
+        timesheetStore.is_loading = true;
         
         const update_success = await shift_store.updateShifts(employee_email);
         const create_success = await shift_store.createNewShifts(employee_email);
 
         if (create_success || update_success){
-            await timesheet_store.getTimesheetsByOptionalEmployeeEmail(employee_email);
+            await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employee_email);
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail();
         }
 
-        timesheet_store.is_loading = false;
+        timesheetStore.is_loading = false;
     }
 
     return {

From 442375efc7eb2723bf92db6dc589cdcd414a0fdc Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Mon, 9 Feb 2026 11:35:38 -0500
Subject: [PATCH 27/44] feat(layout): add username on header bar to mitigate
 account confusion on shared PCs that access app.

---
 .../components/main-layout-header-bar.vue     | 24 ++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/layouts/components/main-layout-header-bar.vue b/src/layouts/components/main-layout-header-bar.vue
index 5ad6d39..71c6eee 100644
--- a/src/layouts/components/main-layout-header-bar.vue
+++ b/src/layouts/components/main-layout-header-bar.vue
@@ -2,9 +2,11 @@
     lang="ts"
     setup
 >
-    import { useUiStore } from 'src/stores/ui-store';
+    import { useAuthStore } from 'src/stores/auth-store';
+import { useUiStore } from 'src/stores/ui-store';
 
     const uiStore = useUiStore();
+    const authStore = useAuthStore();
 </script>
 
 <template>
@@ -31,6 +33,26 @@
                     />
                 </q-btn>
             </q-toolbar-title>
+
+            <q-icon
+                name="las la-user-circle"
+                size="md"
+                class="q-px-sm"
+            />
+
+            <div v-if="$q.platform.is.mobile" class="text-uppercase text-bold text-h4 text-accent">
+                {{ authStore.user?.first_name.charAt(0) }}{{ authStore.user?.last_name.charAt(0) }}
+            </div>
+
+            <div v-if="!$q.platform.is.mobile" class="row items-end">
+                <div class="text-uppercase text-h4 text-weight-medium text-accent q-px-xs">
+                    {{ authStore.user?.first_name }}
+                </div>
+    
+                <div class="text-uppercase text-h6 text-weight-light q-pr-md">
+                    {{ authStore.user?.last_name }}
+                </div>
+            </div>
         </q-toolbar>
     </q-header>
 </template>

From 505fdf0e62fbd281f019397e7bd967a3315a98f9 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Wed, 11 Feb 2026 07:52:07 -0500
Subject: [PATCH 28/44] feat(expense): finalize implementation of S3 in
 expenses

Now able to upload and then view images attached to expenses. Will need to check if further changes need to be made to updating expenses. Minor structural changes here and there.
---
 .../expense-dialog-attachment-viewer.vue      | 45 +++++++++++++++++++
 .../components/expense-dialog-list-item.vue   |  7 +++
 .../timesheets/components/expense-dialog.vue  |  3 ++
 .../mobile/expense-dialog-form-mobile.vue     |  9 +++-
 .../mobile/shift-list-day-row-mobile.vue      | 25 +++++++----
 .../timesheets/composables/use-expense-api.ts |  9 +++-
 .../timesheets/models/expense.models.ts       |  5 +++
 .../timesheets/services/expense-service.ts    | 15 ++++---
 src/stores/expense-store.ts                   | 43 +++++++++++++++---
 9 files changed, 137 insertions(+), 24 deletions(-)
 create mode 100644 src/modules/timesheets/components/expense-dialog-attachment-viewer.vue

diff --git a/src/modules/timesheets/components/expense-dialog-attachment-viewer.vue b/src/modules/timesheets/components/expense-dialog-attachment-viewer.vue
new file mode 100644
index 0000000..db7d2f1
--- /dev/null
+++ b/src/modules/timesheets/components/expense-dialog-attachment-viewer.vue
@@ -0,0 +1,45 @@
+<script
+    setup
+    lang="ts"
+>
+    import { ref } from 'vue';
+    import { useExpensesStore } from 'src/stores/expense-store';
+
+    const expenseStore = useExpensesStore();
+    const isMaximized = ref(false);
+    const imageDimension = ref('400px');
+
+    const onClickMaximizeButton = () => {
+        isMaximized.value = !isMaximized.value;
+        imageDimension.value = isMaximized.value ? '100%' : '400px';
+    }
+</script>
+
+<template>
+    <q-dialog
+        v-model="expenseStore.isShowingAttachmentDialog"
+        backdrop-filter="blur(4px)"
+        :full-height="isMaximized"
+        :full-width="isMaximized"
+    >
+        <q-card class="q-pa-md flex-center relative-position">
+            <q-img
+                spinner-color="accent"
+                fit="contain"
+                :height="imageDimension"
+                :width="imageDimension"
+                :src="expenseStore.attachmentURL"
+            />
+
+            <q-btn
+                dense
+                size="lg"
+                color="accent"
+                :icon="isMaximized ? 'zoom_in_map' : 'zoom_out_map'"
+                class="absolute-bottom-right q-ma-sm rounded-5"
+                style="opacity: 0.5;"
+                @click="onClickMaximizeButton"
+            />
+        </q-card>
+    </q-dialog>
+</template>
\ No newline at end of file
diff --git a/src/modules/timesheets/components/expense-dialog-list-item.vue b/src/modules/timesheets/components/expense-dialog-list-item.vue
index 0d74415..ba87962 100644
--- a/src/modules/timesheets/components/expense-dialog-list-item.vue
+++ b/src/modules/timesheets/components/expense-dialog-list-item.vue
@@ -67,6 +67,12 @@
             });
         }
     }
+
+    const onClickAttachment = async () => {
+        expenses_store.isShowingAttachmentDialog = true;
+        await expenses_store.getAttachmentURL(expense.value.attachment_key);
+        console.log('image url: ', expenses_store.attachmentURL);
+    }
 </script>
 
 <template>
@@ -131,6 +137,7 @@
                         :text-color="expense.is_approved ? 'accent' : 'white'"
                         class="col-auto q-px-sm q-mr-sm"
                         icon="attach_file"
+                        @click.stop="onClickAttachment"
                     />
 
                     <q-item-label class="col">
diff --git a/src/modules/timesheets/components/expense-dialog.vue b/src/modules/timesheets/components/expense-dialog.vue
index 2171f8b..c2fa470 100644
--- a/src/modules/timesheets/components/expense-dialog.vue
+++ b/src/modules/timesheets/components/expense-dialog.vue
@@ -6,6 +6,7 @@
     import ExpenseDialogForm from 'src/modules/timesheets/components/expense-dialog-form.vue';
     import ExpenseDialogHeader from 'src/modules/timesheets/components/expense-dialog-header.vue';
     import ExpenseDialogFormMobile from 'src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue';
+    import ExpenseDialogAttachmentViewer from 'src/modules/timesheets/components/expense-dialog-attachment-viewer.vue';
 
     import { date } from 'quasar';
     import { useExpensesStore } from 'src/stores/expense-store';
@@ -32,6 +33,8 @@
         transition-show="jump-down"
         transition-hide="jump-down"
     >
+        <ExpenseDialogAttachmentViewer class="z-top" />
+
         <q-card
             class="q-pa-none rounded-10 shadow-24 bg-secondary"
             style=" min-width: 70vw;"
diff --git a/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue b/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
index eb1e466..5119ecc 100644
--- a/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
+++ b/src/modules/timesheets/components/mobile/expense-dialog-form-mobile.vue
@@ -61,8 +61,13 @@
                 employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL',
                 file.value
             );
-            
-            emit('onUpdateClicked');
+        else
+            await expenses_api.upsertExpense(
+                expenses_store.current_expense, 
+                employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL'
+            );  
+        
+        emit('onUpdateClicked');
     };
 
     onMounted(() => {
diff --git a/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue b/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue
index c2e3084..2939255 100644
--- a/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue
+++ b/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue
@@ -7,19 +7,14 @@
     import { useUiStore } from 'src/stores/ui-store';
     import { SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
     import type { Shift } from 'src/modules/timesheets/models/shift.models';
-
-    const ui_store = useUiStore();
+    
+    // ========== state ========================================
 
     const COMMENT_LENGTH_MAX = 280;
 
     const shift = defineModel<Shift>('shift', { required: true });
-    const shift_type_selected = ref(SHIFT_OPTIONS.find(option => option.value == shift.value.type));
-    const select_ref = ref<QSelect | null>(null);
-    const is_showing_comment_popup = ref(false);
-    const comment_length = computed(() => shift.value.comment?.length ?? 0);
-    const error_message = ref('');
-
-    const { errorMessage = undefined, dense = false, hasShiftAfter = false, isTimesheetApproved = false } = defineProps<{
+    
+        const { errorMessage = undefined, dense = false, hasShiftAfter = false, isTimesheetApproved = false } = defineProps<{
         dense?: boolean;
         hasShiftAfter?: boolean;
         isTimesheetApproved?: boolean;
@@ -30,6 +25,18 @@
         'requestDelete': [void];
         'onTimeFieldBlur': [void];
     }>();
+    
+    const ui_store = useUiStore();
+    const shift_type_selected = ref(SHIFT_OPTIONS.find(option => option.value == shift.value.type));
+    const select_ref = ref<QSelect | null>(null);
+    const is_showing_comment_popup = ref(false);
+    const error_message = ref('');
+
+    // ========== computed ========================================
+
+    const comment_length = computed(() => shift.value.comment?.length ?? 0);
+
+    // ========== methods =========================================
 
     const onBlurShiftTypeSelect = () => {
         if (shift_type_selected.value === undefined) {
diff --git a/src/modules/timesheets/composables/use-expense-api.ts b/src/modules/timesheets/composables/use-expense-api.ts
index 18a204e..7190bea 100644
--- a/src/modules/timesheets/composables/use-expense-api.ts
+++ b/src/modules/timesheets/composables/use-expense-api.ts
@@ -10,9 +10,14 @@ export const useExpensesApi = () => {
 
     const upsertExpense = async (expense: Expense, employee_email: string, file?: File): Promise<string> => {
         if (file) {
-            const presignedURL = expenses_store.uploadAttachment(file);
+            const attachmentKey = await expenses_store.uploadAttachment(file);
 
-            if (!presignedURL) return 'PRESIGN_FAILED';
+            if (!attachmentKey)
+                console.error('failed to upload attachment');
+            else {
+                expense.attachment_key = attachmentKey;
+                expense.attachment_name = file.name;
+            }
         }
 
         const success = await expenses_store.upsertExpense(expense, employee_email);
diff --git a/src/modules/timesheets/models/expense.models.ts b/src/modules/timesheets/models/expense.models.ts
index 93701ee..67a7b4b 100644
--- a/src/modules/timesheets/models/expense.models.ts
+++ b/src/modules/timesheets/models/expense.models.ts
@@ -32,4 +32,9 @@ export interface ExpenseOption {
     label: string;
     value: ExpenseType;
     icon: string;
+}
+
+export interface AttachmentPresignedURLResponse {
+    url: string;
+    key: string;
 }
\ No newline at end of file
diff --git a/src/modules/timesheets/services/expense-service.ts b/src/modules/timesheets/services/expense-service.ts
index 0b0c0f0..2473bb2 100644
--- a/src/modules/timesheets/services/expense-service.ts
+++ b/src/modules/timesheets/services/expense-service.ts
@@ -1,6 +1,6 @@
 import { api } from "src/boot/axios";
 import type { BackendResponse } from "src/modules/shared/models/backend-response.models";
-import type { Expense } from "src/modules/timesheets/models/expense.models";
+import type { AttachmentPresignedURLResponse, Expense } from "src/modules/timesheets/models/expense.models";
 
 export const ExpenseService = {
     createExpense: async (expense: Expense): Promise<{ success: boolean, data: Expense, error?: unknown }> => {
@@ -18,14 +18,19 @@ export const ExpenseService = {
         return response.data;
     },
 
-    getPresignedUploadURL: async (file: File, checksum_crc32: string): Promise<BackendResponse<string>> => {
+    getPresignedUploadURL: async (file: File, checksum_crc32: string): Promise<BackendResponse<AttachmentPresignedURLResponse>> => {
         const [file_name, file_type] = file.name.split('.');
         const response = await api.post(`attachments/s3/upload?file-name=${file_name}&file-type=${file_type}&checksumCRC32=${checksum_crc32}`);
         return response.data;
     },
 
-    uploadAttachmentWithPresignedUrl: async (file: File, url: string) => {
-        const response = await api.put(url, file, { headers: { 'Content-Type': file.type, }, withCredentials: false });
-        console.log('response to upload: ', response);
+    uploadAttachmentWithPresignedUrl: async (file: File, url: string): Promise<number> => {
+        const response = await api.put(url, file, { headers: { 'Content-Type': `image/${file.type}`, }, withCredentials: false });
+        return response.status;
+    },
+
+    getPresignedDownloadURL: async (key: string): Promise<BackendResponse<string>> => {
+        const response = await api.get<BackendResponse<string>>(`attachments/s3/download?attachmentKey=${key}`);
+        return response.data;
     }
 };
\ No newline at end of file
diff --git a/src/stores/expense-store.ts b/src/stores/expense-store.ts
index 8e7ee27..9bf61e5 100644
--- a/src/stores/expense-store.ts
+++ b/src/stores/expense-store.ts
@@ -11,9 +11,11 @@ export const useExpensesStore = defineStore('expenses', () => {
     const is_open = ref(false);
     const is_loading = ref(false);
     const is_showing_create_form = ref(false);
+    const attachmentURL = ref<string>('');
     const mode = ref<'create' | 'update' | 'delete'>('create');
     const current_expense = ref<Expense>(new Expense(date.formatDate(new Date(), 'YYYY-MM-DD')));
     const initial_expense = ref<Expense>(new Expense(date.formatDate(new Date(), 'YYYY-MM-DD')));
+    const isShowingAttachmentDialog = ref(false);
     const is_save_disabled = computed(() => JSON.stringify(current_expense.value) === JSON.stringify(initial_expense.value))
 
     const open = (): void => {
@@ -51,22 +53,48 @@ export const useExpensesStore = defineStore('expenses', () => {
         return data.success;
     }
 
-    const uploadAttachment = async (file: File) => {
+    /**
+     * Attemps to upload the provided image file to the S3 storage bucket for attachments.
+     * 
+     * @param file image file to be uploaded to the S3 storage
+     * @returns Key `string` associated with the uploaded image file if successful,  
+     * `undefined` if it fails.
+     */
+    const uploadAttachment = async (file: File): Promise<string | undefined> => {
         try {
             const checksum = await computeCRC32Base64(file);
             const presignedUrlResponse = await ExpenseService.getPresignedUploadURL(file, checksum);
-            
-            if (presignedUrlResponse.success && presignedUrlResponse.data) {
-                const { url, key } = JSON.parse(presignedUrlResponse.data);
-                console.log('key: ', key);
 
-                await ExpenseService.uploadAttachmentWithPresignedUrl(file, url);
+            if (!presignedUrlResponse.success || !presignedUrlResponse.data) {
+                console.error('failed to get presigned URL from server');
+                return;
             }
+            
+            const { url, key } = presignedUrlResponse.data;
+
+            const responseStatus = await ExpenseService.uploadAttachmentWithPresignedUrl(file, url);
+
+            if (responseStatus >= 400) {
+                console.error('an error occured during upload: error ', responseStatus);
+                return;
+            }
+
+            return key;
         } catch (error) {
             console.error(error);
         }
     }
 
+    const getAttachmentURL = async (key?: string) => {
+        if (!key)
+            return;
+        
+        const presignedAttachmentURL = await ExpenseService.getPresignedDownloadURL(key);
+
+        if (presignedAttachmentURL.success && presignedAttachmentURL.data)
+            attachmentURL.value = presignedAttachmentURL.data;
+    }
+
     return {
         is_open,
         is_loading,
@@ -74,11 +102,14 @@ export const useExpensesStore = defineStore('expenses', () => {
         mode,
         current_expense,
         initial_expense,
+        isShowingAttachmentDialog,
         is_save_disabled,
+        attachmentURL,
         open,
         upsertExpense,
         deleteExpenseById,
         close,
         uploadAttachment,
+        getAttachmentURL,
     };
 });
\ No newline at end of file

From b09057a6be7f66528cfff37949b4038047dd9ab0 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Wed, 18 Feb 2026 11:00:23 -0500
Subject: [PATCH 29/44] refactor(timesheet): Add warning for unsaved changes
 when navigating away from timesheet.

refactor(approvals): Move save timesheets button to top bar in details dialog. Force timesheet reload when saving any modifications to timesheets.
---
 src/i18n/en-ca/index.ts                       |   7 +-
 src/i18n/fr-ca/index.ts                       |   7 +-
 .../components/details-dialog.vue             |  65 ++++++++---
 .../components/overview-list.vue              |  42 +++----
 .../components/shift-list-weekly-overview.vue |   3 +-
 .../components/timesheet-wrapper.vue          | 104 +++++++++++-------
 .../components/unsaved-changes-dialog.vue     |  74 +++++++++++++
 .../timesheets/composables/use-shift-api.ts   |   5 +-
 .../composables/use-timesheet-api.ts          |  81 +++++++-------
 src/router/index.ts                           |  21 +++-
 src/stores/timesheet-store.ts                 |  35 +++++-
 11 files changed, 316 insertions(+), 128 deletions(-)
 create mode 100644 src/modules/timesheets/components/unsaved-changes-dialog.vue

diff --git a/src/i18n/en-ca/index.ts b/src/i18n/en-ca/index.ts
index 33ff984..3bba422 100644
--- a/src/i18n/en-ca/index.ts
+++ b/src/i18n/en-ca/index.ts
@@ -245,6 +245,8 @@ export default {
             day: "day",
             empty: "empty",
             name: "name",
+            lock: "",
+            unlock: "",
         },
         misc: {
             or: "or",
@@ -290,6 +292,8 @@ export default {
         apply_preset_day: "Apply schedule to day",
         apply_preset_week: "Apply schedule to week",
         save_successful: "timesheets saved",
+        unsaved_changes_title: "You have unsaved changes",
+        unsaved_changes_caption: "Save before leaving?",
         nav_button: {
             calendar_date_picker: "Calendar",
             current_week: "This week",
@@ -349,9 +353,10 @@ export default {
             type: "Type",
             types: {
                 PER_DIEM: "Per Diem",
-                EXPENSES: "expense",
+                EXPENSES: "reimbursement",
                 MILEAGE: "mileage",
                 ON_CALL: "on-call allowance",
+                COMMISSION: "Commission",
             },
         },
         errors: {
diff --git a/src/i18n/fr-ca/index.ts b/src/i18n/fr-ca/index.ts
index c2e0e28..7fe01c2 100644
--- a/src/i18n/fr-ca/index.ts
+++ b/src/i18n/fr-ca/index.ts
@@ -245,6 +245,8 @@ export default {
             day: "jour",
             empty: "vide",
             name: "nom",
+            lock: "verrouiller",
+            unlock: "déverrouiller",
         },
         misc: {
             or: "ou",
@@ -290,6 +292,8 @@ export default {
         apply_preset_day: "Appliquer horaire pour la journée",
         apply_preset_week: "Appliquer horaire pour la semaine",
         save_successful: "feuilles de temps enregistrées",
+        unsaved_changes_title: "Vous avez des changements non-enregistrés",
+        unsaved_changes_caption: "Sauvegardez avant de quitter?",
         nav_button: {
             calendar_date_picker: "Calendrier",
             current_week: "Semaine actuelle",
@@ -349,9 +353,10 @@ export default {
             type: "Type",
             types: {
                 PER_DIEM: "Per diem",
-                EXPENSES: "dépense",
+                EXPENSES: "remboursement",
                 MILEAGE: "kilométrage",
                 ON_CALL: "Prime de garde",
+                COMMISSION: "Commission",
             },
         },
         errors: {
diff --git a/src/modules/timesheet-approval/components/details-dialog.vue b/src/modules/timesheet-approval/components/details-dialog.vue
index 3baabb9..1cb8f9f 100644
--- a/src/modules/timesheet-approval/components/details-dialog.vue
+++ b/src/modules/timesheet-approval/components/details-dialog.vue
@@ -11,25 +11,33 @@
     import TimesheetWrapper from 'src/modules/timesheets/components/timesheet-wrapper.vue';
     import ExpenseDialogList from 'src/modules/timesheets/components/expense-dialog-list.vue';
     import { useTimesheetApprovalApi } from '../composables/use-timesheet-approval-api';
+    import { useShiftApi } from 'src/modules/timesheets/composables/use-shift-api';
+
+    // ========== state ========================================
 
     const { t } = useI18n();
-    const timesheet_store = useTimesheetStore();
+    const timesheetStore = useTimesheetStore();
     const timesheetApprovalApi = useTimesheetApprovalApi();
-    const is_dialog_open = ref(false);
+    const shiftApi = useShiftApi();
+    const isDialogOpen = ref(false);
 
-    const isApproved = computed(() => timesheet_store.timesheets.every(timesheet => timesheet.is_approved));
+    // ========== computed ========================================
+
+    const isApproved = computed(() => timesheetStore.timesheets.every(timesheet => timesheet.is_approved));
     const approveButtonLabel = computed(() => isApproved.value ?
-        t('timesheet_approvals.table.verified') :
-        t('timesheet_approvals.table.unverified')
+        t('shared.label.unlock') :
+        t('shared.label.lock')
     );
-    const approveButtonIcon = computed(() => isApproved.value ? 'lock' : 'lock_open');
-    const hasExpenses = computed(() => timesheet_store.timesheets.some(timesheet =>
+    const approveButtonIcon = computed(() => isApproved.value ? 'las la-lock' : 'las la-unlock');
+    const hasExpenses = computed(() => timesheetStore.timesheets.some(timesheet =>
         Object.values(timesheet.weekly_expenses).some(hours => hours > 0))
     );
 
+    // ========== methods ========================================
+
     const onClickApproveAll = async () => {
-        const employeeEmail = timesheet_store.current_pay_period_overview?.email;
-        const isApproved = timesheet_store.timesheets.every(timesheet => timesheet.is_approved);
+        const employeeEmail = timesheetStore.current_pay_period_overview?.email;
+        const isApproved = timesheetStore.timesheets.every(timesheet => timesheet.is_approved);
 
         if (employeeEmail !== undefined && isApproved !== undefined) {
             await timesheetApprovalApi.toggleTimesheetsApprovalByEmployeeEmail(
@@ -38,19 +46,23 @@
             );
         }
     }
+
+    const onClickSaveTimesheets = async () => {
+        await shiftApi.saveShiftChanges(timesheetStore.current_pay_period_overview?.email);
+    }
 </script>
 
 <template>
     <q-dialog
-        v-model="timesheet_store.is_details_dialog_open"
+        v-model="timesheetStore.is_details_dialog_open"
         full-width
         full-height
         transition-show="jump-down"
         transition-hide="jump-down"
         backdrop-filter="blur(6px)"
-        @show="is_dialog_open = true"
-        @hide="is_dialog_open = false"
-        @before-hide="timesheet_store.getTimesheetOverviews"
+        @show="isDialogOpen = true"
+        @hide="isDialogOpen = false"
+        @before-hide="timesheetStore.getTimesheetOverviews"
     >
         <div
             class="column bg-secondary hide-scrollbar shadow-12 rounded-15 q-pb-sm no-wrap"
@@ -58,13 +70,14 @@
         >
             <!-- employee name -->
             <div class="col-auto row flex-center q-px-none q-py-sm sticky-top bg-secondary full-width shadow-4">
-                <span class="col text-h4 text-weight-bolder text-uppercase q-px-lg">
-                    {{ timesheet_store.selected_employee_name }}
+                <span class="col-auto text-h4 text-weight-bolder text-uppercase q-px-lg">
+                    {{ timesheetStore.selected_employee_name }}
                 </span>
 
                 <div class="col-auto q-px-lg">
                     <q-btn
-                        push
+                        :push="isApproved"
+                        :outline="!isApproved"
                         dense
                         size="lg"
                         color="accent"
@@ -84,11 +97,27 @@
                         </transition>
                     </q-btn>
                 </div>
+
+                <q-space />
+
+                <div class="col-auto q-px-md">
+                    <q-btn
+                        push
+                        dense
+                        size="lg"
+                        :disable="timesheetStore.is_loading || !timesheetStore.canSaveTimesheets"
+                        :color="timesheetStore.is_loading || !timesheetStore.canSaveTimesheets ? 'grey-5' : 'accent'"
+                        icon="upload"
+                        :label="$t('shared.label.save')"
+                        :class="$q.platform.is.mobile && ($q.screen.width < $q.screen.height) ? 'full-width' : 'q-ml-md'"
+                        @click="onClickSaveTimesheets"
+                    />
+                </div>
             </div>
 
             <!-- employee pay period details using chart -->
             <div
-                v-if="is_dialog_open"
+                v-if="isDialogOpen"
                 class="col-auto q-px-md no-wrap"
                 :class="$q.platform.is.mobile ? 'column' : 'row'"
             >
@@ -108,7 +137,7 @@
             <div class="col-auto">
                 <TimesheetWrapper
                     mode="approval"
-                    :employee-email="timesheet_store.current_pay_period_overview?.email"
+                    :employee-email="timesheetStore.current_pay_period_overview?.email"
                     class="col-auto"
                 />
             </div>
diff --git a/src/modules/timesheet-approval/components/overview-list.vue b/src/modules/timesheet-approval/components/overview-list.vue
index d73296d..108958d 100644
--- a/src/modules/timesheet-approval/components/overview-list.vue
+++ b/src/modules/timesheet-approval/components/overview-list.vue
@@ -16,6 +16,7 @@
     import { type OverviewColumns, pay_period_overview_columns, PayPeriodOverviewFilters, type TimesheetApprovalOverview } from 'src/modules/timesheet-approval/models/timesheet-overview.models';
     import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-utils';
     import { useUiStore } from 'src/stores/ui-store';
+    import { useTimesheetApi } from 'src/modules/timesheets/composables/use-timesheet-api';
 
     // ========== constants ========================================
 
@@ -46,11 +47,12 @@
 
     const q = useQuasar();
     const uiStore = useUiStore();
-    const auth_store = useAuthStore();
-    const timesheet_store = useTimesheetStore();
-    const timesheet_approval_api = useTimesheetApprovalApi();
+    const authStore = useAuthStore();
+    const timesheetApi = useTimesheetApi();
+    const timesheetStore = useTimesheetStore();
+    const timesheetApprovalApi = useTimesheetApprovalApi();
 
-    const overview_filters = ref<PayPeriodOverviewFilters>({
+    const overviewFilters = ref<PayPeriodOverviewFilters>({
         is_showing_inactive: false,
         is_showing_team_only: true,
         supervisors: [],
@@ -63,21 +65,21 @@
         uiStore.user_preferences.is_timesheet_approval_grid
     );
 
-    const overview_rows = computed(() =>
-        timesheet_store.pay_period_overviews.filter(overview => overview)
+    const overviewRows = computed(() =>
+        timesheetStore.pay_period_overviews.filter(overview => overview)
     );
 
     // ========== methods ========================================
 
     const onClickedDetails = async (row: TimesheetApprovalOverview) => {
-        timesheet_store.current_pay_period_overview = row;
-        await timesheet_store.getTimesheetsByOptionalEmployeeEmail(row.email);
+        timesheetStore.current_pay_period_overview = row;
+        await timesheetApi.getTimesheetsByCurrentPayPeriod(row.email);
 
-        timesheet_store.is_details_dialog_open = true;
+        timesheetStore.is_details_dialog_open = true;
     };
 
     const onClickApproveAll = async (email: string, is_approved: boolean) => {
-        await timesheet_approval_api.toggleTimesheetsApprovalByEmployeeEmail(email, is_approved);
+        await timesheetApprovalApi.toggleTimesheetsApprovalByEmployeeEmail(email, is_approved);
     }
 
     const filterEmployeeRows = (rows: readonly TimesheetApprovalOverview[], terms: PayPeriodOverviewFilters): TimesheetApprovalOverview[] => {
@@ -88,7 +90,7 @@
         }
 
         if (terms.is_showing_team_only) {
-            result = result.filter(row => row.supervisor !== null && row.supervisor.email === (auth_store.user ? auth_store.user.email : ''));
+            result = result.filter(row => row.supervisor !== null && row.supervisor.email === (authStore.user ? authStore.user.email : ''));
         }
 
         if (terms.name_search_string.length > 0) {
@@ -114,20 +116,20 @@
 
 <template>
     <div class="full-width">
-        <LoadingOverlay v-model="timesheet_store.is_loading" />
+        <LoadingOverlay v-model="timesheetStore.is_loading" />
         <q-table
             dense
             row-key="email"
             color="accent"
             separator="none"
             hide-pagination
-            :rows="overview_rows"
+            :rows="overviewRows"
             :columns="pay_period_overview_columns"
             :table-colspan="pay_period_overview_columns.length"
             :visible-columns="VISIBLE_COLUMNS"
             :grid="isGridMode"
             :pagination="{ sortBy: 'is_active' }"
-            :filter="overview_filters"
+            :filter="overviewFilters"
             :filter-method="filterEmployeeRows"
             :rows-per-page-options="[0]"
             class="bg-transparent"
@@ -138,20 +140,20 @@
             :no-results-label="$t('shared.error.no_search_results')"
             :loading-label="$t('shared.label.loading')"
             table-header-style="min-width: 80xp; max-width: 80px;"
-            :style="overview_rows.length > 0 ? `max-height: ${maxHeight}px;` : ''"
+            :style="overviewRows.length > 0 ? `max-height: ${maxHeight}px;` : ''"
             :table-style="{ tableLayout: 'fixed' }"
             @row-click="(_evt, row: TimesheetApprovalOverview) => onClickedDetails(row)"
         >
             <template #top>
                 <OverviewListTopMobile
                     v-if="$q.platform.is.mobile"
-                    v-model:filters="overview_filters"
+                    v-model:filters="overviewFilters"
                     v-model:visible-columns="VISIBLE_COLUMNS"
                 />
 
                 <OverviewListTop
                     v-else
-                    v-model:filters="overview_filters"
+                    v-model:filters="overviewFilters"
                     v-model:visible-columns="VISIBLE_COLUMNS"
                 />
             </template>
@@ -192,7 +194,7 @@
                         mode="out-in"
                     >
                         <div
-                            :key="props.rowIndex + (timesheet_store.pay_period?.pay_period_no ?? 0)"
+                            :key="props.rowIndex + (timesheetStore.pay_period?.pay_period_no ?? 0)"
                             class="rounded-5"
                             :style="`animation-delay: ${props.rowIndex / 15}s; opacity: ${props.row.is_active ? '1' : '0.5'};`"
                         >
@@ -265,7 +267,7 @@
             <template #item="props: { row: TimesheetApprovalOverview, rowIndex: number }">
                 <OverviewListItem
                     v-model="props.row.is_approved"
-                    :key="props.row.email + timesheet_store.pay_period?.pay_period_no"
+                    :key="props.row.email + timesheetStore.pay_period?.pay_period_no"
                     :row="props.row"
                     @click-details="onClickedDetails"
                     @click-approval-all="is_approved => onClickApproveAll(props.row.email, is_approved)"
@@ -275,7 +277,7 @@
             <!-- Template for custome failed-to-load state -->
             <template #no-data="{ message, filter }">
                 <div
-                    v-if="!timesheet_store.is_loading"
+                    v-if="!timesheetStore.is_loading"
                     class="full-width column items-center text-accent"
                 >
                     <q-icon
diff --git a/src/modules/timesheets/components/shift-list-weekly-overview.vue b/src/modules/timesheets/components/shift-list-weekly-overview.vue
index 7693c3c..11bd417 100644
--- a/src/modules/timesheets/components/shift-list-weekly-overview.vue
+++ b/src/modules/timesheets/components/shift-list-weekly-overview.vue
@@ -23,7 +23,8 @@
     const bankedHours = computed(() => timesheetStore.paid_time_off_totals.banked_hours);
 
     onMounted(async () => {
-        await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail();
+        if (timesheetMode === 'normal')
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail();
     })
 </script>
 
diff --git a/src/modules/timesheets/components/timesheet-wrapper.vue b/src/modules/timesheets/components/timesheet-wrapper.vue
index daa5d19..1e4ab7a 100644
--- a/src/modules/timesheets/components/timesheet-wrapper.vue
+++ b/src/modules/timesheets/components/timesheet-wrapper.vue
@@ -10,14 +10,17 @@
     import TimesheetErrorWidget from 'src/modules/timesheets/components/timesheet-error-widget.vue';
     import ShiftListWeeklyOverview from 'src/modules/timesheets/components/shift-list-weekly-overview.vue';
     import ShiftListWeeklyOverviewMobile from 'src/modules/timesheets/components/mobile/shift-list-weekly-overview-mobile.vue';
+    import UnsavedChangesDialog from 'src/modules/timesheets/components/unsaved-changes-dialog.vue';
 
     import { date, Notify } from 'quasar';
     import { useI18n } from 'vue-i18n';
+    import { useRouter } from 'vue-router';
     import { computed, onMounted, provide } from 'vue';
     import { useShiftApi } from 'src/modules/timesheets/composables/use-shift-api';
     import { useTimesheetApi } from 'src/modules/timesheets/composables/use-timesheet-api';
     import { useExpensesStore } from 'src/stores/expense-store';
     import { useTimesheetStore } from 'src/stores/timesheet-store';
+import { RouteNames } from 'src/router/router-constants';
 
     // ================= state ====================
 
@@ -27,18 +30,25 @@
     }>();
 
     const { t } = useI18n();
-    const expenses_store = useExpensesStore();
-    const timesheet_store = useTimesheetStore();
-    const timesheet_api = useTimesheetApi();
-    const shift_api = useShiftApi();
+    const router = useRouter();
+    const expenseStore = useExpensesStore();
+    const timesheetStore = useTimesheetStore();
+    const timesheetApi = useTimesheetApi();
+    const shiftApi = useShiftApi();
 
     // ================== computed ====================
 
-    const has_shift_errors = computed(() => timesheet_store.all_current_shifts.filter(shift => shift.has_error === true).length > 0);
+    const hasShiftErrors = computed(() => timesheetStore.all_current_shifts.filter(shift => shift.has_error === true).length > 0);
+    const isTimesheetsApproved = computed(() => timesheetStore.timesheets.every(timesheet => timesheet.is_approved));
+    // const timesheetStore.canSaveTimesheets = computed(() => {
+    //     /* eslint-disable-next-line */
+    //     const currentShifts = timesheetStore.timesheets.flatMap(timesheet => timesheet.days.flatMap(day => day.shifts.map(shift => { const { has_error, ...shft } = shift; return shft; })));
+    //     const initialShifts = timesheetStore.initial_timesheets.flatMap(timesheet => timesheet.days.flatMap(day => day.shifts));
 
-    const is_timesheets_approved = computed(() => timesheet_store.timesheets.every(timesheet => timesheet.is_approved))
+    //     return JSON.stringify(currentShifts) !== JSON.stringify(initialShifts);
+    // });
 
-    const total_hours = computed(() => timesheet_store.timesheets.reduce((sum, timesheet) =>
+    const totalHours = computed(() => timesheetStore.timesheets.reduce((sum, timesheet) =>
         sum += timesheet.weekly_hours.regular
         + timesheet.weekly_hours.evening
         + timesheet.weekly_hours.emergency
@@ -46,7 +56,7 @@
         0) //initial value
     );
 
-    const total_expenses = computed(() => timesheet_store.timesheets.reduce((sum, timesheet) =>
+    const totalExpenses = computed(() => timesheetStore.timesheets.reduce((sum, timesheet) =>
         sum + timesheet.weekly_expenses.expenses
         + timesheet.weekly_expenses.on_call
         + timesheet.weekly_expenses.per_diem,
@@ -60,25 +70,43 @@
 
     const onClickSaveTimesheets = async () => {
         if (mode === 'normal') {
-            await shift_api.saveShiftChanges();
+            await shiftApi.saveShiftChanges();
             Notify.create({
                 message: t('timesheet.save_successful'),
                 color: 'accent',
             });
         } else {
-            await shift_api.saveShiftChanges(timesheet_store.current_pay_period_overview?.email);
+            await shiftApi.saveShiftChanges(timesheetStore.current_pay_period_overview?.email);
         }
     }
 
+    const onClickLeave = async () => {
+        timesheetStore.isShowingUnsavedWarning = false;
+        timesheetStore.timesheets = [];
+        timesheetStore.initial_timesheets = [];
+        await router.push({ name: timesheetStore.nextPageNameAfterUnsaveWarning ?? RouteNames.DASHBOARD});
+    }
+
+    const onClickSaveBeforeLeaving = async () => {
+        if (mode === 'approval') return;
+
+        timesheetStore.isShowingUnsavedWarning = false;
+        await onClickSaveTimesheets();
+        await onClickLeave();
+    }
+
     onMounted(async () => {
         if (mode === 'normal')
-            await timesheet_api.getTimesheetsByDate(date.formatDate(new Date(), 'YYYY-MM-DD'));
+            await timesheetApi.getTimesheetsByDate(date.formatDate(new Date(), 'YYYY-MM-DD'));
     });
 </script>
 
 <template>
-    <div class="column items-center full-height" :class="mode === 'normal' ? 'relative-position' : ' no-wrap'">
-        <LoadingOverlay v-model="timesheet_store.is_loading" />
+    <div
+        class="column items-center full-height"
+        :class="mode === 'normal' ? 'relative-position' : ' no-wrap'"
+    >
+        <LoadingOverlay v-model="timesheetStore.is_loading" />
 
         <!-- label for approval mode to delimit that this is the timesheet -->
         <div
@@ -90,19 +118,6 @@
             </span>
 
             <q-space />
-
-            <!-- desktop save timesheet changes button -->
-            <q-btn
-                v-if="!is_timesheets_approved && $q.screen.width > $q.screen.height"
-                push
-                rounded
-                :disable="timesheet_store.is_loading || has_shift_errors"
-                :color="timesheet_store.is_loading || has_shift_errors ? 'grey-5' : 'accent'"
-                icon="upload"
-                :label="$t('shared.label.save')"
-                :class="$q.platform.is.mobile && ($q.screen.width < $q.screen.height) ? 'full-width' : 'q-ml-md'"
-                @click="onClickSaveTimesheets"
-            />
         </div>
 
 
@@ -116,8 +131,8 @@
                 <ShiftListWeeklyOverview
                     mode="total-hours"
                     :timesheet-mode="mode"
-                    :total-hours="total_hours"
-                    :total-expenses="total_expenses"
+                    :total-hours="totalHours"
+                    :total-expenses="totalExpenses"
                 />
             </div>
 
@@ -144,9 +159,9 @@
             <!-- navigation btn -->
             <PayPeriodNavigator
                 class="col-auto"
-                @date-selected="timesheet_api.getTimesheetsByDate"
-                @pressed-previous-button="timesheet_api.getTimesheetsByCurrentPayPeriod"
-                @pressed-next-button="timesheet_api.getTimesheetsByCurrentPayPeriod"
+                @date-selected="timesheetApi.getTimesheetsByDate"
+                @pressed-previous-button="timesheetApi.getTimesheetsByCurrentPayPeriod"
+                @pressed-next-button="timesheetApi.getTimesheetsByCurrentPayPeriod"
             />
 
             <!-- mobile expenses button -->
@@ -160,7 +175,7 @@
                     color="accent"
                     icon="receipt_long"
                     class="full-width"
-                    @click="expenses_store.open"
+                    @click="expenseStore.open"
                 />
             </div>
 
@@ -174,16 +189,16 @@
                 color="accent"
                 icon="receipt_long"
                 :label="$t('timesheet.expense.open_btn')"
-                @click="expenses_store.open"
+                @click="expenseStore.open"
             />
 
             <!-- desktop save timesheet changes button -->
             <q-btn
-                v-if="!is_timesheets_approved && $q.screen.width > $q.screen.height"
+                v-if="!isTimesheetsApproved && $q.screen.width > $q.screen.height"
                 push
                 rounded
-                :disable="timesheet_store.is_loading || has_shift_errors"
-                :color="timesheet_store.is_loading || has_shift_errors ? 'grey-5' : 'accent'"
+                :disable="timesheetStore.is_loading || hasShiftErrors || !timesheetStore.canSaveTimesheets"
+                :color="timesheetStore.is_loading || hasShiftErrors || !timesheetStore.canSaveTimesheets ? 'grey-5' : 'accent'"
                 icon="upload"
                 :label="$t('shared.label.save')"
                 :class="$q.platform.is.mobile && ($q.screen.width < $q.screen.height) ? 'full-width' : 'q-ml-md'"
@@ -211,14 +226,14 @@
             :class="$q.platform.is.mobile ? 'fit no-wrap' : 'full-width'"
             :style="$q.platform.is.mobile && $q.screen.width < $q.screen.height ? 'margin-bottom: 40px' : ''"
         >
-            <!-- Show if no timesheets found (further than one month from present) -->
+            <!-- If no timesheets found -->
             <div
-                v-if="timesheet_store.timesheets.length < 1 && !timesheet_store.is_loading"
+                v-if="timesheetStore.timesheets.length < 1 && !timesheetStore.is_loading"
                 class="col-auto column flex-center fit q-py-lg"
                 style="min-height: 20vh;"
             >
                 <span class="text-uppercase text-weight-bolder text-center">{{ $t('shared.error.no_data_found')
-                    }}</span>
+                }}</span>
                 <q-icon
                     name="las la-calendar"
                     color="accent"
@@ -228,7 +243,7 @@
                 />
             </div>
 
-            <!-- Else show timesheets if found -->
+            <!-- Else show timesheets -->
             <ShiftList
                 v-else
                 class="col-auto"
@@ -238,7 +253,7 @@
         <q-btn
             v-if="$q.platform.is.mobile && $q.screen.width < $q.screen.height"
             square
-            :disable="timesheet_store.is_loading"
+            :disable="timesheetStore.is_loading || hasShiftErrors || !timesheetStore.canSaveTimesheets"
             size="lg"
             color="accent"
             icon="upload"
@@ -249,8 +264,13 @@
         />
 
         <ExpenseDialog
-            :is-approved="is_timesheets_approved"
+            :is-approved="isTimesheetsApproved"
             class="z-top"
         />
+
+        <UnsavedChangesDialog
+            @click-save-no="onClickLeave"
+            @click-save-yes="onClickSaveBeforeLeaving"
+        />
     </div>
 </template>
\ No newline at end of file
diff --git a/src/modules/timesheets/components/unsaved-changes-dialog.vue b/src/modules/timesheets/components/unsaved-changes-dialog.vue
new file mode 100644
index 0000000..69dc24e
--- /dev/null
+++ b/src/modules/timesheets/components/unsaved-changes-dialog.vue
@@ -0,0 +1,74 @@
+<script
+    setup
+    lang="ts"
+>
+    import { useTimesheetStore } from 'src/stores/timesheet-store';
+
+    // ========== state ========================================
+    const emit = defineEmits<{
+        clickSaveNo: [];
+        clickSaveYes: [];
+    }>();
+
+    const timesheetStore = useTimesheetStore();
+
+    // ========== methods ========================================
+
+    const onClickSaveOptionButton = (option: 'cancel' | 'no' | 'yes') => {
+        switch(option) {
+            case 'cancel':
+                timesheetStore.isShowingUnsavedWarning = false;
+                break;
+            case 'no':
+                emit('clickSaveNo');
+                break;
+            case 'yes':
+                emit('clickSaveYes');
+                break;
+        }
+    }
+</script>
+
+<template>
+    <q-dialog
+        v-model="timesheetStore.isShowingUnsavedWarning"
+        backdrop-filter="blur(4px)"
+    >
+        <q-card
+            class="bg-dark shadow-12 flex-center"
+            style="border: 2px solid var(--q-accent);"
+        >
+            <div class="column flex-center q-py-sm q-px-md text-center">
+                <span class="col-auto text-bold text-uppercase" style="font-size: 1.2em;">
+                    {{ $t('timesheet.unsaved_changes_title') }}
+                </span>
+                <span class="">{{ $t('timesheet.unsaved_changes_caption') }}</span>
+            </div>
+
+            <div class="col-auto row full-width">
+                <q-btn
+                    flat
+                    :label="$t('shared.label.cancel')"
+                    class="col"
+                    @click="onClickSaveOptionButton('cancel')"
+                />
+
+                <q-btn
+                    flat
+                    color="negative"
+                    :label="$t('shared.misc.no')"
+                    class="col"
+                    @click="onClickSaveOptionButton('no')"
+                />
+
+                <q-btn
+                    flat
+                    color="accent"
+                    :label="$t('shared.misc.yes')"
+                    class="col"
+                    @click="onClickSaveOptionButton('yes')"
+                />
+            </div>
+        </q-card>
+    </q-dialog>
+</template>
\ No newline at end of file
diff --git a/src/modules/timesheets/composables/use-shift-api.ts b/src/modules/timesheets/composables/use-shift-api.ts
index 1b3da43..def4af9 100644
--- a/src/modules/timesheets/composables/use-shift-api.ts
+++ b/src/modules/timesheets/composables/use-shift-api.ts
@@ -10,7 +10,9 @@ export const useShiftApi = () => {
         const success = await shift_store.deleteShiftById(shift_id, employee_email);
 
         if (success) {
+            timesheetStore.timesheets = [];
             await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employee_email);
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employee_email);
         }
 
         timesheetStore.is_loading = false;
@@ -23,8 +25,9 @@ export const useShiftApi = () => {
         const create_success = await shift_store.createNewShifts(employee_email);
 
         if (create_success || update_success){
+            timesheetStore.timesheets = [];
             await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employee_email);
-            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail();
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employee_email);
         }
 
         timesheetStore.is_loading = false;
diff --git a/src/modules/timesheets/composables/use-timesheet-api.ts b/src/modules/timesheets/composables/use-timesheet-api.ts
index faa46e2..4ad48b5 100644
--- a/src/modules/timesheets/composables/use-timesheet-api.ts
+++ b/src/modules/timesheets/composables/use-timesheet-api.ts
@@ -1,65 +1,70 @@
+import { useShiftStore } from "src/stores/shift-store";
 import { useTimesheetStore } from "src/stores/timesheet-store";
-import { timesheetService } from "src/modules/timesheets/services/timesheet-service";
 
 export const useTimesheetApi = () => {
-    const timesheet_store = useTimesheetStore();
+    const timesheetStore = useTimesheetStore();
+    const shiftStore = useShiftStore();
 
-    const getTimesheetsByDate = async (date_string: string, employee_email?: string) => {
-        timesheet_store.timesheets = [];
-        timesheet_store.is_loading = true;
-        const success = await timesheet_store.getPayPeriodByDateOrYearAndNumber(date_string);
+    const getTimesheetsByDate = async (date_string: string, employeeEmail?: string) => {
+        timesheetStore.timesheets = [];
+        timesheetStore.is_loading = true;
+        const success = await timesheetStore.getPayPeriodByDateOrYearAndNumber(date_string);
 
         if (success) {
-            await timesheet_store.getTimesheetsByOptionalEmployeeEmail(employee_email);
-            timesheet_store.is_loading = false;
+            await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employeeEmail);
+            timesheetStore.is_loading = false;
         }
 
-        timesheet_store.is_loading = false;
+        timesheetStore.is_loading = false;
     }
 
-    const getTimesheetsByCurrentPayPeriod = async (employee_email?: string) => {
-        if (timesheet_store.pay_period === undefined) return false;
+    const getTimesheetsByCurrentPayPeriod = async (employeeEmail?: string) => {
+        if (timesheetStore.pay_period === undefined) return false;
 
-        timesheet_store.is_loading = true;
-        const success = await timesheet_store.getPayPeriodByDateOrYearAndNumber();
+        timesheetStore.is_loading = true;
+        const success = await timesheetStore.getPayPeriodByDateOrYearAndNumber();
 
         if (success) {
-            await timesheet_store.getTimesheetsByOptionalEmployeeEmail(employee_email);
-            timesheet_store.is_loading = false;
+            await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employeeEmail);
+            timesheetStore.is_loading = false;
         }
 
-        timesheet_store.is_loading = false;
+        timesheetStore.is_loading = false;
     };
 
     const applyPreset = async (timesheet_id: number, week_day_index?: number, date?: string, employeeEmail?: string) => {
-        if (timesheet_store.timesheets.map(timesheet => timesheet.timesheet_id).includes(timesheet_id)) {
-            timesheet_store.is_loading = true;
-            try {
-                let response;
+        timesheetStore.is_loading = true;
 
-                if (week_day_index && date)
-                    response = await timesheetService.applyPresetToDay(timesheet_id, week_day_index, date, employeeEmail);
-                else
-                    response = await timesheetService.applyPresetToWeek(timesheet_id, employeeEmail);
+        const success = await timesheetStore.applyPreset(timesheet_id, week_day_index, date, employeeEmail);
 
-                if (response.success) 
-                    await timesheet_store.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
-            } catch (error) {
-                console.error('Error applying weekly timesheet: ', error);
-            }
-            
-            timesheet_store.is_loading = false;
+        if (!success) {
+            timesheetStore.is_loading = false;
+            return;
         }
+
+        const timesheets = JSON.stringify(timesheetStore.timesheets);
+        const initialTimesheets = JSON.stringify(timesheetStore.initial_timesheets);
+
+        if (timesheets !== initialTimesheets) {
+            await shiftStore.updateShifts(employeeEmail);
+            await shiftStore.createNewShifts(employeeEmail);
+            await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
+            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employeeEmail);
+        }
+
+        timesheetStore.is_loading = false;
     }
 
-    const getTimesheetsBySwiping = async( direction: number ) => {
-        timesheet_store.is_loading = true;
+    const getTimesheetsBySwiping = async (direction: number) => {
+        timesheetStore.is_loading = true;
 
-        timesheet_store.getNextOrPreviousPayPeriod(direction);
-        await timesheet_store.getPayPeriodByDateOrYearAndNumber();
-        await timesheet_store.getTimesheetsByOptionalEmployeeEmail();
-        
-        timesheet_store.is_loading = false;
+        timesheetStore.getNextOrPreviousPayPeriod(direction);
+        await timesheetStore.getPayPeriodByDateOrYearAndNumber();
+        await timesheetStore.getTimesheetsByOptionalEmployeeEmail();
+
+        timesheetStore.is_loading = false;
     }
 
     return {
diff --git a/src/router/index.ts b/src/router/index.ts
index 09c82af..ae9dd87 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -5,6 +5,7 @@ import { useAuthStore } from 'src/stores/auth-store';
 import { RouteNames } from 'src/router/router-constants';
 import { useChatbotStore } from 'src/stores/chatbot-store';
 import type { UserModuleAccess } from 'src/modules/shared/models/user.models';
+import { useTimesheetStore } from 'src/stores/timesheet-store';
 
 /*
  * If not building with SSR mode, you can
@@ -30,19 +31,29 @@ export default defineRouter(function (/* { store, ssrContext } */) {
         history: createHistory(process.env.VUE_ROUTER_BASE),
     });
 
-    Router.beforeEach(async (destination_page) => {
+    Router.beforeEach(async (to, from) => {
         const auth_store = useAuthStore();
         const result = await auth_store.getProfile() ?? { status: 400, message: 'unknown error occured' };
 
-        if (destination_page.meta.requires_auth && !auth_store.user || (result.status >= 400 && destination_page.name !== RouteNames.LOGIN)) {
+        if (to.meta.requires_auth && !auth_store.user || (result.status >= 400 && to.name !== RouteNames.LOGIN)) {
             console.error('no user account found');
             return { name: 'login' };
         } 
         
-        if (destination_page.meta.required_module && auth_store.user) {
-            if (!auth_store.user.user_module_access.includes(destination_page.meta.required_module as UserModuleAccess)) 
+        if (to.meta.required_module && auth_store.user) {
+            if (!auth_store.user.user_module_access.includes(to.meta.required_module as UserModuleAccess)) 
                 return {name: 'error'};
-        } 
+        }
+        
+        if (from.name === RouteNames.TIMESHEET) {
+            const timesheetStore = useTimesheetStore();
+
+            if(timesheetStore.canSaveTimesheets) {
+                timesheetStore.nextPageNameAfterUnsaveWarning = to.name;
+                timesheetStore.isShowingUnsavedWarning = true;
+                return false;
+            }
+        }
     })
 
     Router.afterEach( (destination_page) => {
diff --git a/src/stores/timesheet-store.ts b/src/stores/timesheet-store.ts
index dc16499..194ded7 100644
--- a/src/stores/timesheet-store.ts
+++ b/src/stores/timesheet-store.ts
@@ -12,6 +12,8 @@ import type { PaidTimeOff } from 'src/modules/employee-list/models/employee-prof
 import type { PayPeriodEvent } from 'src/modules/timesheet-approval/models/pay-period-event.models';
 import type { TimesheetApprovalCSVReportFilters } from 'src/modules/timesheet-approval/models/timesheet-approval-csv-report.models';
 import { type FederalHoliday, TARGO_HOLIDAY_NAMES_FR } from 'src/modules/timesheets/models/federal-holidays.models';
+import type { RouteNames } from 'src/router/router-constants';
+import type { RouteRecordNameGeneric } from 'vue-router';
 
 
 export const useTimesheetStore = defineStore('timesheet', () => {
@@ -21,7 +23,16 @@ export const useTimesheetStore = defineStore('timesheet', () => {
     const timesheets = ref<Timesheet[]>([]);
     const all_current_shifts = computed(() => timesheets.value.flatMap(week => week.days.flatMap(day => day.shifts)) ?? []);
     const initial_timesheets = ref<Timesheet[]>([]);
+    const canSaveTimesheets = computed(() => {
+        /* eslint-disable-next-line */
+        const currentShifts = timesheets.value.flatMap(timesheet => timesheet.days.flatMap(day => day.shifts.map(shift => { const { has_error, ...shft } = shift; return shft; })));
+        const initialShifts = initial_timesheets.value.flatMap(timesheet => timesheet.days.flatMap(day => day.shifts));
+
+        return JSON.stringify(currentShifts) !== JSON.stringify(initialShifts);
+    });
     const paid_time_off_totals = ref<PaidTimeOff>({ sick_hours: 0, vacation_hours: 0, banked_hours: 0 });
+    const isShowingUnsavedWarning = ref(false);
+    const nextPageNameAfterUnsaveWarning = ref<RouteNames | RouteRecordNameGeneric>();
 
     const pay_period_overviews = ref<TimesheetApprovalOverview[]>([]);
     const pay_period_infos = ref<PayPeriodOverviewResponse>();
@@ -121,7 +132,7 @@ export const useTimesheetStore = defineStore('timesheet', () => {
                 has_timesheet_preset.value = response.data.has_preset_schedule;
                 selected_employee_name.value = response.data.employee_fullname;
                 timesheets.value = response.data.timesheets;
-                initial_timesheets.value = unwrapAndClone(timesheets.value);
+                initial_timesheets.value = unwrapAndClone(response.data.timesheets);
             } else {
                 selected_employee_name.value = '';
                 timesheets.value = [];
@@ -169,6 +180,24 @@ export const useTimesheetStore = defineStore('timesheet', () => {
         return false;
     };
 
+    const applyPreset = async (timesheet_id: number, week_day_index?: number, date?: string, employeeEmail?: string): Promise<boolean> => {
+        if (timesheets.value.map(timesheet => timesheet.timesheet_id).includes(timesheet_id)) {
+            try {
+                let response;
+
+                if (week_day_index && date)
+                    response = await timesheetService.applyPresetToDay(timesheet_id, week_day_index, date, employeeEmail);
+                else
+                    response = await timesheetService.applyPresetToWeek(timesheet_id, employeeEmail);
+
+                return response.success ?? false;
+            } catch (error) {
+                console.error('Error applying weekly timesheet: ', error);
+            }
+        }
+        return false;
+    }
+
     const getPayPeriodReport = async (report_filters: TimesheetApprovalCSVReportFilters) => {
         try {
             if (!pay_period.value) return false;
@@ -239,18 +268,22 @@ export const useTimesheetStore = defineStore('timesheet', () => {
         current_pay_period_overview,
         pay_period_infos,
         selected_employee_name,
+        canSaveTimesheets,
         has_timesheet_preset,
         timesheets,
         all_current_shifts,
         initial_timesheets,
         federal_holidays,
         paid_time_off_totals,
+        isShowingUnsavedWarning,
+        nextPageNameAfterUnsaveWarning,
         getCurrentFederalHolidays,
         getNextOrPreviousPayPeriod,
         getPayPeriodByDateOrYearAndNumber,
         getTimesheetOverviews,
         getTimesheetsByOptionalEmployeeEmail,
         toggleTimesheetsApprovalByEmployeeEmail,
+        applyPreset,
         getPayPeriodReport,
         openReportDialog,
         closeReportDialog,

From 6368beb24d1ae725a78b886f69c241e119603653 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Wed, 18 Feb 2026 16:12:51 -0500
Subject: [PATCH 30/44] feat(shift): start to add logic to lock timestamp entry
 when selecting certain shift types

---
 .../components/shift-list-day-row.vue         | 129 +++++++++++++-----
 .../timesheets/components/shift-list-day.vue  |   1 +
 src/modules/timesheets/models/shift.models.ts |   4 +-
 src/stores/timesheet-store.ts                 |   1 -
 4 files changed, 97 insertions(+), 38 deletions(-)

diff --git a/src/modules/timesheets/components/shift-list-day-row.vue b/src/modules/timesheets/components/shift-list-day-row.vue
index f2d2aac..fed9ed9 100644
--- a/src/modules/timesheets/components/shift-list-day-row.vue
+++ b/src/modules/timesheets/components/shift-list-day-row.vue
@@ -6,15 +6,29 @@
     import { computed, inject, onMounted, ref } from 'vue';
     import { QSelect, QInput, useQuasar, type QSelectProps, QPopupProxy } from 'quasar';
     import { useUiStore } from 'src/stores/ui-store';
-    import { SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
-    import type { Shift } from 'src/modules/timesheets/models/shift.models';
     import { useAuthStore } from 'src/stores/auth-store';
+    import { SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
+    import type { TotalHours } from 'src/modules/timesheets/models/timesheet.models';
+    import type { Shift, ShiftOption, ShiftType } from 'src/modules/timesheets/models/shift.models';
+import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-utils';
 
-    // ================== State ==================
+    // ========== Constants ========================================
+
+    const SHIFT_TYPES_WITH_PREDEFINED_TIMES: ShiftType[] = ['HOLIDAY', 'SICK', 'VACATION'];
+
+    // ========== State ========================================
 
     const shift = defineModel<Shift>('shift', { required: true });
 
-    const { errorMessage = undefined, isTimesheetApproved = false, holiday = false } = defineProps<{
+    const {
+        errorMessage = undefined,
+        isTimesheetApproved = false,
+        holiday = false,
+        expectedDailyHours = 8,
+        dailyHours,
+    } = defineProps<{
+        dailyHours: TotalHours;
+        expectedDailyHours?: number;
         isTimesheetApproved?: boolean;
         errorMessage?: string | undefined;
         holiday?: boolean | undefined;
@@ -39,7 +53,10 @@
     const selectRef = ref<QSelect | null>(null);
     const shiftErrorMessage = ref<string | undefined>();
     const is_showing_delete_confirm = ref(false);
+    const isShowingPredefinedTime = ref(false);
     const popupProxyRef = ref<QPopupProxy | null>(null);
+    const predefinedHours = ref(0);
+    const predefinedHoursBgColor = ref('');
 
     // ================== Computed ==================
 
@@ -128,6 +145,28 @@
             popupProxyRef.value.hide();
     }
 
+    const onShiftTypeChange = (option: ShiftOption) => {
+        shift.value.type = option.value;
+
+        if (SHIFT_TYPES_WITH_PREDEFINED_TIMES.includes(option.value)) {
+            isShowingPredefinedTime.value = true;
+            predefinedHoursBgColor.value = `bg-${option.icon_color}`;
+
+            if (option.value === 'SICK') {
+                const workedHours =
+                    dailyHours.regular +
+                    dailyHours.emergency +
+                    dailyHours.evening +
+                    dailyHours.holiday +
+                    dailyHours.sick +
+                    dailyHours.vacation;
+                predefinedHours.value = Math.max(expectedDailyHours - workedHours, 0);
+            }
+        }
+        else
+            isShowingPredefinedTime.value = false;
+    }
+
     onMounted(() => {
         if (ui_store.focus_next_component) {
             selectRef.value?.focus();
@@ -206,7 +245,7 @@
                 v-model="shiftTypeSelected"
                 v-bind="shiftTypeSelectProps"
                 @blur="onBlurShiftTypeSelect"
-                @update:model-value="option => shift.type = option.value"
+                @update:model-value="onShiftTypeChange"
             >
                 <template #selected-item="scope">
                     <div
@@ -291,40 +330,58 @@
             </q-select>
         </div>
 
-        <div class="col row items-start text-uppercase rounded-5 q-pa-xs">
-            <!-- punch in field -->
-            <q-input
-                ref="start_time"
-                v-model="shift.start_time"
-                v-bind="timeInputProps"
-                type="time"
-                @blur="onTimeFieldBlur(shift.start_time)"
+        <div class="col row">
+            <!-- If shift type has predefined timestamps -->
+            <div
+                v-if="isShowingPredefinedTime"
+                class="col row q-px-sm relative-position flex-center"
             >
-                <template #label>
-                    <span
-                        class="text-weight-bolder"
-                        :class="shift.is_approved ? ' q-ml-md' : ''"
-                        style="font-size: 0.95em;"
-                    >{{ $t('shared.misc.in') }}</span>
-                </template>
-            </q-input>
+                <div
+                    class="absolute-full rounded-5 q-mx-sm"
+                    :class="predefinedHoursBgColor"
+                    style="opacity: 0.3;"
+                ></div>
+                <span class="col text-center text-uppercase text-h6 text-bold">{{ getHoursMinutesStringFromHoursFloat(predefinedHours) }}</span>
+            </div>
 
-            <!-- punch out field -->
-            <q-input
-                ref="end_time"
-                v-model="shift.end_time"
-                v-bind="timeInputProps"
-                type="time"
-                @blur="onTimeFieldBlur(shift.end_time)"
+            <!-- Else show input fields for in-out timestamps -->
+            <div
+                v-else
+                class="col row items-start text-uppercase rounded-5 q-pa-xs"
             >
-                <template #label>
-                    <span
-                        class="text-weight-bolder"
-                        :class="shift.is_approved ? ' q-ml-md' : ''"
-                        style="font-size: 0.95em;"
-                    >{{ $t('shared.misc.out') }}</span>
-                </template>
-            </q-input>
+                <q-input
+                    ref="start_time"
+                    v-model="shift.start_time"
+                    v-bind="timeInputProps"
+                    type="time"
+                    @blur="onTimeFieldBlur(shift.start_time)"
+                >
+                    <template #label>
+                        <span
+                            class="text-weight-bolder"
+                            :class="shift.is_approved ? ' q-ml-md' : ''"
+                            style="font-size: 0.95em;"
+                        >{{ $t('shared.misc.in') }}</span>
+                    </template>
+                </q-input>
+
+                <!-- punch out field -->
+                <q-input
+                    ref="end_time"
+                    v-model="shift.end_time"
+                    v-bind="timeInputProps"
+                    type="time"
+                    @blur="onTimeFieldBlur(shift.end_time)"
+                >
+                    <template #label>
+                        <span
+                            class="text-weight-bolder"
+                            :class="shift.is_approved ? ' q-ml-md' : ''"
+                            style="font-size: 0.95em;"
+                        >{{ $t('shared.misc.out') }}</span>
+                    </template>
+                </q-input>
+            </div>
 
             <div
                 class="row full-height"
diff --git a/src/modules/timesheets/components/shift-list-day.vue b/src/modules/timesheets/components/shift-list-day.vue
index d6ab21f..daa0cc7 100644
--- a/src/modules/timesheets/components/shift-list-day.vue
+++ b/src/modules/timesheets/components/shift-list-day.vue
@@ -116,6 +116,7 @@
                 v-else
                 v-model:shift="day.shifts[shift_index]!"
                 :holiday="holiday"
+                :daily-hours="day.daily_hours"
                 :is-timesheet-approved="approved"
                 :error-message="shift_error_message"
                 @request-delete="deleteCurrentShift(shift)"
diff --git a/src/modules/timesheets/models/shift.models.ts b/src/modules/timesheets/models/shift.models.ts
index 956adc5..2164842 100644
--- a/src/modules/timesheets/models/shift.models.ts
+++ b/src/modules/timesheets/models/shift.models.ts
@@ -1,3 +1,5 @@
+import type { QSelectOption } from "quasar";
+
 export const SHIFT_TYPES: ShiftType[] = [
     'REGULAR',
     'EVENING',
@@ -39,7 +41,7 @@ export class Shift {
     }
 }
 
-export interface ShiftOption {
+export interface ShiftOption extends QSelectOption {
     label: string;
     value: ShiftType;
     icon: string;
diff --git a/src/stores/timesheet-store.ts b/src/stores/timesheet-store.ts
index 194ded7..888faa4 100644
--- a/src/stores/timesheet-store.ts
+++ b/src/stores/timesheet-store.ts
@@ -15,7 +15,6 @@ import { type FederalHoliday, TARGO_HOLIDAY_NAMES_FR } from 'src/modules/timeshe
 import type { RouteNames } from 'src/router/router-constants';
 import type { RouteRecordNameGeneric } from 'vue-router';
 
-
 export const useTimesheetStore = defineStore('timesheet', () => {
     const { t } = useI18n();
     const is_loading = ref<boolean>(false);

From dc9599a084a8ad19c9d5ff32d052a0a4b80076e8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Mon, 23 Feb 2026 12:15:22 -0500
Subject: [PATCH 31/44] added script to change env variables in docker compose

---
 env.sh | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)
 create mode 100644 env.sh

diff --git a/env.sh b/env.sh
new file mode 100644
index 0000000..e7cd7be
--- /dev/null
+++ b/env.sh
@@ -0,0 +1,35 @@
+#!/usr/bin/env sh
+# ================================================================================
+# File: env.sh
+# Description: Replaces environment variables in asset files.
+# Usage: Run this script in your terminal, ensuring APP_PREFIX and ASSET_DIRS are set.
+# ================================================================================
+
+# Set the exit flag to exit immediately if any command fails
+set -e
+
+# Check if APP_PREFIX is set
+: "${APP_PREFIX:?APP_PREFIX must be set (e.g. APP_PREFIX='APP_PREFIX_')}"
+
+# Check if ASSET_DIRS is set
+: "${ASSET_DIR:?Must set ASSET_DIR to one path}"
+
+# Check if the directory exists
+if [ ! -d "$ASSET_DIR" ]; then
+    # If not, display a warning message and skip to the next iteration
+    echo "Warning: directory '$ASSET_DIR' not found, skipping."
+    continue
+fi
+
+# Display the current directory being scanned
+echo "Scanning directory: $ASSET_DIR"
+
+# Iterate through each environment variable that starts with APP_PREFIX
+env | grep "^${APP_PREFIX}" | while IFS='=' read -r key value; do
+    # Display the variable being replaced
+    echo "  • Replacing ${key} → ${value}"
+
+    # Use find and sed to replace the variable in all files within the directory
+    find "$ASSET_DIR" -type f \
+        -exec sed -i "s|${key}|${value}|g" {} +
+done

From 8a321cd88df055185236928a3d1622bcf3f3ff92 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Mon, 23 Feb 2026 12:17:19 -0500
Subject: [PATCH 32/44] added env file for VITE variables

---
 .env.production | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 .env.production

diff --git a/.env.production b/.env.production
new file mode 100644
index 0000000..61b1320
--- /dev/null
+++ b/.env.production
@@ -0,0 +1 @@
+VITE_TARGO_BACKEND_URL=PREFIX_BACKEND_URL
\ No newline at end of file

From 4dac626b81012ca3e9c65d601726553bd9f58653 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Mon, 23 Feb 2026 14:00:50 -0500
Subject: [PATCH 33/44] Modified Dockerfile to add script to modify env vars

---
 Dockerfile | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index 9ec98a1..fa43432 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -2,13 +2,10 @@
 FROM node:22 AS build
 WORKDIR /app
 COPY package*.json ./
-# Set environment variables
-ARG BACKEND_URL
-ENV VITE_TARGO_BACKEND_URL=$BACKEND_URL
 # Install dependencies
 RUN npm install -g @quasar/cli
 COPY . .
-RUN npm install
+RUN npm ci
 RUN npm run build
 
 # Step 2 - Move Applicatin to Nginx
@@ -16,5 +13,12 @@ FROM nginx:alpine
 COPY --from=build /app/dist/spa /usr/share/nginx/html
 RUN mkdir /usr/share/nginx/html/src
 COPY --from=build /app/src /usr/share/nginx/html/src
+
+COPY env.sh /docker-entrypoint.d/env.sh
+RUN dos2unix /docker-entrypoint.d/env.sh
+RUN chmod +x /docker-entrypoint.d/env.sh
+
+ENTRYPOINT ["/docker-entrypoint.sh"]
+
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file

From 2b1b0dbcbd962c011c26bffa8108480d4f912260 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Mon, 23 Feb 2026 14:36:51 -0500
Subject: [PATCH 34/44] fix(timesheets): add autofill functionality to sick,
 vacation, holiday shifts.

---
 .../mobile/shift-list-day-row-mobile.vue      | 80 +++++++++++++---
 .../components/shift-list-day-row.vue         | 63 ++++++------
 .../timesheets/components/shift-list-day.vue  |  3 +-
 src/modules/timesheets/models/shift.models.ts |  1 +
 .../timesheets/models/timesheet.models.ts     |  1 +
 src/modules/timesheets/utils/shift.util.ts    | 96 ++++++++++++++-----
 src/utils/date-and-time-utils.ts              | 27 ++++--
 7 files changed, 194 insertions(+), 77 deletions(-)

diff --git a/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue b/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue
index 2939255..abfdc34 100644
--- a/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue
+++ b/src/modules/timesheets/components/mobile/shift-list-day-row-mobile.vue
@@ -5,32 +5,46 @@
     import { computed, onMounted, ref } from 'vue';
     import { QSelect, QInput } from 'quasar';
     import { useUiStore } from 'src/stores/ui-store';
-    import { SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
-    import type { Shift } from 'src/modules/timesheets/models/shift.models';
-    
+    import { getCurrentDailyMinutesWorked, getTimeStringFromMinutes, SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
+    import type { Shift, ShiftOption, ShiftType } from 'src/modules/timesheets/models/shift.models';
+    import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-utils';
+
     // ========== state ========================================
 
+    const SHIFT_TYPES_WITH_PREDEFINED_TIMES: ShiftType[] = ['HOLIDAY', 'SICK', 'VACATION'];
     const COMMENT_LENGTH_MAX = 280;
 
     const shift = defineModel<Shift>('shift', { required: true });
-    
-        const { errorMessage = undefined, dense = false, hasShiftAfter = false, isTimesheetApproved = false } = defineProps<{
+
+    const {
+        dense = false,
+        hasShiftAfter = false,
+        isTimesheetApproved = false,
+        errorMessage = undefined,
+        expectedDailyHours = 8,
+        currentShifts,
+    } = defineProps<{
         dense?: boolean;
         hasShiftAfter?: boolean;
         isTimesheetApproved?: boolean;
         errorMessage?: string | undefined;
+        expectedDailyHours?: number;
+        currentShifts: Shift[];
     }>();
 
     const emit = defineEmits<{
         'requestDelete': [void];
         'onTimeFieldBlur': [void];
     }>();
-    
+
     const ui_store = useUiStore();
-    const shift_type_selected = ref(SHIFT_OPTIONS.find(option => option.value == shift.value.type));
+    const shiftTypeSelected = ref(SHIFT_OPTIONS.find(option => option.value == shift.value.type));
     const select_ref = ref<QSelect | null>(null);
     const is_showing_comment_popup = ref(false);
     const error_message = ref('');
+    const isShowingPredefinedTime = ref(shift.value.type === 'HOLIDAY');
+    const predefinedHoursString = ref('');
+    const predefinedHoursBgColor = ref(`bg-${shiftTypeSelected.value?.icon_color ?? ''}`);
 
     // ========== computed ========================================
 
@@ -39,7 +53,7 @@
     // ========== methods =========================================
 
     const onBlurShiftTypeSelect = () => {
-        if (shift_type_selected.value === undefined) {
+        if (shiftTypeSelected.value === undefined) {
             shift.value.type = 'REGULAR';
             shift.value.id = 0;
             emit('requestDelete');
@@ -63,11 +77,35 @@
         return 'negative';
     };
 
+    const onShiftTypeChange = (option: ShiftOption) => {
+        shift.value.type = option.value;
+
+        if (SHIFT_TYPES_WITH_PREDEFINED_TIMES.includes(option.value)) {
+            predefinedHoursBgColor.value = `bg-${option.icon_color}`;
+            shift.value.start_time = '00:00';
+
+            if (option.value === 'SICK' || option.value === 'VACATION') {
+                const workedMinutes = getCurrentDailyMinutesWorked(currentShifts);
+                console.log('worked minutes: ', workedMinutes);
+                const expectedWorkedMinutes = expectedDailyHours * 60;
+                const leftOverMinutes = expectedWorkedMinutes - workedMinutes;
+
+                shift.value.end_time = getTimeStringFromMinutes(leftOverMinutes);
+                isShowingPredefinedTime.value = false;
+            } else {
+                isShowingPredefinedTime.value = true;
+                predefinedHoursString.value = getHoursMinutesStringFromHoursFloat(expectedDailyHours);
+                shift.value.end_time = getTimeStringFromMinutes(expectedDailyHours * 60);
+            }
+        } else
+            isShowingPredefinedTime.value = false;
+    }
+
     onMounted(() => {
         if (ui_store.focus_next_component) {
             select_ref.value?.focus();
             select_ref.value?.showPopup();
-            shift_type_selected.value = undefined;
+            shiftTypeSelected.value = undefined;
             ui_store.focus_next_component = false;
         }
 
@@ -131,7 +169,7 @@
                 <!-- shift type -->
                 <q-select
                     ref="select"
-                    v-model="shift_type_selected"
+                    v-model="shiftTypeSelected"
                     :standout="$q.dark.isActive ? 'bg-blue-grey-3' : 'bg-blue-grey-9'"
                     dense
                     :borderless="(shift.is_approved && isTimesheetApproved)"
@@ -148,7 +186,7 @@
                     :style="shift.is_approved ? 'background-color: #0a7d32 !important;' : ''"
                     popup-content-style="border: 2px solid var(--q-accent)"
                     @blur="onBlurShiftTypeSelect"
-                    @update:model-value="option => shift.type = option.value"
+                    @update:model-value="onShiftTypeChange"
                 >
                     <template #selected-item="scope">
                         <div
@@ -234,7 +272,25 @@
                 </q-select>
             </div>
 
-            <div class="col row items-start text-uppercase rounded-5 q-pa-xs">
+            <div
+                v-if="isShowingPredefinedTime"
+                class="col row items-start text-uppercase rounded-5 q-pa-xs relative-position"
+            >
+                <div
+                    class="absolute-full rounded-5 q-mx-sm q-my-xs"
+                    :class="predefinedHoursBgColor"
+                    style="opacity: 0.3;"
+                ></div>
+
+                <span class="col text-center text-uppercase text-h6 text-bold q-py-xs">
+                    {{ getHoursMinutesStringFromHoursFloat(expectedDailyHours) }}
+                </span>
+            </div>
+
+            <div
+                v-else
+                class="col row items-start text-uppercase rounded-5 q-pa-xs"
+            >
                 <!-- punch in field -->
                 <div class="col q-pr-xs">
                     <q-input
diff --git a/src/modules/timesheets/components/shift-list-day-row.vue b/src/modules/timesheets/components/shift-list-day-row.vue
index fed9ed9..73cbe08 100644
--- a/src/modules/timesheets/components/shift-list-day-row.vue
+++ b/src/modules/timesheets/components/shift-list-day-row.vue
@@ -7,14 +7,14 @@
     import { QSelect, QInput, useQuasar, type QSelectProps, QPopupProxy } from 'quasar';
     import { useUiStore } from 'src/stores/ui-store';
     import { useAuthStore } from 'src/stores/auth-store';
-    import { SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
-    import type { TotalHours } from 'src/modules/timesheets/models/timesheet.models';
+    import { getCurrentDailyMinutesWorked, getShiftOptions, getTimeStringFromMinutes, SHIFT_OPTIONS } from 'src/modules/timesheets/utils/shift.util';
     import type { Shift, ShiftOption, ShiftType } from 'src/modules/timesheets/models/shift.models';
-import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-utils';
+    import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-utils';
 
     // ========== Constants ========================================
 
     const SHIFT_TYPES_WITH_PREDEFINED_TIMES: ShiftType[] = ['HOLIDAY', 'SICK', 'VACATION'];
+    const COMMENT_LENGTH_MAX = 280;
 
     // ========== State ========================================
 
@@ -23,11 +23,11 @@ import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-uti
     const {
         errorMessage = undefined,
         isTimesheetApproved = false,
+        currentShifts,
         holiday = false,
         expectedDailyHours = 8,
-        dailyHours,
     } = defineProps<{
-        dailyHours: TotalHours;
+        currentShifts: Shift[];
         expectedDailyHours?: number;
         isTimesheetApproved?: boolean;
         errorMessage?: string | undefined;
@@ -39,9 +39,6 @@ import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-uti
         'onTimeFieldBlur': [void];
     }>();
 
-
-    const COMMENT_LENGTH_MAX = 280;
-
     const q = useQuasar();
     const { t } = useI18n();
     const ui_store = useUiStore();
@@ -53,13 +50,15 @@ import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-uti
     const selectRef = ref<QSelect | null>(null);
     const shiftErrorMessage = ref<string | undefined>();
     const is_showing_delete_confirm = ref(false);
-    const isShowingPredefinedTime = ref(false);
+    const isShowingPredefinedTime = ref(shift.value.type === 'HOLIDAY');
     const popupProxyRef = ref<QPopupProxy | null>(null);
-    const predefinedHours = ref(0);
-    const predefinedHoursBgColor = ref('');
+    const predefinedHoursString = ref('');
+    const predefinedHoursBgColor = ref(`bg-${shiftTypeSelected.value?.icon_color ?? ''}`);
 
     // ================== Computed ==================
 
+    const hasPTO = computed(() => currentShifts.some(shift => SHIFT_TYPES_WITH_PREDEFINED_TIMES.includes(shift.type)));
+
     const rightClickMenuIcon = computed(() => shift.value.is_approved ? 'lock_open' : 'lock');
 
     const rightClickMenuLabel = computed(() => shift.value.is_approved ?
@@ -94,7 +93,7 @@ import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-uti
         menuOffset: [0, 10],
         menuAnchor: "bottom middle",
         menuSelf: "top middle",
-        options: SHIFT_OPTIONS,
+        options: getShiftOptions(hasPTO.value, currentShifts.length > 1),
         class: `col rounded-5 q-mx-xs bg-dark ${!shift.value.is_approved && !isTimesheetApproved ? '' : 'inset-shadow'}`,
         popupContentClass: "text-uppercase text-weight-bold text-center rounded-5",
         style: shift.value.is_approved ? (holiday ? 'background-color: #7b1fa2 !important' : 'background-color: #0a7d32 !important;') : '',
@@ -149,21 +148,23 @@ import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-uti
         shift.value.type = option.value;
 
         if (SHIFT_TYPES_WITH_PREDEFINED_TIMES.includes(option.value)) {
-            isShowingPredefinedTime.value = true;
             predefinedHoursBgColor.value = `bg-${option.icon_color}`;
+            shift.value.start_time = '00:00';
 
-            if (option.value === 'SICK') {
-                const workedHours =
-                    dailyHours.regular +
-                    dailyHours.emergency +
-                    dailyHours.evening +
-                    dailyHours.holiday +
-                    dailyHours.sick +
-                    dailyHours.vacation;
-                predefinedHours.value = Math.max(expectedDailyHours - workedHours, 0);
+            if (option.value === 'SICK' || option.value === 'VACATION') {
+                const workedMinutes = getCurrentDailyMinutesWorked(currentShifts);
+                console.log('worked minutes: ', workedMinutes);
+                const expectedWorkedMinutes = expectedDailyHours * 60;
+                const leftOverMinutes = expectedWorkedMinutes - workedMinutes;
+
+                shift.value.end_time = getTimeStringFromMinutes(leftOverMinutes);
+            } else {
+                isShowingPredefinedTime.value = true;
+                predefinedHoursString.value = getHoursMinutesStringFromHoursFloat(expectedDailyHours);
+                shift.value.start_time = '00:00';
+                shift.value.end_time = `${expectedDailyHours}:00`;
             }
-        }
-        else
+        } else
             isShowingPredefinedTime.value = false;
     }
 
@@ -334,21 +335,21 @@ import { getHoursMinutesStringFromHoursFloat } from 'src/utils/date-and-time-uti
             <!-- If shift type has predefined timestamps -->
             <div
                 v-if="isShowingPredefinedTime"
-                class="col row q-px-sm relative-position flex-center"
+                class="col row q-pa-xs relative-position flex-center"
             >
                 <div
-                    class="absolute-full rounded-5 q-mx-sm"
+                    class="absolute-full rounded-5 q-mx-sm q-my-xs"
                     :class="predefinedHoursBgColor"
                     style="opacity: 0.3;"
                 ></div>
-                <span class="col text-center text-uppercase text-h6 text-bold">{{ getHoursMinutesStringFromHoursFloat(predefinedHours) }}</span>
+
+                <span class="col text-center text-uppercase text-h6 text-bold q-py-xs">
+                    {{ getHoursMinutesStringFromHoursFloat(expectedDailyHours) }}
+                </span>
             </div>
 
             <!-- Else show input fields for in-out timestamps -->
-            <div
-                v-else
-                class="col row items-start text-uppercase rounded-5 q-pa-xs"
-            >
+            <div v-else class="col row items-start text-uppercase rounded-5 q-pa-xs">
                 <q-input
                     ref="start_time"
                     v-model="shift.start_time"
diff --git a/src/modules/timesheets/components/shift-list-day.vue b/src/modules/timesheets/components/shift-list-day.vue
index daa0cc7..c1ecda1 100644
--- a/src/modules/timesheets/components/shift-list-day.vue
+++ b/src/modules/timesheets/components/shift-list-day.vue
@@ -107,6 +107,7 @@
                 :is-timesheet-approved="approved"
                 :error-message="shift_error_message"
                 :dense="dense"
+                :current-shifts="day.shifts"
                 :has-shift-after="shift_index < day.shifts.length - 1"
                 @request-delete="deleteCurrentShift(shift)"
                 @on-time-field-blur="onTimeFieldBlur()"
@@ -116,7 +117,7 @@
                 v-else
                 v-model:shift="day.shifts[shift_index]!"
                 :holiday="holiday"
-                :daily-hours="day.daily_hours"
+                :current-shifts="day.shifts"
                 :is-timesheet-approved="approved"
                 :error-message="shift_error_message"
                 @request-delete="deleteCurrentShift(shift)"
diff --git a/src/modules/timesheets/models/shift.models.ts b/src/modules/timesheets/models/shift.models.ts
index 2164842..9a2145a 100644
--- a/src/modules/timesheets/models/shift.models.ts
+++ b/src/modules/timesheets/models/shift.models.ts
@@ -46,4 +46,5 @@ export interface ShiftOption extends QSelectOption {
     value: ShiftType;
     icon: string;
     icon_color: string;
+    disable?: boolean;
 }
\ No newline at end of file
diff --git a/src/modules/timesheets/models/timesheet.models.ts b/src/modules/timesheets/models/timesheet.models.ts
index e293813..950d2a8 100644
--- a/src/modules/timesheets/models/timesheet.models.ts
+++ b/src/modules/timesheets/models/timesheet.models.ts
@@ -7,6 +7,7 @@ export const DATE_FORMAT_PATTERN = /^\d{4}-\d{2}-\d{2}$/;
 export interface TimesheetResponse {
     has_preset_schedule: boolean;
     employee_fullname: string;
+    daily_expected_hours: number;
     timesheets: Timesheet[];
 }
 
diff --git a/src/modules/timesheets/utils/shift.util.ts b/src/modules/timesheets/utils/shift.util.ts
index 812643c..4778cf9 100644
--- a/src/modules/timesheets/utils/shift.util.ts
+++ b/src/modules/timesheets/utils/shift.util.ts
@@ -1,38 +1,82 @@
 import { date } from "quasar";
 import type { SchedulePresetShift } from "src/modules/employee-list/models/schedule-presets.models";
-import type { Shift, ShiftOption } from "src/modules/timesheets/models/shift.models";
+import type { Shift, ShiftOption, ShiftType } from "src/modules/timesheets/models/shift.models";
 
 export const isShiftOverlap = (shifts: Shift[] | SchedulePresetShift[]): boolean => {
-  if (shifts.length < 2) return false;
+	if (shifts.length < 2) return false;
 
-  const parsed_shifts = shifts.map(shift => ({
-    start: date.extractDate(`2000-01-01 ${shift.start_time}`, 'YYYY-MM-DD HH:mm').getTime(),
-    end:   date.extractDate(`2000-01-01 ${shift.end_time}`,   'YYYY-MM-DD HH:mm').getTime(),
-  }));
+	const parsed_shifts = shifts.map(shift => ({
+		start: date.extractDate(`2000-01-01 ${shift.start_time}`, 'YYYY-MM-DD HH:mm').getTime(),
+		end: date.extractDate(`2000-01-01 ${shift.end_time}`, 'YYYY-MM-DD HH:mm').getTime(),
+	}));
 
-  for (let i = 0; i < parsed_shifts.length; i++) {
-    for (let j = i + 1; j < parsed_shifts.length; j++) {
-      const parsed_shift_a = parsed_shifts[i];
-      const parsed_shift_b = parsed_shifts[j];
+	for (let i = 0; i < parsed_shifts.length; i++) {
+		for (let j = i + 1; j < parsed_shifts.length; j++) {
+			const parsed_shift_a = parsed_shifts[i];
+			const parsed_shift_b = parsed_shifts[j];
 
-      if (parsed_shift_a === undefined || parsed_shift_b === undefined) continue;
+			if (parsed_shift_a === undefined || parsed_shift_b === undefined) continue;
 
-      if (Math.max(parsed_shift_a.start, parsed_shift_b.start) < Math.min(parsed_shift_a.end, parsed_shift_b.end)) {
-        return true; // overlap found
-      }
-    }
-  }
+			if (Math.max(parsed_shift_a.start, parsed_shift_b.start) < Math.min(parsed_shift_a.end, parsed_shift_b.end)) {
+				return true; // overlap found
+			}
+		}
+	}
 
-  return false;
+	return false;
 };
 
+export const getCurrentDailyMinutesWorked = (shifts: Shift[]): number => {
+	const shiftTypesToIgnore: ShiftType[] = ['HOLIDAY', 'SICK', 'VACATION'];
+	let minutes = 0;
+
+	shifts.forEach(shift => {
+		if (shiftTypesToIgnore.includes(shift.type)) return;
+
+		const startTime = new Date(`1970-01-01T${shift.start_time}:00`);
+		const endTime = new Date(`1970-01-01T${shift.end_time}:00`);
+
+		const diff = date.getDateDiff(endTime, startTime, 'minutes');
+		minutes += diff;
+	});
+
+	return minutes;
+}
+
+export const getTimeStringFromMinutes = (minutes: number): string => {
+    const h = Math.floor(minutes / 60);
+    const m = minutes % 60;
+
+    if (h < 10 ) {
+        if (m < 10)
+            return `0${h}:0${m}`;
+
+        return `0${h}:${m}`;
+    }
+
+    return `${h}:${m}`;
+}
+
 export const SHIFT_OPTIONS: ShiftOption[] = [
-        { label: 'timesheet.shift.types.REGULAR', value: 'REGULAR', icon: 'wb_sunny', icon_color: 'accent' },
-        { label: 'timesheet.shift.types.EVENING', value: 'EVENING', icon: 'bedtime', icon_color: 'orange-5' },
-        { label: 'timesheet.shift.types.EMERGENCY', value: 'EMERGENCY', icon: 'ring_volume', icon_color: 'red-5' },
-        { label: 'timesheet.shift.types.VACATION', value: 'VACATION', icon: 'beach_access', icon_color: 'deep-orange-5' },
-        { label: 'timesheet.shift.types.HOLIDAY', value: 'HOLIDAY', icon: 'event', icon_color: 'purple-5' },
-        { label: 'timesheet.shift.types.SICK', value: 'SICK', icon: 'medication_liquid', icon_color: 'light-blue-6' },
-        // { label: 'timesheet.shift.types.BANKING', value: 'BANKING', icon: 'savings', icon_color: 'pink-3' },
-        { label: 'timesheet.shift.types.WITHDRAW_BANKED', value: 'WITHDRAW_BANKED', icon: 'attach_money', icon_color: 'yellow-4' },
-    ];
\ No newline at end of file
+	{ label: 'timesheet.shift.types.REGULAR', value: 'REGULAR', icon: 'wb_sunny', icon_color: 'accent' },
+	{ label: 'timesheet.shift.types.EVENING', value: 'EVENING', icon: 'bedtime', icon_color: 'orange-5' },
+	{ label: 'timesheet.shift.types.EMERGENCY', value: 'EMERGENCY', icon: 'ring_volume', icon_color: 'red-5' },
+	{ label: 'timesheet.shift.types.VACATION', value: 'VACATION', icon: 'beach_access', icon_color: 'deep-orange-5' },
+	{ label: 'timesheet.shift.types.HOLIDAY', value: 'HOLIDAY', icon: 'event', icon_color: 'purple-5' },
+	{ label: 'timesheet.shift.types.SICK', value: 'SICK', icon: 'medication_liquid', icon_color: 'light-blue-6' },
+	// { label: 'timesheet.shift.types.BANKING', value: 'BANKING', icon: 'savings', icon_color: 'pink-3' },
+	{ label: 'timesheet.shift.types.WITHDRAW_BANKED', value: 'WITHDRAW_BANKED', icon: 'attach_money', icon_color: 'yellow-4' },
+];
+
+export const getShiftOptions = (disablePTO: boolean, isNotUnique: boolean): ShiftOption[] => {
+	return [
+		{ label: 'timesheet.shift.types.REGULAR', value: 'REGULAR', icon: 'wb_sunny', icon_color: 'accent' },
+		{ label: 'timesheet.shift.types.EVENING', value: 'EVENING', icon: 'bedtime', icon_color: 'orange-5' },
+		{ label: 'timesheet.shift.types.EMERGENCY', value: 'EMERGENCY', icon: 'ring_volume', icon_color: 'red-5' },
+		{ label: 'timesheet.shift.types.VACATION', value: 'VACATION', icon: 'beach_access', icon_color: 'deep-orange-5', disable: disablePTO },
+		{ label: 'timesheet.shift.types.HOLIDAY', value: 'HOLIDAY', icon: 'event', icon_color: 'purple-5', disable: isNotUnique || disablePTO },
+		{ label: 'timesheet.shift.types.SICK', value: 'SICK', icon: 'medication_liquid', icon_color: 'light-blue-6', disable: disablePTO },
+		// { label: 'timesheet.shift.types.BANKING', value: 'BANKING', icon: 'savings', icon_color: 'pink-3' },
+		// { label: 'timesheet.shift.types.WITHDRAW_BANKED', value: 'WITHDRAW_BANKED', icon: 'attach_money', icon_color: 'yellow-4' },
+	];
+}
\ No newline at end of file
diff --git a/src/utils/date-and-time-utils.ts b/src/utils/date-and-time-utils.ts
index 52a4758..b7494b8 100644
--- a/src/utils/date-and-time-utils.ts
+++ b/src/utils/date-and-time-utils.ts
@@ -20,14 +20,27 @@ export const getMinutes = (hours: number) => {
     return minutes > 1 ? minutes.toString() : '0';
 }
 
-export const getHoursMinutesStringFromHoursFloat = (hours: number): string => {
-    let flat_hours = Math.floor(hours);
-    let minutes = Math.round((hours - flat_hours) * 60);
+export const getHoursMinutesStringFromHoursFloat = (hours: number, minutes?: number): string => {
+    let flatHours = Math.floor(hours);
+    let flatMinutes = minutes ?? Math.round((hours - flatHours) * 60);
 
-    if (minutes === 60) {
-        flat_hours += 1;
-        minutes = 0;
+    if (flatMinutes === 60) {
+        flatHours += 1;
+        flatMinutes = 0;
     }
     
-    return `${flat_hours}h${minutes > 1 ? ' ' + minutes : ''}`
+    return `${flatHours}h${flatMinutes > 1 ? ' ' + flatMinutes : ''}`
+}
+
+export const getHoursMinutesBetweenTwoHHmm = (startTime: string, endTime: string): {
+    hours: number,
+    minutes: number,
+} => {
+    const [startHours, startMinutes] = startTime.split(':');
+    const [endHours, endMinutes] = endTime.split(':');
+
+    return { 
+        hours: Number(endHours) - Number(startHours),
+        minutes: Number(endMinutes) - Number(startMinutes),
+    }
 }
\ No newline at end of file

From e6d2dac092c32a943665f7b3197534b10fbc0065 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Mon, 23 Feb 2026 14:58:14 -0500
Subject: [PATCH 35/44] fix(timesheets): fix issue where timesheets do not
 reload if applying presets with no other changes

---
 src/modules/timesheets/composables/use-timesheet-api.ts | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/modules/timesheets/composables/use-timesheet-api.ts b/src/modules/timesheets/composables/use-timesheet-api.ts
index 4ad48b5..50be89f 100644
--- a/src/modules/timesheets/composables/use-timesheet-api.ts
+++ b/src/modules/timesheets/composables/use-timesheet-api.ts
@@ -50,9 +50,10 @@ export const useTimesheetApi = () => {
         if (timesheets !== initialTimesheets) {
             await shiftStore.updateShifts(employeeEmail);
             await shiftStore.createNewShifts(employeeEmail);
-            await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
-            await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employeeEmail);
         }
+        
+        await timesheetStore.getTimesheetsByOptionalEmployeeEmail(employeeEmail);
+        await timesheetStore.getPaidTimeOffTotalsWithOptionalEmployeeEmail(employeeEmail);
 
         timesheetStore.is_loading = false;
     }

From 1b3dc7a6a3140281e3b6e58fc852f54807cbb0bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Mon, 23 Feb 2026 15:57:07 -0500
Subject: [PATCH 36/44] Updated Action script

---
 .gitea/workflows/node-ci.yaml | 64 ++++++++++++++++++++++++++++-------
 1 file changed, 52 insertions(+), 12 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index c49964f..044560d 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -88,6 +88,24 @@ jobs:
       - name: Run build
         run: npm run build
 
+      - uses: actions/upload-artifact@v3
+        with:
+          name: dist
+          path: dist
+          retention-days: 1
+
+      - uses: actions/upload-artifact@v3
+        with:
+          name: source
+          path: src
+          retention-days: 1
+          
+      - uses: actions/upload-artifact@v3
+        with:
+          name: Dockerfile
+          path: Dockerfile
+          retention-days: 1
+
       - name: Notify Google Chat
         if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
         uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
@@ -96,16 +114,38 @@ jobs:
           jobStatus: ${{ job.status }}
           title: Build failed
       
-      #- name: deploy
-      #  if: ${{ success() }}
-      #  run: docker build -t targo_frontend .
 
-  #deploy:
-  #  needs: [lint, test, build]
-  #  runs-on: ubuntu-24.04
-  #  if: github.ref == 'refs/heads/main'
-  #  permissions:
-  #    contents: read
-  #    id-token: write
-  #  steps:
-  #    - run: docker build -t targo_frontend .
\ No newline at end of file
+
+  deploy:
+    needs: [lint, test, build]
+    runs-on: ubuntu-24.04
+    if: github.ref == 'refs/heads/main'
+    permissions:
+      contents: read
+      id-token: write
+    steps:
+      - name: Getting Dockerfile
+        uses: actions/download-artifact@v3
+        with:
+          name: Dockerfile
+      - name: Downloading dist folder
+        uses: actions/download-artifact@v3
+        with:
+          name: dist
+          path: dist
+      - name: Downloading src folder
+        uses: actions/download-artifact@v3
+        with:
+          name: source
+          path: source      
+      - name: Set version number
+        run: echo "VERSION_NUMBER=$(date +'%y%m%d.%H%M%S')" >> $GITHUB_ENV
+      - name: Building docker image
+        run: docker build -t git.targo.ca/targo/targo_frontend_staging:2.${{ env.VERSION_NUMBER }} .
+      - name: Add tag Latest
+        run: docker tag git.targo.ca/targo/targo_frontend_staging:2.${{ env.VERSION_NUMBER }} git.targo.ca/targo/targo_frontend_staging:latest
+      - name: Push images to server
+        run:  |
+          docker login -u ${{ secrets.CI_USER }} -p ${{ secrets.CI_PASSWORD }} git.targo.ca
+          docker push git.targo.ca/targo/targo_frontend_staging:2.${{ env.VERSION_NUMBER }}
+          docker push git.targo.ca/targo/targo_frontend_staging:latest
\ No newline at end of file

From 60550f6364ccbd68e322e64cfb905216d435964b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Mon, 23 Feb 2026 15:58:06 -0500
Subject: [PATCH 37/44] Updated dockerfile

---
 Dockerfile | 23 +++--------------------
 1 file changed, 3 insertions(+), 20 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index fa43432..c4c69ff 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,24 +1,7 @@
-# Step 1 - Building the app
-FROM node:22 AS build
-WORKDIR /app
-COPY package*.json ./
-# Install dependencies
-RUN npm install -g @quasar/cli
-COPY . .
-RUN npm ci
-RUN npm run build
-
-# Step 2 - Move Applicatin to Nginx
 FROM nginx:alpine
-COPY --from=build /app/dist/spa /usr/share/nginx/html
 RUN mkdir /usr/share/nginx/html/src
-COPY --from=build /app/src /usr/share/nginx/html/src
-
-COPY env.sh /docker-entrypoint.d/env.sh
-RUN dos2unix /docker-entrypoint.d/env.sh
-RUN chmod +x /docker-entrypoint.d/env.sh
-
-ENTRYPOINT ["/docker-entrypoint.sh"]
-
+COPY dist /usr/share/nginx/html
+COPY source /usr/share/nginx/html/src
+RUN ls -la /usr/share/nginx/html/src
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file

From 58db6f7ac45bae1af1e52bbb1500d48fddaa56cb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Mon, 23 Feb 2026 15:59:39 -0500
Subject: [PATCH 38/44] revert 60550f6364ccbd68e322e64cfb905216d435964b

revert Updated dockerfile
---
 Dockerfile | 23 ++++++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index c4c69ff..fa43432 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,7 +1,24 @@
+# Step 1 - Building the app
+FROM node:22 AS build
+WORKDIR /app
+COPY package*.json ./
+# Install dependencies
+RUN npm install -g @quasar/cli
+COPY . .
+RUN npm ci
+RUN npm run build
+
+# Step 2 - Move Applicatin to Nginx
 FROM nginx:alpine
+COPY --from=build /app/dist/spa /usr/share/nginx/html
 RUN mkdir /usr/share/nginx/html/src
-COPY dist /usr/share/nginx/html
-COPY source /usr/share/nginx/html/src
-RUN ls -la /usr/share/nginx/html/src
+COPY --from=build /app/src /usr/share/nginx/html/src
+
+COPY env.sh /docker-entrypoint.d/env.sh
+RUN dos2unix /docker-entrypoint.d/env.sh
+RUN chmod +x /docker-entrypoint.d/env.sh
+
+ENTRYPOINT ["/docker-entrypoint.sh"]
+
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file

From 67132857acf27b5edfb7cd2a5347bbd355278093 Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Tue, 24 Feb 2026 08:32:10 -0500
Subject: [PATCH 39/44] feat(timesheet-approval): allow creation of expenses
 from employee details window

---
 .../components/details-dialog.vue             | 61 ++++++++++++++++++-
 .../components/expense-dialog-form.vue        | 15 ++++-
 .../components/shift-list-day-row.vue         |  2 +-
 .../timesheets/composables/use-expense-api.ts |  2 +-
 .../timesheets/services/expense-service.ts    |  4 +-
 src/stores/expense-store.ts                   |  2 +-
 6 files changed, 77 insertions(+), 9 deletions(-)

diff --git a/src/modules/timesheet-approval/components/details-dialog.vue b/src/modules/timesheet-approval/components/details-dialog.vue
index 1cb8f9f..0c3f08a 100644
--- a/src/modules/timesheet-approval/components/details-dialog.vue
+++ b/src/modules/timesheet-approval/components/details-dialog.vue
@@ -10,13 +10,18 @@
     import DetailsDialogChartExpenses from 'src/modules/timesheet-approval/components/details-dialog-chart-expenses.vue';
     import TimesheetWrapper from 'src/modules/timesheets/components/timesheet-wrapper.vue';
     import ExpenseDialogList from 'src/modules/timesheets/components/expense-dialog-list.vue';
+    import ExpenseDialogForm from 'src/modules/timesheets/components/expense-dialog-form.vue';
     import { useTimesheetApprovalApi } from '../composables/use-timesheet-approval-api';
     import { useShiftApi } from 'src/modules/timesheets/composables/use-shift-api';
+    import { useExpensesStore } from 'src/stores/expense-store';
+    import { Expense } from 'src/modules/timesheets/models/expense.models';
+    import { date } from 'quasar';
 
     // ========== state ========================================
 
     const { t } = useI18n();
     const timesheetStore = useTimesheetStore();
+    const expenseStore = useExpensesStore();
     const timesheetApprovalApi = useTimesheetApprovalApi();
     const shiftApi = useShiftApi();
     const isDialogOpen = ref(false);
@@ -24,11 +29,14 @@
     // ========== computed ========================================
 
     const isApproved = computed(() => timesheetStore.timesheets.every(timesheet => timesheet.is_approved));
+
     const approveButtonLabel = computed(() => isApproved.value ?
         t('shared.label.unlock') :
         t('shared.label.lock')
     );
+    
     const approveButtonIcon = computed(() => isApproved.value ? 'las la-lock' : 'las la-unlock');
+    
     const hasExpenses = computed(() => timesheetStore.timesheets.some(timesheet =>
         Object.values(timesheet.weekly_expenses).some(hours => hours > 0))
     );
@@ -49,6 +57,15 @@
 
     const onClickSaveTimesheets = async () => {
         await shiftApi.saveShiftChanges(timesheetStore.current_pay_period_overview?.email);
+        expenseStore.is_showing_create_form = false;
+    }
+
+    const onClickExpenseCreate = () => {
+        expenseStore.mode = 'create';
+        if (timesheetStore.pay_period)
+            expenseStore.current_expense = new Expense(timesheetStore.pay_period.period_start);
+        else
+            expenseStore.current_expense = new Expense(date.formatDate(new Date(), 'YYYY-MM-DD'));
     }
 </script>
 
@@ -118,6 +135,7 @@
             <!-- employee pay period details using chart -->
             <div
                 v-if="isDialogOpen"
+                :key="hasExpenses ? 0 : 1"
                 class="col-auto q-px-md no-wrap"
                 :class="$q.platform.is.mobile ? 'column' : 'row'"
             >
@@ -129,12 +147,51 @@
                 />
             </div>
 
-            <div class="col-auto">
+            <div class="col-auto column">
+                <q-separator
+                    spaced
+                    size="4px"
+                    class="q-mx-md"
+                />
+
                 <ExpenseDialogList mode="approval" />
+
+                <q-expansion-item
+                    v-if="!isApproved"
+                    v-model="expenseStore.is_showing_create_form"
+                    hide-expand-icon
+                    :dense="!$q.platform.is.mobile"
+                    group="expenses"
+                    @show="onClickExpenseCreate()"
+                    header-class="bg-accent text-white q-mx-md rounded-5"
+                >
+                    <template #header>
+                        <div class="row items-center">
+                            <q-icon
+                                name="add_circle_outline"
+                                size="md"
+                                class="col-auto"
+                                :class="expenseStore.is_showing_create_form ? 'invisible' : ''"
+                            />
+
+                            <span class="col-auto text-uppercase text-weight-bold text-h6 q-ml-xs q-mr-sm">
+                                {{ $t('timesheet.expense.add_expense') }}
+                            </span>
+                        </div>
+                    </template>
+
+                    <ExpenseDialogForm :email="timesheetStore.current_pay_period_overview?.email"/>
+                </q-expansion-item>
+
+                <q-separator
+                    spaced
+                    size="4px"
+                    class="q-mx-md"
+                />
             </div>
 
             <!-- list of shifts -->
-            <div class="col-auto">
+            <div class="col-auto q-mt-md">
                 <TimesheetWrapper
                     mode="approval"
                     :employee-email="timesheetStore.current_pay_period_overview?.email"
diff --git a/src/modules/timesheets/components/expense-dialog-form.vue b/src/modules/timesheets/components/expense-dialog-form.vue
index 68b96c0..509ccc5 100644
--- a/src/modules/timesheets/components/expense-dialog-form.vue
+++ b/src/modules/timesheets/components/expense-dialog-form.vue
@@ -20,6 +20,10 @@
     const expense = defineModel<Expense>({ default: new Expense(new Date().toISOString().slice(0, 10)) })
     const file = defineModel<File>('file');
 
+    const {email} = defineProps<{
+        email?: string | undefined;
+    }>();
+
     const { t } = useI18n();
     const ui_store = useUiStore();
     const timesheet_store = useTimesheetStore();
@@ -60,9 +64,16 @@
 
     const requestExpenseCreationOrUpdate = async () => {
         if (file.value)
-            await expenses_api.upsertExpense(expenses_store.current_expense, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL', file.value);
+            await expenses_api.upsertExpense(
+                expenses_store.current_expense, 
+                email ?? employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL', 
+                file.value
+            );
         else
-            await expenses_api.upsertExpense(expenses_store.current_expense, employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL');
+            await expenses_api.upsertExpense(
+                expenses_store.current_expense, 
+                email ?? employeeEmail ?? auth_store.user?.email ?? 'MISSING_EMAIL'
+            );
         
         expenses_store.is_showing_create_form = true;
         expenses_store.mode = 'create';
diff --git a/src/modules/timesheets/components/shift-list-day-row.vue b/src/modules/timesheets/components/shift-list-day-row.vue
index 73cbe08..35142f7 100644
--- a/src/modules/timesheets/components/shift-list-day-row.vue
+++ b/src/modules/timesheets/components/shift-list-day-row.vue
@@ -211,7 +211,7 @@
             backdrop-filter="blur(6px)"
         >
             <div
-                class="column flex-center q-pa-md bg-secondary shadow-24 rounded-10"
+                class="column flex-center q-pa-md bg-dark shadow-24 rounded-10"
                 style="border: 2px solid var(--q-accent);"
             >
                 <span class="col-auto text-h6 text-bold text-uppercase">{{
diff --git a/src/modules/timesheets/composables/use-expense-api.ts b/src/modules/timesheets/composables/use-expense-api.ts
index 7190bea..2165807 100644
--- a/src/modules/timesheets/composables/use-expense-api.ts
+++ b/src/modules/timesheets/composables/use-expense-api.ts
@@ -19,7 +19,7 @@ export const useExpensesApi = () => {
                 expense.attachment_name = file.name;
             }
         }
-
+        console.log('employee email provided for expense: ', employee_email)
         const success = await expenses_store.upsertExpense(expense, employee_email);
         
         if (success) {
diff --git a/src/modules/timesheets/services/expense-service.ts b/src/modules/timesheets/services/expense-service.ts
index 2473bb2..4a4e462 100644
--- a/src/modules/timesheets/services/expense-service.ts
+++ b/src/modules/timesheets/services/expense-service.ts
@@ -3,8 +3,8 @@ import type { BackendResponse } from "src/modules/shared/models/backend-response
 import type { AttachmentPresignedURLResponse, Expense } from "src/modules/timesheets/models/expense.models";
 
 export const ExpenseService = {
-    createExpense: async (expense: Expense): Promise<{ success: boolean, data: Expense, error?: unknown }> => {
-        const response = await api.post('expense/create', expense);
+    createExpense: async (expense: Expense, email?: string): Promise<{ success: boolean, data: Expense, error?: unknown }> => {
+        const response = await api.post(`expense/create${email ? '?employee_email=' + email : ''}`, expense);
         return response.data;
     },
 
diff --git a/src/stores/expense-store.ts b/src/stores/expense-store.ts
index 9bf61e5..64911c9 100644
--- a/src/stores/expense-store.ts
+++ b/src/stores/expense-store.ts
@@ -36,7 +36,7 @@ export const useExpensesStore = defineStore('expenses', () => {
     const upsertExpense = async (expense: Expense, email?: string): Promise<boolean> => {
         try {
             if (expense.id < 0) {
-                const data = await ExpenseService.createExpense(expense);
+                const data = await ExpenseService.createExpense(expense, email);
                 return data.success;
             }
             const data = await ExpenseService.updateExpense(expense, email);

From b353db518c0730f3dadd20acd80ce97de2925e96 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Tue, 24 Feb 2026 09:13:19 -0500
Subject: [PATCH 40/44] added modifications to build Docker image in Gitea
 Runners

---
 .gitea/workflows/node-ci.yaml | 57 ++++++++++++++++++-----------------
 Dockerfile                    | 25 +++++----------
 2 files changed, 37 insertions(+), 45 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index 044560d..c6b45c9 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -36,13 +36,13 @@ jobs:
       - name: Run linter
         run: npm run lint
 
-      - name: Notify Google Chat
-        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
-        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-        with:
-          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-          jobStatus: ${{ job.status }}
-          title: Lint failed
+#      - name: Notify Google Chat
+#        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+#        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+#        with:
+#          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+#          jobStatus: ${{ job.status }}
+#          title: Lint failed
 
   test:
     runs-on: ubuntu-24.04
@@ -62,13 +62,13 @@ jobs:
       - name: Run tests
         run: npm test
 
-      - name: Notify Google Chat
-        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
-        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-        with:
-          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-          jobStatus: ${{ job.status }}
-          title: Test failed
+#      - name: Notify Google Chat
+#        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+#        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+#        with:
+#          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+#          jobStatus: ${{ job.status }}
+#          title: Test failed
 
   build:
     runs-on: ubuntu-24.04
@@ -99,27 +99,28 @@ jobs:
           name: source
           path: src
           retention-days: 1
-          
       - uses: actions/upload-artifact@v3
         with:
           name: Dockerfile
           path: Dockerfile
           retention-days: 1
 
-      - name: Notify Google Chat
-        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
-        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-        with:
-          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-          jobStatus: ${{ job.status }}
-          title: Build failed
+ #     - name: Notify Google Chat
+ #       if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+ #       uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+ #       with:
+ #         webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+ #         jobStatus: ${{ job.status }}
+ #         title: Build failed
       
-
+      #- name: deploy
+      #  if: ${{ success() }}
+      #  run: docker build -t targo_frontend .
 
   deploy:
     needs: [lint, test, build]
     runs-on: ubuntu-24.04
-    if: github.ref == 'refs/heads/main'
+    #if: github.ref == 'refs/heads/main'
     permissions:
       contents: read
       id-token: write
@@ -141,11 +142,11 @@ jobs:
       - name: Set version number
         run: echo "VERSION_NUMBER=$(date +'%y%m%d.%H%M%S')" >> $GITHUB_ENV
       - name: Building docker image
-        run: docker build -t git.targo.ca/targo/targo_frontend_staging:2.${{ env.VERSION_NUMBER }} .
+        run: docker build -t git.targo.ca/targo/targo-frontend-staging:2.${{ env.VERSION_NUMBER }} .
       - name: Add tag Latest
-        run: docker tag git.targo.ca/targo/targo_frontend_staging:2.${{ env.VERSION_NUMBER }} git.targo.ca/targo/targo_frontend_staging:latest
+        run: docker tag git.targo.ca/targo/targo-frontend-staging:2.${{ env.VERSION_NUMBER }} git.targo.ca/targo/targo-frontend-staging:latest
       - name: Push images to server
         run:  |
           docker login -u ${{ secrets.CI_USER }} -p ${{ secrets.CI_PASSWORD }} git.targo.ca
-          docker push git.targo.ca/targo/targo_frontend_staging:2.${{ env.VERSION_NUMBER }}
-          docker push git.targo.ca/targo/targo_frontend_staging:latest
\ No newline at end of file
+          docker push git.targo.ca/targo/targo-frontend-staging:2.${{ env.VERSION_NUMBER }}
+          docker push git.targo.ca/targo/targo-frontend-staging:latest
diff --git a/Dockerfile b/Dockerfile
index fa43432..73f79ab 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,24 +1,15 @@
-# Step 1 - Building the app
-FROM node:22 AS build
-WORKDIR /app
-COPY package*.json ./
-# Install dependencies
-RUN npm install -g @quasar/cli
-COPY . .
-RUN npm ci
-RUN npm run build
-
-# Step 2 - Move Applicatin to Nginx
 FROM nginx:alpine
-COPY --from=build /app/dist/spa /usr/share/nginx/html
-RUN mkdir /usr/share/nginx/html/src
-COPY --from=build /app/src /usr/share/nginx/html/src
 
-COPY env.sh /docker-entrypoint.d/env.sh
+#Copy files
+RUN mkdir /usr/share/nginx/html/src
+COPY dist/spa /usr/share/nginx/html
+COPY source /usr/share/nginx/html/src
+
+#Add script to replace VITE env vars 
+RUN curl -o /docker-entrypoint.d/env.sh -O https://raw.githubusercontent.com/Dutchskull/Vite-Dynamic-Environment-Variables/refs/heads/main/app/env.sh
 RUN dos2unix /docker-entrypoint.d/env.sh
 RUN chmod +x /docker-entrypoint.d/env.sh
 
 ENTRYPOINT ["/docker-entrypoint.sh"]
-
 EXPOSE 80
-CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file
+CMD ["nginx", "-g", "daemon off;"]

From 2895284bc1c47e0bd82a2608da132aaa2506e696 Mon Sep 17 00:00:00 2001
From: Frederick Pruneau <frederick@targointernet.com>
Date: Tue, 24 Feb 2026 09:55:11 -0500
Subject: [PATCH 41/44] modification in action script

---
 .gitea/workflows/node-ci.yaml | 45 ++++++++++++++++-------------------
 1 file changed, 21 insertions(+), 24 deletions(-)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index c6b45c9..dc984a2 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -36,13 +36,13 @@ jobs:
       - name: Run linter
         run: npm run lint
 
-#      - name: Notify Google Chat
-#        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
-#        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-#        with:
-#          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-#          jobStatus: ${{ job.status }}
-#          title: Lint failed
+      - name: Notify Google Chat
+        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Lint failed
 
   test:
     runs-on: ubuntu-24.04
@@ -62,13 +62,13 @@ jobs:
       - name: Run tests
         run: npm test
 
-#      - name: Notify Google Chat
-#        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
-#        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
-#        with:
-#          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
-#          jobStatus: ${{ job.status }}
-#          title: Test failed
+      - name: Notify Google Chat
+        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Test failed
 
   build:
     runs-on: ubuntu-24.04
@@ -105,17 +105,14 @@ jobs:
           path: Dockerfile
           retention-days: 1
 
- #     - name: Notify Google Chat
- #       if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
- #       uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
- #       with:
- #         webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
- #         jobStatus: ${{ job.status }}
- #         title: Build failed
+      - name: Notify Google Chat
+        if: ${{ failure() }} # Use always to ensure that the notification is also send on failure of former steps
+        uses: SimonScholz/google-chat-action@3b3519e5102dba8aa5046fd711c4b553586409bb # v1.1.0
+        with:
+          webhookUrl: '${{ secrets.GOOGLE_CHAT_WEBHOOK }}'
+          jobStatus: ${{ job.status }}
+          title: Build failed
       
-      #- name: deploy
-      #  if: ${{ success() }}
-      #  run: docker build -t targo_frontend .
 
   deploy:
     needs: [lint, test, build]

From 883e6f8a3d09ae6f59f89b2914dbd1a53fb65eec Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Tue, 24 Feb 2026 11:04:24 -0500
Subject: [PATCH 42/44] fix(chatbot): correct formatting issue with text
 display, now displays markdown properly as html

---
 src/boot/axios.ts                             |   3 +-
 src/i18n/en-ca/index.ts                       |   1 +
 src/i18n/fr-ca/index.ts                       |   3 +-
 .../components/login-connection-panel.vue     | 131 ++++++++++--------
 .../chatbot/components/dialogue-phrase.vue    |  53 +++----
 5 files changed, 96 insertions(+), 95 deletions(-)

diff --git a/src/boot/axios.ts b/src/boot/axios.ts
index 3ac8c4c..612d74e 100644
--- a/src/boot/axios.ts
+++ b/src/boot/axios.ts
@@ -16,7 +16,8 @@ declare module 'vue' {
 // for each client)
 const api = axios.create({ 
     baseURL: import.meta.env.VITE_TARGO_BACKEND_URL, 
-    withCredentials: true 
+    withCredentials: true,
+    timeout: 5 * 60 * 1000, 
 });
 
 export default defineBoot(({ app }) => {
diff --git a/src/i18n/en-ca/index.ts b/src/i18n/en-ca/index.ts
index 3bba422..4f4be80 100644
--- a/src/i18n/en-ca/index.ts
+++ b/src/i18n/en-ca/index.ts
@@ -7,6 +7,7 @@ export default {
         error: {
             NO_REPLY_RECEIVED: "encountered an error while waiting for chatbot to reply",
             SEND_MESSAGE_FAILED: "unable to send message to chatbot",
+            GENERIC_RESPONSE_ERROR: "An error was encountered while waiting for the chatbot to reply, please try again.",
         },
     },
 
diff --git a/src/i18n/fr-ca/index.ts b/src/i18n/fr-ca/index.ts
index 7fe01c2..0252bb6 100644
--- a/src/i18n/fr-ca/index.ts
+++ b/src/i18n/fr-ca/index.ts
@@ -6,7 +6,8 @@ export default {
         chat_thinking: "Réflexion en cours...",
         error: {
             NO_REPLY_RECEIVED: "Une erreur est survenu lors de la réception de la réponse du chatbot",
-            SEND_MESSAGE_FAILED: "Une erreur est survenu lors de l'envoi de votre message",
+            SEND_MESSAGE_FAILED: "Une erreur est survenue lors de l'envoi de votre message",
+            GENERIC_RESPONSE_ERROR: "Le chatbot ne réponds pas pour le moment, veuillez réessayer.",
         },
     },
 
diff --git a/src/modules/auth/components/login-connection-panel.vue b/src/modules/auth/components/login-connection-panel.vue
index 0dd7755..dfeb369 100644
--- a/src/modules/auth/components/login-connection-panel.vue
+++ b/src/modules/auth/components/login-connection-panel.vue
@@ -12,6 +12,15 @@
     // const is_remembered = ref<boolean>(false);
     const is_employee_email = computed(() => email.value.includes('@targ'));
     const is_game_time = computed(() => email.value.includes('allumette'));
+
+    const onSubmitConnectionRequest = () => {
+        console.log('submit requested');
+        if (is_employee_email.value) return;
+    }
+
+    const onClickEmployeeConnect = () => {
+        auth_api.oidcLogin();
+    }
 </script>
 
 <template>
@@ -27,28 +36,31 @@
             />
         </div>
 
-        <div class="q-pt-sm q-px-xl q-pb-lg ">
-            <q-card-section class="text-center text-uppercase">
-                <div class="text-h6 text-weight-bold">
-                    {{ $t('login.page_header') }}
-                </div>
-            </q-card-section>
+        <div class="q-px-xl q-pb-lg ">
+            <div class="text-h6 text-weight-bold text-center text-uppercase q-py-sm">
+                {{ $t('login.page_header') }}
+            </div>
 
-            <q-form @submit="auth_api.login">
+            <q-form
+                @submit="onSubmitConnectionRequest"
+                autocomplete="on"
+            >
                 <q-input
                     v-model="email"
                     dense
                     outlined
+                    label-slot
+                    name="email"
                     color="accent"
                     label-color="accent"
                     class="rounded-5 inset-shadow bg-white"
-                    label-slot
                     input-class="text-h6 text-primary"
                 >
                     <template #label>
                         <span class="text-weight-bolder text-uppercase text-overline"> {{ $t('login.email') }} </span>
                     </template>
                 </q-input>
+
                 <!-- Stay-logged-in section, removed temporarly until customer module is up -->
                 <!-- <q-card-section
                     horizontal
@@ -86,58 +98,59 @@
                 <!-- <q-card-section class="text-center q-pa-none q-mt-none">
                     <RouterLink disabled class="text-primary" to="/signup">{{ $t('loginPage.signUp') }}</RouterLink>
                 </q-card-section> -->
+
+                <q-card-section class="row q-pt-sm">
+                    <q-separator
+                        size="2px"
+                        color="accent"
+                        class="col self-center"
+                    />
+                    <span class="col text-accent text-weight-bolder text-center text-uppercase self-center">{{
+                        $t('shared.misc.or') }}</span>
+                    <q-separator
+                        size="2px"
+                        color="accent"
+                        class="col self-center"
+                    />
+                </q-card-section>
+
+                <q-card-section class="column q-px-sm q-pt-none">
+                    <q-btn
+                        rounded
+                        push
+                        disabled
+                        color="blue-grey-7"
+                        icon="img:src/assets/Facebook-f_Logo-White-Logo.wine.svg"
+                        :label="$t('login.button.facebook')"
+                        class="full-width row q-mb-sm"
+                    >
+                        <q-tooltip
+                            anchor="top middle"
+                            class="bg-primary"
+                        >{{ $t('login.tooltip.coming_soon') }}</q-tooltip>
+                    </q-btn>
+                    <q-slide-transition>
+                        <div v-if="is_employee_email">
+                            <transition
+                                slow
+                                enter-active-class="animated zoomIn"
+                                leave-active-class="animated zoomOut"
+                            >
+                                <q-btn
+                                    push
+                                    rounded
+                                    type="submit"
+                                    color="accent"
+                                    icon="img:src/assets/logo-targo-simple.svg"
+                                    :label="$t('login.button.employee')"
+                                    class="full-width row"
+                                    @click="onClickEmployeeConnect"
+                                />
+                            </transition>
+                        </div>
+                    </q-slide-transition>
+                </q-card-section>
             </q-form>
-
-            <q-card-section class="row q-pt-sm">
-                <q-separator
-                    size="2px"
-                    color="accent"
-                    class="col self-center"
-                />
-                <span class="col text-accent text-weight-bolder text-center text-uppercase self-center">{{
-                    $t('shared.misc.or') }}</span>
-                <q-separator
-                    size="2px"
-                    color="accent"
-                    class="col self-center"
-                />
-            </q-card-section>
-
-            <q-card-section class="column q-px-sm q-pt-none">
-                <q-btn
-                    rounded
-                    push
-                    disabled
-                    color="blue-grey-7" 
-                    icon="img:src/assets/Facebook-f_Logo-White-Logo.wine.svg"
-                    :label="$t('login.button.facebook')"
-                    class="full-width row q-mb-sm"
-                >
-                    <q-tooltip
-                        anchor="top middle"
-                        class="bg-primary"
-                    >{{ $t('login.tooltip.coming_soon') }}</q-tooltip>
-                </q-btn>
-                <q-slide-transition>
-                    <div v-if="is_employee_email">
-                        <transition
-                            slow
-                            enter-active-class="animated zoomIn"
-                            leave-active-class="animated zoomOut"
-                        >
-                            <q-btn
-                                push
-                                rounded
-                                color="accent"
-                                icon="img:src/assets/logo-targo-simple.svg"
-                                :label="$t('login.button.employee')"
-                                class="full-width row"
-                                @click="auth_api.oidcLogin"
-                            />
-                        </transition>
-                    </div>
-                </q-slide-transition>
-            </q-card-section>
         </div>
     </q-card>
     <div v-if="is_game_time">
diff --git a/src/modules/chatbot/components/dialogue-phrase.vue b/src/modules/chatbot/components/dialogue-phrase.vue
index 7ed1152..60a59aa 100644
--- a/src/modules/chatbot/components/dialogue-phrase.vue
+++ b/src/modules/chatbot/components/dialogue-phrase.vue
@@ -2,49 +2,33 @@
     setup
     lang="ts"
 >
+    import MarkdownIt from 'markdown-it';
+
     import { computed } from 'vue';
-    // import MarkdownIt from 'markdown-it'
+    import { useI18n } from 'vue-i18n';
     import { useAuthStore } from 'src/stores/auth-store';
     import type { Message } from 'src/modules/chatbot/models/dialogue-message.model';
-    import { useI18n } from 'vue-i18n';
 
-    const { t } = useI18n();
-    const auth_store = useAuthStore();
+    // ========== state ========================================
 
     const { message } = defineProps<{
         message: Message;
     }>();
 
-    const message_text = computed(() => message.text.includes('chatbot.') ? t(message.text) : message.text)
+    const { t } = useI18n();
+    const authStore = useAuthStore();
+    const md = new MarkdownIt({
+        linkify: true,
+        typographer: true,
+    })
 
-    const is_error = computed(() => message.text.includes('NO_REPLY_RECEIVED') || message.text.includes('SEND_MESSAGE_FAILED'));
+    // ========== computed ========================================
 
-    // Initialize Markdown parser
-    // const md = new MarkdownIt({
-    //     // breaks: false,       // Support line breaks
-    //     linkify: true,      // Make URLs clickable
-    //     html: false         // Prevent raw HTML injection
-    // })
-
-    // // Removes all the h1,h2,h3 to make the Md more user friendly
-    // const cleanMarkdown = (markdown: string): string => {
-    //     if (!markdown) return ''
-    //     return markdown
-    //         .replace(/\r\n/g, '\n')                         // normalize Windows line endings
-    //         .replace(/([.!?])(\s+)(?=[A-Z])/g, '$1\n')      // insert line break after sentence-ending punctuation
-    //         .replace(/\n{3,}/g, '\n\n')                     // squash triple+ line breaks
-    //         .replace(/^#{1,3}\s(.*)$/gm, '#### $1')         // downgrade headings
-    // }
-
-    // // Compute parsed content
-    // const parsedText = computed((): string => {
-    //     const cleaned = cleanMarkdown(message.text || '')
-    //     if (cleaned.includes('chatbot.')) {
-    //         const translated_message = t(message.text);
-    //         return md.render(translated_message);
-    //     }
-    //     return md.render(cleaned);
-    // })
+    const message_text = computed(() => message.text.includes('chatbot.') ? 
+        t(message.text) : 
+        message.text.replaceAll("\\n", "\n")
+    );
+    const is_error = computed(() => message.text.includes('chatbot.error.'));
 </script>
 
 <template>
@@ -67,11 +51,12 @@
 
     <q-chat-message
         v-else
+        text-html
         :sent="message.sent"
-        :name="message.sent ? auth_store.user?.first_name : 'TargoBot'"
+        :name="message.sent ? authStore.user?.first_name : 'TargoBot'"
         :bg-color="message.sent ? 'accent' : 'info'"
         :text-color="message.sent ? 'white' : ''"
-        :text="[message_text]"
+        :text="[md.renderInline(message_text)]"
     />
 </template>
 

From c737109f36ed9b51b7f7b90ebc81b02914eeb5bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9rick=20Pruneau?=
 <frederick@targointernet.com>
Date: Wed, 25 Feb 2026 13:22:06 -0500
Subject: [PATCH 43/44] added restart stack api request to force update to
 staging app

---
 .gitea/workflows/node-ci.yaml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.gitea/workflows/node-ci.yaml b/.gitea/workflows/node-ci.yaml
index dc984a2..76a34ea 100644
--- a/.gitea/workflows/node-ci.yaml
+++ b/.gitea/workflows/node-ci.yaml
@@ -147,3 +147,4 @@ jobs:
           docker login -u ${{ secrets.CI_USER }} -p ${{ secrets.CI_PASSWORD }} git.targo.ca
           docker push git.targo.ca/targo/targo-frontend-staging:2.${{ env.VERSION_NUMBER }}
           docker push git.targo.ca/targo/targo-frontend-staging:latest
+          curl --location 'https://n8napi.targo.ca/webhook/portainer' --header 'Authorization: Basic ${{ secrets.API_SECRET}}' --form 'stack="new_targo_app_staging"'

From 0b7e29e5d0602f64be0e5db6748ca3811b9fbbcb Mon Sep 17 00:00:00 2001
From: Nic D <n_drolet@hotmail.ca>
Date: Wed, 25 Feb 2026 14:08:04 -0500
Subject: [PATCH 44/44] fix(chatbot): made error handling more explicit in
 replies.

---
 quasar.config.ts            | 8 ++++++--
 src/i18n/en-ca/index.ts     | 8 +++++---
 src/i18n/fr-ca/index.ts     | 8 +++++---
 src/stores/chatbot-store.ts | 7 ++++---
 4 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/quasar.config.ts b/quasar.config.ts
index 8e9ee05..205b2f3 100644
--- a/quasar.config.ts
+++ b/quasar.config.ts
@@ -41,7 +41,7 @@ export default defineConfig((ctx) => {
     build: {
       target: {
         browser: [ 'es2022', 'firefox115', 'chrome115', 'safari14' ],
-        node: 'node20'
+        node: 'node20',
       },
 
       typescript: {
@@ -66,7 +66,11 @@ export default defineConfig((ctx) => {
       // polyfillModulePreload: true,
       // distDir
 
-      // extendViteConf (viteConf) {},
+      extendViteConf: (_config) => ({ 
+        optimizeDeps: {
+          exclude: ['tesseract.js']
+        } 
+      }),
       // viteVuePluginOptions: {},
       
       vitePlugins: [
diff --git a/src/i18n/en-ca/index.ts b/src/i18n/en-ca/index.ts
index 4f4be80..9af138a 100644
--- a/src/i18n/en-ca/index.ts
+++ b/src/i18n/en-ca/index.ts
@@ -5,9 +5,11 @@ export default {
         chat_placeholder: "Enter a Message",
         chat_thinking: "Thinking...",
         error: {
-            NO_REPLY_RECEIVED: "encountered an error while waiting for chatbot to reply",
-            SEND_MESSAGE_FAILED: "unable to send message to chatbot",
-            GENERIC_RESPONSE_ERROR: "An error was encountered while waiting for the chatbot to reply, please try again.",
+            NO_REPLY_RECEIVED: "FRONTEND ERROR: the backend did not include a message text in the response",
+            NO_DATA_RECEIVED: "BACKEND ERROR: the backend did not receive any data from the AI agent",
+            NO_OUTPUT_RECEIVED: "BACKEND ERROR: the backend received data, but no output, from the AI agent",
+            SEND_MESSAGE_FAILED: "FRONTEND ERROR: Your message could not send or was timed out",
+            GENERIC_RESPONSE_ERROR: "BACKEND ERROR: An unexpected error occured while waiting for the backend to respond",
         },
     },
 
diff --git a/src/i18n/fr-ca/index.ts b/src/i18n/fr-ca/index.ts
index 0252bb6..a76fdd9 100644
--- a/src/i18n/fr-ca/index.ts
+++ b/src/i18n/fr-ca/index.ts
@@ -5,9 +5,11 @@ export default {
         chat_placeholder: "Entrez un Message",
         chat_thinking: "Réflexion en cours...",
         error: {
-            NO_REPLY_RECEIVED: "Une erreur est survenu lors de la réception de la réponse du chatbot",
-            SEND_MESSAGE_FAILED: "Une erreur est survenue lors de l'envoi de votre message",
-            GENERIC_RESPONSE_ERROR: "Le chatbot ne réponds pas pour le moment, veuillez réessayer.",
+            NO_REPLY_RECEIVED: "ERREUR FRONTEND: Le frontend n'a pas recu de message de l'IA dans la réponse du backend",
+            NO_DATA_RECEIVED: "ERREUR BACKEND: L'agent IA n'a pas inclu de data dans sa réponse au backend",
+            NO_OUTPUT_RECEIVED: "ERREUR BACKEND: L'agent IA a inclu du data, mais pas de output, dans sa réponse au backend",
+            SEND_MESSAGE_FAILED: "ERREUR FRONTEND: Une erreur est survenue lors de l'envoi de votre message, ou la connexion a été perdu",
+            GENERIC_RESPONSE_ERROR: "ERREUR BACKEND: Une erreur est survenu lors de la réception de la réponse du AI",
         },
     },
 
diff --git a/src/stores/chatbot-store.ts b/src/stores/chatbot-store.ts
index b0fc645..54600f9 100644
--- a/src/stores/chatbot-store.ts
+++ b/src/stores/chatbot-store.ts
@@ -16,17 +16,18 @@ export const useChatbotStore = defineStore("chatbot", () => {
 
         try {
             const chatbot_response = await chatbotService.sendChatMessage(user_message, current_page_context.value);
-            if (chatbot_response) {
+
+            if (chatbot_response.text) {
                 last_chatbot_message.text = chatbot_response.text;
                 last_chatbot_message.isThinking = false;
             } else {
                 last_chatbot_message.text = 'chatbot.error.NO_REPLY_RECEIVED';
                 last_chatbot_message.isThinking = false;
             }
-        }
-        catch (error) {
+        } catch (error) {
             last_chatbot_message.text = 'chatbot.error.SEND_MESSAGE_FAILED';
             last_chatbot_message.isThinking = false;
+            
             console.error('error sending message: ', error);
         }
     };