Build a Forum with Inertia and Laravel

Sign in Get started

This episode is for members only

Sign up to access "Build a Forum with Inertia and Laravel" right now.

Already a member? Sign in to continue

Playing

20. Handling deleted users

Episodes

0%

Your progress

Total: 6h 54m
Played: 0m
Remaining: 6h 54m

Join or sign in to track your progress

01. Introduction and demo

02. Getting set up

03. Modifying registration for usernames

04. Figuring out the forum layout

05. Creating and listing topics

06. Basic discussion listing

07. Pinning discussions

08. Tackling pagination in Inertia

09. Customising pagination text in Laravel

10. Showing a discussion

11. Setting up discussion posts

12. Listing through discussion posts

13. Adding more data to posts

14. Adding pagination to posts

15. Adding a post preview to discussions

16. Adding the last reply to discussions

17. Outputting discussion participants

18. Limiting participants in the UI

19. Ordering discussions by last post

20. Handling deleted users

21. Counting replies

22. Building our first filter

23. Highlighting current filters, and merging with pagination

24. Adding auth specific filters

25. Adding the topic filter

26. Scaffolding the new discussion form

27. Toggling the create discussion form

28. Keeping form state

29. Storing a new discussion

30. Discussion validation and authorization

31. Generating markdown for posts

32. Toggling the markdown preview

33. Fetching and displaying markdown

34. Adding a markdown shortcut toolbar

35. Dealing with SVG icons

36. Creating the reply form

37. Basic Inertia permission checking

38. Creating replies to discussions

39. Jumping to posts

40. Automatically scrolling to posts

41. Toggling post editing

42. Editing posts

43. Deleting posts

44. Deleting discussions

45. Setting up for best answers

46. Toggling the best discussion answer

47. Solved and unsolved filters

48. Indexing discussions for search

49. Searching discussions

50. Debouncing search

51. Adding mentionable functionality to forms

52. Indexing users for mentioning

53. Hooking up users for mentions

54. Detecting and storing mentioned users

55. Adding the mentioned filter

56. Adding mentions to the markdown toolbar

57. Adding mentions to the reply form

58. Fixing up some unauthenticated state

59. Fixing up post scrolling

60. Reviewing SSR (Server-side rendering)

61. Preventing parent posts from being deleted

62. Improving solution marking

Transcript

00:00

Since we've got a few users here to play around with, we're now going to look at handling users that have been deleted. So if we head over to this discussion

00:07

here, let's go ahead and delete Fred, because he's the latest as well, so appears here. And we can modify that behavior too. So we're going to go ahead and delete Fred's account

00:17

from the database, which is just how this would happen if he were to delete it from the UI. And now that we've done that, the post isn't actually deleted, remember.

00:26

The user ID is set to null. Now that's going to completely break things over here, because we are accessing that user property, and we can't read his avatar and any other information.

00:37

So let's work on the post component first, and just check where we're referencing the user. We've got the first one here, which is the image. Now, we're going to go ahead and use the null safe operator

00:47

on this, which will technically just return or give us back a null value for this. And we can do the same for the username as well. Now, if we go over and just give this a refresh,

00:57

sure enough, that works, but it doesn't look great. We don't have any information in here about what's going on. It just looks a little bit of a mess. So for the username, what we can do

01:07

is just write in here, user deleted. And we can even create a component for that, because we're going to have to repeat this in a few places, but we'll leave it at this for now.

01:18

So user deleted. So it's a little bit clearer now that this user has actually been deleted. As for the image, we can actually just get rid

01:25

of the avatar altogether. So we can do this directly within here. So we can say vif post.user. That will just tell us if there is a user.

01:34

We still keep the spacing here because we've set the width on the outside container here. But now it looks a little bit cleaner because we're not giving it a broken image.

01:44

Now, if we go back to the homepage, this is also going to break because over on the discussion component, under where we're using the latest post,

01:53

we're grabbing the latest post username. So once again, we can do the same thing here. Use the null safe operator. And in here, just output a string that says user deleted.

02:05

Let's go over, give that a refresh. And there we go. Last post by user deleted. And we can click through,

02:10

and eventually we'll scroll down to the correct page and see that user. But there we go. That is just a really nice enhancement

02:17

because when a user deletes their account, we don't really want the context of a discussion to be missed. So I think this is a really important feature.

02:25

And we've just tidied it up now in the UI. So first of all, it works. And second of all, we can see that the user has been deleted.

Episode summary

In this episode, we tackle what happens when a user gets deleted from our app—the kind of thing that could definitely break the user experience if we’re not careful. We start by actually deleting a user (Fred, sorry Fred) from the database, just like it would happen from the frontend. When this happens, their posts stick around, but their userId gets set to null. Suddenly, any code that expects a user object (like for showing their avatar or username) is going to run into trouble.

So, we dive into the relevant components. First, we update the post component so anywhere we’re using the user object (like displaying the avatar or the username), we use the null-safe operator. If the user’s gone, we just display “user deleted” as their username and skip showing the avatar completely. That keeps things much tidier—no more broken images or blank spots.

We quickly set up similar logic anywhere else in the app that references a (possibly deleted) user, including on the homepage where we show the latest post. The whole idea here is to gracefully handle missing user info and make it clear in the UI when someone’s account is gone, without losing the context of their posts or causing errors.

By the end, we’ve got a snappy little enhancement: the app won’t break if a user goes away, and other users can clearly see when an account has been deleted. This is an important bit of polish for any community-driven app!

Episode discussion

No comments, yet. Be the first!