This October we’ve added much requested features, and offer new discounts.

- [Pagination for threads & notifications](#pagination) - Enabling “Load more” &
  a quicker start.
- [Revalidate user & room data](#revalidate) - Update info, such as avatars,
  without refreshing.
- [Expanded attachments support](#attachments) - Now part of our dashboard &
  Figma kit.
- [Discounts for startups & nonprofits](#discounts) - We’ll help you grow your
  company.

## Upgrade now

To use the latest features, update your packages with the following command.

```bash
npx create-liveblocks-app@latest --upgrade
```

If you were previously on Liveblocks 2.8 or below, make sure to follow our
[upgrade guides](/docs/platform/upgrading) before updating.

## Pagination for threads & notifications [#pagination]

We’ve added pagination when fetching threads and inbox notifications in React,
making it easy to add a “Load more” button when building your application. This
is the new default behavior, and can make initial load times quicker, as only 50
threads/notifications are loaded at once.

<Figure>
  <Image
    src="/images/blog/whats-new-in-liveblocks-october-24/pagination-screenshot.png"
    alt="Threads pagination example"
    width={750}
    height={394}
    quality={95}
  />
</Figure>

In the code, this change applies to
[`useThreads`](/docs/api-reference/liveblocks-react#useThreads) and
[`useInboxNotifications`](/docs/api-reference/liveblocks-react#useInboxNotifications),
and pagination works in the same way for both.

```tsx highlight="6-8,17-23"
function Threads() {
  const {
    threads,

    // New pagination properties
    fetchMore,
    isFetchingMore,
    hasFetchedAll,
  } = useThreads();

  return (
    <div>
      {threads.map((thread) => (
        <Thread key={thread.id} thread={thread} />
      ))}

      {hasFetchedAll ? (
        <div>🎉 You're all caught up!</div>
      ) : (
        <button disabled={isFetchingMore} onClick={fetchMore}>
          Load more
        </button>
      )}
    </div>
  );
}
```

To learn more and upgrade your app, make sure to read our
[pagination upgrade guide](/docs/platform/upgrading/2.9).

## Revalidate user & room data [#revalidate]

In our React components, it’s now possible to revalidate user, mention, and room
data without refreshing this page. This is helpful in a number of ways—for
example if a user changes their avatar, you can tell Liveblocks to revalidate
its user cache, and you’ll see the new avatar in Comments.

```tsx highlight="7-8"
function SubmitAvatar() {
  const client = useClient();

  function handleClick() {
    __updateUserAvatar__();

    // Refresh user cache and get new avatar
    client.resolvers.invalidateUsers();
  }

  return <button onClick={handleClick}>Submit avatar</button>;
}
```

We’ve introduced three new functions for this, allowing you to:

- [Refresh user info](/docs/api-reference/liveblocks-client#invalidateUsers),
  e.g. names and avatars in comments.
- [Refresh room info](/docs/api-reference/liveblocks-client#invalidateRoomsInfo),
  e.g. room names and URLs in notifications.
- [Refresh mention suggestions](/docs/api-reference/liveblocks-client#invalidateMentionSuggestions),
  e.g. the list when typing `@` in a comment.

```tsx
// Refreshing user info
client.resolvers.invalidateUsers(); // All users
client.resolvers.invalidateUsers(["user-0", "user-1"]);

// Refreshing room info
client.resolvers.invalidateRoomsInfo(); // All rooms
client.resolvers.invalidateRoomsInfo(["room-0", "room-1"]);

// Refreshing all mention suggestions
client.resolvers.invalidateMentionSuggestions();
```

When using React, you can retrieve `client` with
[`useClient`](/docs/api-reference/liveblocks-react#useClient). Learn more under
[resolver methods](/docs/api-reference/liveblocks-client#Resolvers) in our docs.

## Expanded attachments support [#attachments]

Recently we
[introduced attachments for Comments](/blog/introducing-attachments-for-comments),
allowing you to upload media and files to individual comments. We’ve expanded
support for this into other parts of our product, for example you can now see
attachments in the dashboard and in our
[Figma collaboration kit](/blog/introducing-liveblocks-collaboration-kit-for-figma)

<Figure>
  <Image
    src="/images/blog/whats-new-in-liveblocks-october-24/figma-kit-attachments.png"
    alt="Attachments in the Figma kit"
    width={2544}
    height={1746}
    quality={90}
  />
</Figure>

## Discounts for startups & nonprofits [#discounts]

We now offer pre-negotiated discounts for startups and nonprofits, helping you
to build and grow your company.

<UniversalLink href="/startups">
  <Figure>
    <Image
      src="/images/social-images/startups.png"
      alt="Apply for discounts"
      width={750}
      height={394}
      quality={95}
    />
  </Figure>
</UniversalLink>

Apply and learn more on our new [startups page](/startups).

## Upgrade

To use the latest features, update your packages with the following command.

```bash
npx create-liveblocks-app@latest --upgrade
```

If you were previously on Liveblocks 2.8 or below, make sure to follow our
[upgrade guides](/docs/platform/upgrading) before updating.

## Contributors

<Contributors
  gitHubUsernames={[
    "marcbouchenoire",
    "sugardarius",
    "pierrelevaillant",
    "nvie",
    "nimeshnayaju",
    "ofoucherot",
    "stevenfabre",
    "kaf-lamed-beyt",
    "ctnicholas",
  ]}
/>