Playing
32. Removing a pending friend request

Transcript

00:00
OK. So before we continue, we're just going to fix up a quick issue with cancelling frame requests.
00:05
If I go ahead and enter a email in here to add, let's go ahead and do that now, and click this, I can't actually cancel this. We know that cancelling a frame request
00:16
is the same as removing a frame request, because it just deletes it from that pivot table. So what we need to do is just come over to our template here, so under Friends and Index,
00:27
and let's come down to the Pending Frame Request section and just fill out the form like we did for the others. So for this, it's pretty much just going to be the same as this form just here.
00:38
Let's go ahead and grab this form, pull this down here, and just put this in here. And then let's just go ahead and say Cancel, because it's a slightly different action.
00:47
And we're just going to go through to exactly the same place, post through to this with that delete method in here. So now if we just come over and we look at this one here, and we get, yeah, Undefined Variable Friends,
01:00
because that needs to be Pending Friend. So let's switch that to Pending Friend, that looks good. And if we come back over to here, there we go, we can cancel this.
01:09
Now, we didn't include the email there like we've been doing for the others. Let's add that in there as well, just for a little bit of consistency.
01:16
So let's come down and pop that in here, and of course, switch that to Pending Friend. And if we now come back over, there we go, we can click Cancel.
01:24
That removes it, of course, for us and also the other user. So of course, a quick UI update. We already know the functionality works because we've tested it, but just a quick update to the UI.

Episode summary

In this episode, we tackle a small but important usability issue: allowing users to cancel (or remove) a pending friend request. We notice that once you send a friend request using an email, there's currently no direct way to cancel it from the UI, even though the backend logic already supports it by deleting the relevant entry from the database.

We dive into the friends list template and add the missing form/button in the 'Pending Friend Requests' section. Essentially, we reuse the form setup from elsewhere in the page, tweaking it a bit so that the action is labeled as 'Cancel' and routes through the proper delete method.

After patching up a variable name mistake, we make sure the pending friend's email is displayed for consistency. Now, everything looks good: we can see the 'Cancel' option next to each pending request, and hitting it removes the request for both users.

This episode is all about tying up this loose end in the friend request feature, making the UI behave as expected—and making our app feel much smoother!

Episode discussion

No comments, yet. Be the first!