From 720f83bd0ba382da705d6cd09a609bc4ddf51f4c Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Mon, 26 Aug 2024 23:32:12 +0800
Subject: [PATCH] show multiple selected week days in the order of the week day
 list

---
 .../desktop/ScheduleFrequencySelect.vue       |  2 +-
 src/lib/i18n.js                               | 33 +++++++++++++++++--
 src/views/mobile/transactions/EditPage.vue    |  5 ++-
 3 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/src/components/desktop/ScheduleFrequencySelect.vue b/src/components/desktop/ScheduleFrequencySelect.vue
index 22853482..a61c2114 100644
--- a/src/components/desktop/ScheduleFrequencySelect.vue
+++ b/src/components/desktop/ScheduleFrequencySelect.vue
@@ -146,7 +146,7 @@ export default {
             } else if (this.type === templateConstants.allTemplateScheduledFrequencyTypes.Weekly.type) {
                 if (this.frequencyValue.length) {
                     return this.$t('format.misc.everyMultiDaysOfWeek', {
-                        days: this.$locale.getMultiWeekdayLongNames(this.frequencyValue)
+                        days: this.$locale.getMultiWeekdayLongNames(this.frequencyValue, this.firstDayOfWeek)
                     });
                 } else {
                     return this.$t('Weekly');
diff --git a/src/lib/i18n.js b/src/lib/i18n.js
index d1279c95..62e06e24 100644
--- a/src/lib/i18n.js
+++ b/src/lib/i18n.js
@@ -350,9 +350,36 @@ function getMultiMonthdayShortNames(monthDays, translateFn) {
     }
 }
 
-function getMultiWeekdayLongNames(weekdayTypes, translateFn) {
+function getMultiWeekdayLongNames(weekdayTypes, firstDayOfWeek, translateFn) {
+    const weekdayTypesMap = {};
+    const finalWeekdayTypes = [];
+
+    if (!isNumber(firstDayOfWeek)) {
+        firstDayOfWeek = datetimeConstants.allWeekDays.Sunday.type;
+    }
+
+    for (let i = 0; i < weekdayTypes.length; i++) {
+        weekdayTypesMap[weekdayTypes[i]] = true;
+    }
+
+    for (let i = firstDayOfWeek; i < datetimeConstants.allWeekDaysArray.length; i++) {
+        const weekDay = datetimeConstants.allWeekDaysArray[i];
+
+        if (weekdayTypesMap[weekDay.type]) {
+            finalWeekdayTypes.push(weekDay.type);
+        }
+    }
+
+    for (let i = 0; i < firstDayOfWeek; i++) {
+        const weekDay = datetimeConstants.allWeekDaysArray[i];
+
+        if (weekdayTypesMap[weekDay.type]) {
+            finalWeekdayTypes.push(weekDay.type);
+        }
+    }
+
     const allWeekDays = getAllWeekDays(null, translateFn)
-    return joinMultiText(weekdayTypes.map(type => getNameByKeyValue(allWeekDays, type, 'type', 'displayName')), translateFn);
+    return joinMultiText(finalWeekdayTypes.map(type => getNameByKeyValue(allWeekDays, type, 'type', 'displayName')), translateFn);
 }
 
 function getI18nLongDateFormat(translateFn, formatTypeValue) {
@@ -1515,7 +1542,7 @@ export function i18nFunctions(i18nGlobal) {
         getWeekdayShortName: (weekDay) => getWeekdayShortName(weekDay, i18nGlobal.t),
         getWeekdayLongName: (weekDay) => getWeekdayLongName(weekDay, i18nGlobal.t),
         getMultiMonthdayShortNames: (monthdays) => getMultiMonthdayShortNames(monthdays, i18nGlobal.t),
-        getMultiWeekdayLongNames: (weekdayTypes) => getMultiWeekdayLongNames(weekdayTypes, i18nGlobal.t),
+        getMultiWeekdayLongNames: (weekdayTypes, firstDayOfWeek) => getMultiWeekdayLongNames(weekdayTypes, firstDayOfWeek, i18nGlobal.t),
         formatUnixTimeToLongDateTime: (userStore, unixTime, utcOffset, currentUtcOffset) => formatUnixTime(unixTime, getI18nLongDateFormat(i18nGlobal.t, userStore.currentUserLongDateFormat) + ' ' + getI18nLongTimeFormat(i18nGlobal.t, userStore.currentUserLongTimeFormat), utcOffset, currentUtcOffset),
         formatUnixTimeToShortDateTime: (userStore, unixTime, utcOffset, currentUtcOffset) => formatUnixTime(unixTime, getI18nShortDateFormat(i18nGlobal.t, userStore.currentUserShortDateFormat) + ' ' + getI18nShortTimeFormat(i18nGlobal.t, userStore.currentUserShortTimeFormat), utcOffset, currentUtcOffset),
         formatUnixTimeToLongDate: (userStore, unixTime, utcOffset, currentUtcOffset) => formatUnixTime(unixTime, getI18nLongDateFormat(i18nGlobal.t, userStore.currentUserLongDateFormat), utcOffset, currentUtcOffset),
diff --git a/src/views/mobile/transactions/EditPage.vue b/src/views/mobile/transactions/EditPage.vue
index 95654f24..85e51866 100644
--- a/src/views/mobile/transactions/EditPage.vue
+++ b/src/views/mobile/transactions/EditPage.vue
@@ -526,6 +526,9 @@ export default {
         defaultAccountId() {
             return this.userStore.currentUserDefaultAccountId;
         },
+        firstDayOfWeek() {
+            return this.userStore.currentUserFirstDayOfWeek;
+        },
         allTransactionTypes() {
             return transactionConstants.allTransactionTypes;
         },
@@ -628,7 +631,7 @@ export default {
             if (this.transaction.scheduledFrequencyType === templateConstants.allTemplateScheduledFrequencyTypes.Weekly.type) {
                 if (scheduledFrequencyValues.length) {
                     return this.$t('format.misc.everyMultiDaysOfWeek', {
-                        days: this.$locale.getMultiWeekdayLongNames(scheduledFrequencyValues)
+                        days: this.$locale.getMultiWeekdayLongNames(scheduledFrequencyValues, this.firstDayOfWeek)
                     });
                 } else {
                     return this.$t('Weekly');