From 59da6686d08071db7011bc928dc50c5c3a78553b Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Fri, 14 Jan 2022 21:52:00 +0100
Subject: [PATCH 1/2] feat: add authenticated http factory to create an axios
 instance with bearer header

---
 src/http-common/index.js  | 13 ++++++++++++-
 src/store/modules/auth.js | 10 +++-------
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/src/http-common/index.js b/src/http-common/index.js
index 66835fc5fa..e6c116cd62 100644
--- a/src/http-common/index.js
+++ b/src/http-common/index.js
@@ -1,7 +1,18 @@
 import axios from 'axios'
+import {getToken} from '@/helpers/auth'
 
-export const HTTPFactory = () => {
+export function HTTPFactory() {
 	return axios.create({
 		baseURL: window.API_URL,
 	})
 }
+
+export function AuthenticatedHTTPFactory(token = getToken()) {	
+	return axios.create({
+		baseURL: window.API_URL,
+		headers: {
+			Authorization: `Bearer ${token}`,
+			'Content-Type': 'application/json',
+		},
+	})
+}
diff --git a/src/store/modules/auth.js b/src/store/modules/auth.js
index 9e2f9cbb89..99291a2a97 100644
--- a/src/store/modules/auth.js
+++ b/src/store/modules/auth.js
@@ -1,4 +1,4 @@
-import {HTTPFactory} from '@/http-common'
+import {HTTPFactory, AuthenticatedHTTPFactory} from '@/http-common'
 import {i18n, getCurrentLanguage, saveLanguage} from '@/i18n'
 import {objectToSnakeCase} from '@/helpers/case'
 import {LOADING} from '../mutation-types'
@@ -215,13 +215,9 @@ export default {
 				return
 			}
 
-			const HTTP = HTTPFactory()
+			const HTTP = AuthenticatedHTTPFactory(jwt)
 			try {
-				const response = await HTTP.get('user', {
-					headers: {
-						Authorization: `Bearer ${jwt}`,
-					},
-				})
+				const response = await HTTP.get('user')
 				const info = new UserModel(response.data)
 				info.type = state.info.type
 				info.email = state.info.email

From a812793eadb83d430bc5ae70d4542d23cfeaac88 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Fri, 14 Jan 2022 22:02:45 +0100
Subject: [PATCH 2/2] feat: add setting for time zone to user settings

---
 src/i18n/lang/en.json               |  3 ++-
 src/models/userSettings.js          |  1 +
 src/views/user/settings/General.vue | 36 +++++++++++++++++++++++++----
 3 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/src/i18n/lang/en.json b/src/i18n/lang/en.json
index 585cdfb06b..306eb3f564 100644
--- a/src/i18n/lang/en.json
+++ b/src/i18n/lang/en.json
@@ -85,7 +85,8 @@
         "weekStartSunday": "Sunday",
         "weekStartMonday": "Monday",
         "language": "Language",
-        "defaultList": "Default List"
+        "defaultList": "Default List",
+        "timezone": "Time Zone"
       },
       "totp": {
         "title": "Two Factor Authentication",
diff --git a/src/models/userSettings.js b/src/models/userSettings.js
index 6ed0ffe588..41932e261b 100644
--- a/src/models/userSettings.js
+++ b/src/models/userSettings.js
@@ -11,6 +11,7 @@ export default class UserSettingsModel extends AbstractModel {
 			overdueTasksRemindersEnabled: true,
 			defaultListId: undefined,
 			weekStart: 0,
+			timezone: '',
 		}
 	}
 }
\ No newline at end of file
diff --git a/src/views/user/settings/General.vue b/src/views/user/settings/General.vue
index 876bef26f1..279b004ffb 100644
--- a/src/views/user/settings/General.vue
+++ b/src/views/user/settings/General.vue
@@ -92,9 +92,9 @@
 		</div>
 		<div class="field">
 			<label class="is-flex is-align-items-center">
-					<span>
-						{{ $t('user.settings.appearance.title') }}
-					</span>
+				<span>
+					{{ $t('user.settings.appearance.title') }}
+				</span>
 				<div class="select ml-2">
 					<select v-model="activeColorSchemeSetting">
 						<!-- TODO: use the Vikunja logo in color scheme as option buttons -->
@@ -105,6 +105,20 @@
 				</div>
 			</label>
 		</div>
+		<div class="field">
+			<label class="is-flex is-align-items-center">
+				<span>
+					{{ $t('user.settings.general.timezone') }}
+				</span>
+				<div class="select ml-2">
+					<select v-model="settings.timezone">
+						<option v-for="tz in availableTimezones" :key="tz">
+							{{ tz }}
+						</option>
+					</select>
+				</div>
+			</label>
+		</div>
 
 		<x-button
 			:loading="loading"
@@ -118,7 +132,7 @@
 </template>
 
 <script>
-import {computed, watch} from 'vue'
+import {computed, watch, ref} from 'vue'
 import {useI18n} from 'vue-i18n'
 
 import {playSoundWhenDoneKey, playPop} from '@/helpers/playPop'
@@ -129,6 +143,7 @@ import ListSearch from '@/components/tasks/partials/listSearch'
 import {createRandomID} from '@/helpers/randomId'
 import {useColorScheme} from '@/composables/useColorScheme'
 import {success} from '@/message'
+import {AuthenticatedHTTPFactory} from '@/http-common'
 
 const DEFAULT_LIST_ID = 0
 
@@ -155,6 +170,18 @@ function useColorSchemeSetting() {
 	}
 }
 
+function useAvailableTimezones() {
+	const availableTimezones = ref([])
+
+	const HTTP = AuthenticatedHTTPFactory()
+	HTTP.get('user/timezones')
+		.then(r => {
+			availableTimezones.value = r.data.sort()
+		})
+
+	return availableTimezones
+}
+
 function getPlaySoundWhenDoneSetting() {
 	return localStorage.getItem(playSoundWhenDoneKey) === 'true' || localStorage.getItem(playSoundWhenDoneKey) === null
 }
@@ -193,6 +220,7 @@ export default {
 	setup() {
 		return {
 			...useColorSchemeSetting(),
+			availableTimezones: useAvailableTimezones(),
 		}
 	},