Skip to main content
useEntityList is the main hook for building entity feeds. Each list is identified by a listId, allowing multiple independent lists on the same page.

​
Basic Setup

import { useEntityList } from "@replyke/react-js";
import { useEffect } from "react";

function Feed() {
  const { entities, loading, hasMore, fetchEntities, loadMore } = useEntityList({
    listId: "main-feed",
  });

  useEffect(() => {
    fetchEntities(
      {},                         // filters (empty = no filters)
      { sortBy: "hot" },          // sort config
      { limit: 20, include: ["user"] } // list config
    );
  }, []);

  return (
    <>
      {loading && <p>Loading...</p>}
      {entities.map((entity) => (
        <div key={entity.id}>{entity.title}</div>
      ))}
      {hasMore && (
        <button onClick={loadMore} disabled={loading}>
          Load more
        </button>
      )}
    </>
  );
}

​
fetchEntities Signature

fetchEntities(
  filters: Partial<EntityListFilters>,
  sort?: Partial<EntityListSort>,
  config?: EntityListConfig,
  options?: EntityListFetchOptions
) => void

​
Filters

ParamTypeDescription
timeFrame"day" | "week" | "month" | "year"Filter by age
userIdstringFilter to a specific user’s entities
followedOnlybooleanOnly show entities from users the current user follows
keywordsFiltersKeywordsFiltersFilter by keywords
titleFiltersTitleFiltersFilter by title content
contentFiltersContentFiltersFilter by body content
attachmentsFiltersAttachmentsFiltersFilter by attachments data
locationFiltersLocationFiltersFilter by geographic proximity
metadataFiltersMetadataFiltersFilter by metadata fields

​
Sort config

ParamTypeDescription
sortBy"hot" | "top" | "new" | "controversial" | "metadata.field"Sort algorithm
sortByReaction"upvote" | "downvote" | "like" | "love" | "wow" | "sad" | "angry" | "funny"Used when sortBy is "top"
sortDir"asc" | "desc"Sort direction
sortType"auto" | "numeric" | "text" | "boolean" | "timestamp"Type hint for metadata sorts

​
List config

ParamTypeDescription
limitnumberResults per page. Default: 10
sourceIdstringFilter to a specific source section
spaceIdstringFilter to a specific space
includestring | string[]Populate related data: "user", "space", "topComment", "saved", "files"

​
Fetch options

ParamTypeDescription
fetchImmediatelybooleanSkip debounce and fetch right away
clearImmediatelybooleanClear the current list before fetching
resetFiltersbooleanReset all filters to defaults before applying new ones
resetSortbooleanReset sort to defaults before applying new sort

​
Infinite Scroll

Call loadMore() to append the next page. The hook tracks pagination state internally. 
<button onClick={loadMore} disabled={loading || !hasMore}>
  Load More
</button>
hasMore reflects the value returned by the server, based on the total item count.

​
Creating Entities Within a List

createEntity creates an entity and automatically inserts it into the list: 
const { createEntity } = useEntityList({ listId: "my-feed" });

await createEntity({
  title: "New Post",
  content: "Hello!",
  insertPosition: "first", // "first" or "last"
});

​
Deleting Entities From a List

deleteEntity removes an entity from both the server and the local list state: 
const { deleteEntity } = useEntityList({ listId: "my-feed" });

await deleteEntity({ entityId: "ent_abc123" });

​
Sorting by Metadata

You can sort by any metadata field using the metadata.fieldName syntax: 
fetchEntities(
  {},
  { sortBy: "metadata.price", sortType: "numeric", sortDir: "asc" }
);
Metadata field names must contain only alphanumeric characters and underscores.