Answers.Body: <p>The problem is that you are doing <code>.relatedTo(category)</code> but the variable you are passing is called <code>relatedTo</code>, not <code>category</code>.</p>
  <p>Just like with <code>limit</code>, based on your code, it should be <code>.relatedTo(relatedTo)</code>. Also, it should be part of the same hash as your <code>limit</code>.</p>
  <p>However, you can't pass a category object to a component and will need to pass its <code>id</code> instead (<a href="https://putyourlightson.com/plugins/sprig#component-variables" rel="nofollow noreferrer">docs</a>).</p>
  <p>Depending on what <code>category</code> is in your case (and I guess it's an object), you could do:</p>
  <pre><code>{{ sprig('_components/load-more', {
      'limit': 6,
      'categoryId': category.id
  }) }}
  </code></pre>
  <p>Then in your component:</p>
  <pre><code>{% set offset = offset ?? 0 %}
  
  {% set query = craft.entries().section('caseFiles').offset(offset).limit(limit) %}
  
  {# Make sure a categoryId is being passed #}
  {% if categoryId %}
      {% set query = query.relatedTo(categoryId) %}
  {% endif %}
  
  {% set entries = query.all() %}
  
  {% for entry in entries %}
     ------Entry Content-----
  {% endfor %}
  
  {% if entries %}
    {# Increments `offset` by the value of `limit` and swaps itself out on click #}
    &lt;button class=&quot;orange-button&quot; sprig s-vars=&quot;offset: {{ offset + limit }}&quot; 
      s-target=&quot;this&quot; s-swap=&quot;outerHTML&quot;&gt;
      &lt;p&gt;Load More&lt;/p&gt;
    &lt;/button&gt;
  {% endif %}
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-11-19T14:34:16.707Z
Answers.Text: This worked great! However, the load more button at the bottom no longer disappears when there are no more entries to load
Answers.UserDisplayName: Justin Kendall
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-11-19T15:11:21.607Z
Answers.Text: @JustinKendall - changed the code above for you, the button should disappears as before now.
Answers.UserDisplayName: Oli
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-11-19T15:13:10.300Z
Answers.Text: Perfect, thanks!
Answers.UserDisplayName: Justin Kendall
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-11-23T12:09:19.273Z
Answers.Text: @Oli You're a legend!
Answers.UserDisplayName: Ben Croker
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-11-19T09:50:30.147Z
Answers.LastActivityDate: 2020-11-19T15:10:24.753Z
Answers.LastEditDate: 2020-11-19T15:10:24.753Z
Answers.UserDisplayName: Oli
Body: <p>This is a continuation of a previous question I had <a href="https://craftcms.stackexchange.com/questions/35839/how-to-use-categories-with-sprigs-load-more-recipe">(Here)</a>. I am using <a href="https://putyourlightson.com/sprig-cookbook#load-more" rel="nofollow noreferrer">Sprig's Load More Recipe</a>. In my category page, I want the load more function to only pull up entries that equals the current category page. In a recent update, the category solution that was in my previous question no longer works, since it has been restructured a little. I cannot figure out how get the <code>relatedTo(category)</code> to work again. I currently have it set up like this (the <code>{'relatedTo': category}</code> does not do anything):</p>
  <p>_category.twig</p>
  <pre><code>{{ sprig('_layouts/_blog/_categories/_loadMore', {'limit': 6},{'relatedTo': category}) }}
  {{ sprig.script }}
  </code></pre>
  <p>_loadMore.twig</p>
  <pre><code>{% set offset = offset ?? 0 %}
  
  {% set entries = craft.entries.section('caseFiles').offset(offset).limit(limit).relatedTo(category).all() %}
  
  {% for entry in entries %}
     ------Entry Content-----
  {% endfor %}
  
  {% if entries %}
    {# Increments `offset` by the value of `limit` and swaps itself out on click #}
    &lt;button class=&quot;orange-button&quot; sprig s-vars=&quot;offset: {{ offset + limit }}&quot; 
      s-target=&quot;this&quot; s-swap=&quot;outerHTML&quot;&gt;
      &lt;p&gt;Load More&lt;/p&gt;
    &lt;/button&gt;
  {% endif %}
  </code></pre>
  
Tags: <craft3><categories><relatedto><plugin-sprig>
Title: How to use Sprig's "Load More" Recipe After Update
ThreadText: # How to use Sprig's "Load More" Recipe After Update
  
  (Asked by: username_0 on 2020-11-18)
  
  This is a continuation of a previous question I had [(Here)](https://craftcms.stackexchange.com/questions/35839/how-to-use-categories-with-sprigs-load-more-recipe). I am using [Sprig's Load More Recipe](https://putyourlightson.com/sprig-cookbook#load-more). In my category page, I want the load more function to only pull up entries that equals the current category page. In a recent update, the category solution that was in my previous question no longer works, since it has been restructured a little. I cannot figure out how get the `relatedTo(category)` to work again. I currently have it set up like this (the `{'relatedTo': category}` does not do anything):
  
  \_category.twig
  
  ```
  {{ sprig('_layouts/_blog/_categories/_loadMore', {'limit': 6},{'relatedTo': category}) }}
  {{ sprig.script }}
  
  ```
  
  \_loadMore.twig
  
  ```
  {% set offset = offset ?? 0 %}
  
  {% set entries = craft.entries.section('caseFiles').offset(offset).limit(limit).relatedTo(category).all() %}
  
  {% for entry in entries %}
     ------Entry Content-----
  {% endfor %}
  
  {% if entries %}
    {# Increments `offset` by the value of `limit` and swaps itself out on click #}
    <button class="orange-button" sprig s-vars="offset: {{ offset + limit }}" 
      s-target="this" s-swap="outerHTML">
      <p>Load More</p>
    </button>
  {% endif %}
  
  ```
  
  **Tags:** craft3, categories, relatedto, plugin-sprig
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2020-11-19. Score: 4 | Accepted answer
  
  The problem is that you are doing `.relatedTo(category)` but the variable you are passing is called `relatedTo`, not `category`.
  
  Just like with `limit`, based on your code, it should be `.relatedTo(relatedTo)`. Also, it should be part of the same hash as your `limit`.
  
  However, you can't pass a category object to a component and will need to pass its `id` instead ([docs](https://putyourlightson.com/plugins/sprig#component-variables)).
  
  Depending on what `category` is in your case (and I guess it's an object), you could do:
  
  ```
  {{ sprig('_components/load-more', {
      'limit': 6,
      'categoryId': category.id
  }) }}
  
  ```
  
  Then in your component:
  
  ```
  {% set offset = offset ?? 0 %}
  
  {% set query = craft.entries().section('caseFiles').offset(offset).limit(limit) %}
  
  {# Make sure a categoryId is being passed #}
  {% if categoryId %}
      {% set query = query.relatedTo(categoryId) %}
  {% endif %}
  
  {% set entries = query.all() %}
  
  {% for entry in entries %}
     ------Entry Content-----
  {% endfor %}
  
  {% if entries %}
    {# Increments `offset` by the value of `limit` and swaps itself out on click #}
    <button class="orange-button" sprig s-vars="offset: {{ offset + limit }}" 
      s-target="this" s-swap="outerHTML">
      <p>Load More</p>
    </button>
  {% endif %}
  
  ```
  
  > **Comments:**
  > **username_0**: This worked great! However, the load more button at the bottom no longer disappears when there are no more entries to load  
  > **username_1**: @username_0 - changed the code above for you, the button should disappears as before now.  
  > **username_0**: Perfect, thanks!  
  > **username_2**: @username_1 You're a legend!  
  
  ---
  
  