title: How to find out I'm on the last page when querying Facebook Graph API?
body: <p>As an exercise I'm writing simple (and also as stateless as possible) client-side application (in React) displaying posts in feed of single Facebook entity. The application gets its data from Facebook Graph API.</p>
  
  <p>I use Facebook JS SDK to query the following URL: <code>/&lt;entity-id&gt;/feed?limit=20&amp;fields=...</code></p>
  
  <p>I have simple paging buttons ("previous" &amp; "next"), which are querying paging URLs received in API response in <code>response.paging.previous</code> and  <code>response.paging.next</code> respectively.</p>
  
  <p>The problem is <strong>I don't know how to find out if I'm on the last page</strong> to disable the "next" button correctly.</p>
  
  <p>There are couple of things I tried, however I still don't get what I want.</p>
  
  <p><strong>Option 1: Allow clicking "next" until there are no more data in response</strong></p>
  
  <ul>
  <li><p>Button gets disabled when <code>response.data.length == 0</code>.</p></li>
  <li><p><code>paging</code> object contains <code>next</code> URL even when there are no more data to be received, so I can't check it before getting to page with no data.</p></li>
  <li><p>Problem is that when I get to that page, there is also no <code>paging</code> object included in <code>response</code>. As a result I can't use the "previous" button to get back to the last page with data.</p></li>
  </ul>
  
  <p><strong>Option 2: Allow clicking "next" until I receive less data than query limit</strong></p>
  
  <ul>
  <li><p>Button gets disabled when <code>response.data.length &lt; limit</code>.</p></li>
  <li><p>Works well for collections where <code>data.length % limit != 0</code>.</p></li>
  <li><p>Problem is in the opposite case, for example when there are 40 objects in the collection and I'm on the second page with limit 20, I can still click "next", but then I end up on page with no more objects, as mentioned in Option 1.</p></li>
  </ul>
  
  <p><strong>Option 3: Remember URL of last request</strong></p>
  
  <ul>
  <li><p>Last request URL is stored into variable, and "previous" button works even in case when there are no <code>paging</code> data in <code>response</code>.</p></li>
  <li><p>Solves only the "you can't go back" problem.</p></li>
  <li><p>Doesn't solve the problem with correctly disabling the "next" button. It is still possible to click "next" on the last page with data and get to the empty page with no data.</p></li>
  </ul>
  
  <p><strong>So the question is:</strong> </p>
  
  <p>How can I find out that I already received last items in collection and by clicking "next" I will get to invalid empty page?</p>
  
  <ul>
  <li><p>It seems weird to me that Graph API provides the <code>response.paging</code> URLs even on the beginning/end of the collection. </p></li>
  <li><p>For example if I have feed with 10 posts and I query with <code>limit 20</code>, I receive <code>response</code> with <code>data: Array[10]</code> and <code>paging</code> object with valid URLs in both <code>paging.previous</code> and <code>paging.next</code>, even though there are no "previous" and no "next" data. </p></li>
  <li><p>Querying those URLs results in <code>response</code> with empty <code>data</code> array and with no <code>paging</code> object, so I there is no way to get back in stateless application.</p></li>
  <li><p>Wouldn't it be better if there were no <code>paging.previous</code> on the beginning of the collection and no <code>paging.next</code> on the end of collection?</p></li>
  </ul>