Commit 584a8eac authored by MrMan's avatar MrMan

Merge pull request #35 from t3hmrman/topic-26-fix-stale-recs-on-find-matches-page

Resolves #26, stale recs no longer present
parents aecf2dad a5746d30
......@@ -3,6 +3,7 @@ import Reflux from "reflux";
export default Reflux.createActions([
"authenticateWithTinder",
"error",
"getCurrentRec",
"getNextTinderRecommendation",
"like",
"loggedIn",
......
......@@ -22,16 +22,20 @@ class RecsPage extends React.Component {
// Set rec if available through the TinderRecommendationStore
if (_.isNull(this.state.rec) && !_.isNull(TinderRecommendationStore.state.currentRec)) {
this.state.rec = _.get(TinderRecommendationStore, "state.currentRec", null);
this.state.recsFetchFailed = _.get(TinderRecommendationStore, "state.recsFetchFailed", false);
}
}
componentDidMount() {
// Setup subscriptions
this.unsubFunctions["store-tinder-recommendations"] = TinderRecommendationStore.listen(state => {
console.log("[RECS PAGE COMPONENT] Detected recommendations update, updating list");
// Update list of recommendations
this.setState({rec: state.currentRec});
// Update current recommendation
console.log("[RECS PAGE COMPONENT] Detected rec store update, updating according to state:", state);
this.setState({rec: state.currentRec, recsFetchFailed: state.recsFetchFailed});
});
// Get the current rec
Actions.getCurrentRec();
}
componentWillUnmount() {
......@@ -46,25 +50,25 @@ class RecsPage extends React.Component {
pullRecommendations() { Actions.pullTinderRecommendations(); }
render() {
// Return early if there are no rec
if (_.isEmpty(this.state.rec)) {
// If there is no current rec, request some
if (_.isNull(this.state.rec)) {
this.pullRecommendations();
}
// Return early if there is no rec
if (_.isNull(this.state.rec) || this.state.recsFetchFailed) {
return (
<div>
<h3>0 Potential Recs</h3>
<h4>Maybe you&#39;d like to update your preferences?</h4>
<div className="row">
<button onClick={this.pullRecommendations} className="pure-button button-success in-stack">
<i className="fa fa-refresh"></i> Find Recommendations
</button>
</div>
<h3>{this.i18n`pages.recs.noRecsMessage`}</h3>
<h4>{_.isNull(this.state.rec) && !this.state.recsFetchFailed ? this.i18n`pages.recs.updatePrefsMaybe` : this.i18n`pages.recs.hitDailyLimitMaybe`}</h4>
<div className="row">
<button className="pure-button button-secondary in-stack">
<i className="fa fa-wrench"></i> Manage Preferences
<i className="fa fa-wrench"></i> {this.i18n`pages.recs.managePrefs`}
</button>
</div>
<div className="row">
<button onClick={this.context.history.goBack} className="pure-button button-error">
<i className="fa fa-arrow-left"></i> Back
<i className="fa fa-arrow-left"></i> {this.i18n`nav.back`}
</button>
</div>
</div>
......
......@@ -9,6 +9,7 @@ export default {
},
nav: {
loadingMessage: "Loading...",
back: "Back",
sections: {
findAMatch: "Find A Match",
matches: "Matches",
......@@ -41,6 +42,11 @@ export default {
login: "Login"
},
recs: {
noRecsMessage: "No more recommendations",
getMoreRecs: "Get More Recommendations",
hitDailyLimitMaybe: "Looks like you might have hit your daily limit of likes! Please try again tomorrow.",
updatePrefsMaybe: "Your preferences might also be keeping you from receiving recommendations.",
managePrefs: "Manage Preferences",
friendsInCommon: "{} friends in common",
commonInterests: "{} common interests",
lastActive: "last active"
......
......@@ -12,7 +12,8 @@ const DEFAULT_STATE = {
currentRec: null,
location: null,
tinderAccessToken: null,
requestInFlight: false
requestInFlight: false,
recsFetchFailed: false
};
const LocalStorageBackupMixin = LocalStorageBackupMixinGenerator(Constants.LOCALSTORAGE_KEY_TINDER_RECOMMENDATION_STORE_STATE);
......@@ -26,6 +27,7 @@ let RecommendationStore = Reflux.createStore({
this.listenTo(Actions.pullTinderRecommendations, this.pullRecommendations);
this.listenTo(Actions.getNextTinderRecommendation, this.getNextRecommendation);
this.listenTo(Actions.sentimentSuccessfullyProcessed, this.handleSentimentProcessing);
this.listenTo(Actions.getCurrentRec, () => this.trigger(this.state));
// Save the Tinder access token when provided by the TinderAuthStore
TinderAuthStore.listen(auth => {
......@@ -103,6 +105,8 @@ let RecommendationStore = Reflux.createStore({
this.state.currentRec = next || null;
this.backupState();
this.trigger(this.state);
console.log("[TINDER RECOMMENDATION STORE] Updated current rec, state:", this.state);
},
// Pull recommendations from tinder API
......@@ -110,10 +114,16 @@ let RecommendationStore = Reflux.createStore({
console.log("[TINDER RECOMMENDATION STORE] Attempting to pull recommendations from tinder...");
// Exit early if not all necessary credentials are available yet
if (!this.hasNecessaryCredentials()) { return; }
if (!this.hasNecessaryCredentials()) {
console.log("[TINDER RECOMMENDATION STORE] Missing necessary credentials for fetching recs from tinder...");
return;
}
// Exit early if there's a request in flight already
if (this.state.requestInFlight) { return; }
if (this.state.requestInFlight) {
console.log("[TINDER RECOMMENDATION STORE] Request already in flight, skipping fetch...");
return;
}
// Fetch Tinder recs
console.log("[TINDER RECOMMENDATION STORE] Performing GET...");
......@@ -121,23 +131,37 @@ let RecommendationStore = Reflux.createStore({
TinderAPI.GETWithToken(Constants.TINDER_RECS_URL, this.state.tinderAccessToken)
.then(resp => resp.json())
.then(resp => {
this.state.requestInFlight = false;
if (resp.status == 200) {
console.log("[TINDER RECOMMENDATION STORE] Successfully fetched recommendations: ", resp.results);
// Recs came through
console.log("[TINDER RECOMMENDATION STORE] Successfully fetched recs: ", resp.results);
this.state.recs = _.isNull(this.state.recs) ? resp.results : this.state.recs.concat(resp.results);
this.state.currentRec = _.isNull(this.state.recs) ? null : _.first(this.state.recs);
this.state.requestInFlight = false;
this.state.recsFetchFailed = false;
this.backupState();
this.trigger(this.state);
} else if (resp.status === "500") {
// Request went through but tinder reported error
console.log("[TINDER RECOMMENDATION STORE] Failed to retrieve recs, possible limit hit: ", resp);
this.state.recsFetchFailed = false;
this.backupState();
this.trigger(this.state);
} else {
console.log("[TINDER RECOMMENDATION STORE] Failed to retrieve recommendations, response: ", resp);
// Not sure what happened here
console.log("[TINDER RECOMMENDATION STORE] Failed to retrieve recs, response: ", resp);
this.state.recsFetchFailed = true;
this.backupState();
this.trigger(this.state);
}
})
.catch(err => {
this.state.requestInFlight = false;
this.state.recsFetchFailed = true;
this.backupState();
this.trigger(this.state);
alert("Failed to fetch Tinder recommendations");
console.log("[TINDER RECOMMENDATION STORE] Failed to fetch recommendations: ", err);
console.log("[TINDER RECOMMENDATION STORE] Failed to fetch recs: ", err);
});
},
......
......@@ -6,6 +6,7 @@ import _ from "lodash";
const EXPECTED_ACTIONS = [
"authenticateWithTinder",
"error",
"getCurrentRec",
"getNextTinderRecommendation",
"like",
"loggedIn",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment