Apollo fetchMore's updateQuery doesn't do anything

apollo
1

I’m defining an observableQuery and subscribe to it in my component upon initialization. Then later on I do fetchMore but the updateQuery does not seem to be done anything useful. Note: I’m using vanilla apolloClient without a specific implementation.

The first time I run fetchMore, new items get appended as expected. As soon as I call fetchMore again, it seems that previousResult has not changed from the last time. I’d expect my queries to be the contents of:

[firstQueryResults before fetchMore]

[firstQueryResults + secondQueryResults]

[firstQueryResults + secondQueryResults + thirdQueryResults]

Instead I am getting:

[firstQueryResults + thirdQueryResults]

fetchMore() {
	this.currentOffset = this.currentOffset + 5;

	this.observableQuery.fetchMore({
		variables: {
			offset: this.currentOffset,
			limit: this.currentLimit,
		},
		updateQuery: (previousResult, { fetchMoreResult }) => {
			if (!fetchMoreResult) {
				return previousResult;
			}

			var newEntries = fetchMoreResult.getStoriesByDate;
			var combinedEntries = [...previousResult.getStoriesByDate, ...newEntries];
			// console.log(newEntries);
			// console.log(combinedEntries);
			// these two return exactly what I expect them to
			// but the return value doesn't do anything

			return Object.assign({}, previousResult, {
			 	// Append the new feed results to the old one
			 	getStoriesByDate: [...previousResult.getStoriesByDate, ...fetchMoreResult.getStoriesByDate],
			 });
		},
	});
}

getStoriesByDate() {
	this.currentLimit = 5;
	this.currentOffset = 0;
	this.observableQuery = apolloClient.watchQuery({
		query: gql`
			query getStories($limit: Int, $offset: Int) {
				getStoriesByDate(limit: $limit, offset: $offset) {
					_id
					title
					longUrl
					shortUrl
					date
					authorId
					category
					author {
						name
					}
					commentsCount
					votesCount
					voters
				}
			}
		`,
		pollInterval: 30000,
		variables: {
			limit: this.currentLimit,
			offset: this.currentOffset,
		},
	});


	this.subscription = this.observableQuery.subscribe({
		next: ({ data }) => {
			this.stories = data.getStoriesByDate;
		}
	});
}

Am I misunderstanding how this is supposed to work? I would expect that the return value from updateQuery gets added to the subscription data, meaning that my next hook in the subscribe function would update the stories field accordingly. I’ve tried so many approaches but I feel like the return value of updateQuery just doesn’t have any relevance anywhere which obviously can’t be right.

Any feedback what’s wrong here? Am I just misunderstanding how this is supposed to work?