# Blocking Users

## Introduction

Blocking users improves safety and user control. It helps prevent harassment, spam, and unwanted interactions, and is required by some app stores.

## Best Practices

- Gate block/unblock actions behind clear confirmation to prevent accidental taps.
- Reflect block state immediately in UI and sync with the server in the background.
- Handle group channels carefully: blocked users can still post in shared channels.
- Cache blocked users locally to avoid repeated fetches on every screen open.
- Keep moderation actions consistent across message actions and profile surfaces.

## Stream Chat

The Stream Chat SDK supports blocking/unblocking users and listing blocked users.

When you block a user, you won’t receive any direct messages from that user anymore. However, if you share a group with other participants, you will still receive messages from the blocked user.

This cookbook shows how to implement blocking in a React Native chat app.

## Low-level client support

The low-level client provides the following methods related to user blocking.

### Blocking a user

Call `blockUser` with the ID of the user you want to block.

```tsx
import { StreamChat } from "stream-chat";
const chatClient = StreamChat.getInstance("your api key");

// Note: call after `client.connectUser` is established.
const blockUser = async (userId: string) => {
  try {
    await chatClient.blockUser(userId);
  } catch (err) {
    console.log("Error blocking user:", err);
  }
};
```

### Unblocking a user

To unblock a user, call `unblockUser` with their user ID.

```tsx
import { StreamChat } from "stream-chat";
const chatClient = StreamChat.getInstance("your api key");

// Note this has to be done after the client connection(`client.connectUser`) is established.
const unblockUser = async (userId: string) => {
  try {
    await chatClient.unblockUser(userId);
  } catch (err) {
    console.log("Error unblocking user:", err);
  }
};
```

### Listing Blocked Users

To list all the blocked users, you can use the `getBlockedUsers` method of the client instance.

```tsx
const chatClient = StreamChat.getInstance("your api key");

// Note: call after `client.connectUser` is established.
const getBlockedUsers = async () => {
  try {
    const users = await chatClient.getBlockedUsers();
    setBlockedUsers(users.blocks);
  } catch (error) {
    console.log("Error getting blocked users:", error);
  }
};
```

## Message Actions

You can use the logic above to create your own custom message actions that will involve user blocking.

Use the `messageActions` prop on `Channel`. See [Customize message actions](/chat/docs/sdk/react-native/v8/guides/customize-message-actions/).

```tsx
import { Channel, messageActions } from "stream-chat-react-native";

const App = () => {
  return (
    <Channel
      channel={channel}
      messageActions={(params) => {
        const { dismissOverlay, message } = params;
        const actions = messageActions({ ...params });
        if (actions) {
          actions.push({
            action: async () => {
              try {
                await chatClient.blockUser(message.user?.id || "");
                dismissOverlay();
              } catch (error) {
                console.log("Error blocking user:", error);
              }
            },
            actionType: "block-user",
            title: "Block User",
          });
          return actions;
        } else {
          return [];
        }
      }}
    >
      {/* Other components here  */}
    </Channel>
  );
};
```

## Displaying Blocked users

Next, build a custom UI to list blocked users and allow unblocking.

![Blocked Users](@chat-sdk/react-native/v8/_assets/guides/blocking-users/blocked-users-list.png)

```tsx
import { useEffect, useState } from "react";
import { Image, Pressable, StyleSheet, Text, View } from "react-native";
import { BlockedUserDetails, StreamChat } from "stream-chat";

const chatClient = StreamChat.getInstance("your api key");

const BlockedUsers = () => {
  const [blockedUsers, setBlockedUsers] = useState<BlockedUserDetails[]>([]);

  useEffect(() => {
    const getBlockedUsers = async () => {
      try {
        const users = await chatClient.getBlockedUsers();
        setBlockedUsers(users.blocks);
      } catch (error) {
        console.log("Error getting blocked users:", error);
      }
    };

    getBlockedUsers();
  }, []);

  const unblockUser = async (userId: string) => {
    try {
      await chatClient.unblockUser(userId);
      const filteredUsers = blockedUsers.filter(
        (user) => user.blocked_user_id !== userId,
      );
      setBlockedUsers(filteredUsers);
    } catch (err) {
      console.log("Error unblocking user:", err);
    }
  };

  return (
    <View>
      {blockedUsers.map((blockedUser: BlockedUserDetails) => (
        <Pressable
          key={blockedUser.blocked_user_id}
          onPress={() => {
            unblockUser(blockedUser.blocked_user_id);
          }}
          style={styles.container}
        >
          <Image
            source={{ uri: blockedUser.blocked_user.image as string }}
            style={styles.image}
          />
          <Text style={styles.name}>{blockedUser.blocked_user.name}</Text>
        </Pressable>
      ))}
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flexDirection: "row",
    padding: 16,
    alignItems: "center",
  },
  image: {
    height: 80,
    width: 80,
    borderRadius: 40,
  },
  name: {
    fontSize: 16,
    fontWeight: "bold",
    marginLeft: 16,
  },
});
```

This view lists blocked users and lets you unblock them.

## Summary

This cookbook covered blocking/unblocking users, adding message actions, and building a blocked users list. Use these actions to meet app store review requirements (especially on Apple platforms).


---

This page was last updated at 2026-04-17T17:33:45.279Z.

For the most recent version of this documentation, visit [https://getstream.io/chat/docs/sdk/react-native/v8/guides/blocking-users/](https://getstream.io/chat/docs/sdk/react-native/v8/guides/blocking-users/).