# Watchlist events

Member yang signin dapat menyebutkan member mana saja yang ingin mereka ikuti, dan koneksi diberi tahu ketika salah satu dari mereka menjadi online atau offline. Itulah keseluruhan fiturnya: tanpa channel per relasi, tanpa polling, satu daftar.

Watchlist events berjalan di atas [member signin](/docs/guides/realtime/terminating-member-connections). Identity yang ditandatangani backend Anda saat signin dapat membawa array `watchlist` berisi member id; ketika pengaturan `watchlist_events` pada app diaktifkan, koneksi menerima event online dan offline untuk id-id tersebut saja. Seorang member dianggap online selama mereka memiliki setidaknya satu koneksi yang sudah signin: koneksi pertama memicu `online`, menutup koneksi terakhir memicu `offline`, dan tab di antaranya tidak memicu apa pun, penghitungan yang sama seperti yang digunakan presence channel.

## Aktifkan fitur ini

Aktifkan **Watchlist events** di pengaturan app pada halaman [**Realtime → Apps**](https://bird.com/dashboard/w/realtime/apps), atau atur `watchlist_events` ke `true` pada app melalui Realtime API. Koneksi mengambil pengaturan ini saat terhubung, jadi aktifkan sebelum klien yang bergantung padanya dirilis.

## Masukkan watchlist ke dalam signed identity

Watchlist adalah bagian dari `member_data`, string JSON yang ditandatangani oleh endpoint autentikasi member Anda. Tambahkan id-id tersebut di samping identity:

```json
{
  "member_id": "u_1",
  "member_info": { "name": "Ada" },
  "watchlist": ["u_2", "u_3"]
}
```

Karena daftar ini berada di dalam signed identity, endpoint autentikasi Anda yang menentukan siapa yang boleh dipantau oleh seorang member: bangun array dari data Anda sendiri (kontak mereka, tim mereka) alih-alih menerima array yang dikirim klien, atau member mana pun bisa memantau member lain. Sebuah watchlist menampung hingga 100 id; daftar yang lebih panjang dipotong menjadi 100 pertama dan koneksi menerima error `4302` yang menyebutkan id mana saja yang diterima.

Daftar ini ditangkap saat signin dan berlaku selama koneksi hidup. Untuk mengubahnya, minta endpoint Anda menandatangani daftar baru: klien signin ulang secara otomatis setiap kali reconnect, sehingga koneksi berikutnya mengikuti daftar yang diperbarui dan menerima status terkini.

## Dengarkan di browser

Bind pada `bird.member.watchlist`. Status terkini seluruh daftar tiba tepat setelah signin, sehingga Anda dapat menampilkan siapa yang online sebelum ada yang berubah status:

```typescript
await bird.signin();

bird.member.watchlist.bind("online", (memberIds) => {
  console.log("online:", memberIds);
});
bird.member.watchlist.bind("offline", (memberIds) => {
  console.log("offline:", memberIds);
});
```

Setiap event membawa member id yang terkait. Pengiriman awal setelah signin mencakup seluruh daftar, dikelompokkan berdasarkan status; setelah itu, event tiba saat member berpindah antara nol dan satu koneksi.

## Watchlist atau presence?

Presence channel menjawab "who is in this room with me": semua orang berlangganan channel yang sama dan melihat daftar member yang sama. Watchlist menjawab "are the people I care about online anywhere": setiap member mengikuti daftar mereka sendiri, dan orang yang dipantau tidak perlu melakukan apa pun selain signin. Daftar teman, indikator ketersediaan agen, atau dorongan "your contact just came online" adalah pekerjaan watchlist; roster ruangan bersama adalah presence.

## Langkah selanjutnya

- [Mengakhiri koneksi member](/docs/guides/realtime/terminating-member-connections) membahas signin dan kontrak identity tempat watchlist berada.
- [Presence channel](/docs/guides/realtime/presence-channels) untuk keanggotaan ruangan bersama, bukan daftar ikutan pribadi.
- [Mengirim event ke member](/docs/guides/realtime/sending-events-to-a-member) adalah permukaan lain yang ditujukan ke member.

## Related resources

- [Realtime](/products/realtime) (product)
- [Build your first integration](/learn/paths/integration) (course)
- [Send your first realtime event](/docs/get-started/send-your-first-realtime-event) (docs)

[Get an implementation brief](/learn/workspace?topic=realtime)