feat: datepicker locale support (#3878)

Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/3878
Reviewed-by: konrad <k@knt.li>
Co-authored-by: nor <zorodey@outlook.com>
Co-committed-by: nor <zorodey@outlook.com>

src/views/project/ProjectGantt.vue

@@ -54,7 +54,7 @@ import {useI18n} from 'vue-i18n'
 import type {RouteLocationNormalized} from 'vue-router'
 
 import {useBaseStore} from '@/stores/base'
-import {useAuthStore} from '@/stores/auth'
+import { getFlatpickrLanguage } from '@/helpers/flatpickrLanguage'
 
 import Foo from '@/components/misc/flatpickr/Flatpickr.vue'
 import ProjectWrapper from '@/components/project/ProjectWrapper.vue'
@@ -126,16 +126,13 @@ const flatPickerDateRange = computed<Date[]>({
 const initialDateRange = [filters.value.dateFrom, filters.value.dateTo]
 
 const {t} = useI18n({useScope: 'global'})
-const authStore = useAuthStore()
 const flatPickerConfig = computed<Options>(() => ({
 	altFormat: t('date.altFormatShort'),
 	altInput: true,
 	defaultDate: initialDateRange,
 	enableTime: false,
 	mode: 'range',
-	locale: {
-		firstDayOfWeek: authStore.settings.weekStart,
-	},
+	locale: getFlatpickrLanguage(),
 }))
 </script>
 

src/views/user/settings/ApiTokens.vue

@@ -10,9 +10,9 @@ import {MILLISECONDS_A_DAY} from '@/constants/date'
 import flatPickr from 'vue-flatpickr-component'
 import 'flatpickr/dist/flatpickr.css'
 import {useI18n} from 'vue-i18n'
-import {useAuthStore} from '@/stores/auth'
 import Message from '@/components/misc/message.vue'
 import type {IApiToken} from '@/modelTypes/IApiToken'
+import { getFlatpickrLanguage } from '@/helpers/flatpickrLanguage'
 
 const service = new ApiTokenService()
 const tokens = ref<IApiToken[]>([])
@@ -32,18 +32,16 @@ const showDeleteModal = ref<boolean>(false)
 const tokenToDelete = ref<IApiToken>()
 
 const {t} = useI18n()
-const authStore = useAuthStore()
 
 const now = new Date()
+
 const flatPickerConfig = computed(() => ({
 	altFormat: t('date.altFormatLong'),
 	altInput: true,
 	dateFormat: 'Y-m-d H:i',
 	enableTime: true,
 	time_24hr: true,
-	locale: {
-		firstDayOfWeek: authStore.settings.weekStart,
-	},
+	locale: getFlatpickrLanguage(),
 	minDate: now,
 }))