only load the coaches once a minute
This commit is contained in:
parent
1f361349fe
commit
c5bb1139f8
|
@ -12,7 +12,9 @@
|
||||||
<base-card>
|
<base-card>
|
||||||
<section>
|
<section>
|
||||||
<div class="controls">
|
<div class="controls">
|
||||||
<base-button mode="outline" @click="loadCoaches">Refresh</base-button>
|
<base-button mode="outline" @click="loadCoaches(true)"
|
||||||
|
>Refresh</base-button
|
||||||
|
>
|
||||||
<base-button v-if="!isCoach && !isLoading" link to="/register"
|
<base-button v-if="!isCoach && !isLoading" link to="/register"
|
||||||
>Register as Coach</base-button
|
>Register as Coach</base-button
|
||||||
>
|
>
|
||||||
|
@ -83,10 +85,12 @@ export default {
|
||||||
setFilter(updatedFilters) {
|
setFilter(updatedFilters) {
|
||||||
this.activeFilters = updatedFilters;
|
this.activeFilters = updatedFilters;
|
||||||
},
|
},
|
||||||
async loadCoaches() {
|
async loadCoaches(refresh = false) {
|
||||||
this.isLoading = true;
|
this.isLoading = true;
|
||||||
try {
|
try {
|
||||||
await this.$store.dispatch('coaches/loadCoaches');
|
await this.$store.dispatch('coaches/loadCoaches', {
|
||||||
|
forceRefresh: refresh
|
||||||
|
});
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
this.error = error || 'Something went wrong!';
|
this.error = error || 'Something went wrong!';
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,7 +22,10 @@ export default {
|
||||||
console.log(err.message);
|
console.log(err.message);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async loadCoaches(context) {
|
async loadCoaches(context, payload) {
|
||||||
|
if (!payload.forceRefresh && !context.getters.shouldUpdate) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
try {
|
try {
|
||||||
const response = await getAPI.get('coaches.json');
|
const response = await getAPI.get('coaches.json');
|
||||||
const responseData = response.data;
|
const responseData = response.data;
|
||||||
|
@ -39,6 +42,7 @@ export default {
|
||||||
coaches.push(coach);
|
coaches.push(coach);
|
||||||
}
|
}
|
||||||
context.commit('setCoaches', coaches);
|
context.commit('setCoaches', coaches);
|
||||||
|
context.commit('setFetchTimestamp');
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
const error = new Error(err.message || 'Failed to fetch!');
|
const error = new Error(err.message || 'Failed to fetch!');
|
||||||
throw error;
|
throw error;
|
||||||
|
|
|
@ -9,5 +9,13 @@ export default {
|
||||||
const coaches = getters.coaches;
|
const coaches = getters.coaches;
|
||||||
const userId = rootGetters.userId;
|
const userId = rootGetters.userId;
|
||||||
return coaches.some(coach => coach.id === userId);
|
return coaches.some(coach => coach.id === userId);
|
||||||
|
},
|
||||||
|
shouldUpdate(state) {
|
||||||
|
const lastFetch = state.lastFetch;
|
||||||
|
if (!lastFetch) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
const currentTimeStamp = new Date().getTime();
|
||||||
|
return (currentTimeStamp - lastFetch) / 1000 > 60;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -6,26 +6,8 @@ export default {
|
||||||
namespaced: true,
|
namespaced: true,
|
||||||
state() {
|
state() {
|
||||||
return {
|
return {
|
||||||
coaches: [
|
lastFetch: null,
|
||||||
{
|
coaches: []
|
||||||
id: 'c1',
|
|
||||||
firstName: 'Maximilian',
|
|
||||||
lastName: 'Schwarzmüller',
|
|
||||||
areas: ['frontend', 'backend', 'career'],
|
|
||||||
description:
|
|
||||||
"I'm Maximilian and I've worked as a freelance web developer for years. Let me help you become a developer as well!",
|
|
||||||
hourlyRate: 30
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 'c2',
|
|
||||||
firstName: 'Julie',
|
|
||||||
lastName: 'Jones',
|
|
||||||
areas: ['frontend', 'career'],
|
|
||||||
description:
|
|
||||||
'I am Julie and as a senior developer in a big tech company, I can help you get your first job or progress in your current role.',
|
|
||||||
hourlyRate: 30
|
|
||||||
}
|
|
||||||
]
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
actions,
|
actions,
|
||||||
|
|
|
@ -4,5 +4,8 @@ export default {
|
||||||
},
|
},
|
||||||
setCoaches(state, payload) {
|
setCoaches(state, payload) {
|
||||||
state.coaches = payload;
|
state.coaches = payload;
|
||||||
|
},
|
||||||
|
setFetchTimestamp(state) {
|
||||||
|
state.lastFetch = new Date().getTime();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Reference in New Issue