Chat app with Ionic 3 & Firebase – Ep. 7 – Accepting and ignoring requests

Hi Friends,

Hope you are all well. In this part let’s see how to accept or ignore the friend requests received. I presume you have read all the previous parts of this series.

Let’s begin from where we left off.

A screencast of this post:

 

The complete code for this part – here.

The complete code for this series – here.

Open up chats.ts and add the functions for accepting a request and ignoring a request as shown below.

Now open up requests.ts and let’s add the code for the functions acceptrequest() and deleterequest() respectively.

Things to notice:

1) Note that I am pushing the uid’s into a friends collection. (Created nodes with both id’s as keys because, once the person accepts the request, he should show up as a friend in both their accounts).

2) I am also deleting the request once a friend request has been accepted. I guess this is pretty much self-explanatory.

Now wait. We have added code for accepting a request. We have created a new collection called friends for storing these friendships, but have we displayed it on the screen ? Not yet.

Open up chats.ts file and add the below code in ionViewWillEnter()

The complete chats.ts file would look like this.

Now let’s write the getmyfriends() function in the requests.ts file. Open it up and add the below code.

The complete requests.ts file would look as shown below.

 

Note that I am publishing an event called friends (which I have subscribed to in chats).

Wait.. There’s one more task. Open up chats.html and modify it as shown below.

This will show the friends in a list. Now run the app and if everything goes fine you should see the below screens.

Screenshot_2017-07-24-19-58-03

Screenshot_2017-07-24-20-09-16

 

Screenshot_2017-07-24-20-00-52

 

What we have done so far:

We have created an app with authentication, profile management and a provision to add friends.

Going forth we will see how to use firebase and events to build a real-time chat system.

Hope this helped you guys. If you found this helpful kindly consider supporting me on patreon or by clicking the donate button and donating on paypal – Click here or just sharing this post on social media would help me too.

Thanks for reading. Peace.. :)

Liked it? Take a second to support admin on Patreon!
  • Yash Baxi

    please help me with logout function of firebase

  • Generalzod

    thanks for your videos it been very helpfull but my image cant upload i dont know why in the profile and profilepics

  • Generalzod

    and is there a way the user can log on just once
    after the first login it should auto login

  • Generalzod

    and is it possible to see the every body profile on click

  • Indranil paul

    raja bro… little change you code i think is good for app. Don’t mint. Thank you bro..

    getmyfriends() {
    let friendsuid = [];
    this.firefriends.child(firebase.auth().currentUser.uid).on(‘value’, (snapshot) => {
    let allfriends = snapshot.val();
    this.myfriends = [];
    for (var i in allfriends)
    if (i != firebase.auth().currentUser.uid) {// reduce 1 loop..
    friendsuid.push(allfriends[i].uid);
    }
    this.userservice.getallusers().then((users) => {
    this.myfriends = [];
    for (var j in friendsuid)
    for (var key in users) {
    if (friendsuid[j] === users[key].uid) {
    this.myfriends.push(users[key]);
    }
    }
    this.events.publish(‘friends’);
    }).catch((err) => {
    alert(err);
    })

    })
    }