This episode is for members only

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

Get started
Already a member? Sign in to continue
Playing
16. Adding the last reply to discussions

Episodes

0%
Your progress
  • Total: 6h 54m
  • Played: 0m
  • Remaining: 6h 54m
Join or sign in to track your progress
01. Introduction and demo
6m 59s
0%
02. Getting set up
10m 36s
0%
03. Modifying registration for usernames
7m 15s
0%
04. Figuring out the forum layout
5m 57s
0%
05. Creating and listing topics
9m 15s
0%
06. Basic discussion listing
13m 33s
0%
07. Pinning discussions
4m 1s
0%
08. Tackling pagination in Inertia
8m 23s
0%
09. Customising pagination text in Laravel
52s
0%
10. Showing a discussion
6m 4s
0%
11. Setting up discussion posts
5m 53s
0%
12. Listing through discussion posts
5m 28s
0%
13. Adding more data to posts
8m 24s
0%
14. Adding pagination to posts
1m 35s
0%
15. Adding a post preview to discussions
4m 52s
0%
16. Adding the last reply to discussions
5m 54s
0%
17. Outputting discussion participants
8m 4s
0%
18. Limiting participants in the UI
5m 56s
0%
19. Ordering discussions by last post
4m 30s
0%
20. Handling deleted users
2m 31s
0%
21. Counting replies
8m 13s
0%
22. Building our first filter
8m 31s
0%
23. Highlighting current filters, and merging with pagination
5m 37s
0%
24. Adding auth specific filters
6m 40s
0%
25. Adding the topic filter
8m 18s
0%
26. Scaffolding the new discussion form
13m 29s
0%
27. Toggling the create discussion form
9m 2s
0%
28. Keeping form state
4m 59s
0%
29. Storing a new discussion
11m 29s
0%
30. Discussion validation and authorization
5m 1s
0%
31. Generating markdown for posts
8m 37s
0%
32. Toggling the markdown preview
7m 43s
0%
33. Fetching and displaying markdown
8m 6s
0%
34. Adding a markdown shortcut toolbar
5m 53s
0%
35. Dealing with SVG icons
7m 46s
0%
36. Creating the reply form
7m 48s
0%
37. Basic Inertia permission checking
6m 26s
0%
38. Creating replies to discussions
5m 37s
0%
39. Jumping to posts
11m 40s
0%
40. Automatically scrolling to posts
6m 18s
0%
41. Toggling post editing
7m 32s
0%
42. Editing posts
3m 36s
0%
43. Deleting posts
4m 21s
0%
44. Deleting discussions
6m 7s
0%
45. Setting up for best answers
7m 29s
0%
46. Toggling the best discussion answer
12m 14s
0%
47. Solved and unsolved filters
2m 23s
0%
48. Indexing discussions for search
8m 6s
0%
49. Searching discussions
12m 35s
0%
50. Debouncing search
2m 47s
0%
51. Adding mentionable functionality to forms
6m 32s
0%
52. Indexing users for mentioning
9m 9s
0%
53. Hooking up users for mentions
10m 10s
0%
54. Detecting and storing mentioned users
9m 54s
0%
55. Adding the mentioned filter
2m 26s
0%
56. Adding mentions to the markdown toolbar
1m 1s
0%
57. Adding mentions to the reply form
7m 21s
0%
58. Fixing up some unauthenticated state
1m 1s
0%
59. Fixing up post scrolling
1m 48s
0%
60. Reviewing SSR (Server-side rendering)
8m 20s
0%
61. Preventing parent posts from being deleted
2m 31s
0%
62. Improving solution marking
4m 9s
0%

Transcript

00:00
It's really helpful when viewing a list of discussions to see the latest post, just so you can click through to that and sort of catch up. So we're going to add that now.
00:09
Now for this, we're going to need a new relationship because remember over on the discussion model, we have the first post, we have all of the posts, but we don't have the latest post in here yet. OK, let's do a little bit of scaffolding over on the actual discussion itself just to output a link.
00:28
So for this, of course, we can use Inertia's link component. We're not actually going to link through to this yet for a very good reason. We don't know which page the latest post is on. It could be on page 10, for example, and we don't have a way to calculate and redirect for that yet.
00:45
So for now, what we're going to do is just set the href in here to go through to the discussion show page. And I'm aware that we're working within a link here, so we can pretty much use the same thing, but this will link to a separate place.
00:58
So we'll be able to click this individually as well. I'm not sure having a link inside of a link is a good idea, but we can always figure this out later. OK, so now that we've done that, let's just open this up quickly and fix that up.
01:12
And we want this to say last post by x at and then y. So let's have a look at this. Of course, it doesn't look great at the moment. So add a couple of styles to this.
01:24
We'll set this to inline. In fact, it's already inline. Add text small and we'll set margin on the top of three. So I think that's OK.
01:36
Probably bump that up a little bit more. And that doesn't look like it's working. Yeah, so that's why we need inline block. So we can actually style it like a block element.
01:45
OK, so how do we grab this information? Well, over in our discussion model, we can create out a latest post relationship. So let's say latest post. And for this, we can use the has one relationship type.
02:01
But remember, that's not quite going to work on its own. So using has one here is just going to give us the first post in the list. What we need to do here is use the latest of many. What that's going to do is it's going to find the latest of many like we would use in post,
02:18
but then it's going to return it as a single item, which is really useful. This is a relatively new relationship modifier within Laravel. So now we have the latest post. We can add that over on our discussion resource.
02:31
So let's say latest post. We can still use our post resource and when the latest post is loaded. So over on the forum index controller, let's add our latest post. And we need to be careful here because we're going to check our debug bar.
02:48
When we're accessing the user data of that latest post, we're then accessing more relationships. So we need to be careful that we are egoloading everything in that we need. So we're going to open this up for the first time and just check things out in a second.
03:02
Let's actually output the data for this first of all. So over on the discussion, what we should now have if we just dump this out is the latest post. And because we're reusing that resource, we have all of the information that we could need in here. And we don't actually have the user just yet.
03:19
So over in the post resource, we know we are outputting the user, but only when it's loaded. So if we go over to our forum index controller, we're going to say .user. So what we're now doing is not only loading the user within the latest post, we're also loading the latest post as well.
03:38
So if we just go over and give that a refresh, there we go. We've got the latest post user in here as well as all of the other information plus the created app in that specific format that we gave it in, which is really helpful. So we have everything we need now to pull this together.
03:53
So let's output the time first of all, latest post or discussion, latest post, created app and human. And for this, it will be discussion, latest post, user and username. Let's head over. And there we go.
04:13
Last post by AlexGS at 19 minutes from now. So we can just get rid of app there. And that works nicely. Now we're going to go ahead and improve the way we output these dates and times.
04:26
And we're actually going to wrap these in time elements. And I'm going to show you why this is a lot better way to do things. It's not going to have any effect at all. But what we can do with this is we can actually add in or bind in a date time
04:40
that looks like an actual date time. So we can use that in there and say date time. And what that's going to do is give a more accurate representation of when this was posted. What we can then do is do the same thing for the title of this,
04:57
which means that conveniently when we hover over this, we can see the actual date and time this was posted. Just a really small improvement there. But it's something that we should get into the habit of doing
05:08
whenever we are dealing with dates and times using these. So we know the exact date and time so it can be read properly. So we can do the same thing here for over on our discussion show page. So let's find that human time that we were outputting.
05:23
Oh, no, it was on the post, wasn't it? So each of the posts has when this was posted just here. So again, we can wrap that in time. And we can go ahead and bind in date time.
05:38
And that's post created at and date time. And we can add the title and bind that in there as well. So bind that into the title and we should be good. So now if we click through, there we go.
62 episodes6 hrs 54 mins

Overview

Ready to build a forum with Inertia and Laravel?

Why a forum? A forum touches a whole load of concepts that you'll use throughout your development career – particularly on the client-side, where we'll be doing most of the heavy lifting.

So, let's build a clean, modern forum with features like markdown support, code highlighting, advanced filtering, user mentions, full-text search, the ability to mark best answers, and more.

Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Comments

No comments, yet. Be the first to leave a comment.