flat-fuchsia•6mo ago

Remix docs out of date?

I'm just starting to experiment with refine in Remix and coming across issues when using some of the examples in particular SSR https://refine.dev/docs/routing/integrations/remix/#how-to-make-ssr-work If I understand correctly it seems things have changed since this was written, for example:

export async function loader() {
  const { data } = await dataProvider.getList<IPost>("posts", {
    pagination: {
      page: 1,
      perPage: 10,
    },
  });

  return json(data);
}

Should actually be:

export async function loader() {
  const { data } = await dataProvider.getList<IPost>({
    resource: "posts",
    pagination: {
      current: 1,
      pageSize: 10,
    },
  });

  return json(data);
}

Or am I missing something?

Remix | Refine

Refine provides router bindings and utilities for Remix. This package will provide easy integration between Refine and Remix for both existing projects and new projects without giving up the benefits of Remix.

5 Replies

kapa.ai•6mo ago

Hi @Duncan_LittleHobbyShop. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Based on the extracts provided, the getList method from dataProvider is used to fetch data in your pages. The method is used in the loader function and the data is passed to your page as a prop. The data is then passed as the initialData to your data hooks using the queryOptions prop. Here is the example from the extract:

export async function loader() {  
 const { data } = await dataProvider.getList<IPost>("posts", {  
 pagination: {  
 page: 1,  
 perPage: 10,  
 },  
 });  
  
 return json(data);  
}

export async function loader() {  
 const { data } = await dataProvider.getList<IPost>("posts", {  
 pagination: {  
 page: 1,  
 perPage: 10,  
 },  
 });  
  
 return json(data);  
}

In your modified version, you've changed the resource from "posts" to "categories" and the pagination object keys from page and perPage to current and pageSize.

export async function loader() {
  const { data } = await dataProvider.getList<IPost>({
    resource: "categories",
    pagination: {
      current: 1,
      pageSize: 10,
    },
  });

  return json(data);
}

export async function loader() {
  const { data } = await dataProvider.getList<IPost>({
    resource: "categories",
    pagination: {
      current: 1,
      pageSize: 10,
    },
  });

  return json(data);
}

The changes you've made seem to be specific to your use case. The resource should be the endpoint you're trying to fetch data from. The keys in the pagination object depend on the API you're using. If your API uses current and pageSize for pagination, then your modification is correct. However, without more context or a specific error message, it's hard to say definitively if the documentation is out of date or if there's another issue at play. If you're still having trouble, I would recommend checking the official refine documentation (https://refine.dev/docs/getting-started/installation) or reaching out to the refine community for more specific guidance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•6mo ago

<@318119626196385794> kapa.ai is still learning and improving, please let us know how it did by reacting below

flat-fuchsia•6mo ago

Sorry for the confusion @kapa.ai , I've edited the original post now

kapa.ai•6mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- I'm sorry, but I can't provide the help you're looking for. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•6mo ago

<@318119626196385794> kapa.ai is still learning and improving, please let us know how it did by reacting below