GetStream / stream-js

JS / Browser Client - Build Activity Feeds & Streams with GetStream.io
https://getstream.io
BSD 3-Clause "New" or "Revised" License
329 stars 110 forks source link

Trouble implementing JS / Browser Client - Build Activity Feeds & Streams subscriptions with GetStream.io in Angular 17 using the Realtime (Faye) #598

Open syahirudean opened 6 months ago

syahirudean commented 6 months ago

I'm trying to implement a real-time feed in my Angular 17 application using GetStream.io and Faye for notifications. I followed the official documentation (https://github.com/GetStream/stream-js) but the subscribe method on the user feed isn't working as expected.

Here's a simplified version of my NotificationService:

TypeScript


import { connect } from 'getstream';
import { Injectable } from '@angular/core';
import { signal, toSignal } from 'ngx-signal';

@Injectable({
  providedIn: 'root'
})
export class NotificationService {
  // ... other imports ...

  stream_user_token = signal<string | null>(null);
  current_user_token$ = this.stream_service.readStreamUserToken().pipe(
    tap(async (user_token) => {
      console.log('Client token', user_token);
      this.stream_user_token.set(user_token);
    }),
  );

  getUserStreamFeed() {
    const client = connect(this.api_key, this.stream_user_token(), this.app_id);
    const user_feed = client.feed('notification', this.current_user()!.uid);

    // This works, but doesn't provide realtime updates
    user_feed
      .get({ mark_seen: true })
      .then((feed) => {
        console.log('Success getting notification feed', feed);
      })
      .catch((error) => {
        console.error('Error getting notification feed', error);
      });

    // This isn't working, subscription callback never called
    user_feed
      .subscribe((data) => {
        console.log('Data', data);
      })
      .then((feed) => {
        console.log('Success getting notification feed', feed); // called but undefined
      })
      .catch((error) => {
        console.error('Error getting notification feed', error);
      });
  }
}

Problem:

The subscribe method doesn't seem to be working. The callback is never called, and the then block logs "Success getting notification feed undefined".

Questions:

  1. What am I doing wrong with the subscribe method?
  2. Is there anything specific to consider for real-time updates with GetStream.io and Angular 17?

Additional Information:

Angular version: 17.2.1 GetStream SDK version (getstream): 8.4.1

I've searched the documentation and forums but couldn't find a solution. Any help would be greatly appreciated!