Client: remove unnecessary API calls + members fixes (#12179)

* wip

* refactor world state

* allow resource to be reloaded when the server is updated

* fix #9242

* fix event listeners

* remove un-needed code

* add tests for  asyncResourceFactory reloadOnAppVersionChange

* fix double cron notifications and party members showing up in the header after a party invitation is accepted

* remove console.log

* do not send vm info to loggly due to circular dependency + fix typo

* fix #12181

* do not load invites multiple times in members modal

* add hover to challenge member count

* groups: load members only on demand

* minor ui fixes

* choose class: fix vue duplicate key warning

* minor ui fixes

* challanges: load members on demand

* add loading spinner

* change loading mechanism

* fix loading gryphon issues

* reduce code duplication
This commit is contained in:
Matteo Pagliazzi
2020-05-25 17:02:29 +02:00
committed by GitHub
parent ca80f4ee33
commit 08f1e2b273
50 changed files with 394 additions and 259 deletions

View File

@@ -297,7 +297,7 @@ export default {
};
},
computed: {
...mapState(['isUserLoggedIn', 'browserTimezoneOffset', 'isUserLoaded']),
...mapState(['isUserLoggedIn', 'browserTimezoneOffset', 'isUserLoaded', 'notificationsRemoved']),
...mapState({ user: 'user.data' }),
isStaticPage () {
return this.$route.meta.requiresLogin === false;
@@ -361,13 +361,55 @@ export default {
showSpinner: false,
});
// Set up Error interceptors
axios.interceptors.response.use(response => {
if (this.user && response.data && response.data.notifications) {
this.$set(this.user, 'notifications', response.data.notifications);
axios.interceptors.response.use(response => { // Set up Response interceptors
// Verify that the user was not updated from another browser/app/client
// If it was, sync
const { url } = response.config;
const { method } = response.config;
const isApiCall = url.indexOf('api/v4') !== -1;
const userV = response.data && response.data.userV;
const isCron = url.indexOf('/api/v4/cron') === 0 && method === 'post';
if (this.isUserLoaded && isApiCall && userV) {
const oldUserV = this.user._v;
this.user._v = userV;
// Do not sync again if already syncing
const isUserSync = url.indexOf('/api/v4/user') === 0 && method === 'get';
const isTasksSync = url.indexOf('/api/v4/tasks/user') === 0 && method === 'get';
// exclude chat seen requests because with real time chat they would be too many
const isChatSeen = url.indexOf('/chat/seen') !== -1 && method === 'post';
// exclude POST /api/v4/cron because the user is synced automatically after cron runs
// Something has changed on the user object that was not tracked here, sync the user
if (userV - oldUserV > 1 && !isCron && !isChatSeen && !isUserSync && !isTasksSync) {
Promise.all([
this.$store.dispatch('user:fetch', { forceLoad: true }),
this.$store.dispatch('tasks:fetchUserTasks', { forceLoad: true }),
]);
}
}
// Store the app version from the server
const serverAppVersion = response.data && response.data.appVersion;
if (serverAppVersion && this.$store.state.serverAppVersion !== response.data.appVersion) {
this.$store.state.serverAppVersion = serverAppVersion;
}
// Store the notifications, filtering those that have already been read
// See store/index.js on why this is necessary
if (this.user && response.data && response.data.notifications) {
const filteredNotifications = response.data.notifications.filter(serverNotification => {
if (this.notificationsRemoved.includes(serverNotification.id)) return false;
return true;
});
this.$set(this.user, 'notifications', filteredNotifications);
}
return response;
}, error => {
}, error => { // Set up Error interceptors
if (error.response.status >= 400) {
const isBanned = this.checkForBannedUser(error);
if (isBanned === true) return null; // eslint-disable-line consistent-return
@@ -425,51 +467,6 @@ export default {
return Promise.reject(error);
});
axios.interceptors.response.use(response => {
// Verify that the user was not updated from another browser/app/client
// If it was, sync
const { url } = response.config;
const { method } = response.config;
const isApiCall = url.indexOf('api/v4') !== -1;
const userV = response.data && response.data.userV;
const isCron = url.indexOf('/api/v4/cron') === 0 && method === 'post';
if (this.isUserLoaded && isApiCall && userV) {
const oldUserV = this.user._v;
this.user._v = userV;
// Do not sync again if already syncing
const isUserSync = url.indexOf('/api/v4/user') === 0 && method === 'get';
const isTasksSync = url.indexOf('/api/v4/tasks/user') === 0 && method === 'get';
// exclude chat seen requests because with real time chat they would be too many
const isChatSeen = url.indexOf('/chat/seen') !== -1 && method === 'post';
// exclude POST /api/v4/cron because the user is synced automatically after cron runs
// Something has changed on the user object that was not tracked here, sync the user
if (userV - oldUserV > 1 && !isCron && !isChatSeen && !isUserSync && !isTasksSync) {
Promise.all([
this.$store.dispatch('user:fetch', { forceLoad: true }),
this.$store.dispatch('tasks:fetchUserTasks', { forceLoad: true }),
]);
}
}
// Verify the client is updated
// const serverAppVersion = response.data.appVersion;
// let serverAppVersionState = this.$store.state.serverAppVersion;
// if (isApiCall && !serverAppVersionState) {
// this.$store.state.serverAppVersion = serverAppVersion;
// } else if (isApiCall && serverAppVersionState !== serverAppVersion) {
// if (document.activeElement.tagName !== 'INPUT'
// || confirm(this.$t('habiticaHasUpdated'))) {
// location.reload(true);
// }
// }
return response;
});
// Setup listener for title
this.$store.watch(state => state.title, title => {
document.title = title;