Skip to content

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

@syahirudean

Description

@syahirudean

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!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions