Skip to content

Commit

Permalink
Merge pull request #242 from amansinghbais/import/fix-timezone
Browse files Browse the repository at this point in the history 
Fixed: timeZone does not gets updated for user login, removed confirm alert, and added loading state
  • Loading branch information
@ymaheshwari1
ymaheshwari1 authored Mar 18, 2024
2 parents 1ee28d1 + 6553126 commit 5ef2594
Show file tree
Hide file tree
Showing 3 changed files with 52 additions and 62 deletions.
3 changes: 1 addition & 2 deletions src/locales/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
"App": "App",
"Apply": "Apply",
"Any edits made on this page will be lost.": "Any edits made on this page made will be lost.",
"Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
"Are you sure you want to change the date time format?": "Are you sure you want to change the date time format?",
"Are you sure you want to delete this CSV mapping? This action cannot be undone.": "Are you sure you want to delete this CSV mapping? This action cannot be undone.",
"Are you sure you want to update this CSV mapping? This action cannot be undone.": "Are you sure you want to update this CSV mapping? This action cannot be undone.",
Expand Down Expand Up @@ -48,6 +47,7 @@
"Failed to save CSV mapping.": "Failed to save CSV mapping.",
"Failed to delete CSV mapping.": "Failed to delete CSV mapping.",
"Failed to update CSV mapping.": "Failed to update CSV mapping.",
"Fetching TimeZones": "Fetching TimeZones",
"Field mapping name": "Field mapping name",
"This CSV mapping has been saved.": "This CSV mapping has been saved.",
"This CSV mapping has been deleted.": "This CSV mapping has been deleted.",
Expand Down Expand Up @@ -164,7 +164,6 @@
"UI Components": "UI Components",
"Update": "Update",
"Update mapping": "Update mapping",
"Update time zone": "Update time zone",
"Update date time format": "Update date time format",
"Upload": "Upload",
"Upload a file": "Upload a file",
Expand Down
16 changes: 9 additions & 7 deletions src/store/modules/user/actions.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -150,13 +150,15 @@ const actions: ActionTree<UserState, RootState> = {
/**
* Update user timeZone
*/
async setUserTimeZone ( { state, commit }, payload) {
const resp = await UserService.setUserTimeZone(payload)
if (resp.status === 200 && !hasError(resp)) {
const current: any = state.current;
current.userTimeZone = payload.timeZoneId;
commit(types.USER_INFO_UPDATED, current);
showToast(translate("Time zone updated successfully"));
async setUserTimeZone({ state, commit }, payload) {
const current: any = state.current;
if(current.userTimeZone !== payload.tzId) {
const resp = await UserService.setUserTimeZone(payload)
if (resp.status === 200 && !hasError(resp)) {
current.userTimeZone = payload.tzId;
commit(types.USER_INFO_UPDATED, current);
showToast(translate("Time zone updated successfully"));
}
}
},

Expand Down
95 changes: 42 additions & 53 deletions src/views/TimezoneModal.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,36 +9,40 @@
<ion-title>{{ $t("Select time zone") }}</ion-title>
</ion-toolbar>
<ion-toolbar>
<ion-searchbar @ionFocus="selectSearchBarText($event)" :placeholder="$t('Search time zones')" v-model="queryString" @keyup.enter="queryString = $event.target.value; findTimeZone()" @keydown="preventSpecialCharacters($event)" />
<ion-searchbar @ionFocus="selectSearchBarText($event)" :placeholder="$t('Search time zones')" v-model="queryString" @ionChange="findTimeZone()" @keydown="preventSpecialCharacters($event)" />
</ion-toolbar>
</ion-header>

<ion-content class="ion-padding">
<!-- Empty state -->
<div class="empty-state" v-if="isLoading">
<ion-item lines="none">
<ion-spinner color="secondary" name="crescent" slot="start" />
{{ $t("Fetching time zones") }}
</ion-item>
</div>
<div class="empty-state" v-else-if="filteredTimeZones.length === 0">
<p>{{ $t("No time zone found") }}</p>
</div>
<form @keyup.enter="setUserTimeZone">
<!-- Empty state -->
<div class="empty-state" v-if="isLoading">
<ion-item lines="none">
<ion-spinner color="secondary" name="crescent" slot="start" />
{{ $t("Fetching time zones") }}
</ion-item>
</div>

<!-- Timezones -->
<div v-else>
<ion-list>
<ion-radio-group value="rd" v-model="timeZoneId">
<ion-item :key="timeZone.id" v-for="timeZone in filteredTimeZones">
<ion-label>{{ timeZone.label }} ({{ timeZone.id }})</ion-label>
<ion-radio :value="timeZone.id" slot="start" />
</ion-item>
</ion-radio-group>
</ion-list>
</div>

<div class="empty-state" v-else-if="filteredTimeZones.length === 0">
<p>{{ $t("No time zone found") }}</p>
</div>

<!-- Timezones -->
<div v-else>
<ion-list>
<ion-radio-group value="rd" v-model="timeZoneId">
<ion-item :key="timeZone.id" v-for="timeZone in filteredTimeZones">
<ion-label>{{ timeZone.label }} ({{ timeZone.id }})</ion-label>
<ion-radio :value="timeZone.id" slot="start" />
</ion-item>
</ion-radio-group>
</ion-list>
</div>
</form>

<!-- Defined ion-fab outside of form element as the fab button losoe its styling when wrapped inside form -->
<ion-fab vertical="bottom" horizontal="end" slot="fixed">
<ion-fab-button :disabled="!timeZoneId" @click="saveAlert">
<ion-fab-button :disabled="!timeZoneId" @click="setUserTimeZone">
<ion-icon :icon="save" />
</ion-fab-button>
</ion-fab>
Expand All @@ -63,8 +67,8 @@ import {
IonSpinner,
IonTitle,
IonToolbar,
modalController,
alertController } from "@ionic/vue";
modalController
} from "@ionic/vue";
import { defineComponent } from "vue";
import { close, save } from "ionicons/icons";
import { useStore } from "@/store";
Expand Down Expand Up @@ -105,25 +109,6 @@ export default defineComponent({
closeModal() {
modalController.dismiss({ dismissed: true });
},
async saveAlert() {
const message = this.$t("Are you sure you want to change the time zone to?", { timeZoneId: this.timeZoneId });
const alert = await alertController.create({
header: this.$t("Update time zone"),
message,
buttons: [
{
text: this.$t("Cancel"),
},
{
text: this.$t("Confirm"),
handler: () => {
this.setUserTimeZone();
}
}
],
});
return alert.present();
},
preventSpecialCharacters($event: any) {
// Searching special characters fails the API, hence, they must be omitted
if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test($event.key)) $event.preventDefault();
Expand All @@ -136,13 +121,17 @@ export default defineComponent({
},
async getAvailableTimeZones() {
this.isLoading = true;
const resp = await UserService.getAvailableTimeZones()
if(resp.status === 200 && !hasError(resp)) {
// We are filtering valid the timeZones coming with response here
this.timeZones = resp.data.filter((timeZone: any) => {
return DateTime.local().setZone(timeZone.id).isValid;
});
this.findTimeZone();
try {
const resp = await UserService.getAvailableTimeZones()
if(resp.status === 200 && !hasError(resp)) {
// We are filtering valid the timeZones coming with response here
this.timeZones = resp.data.filter((timeZone: any) => {
return DateTime.local().setZone(timeZone.id).isValid;
});
this.findTimeZone();
}
} catch(err) {
console.error(err)
}
this.isLoading = false;
},
Expand All @@ -152,7 +141,7 @@ export default defineComponent({
},
async setUserTimeZone() {
await this.store.dispatch("user/setUserTimeZone", {
"timeZoneId": this.timeZoneId
"tzId": this.timeZoneId
})
this.closeModal()
}
Expand Down

0 comments on commit 5ef2594

Please sign in to comment.