Laravel Mentions
This episode is for members only

Sign up to access "Laravel Mentions" right now.

Get started
Already a member? Sign in to continue
Playing
04. Detecting mentions

Episodes

0%
Your progress
  • Total: 1h 52m
  • Played: 0m
  • Remaining: 1h 52m
Join or sign in to track your progress

Transcript

00:00
Now that we have some way to post text, let's jump straight in and look at how we detect usernames. For this, we're going to use a regular expression, but we're going to set this up in such a way that we can easily extract the usernames from our database and then eventually sync users up.
00:20
So how are we going to do this? Well, there's a couple of ways, but probably the easiest way is to set up a model observer for our comment. So let's go ahead and do that now. Let's say makeObserver and we're going to call this commentObserver. What we can then do is come over to our comment model and let's go ahead and set this up and say observedBy, so we use the
00:42
Laravel observedBy attribute, and let's say commentObserver class, fully qualified class name for that. Now, what do we want to do here? Well, when a comment is created or updated, we want to find any mentions. It's important that we do both because if a comment is created, of course, that's the obvious one, but if it's updated, we could remove usernames that have been mentioned
01:08
and we could add new usernames that have been mentioned. So let's create out a method for both of these. So let's say created. Now, when this invokes, when our model actually gets created, we'll get an instance of our comment in here. Same thing for updated as well. So both of these are now going to be fired when this is created or updated, and updated will come a little bit later
01:35
when we look at editing our comments. So for now, if I just go ahead and say, hey, and hit post, we get that dumped out. Okay, it still gets inserted, but this gets put in the way. Okay, so what do we want to do? Well, let's extract this functionality since we already know we're going to use it in both created and updated. Let's extract this out to another method. Let's think
01:59
about what we want to call this. Let's say findAndSyncMentions because we're going to eventually want to store these, and let's go ahead and pass in the comment so we can grab this data. So we want to do that for both of these. I'm just going to add this in here as well now too. So in here, let's create out a protected method, and let's call this findAndSyncMentions. We'll get an
02:25
instance of the comment in here that we want to work with. And just to test this out, we are going to be writing tests later, but let's just manually test this for now just to make sure that that dumps out and we're all good. Okay, so what do we want to do here? Well, we basically want to just detect anywhere inside of this comment body where something has been mentioned. You can tweak this
02:51
based on the patterns that you want to recognize. For example, the types of usernames that you're allowing, and we'll go back to that and fix that up as part of our registration and update process shortly. But I'm just going to go ahead and copy and paste some projects that I just built up gradually here, and that is the following. So basically, we've got a username in here that we
03:10
want to match. This can contain or is matched by lowercase standard alpha characters, so from a to z. Numbers, so we're allowing numbers. We're allowing hyphens in our usernames. We're allowing underscores in our usernames as well. So you can change this up to exclude these or whatever you want to do. So how are we going to take the comment body and use this regex? Well, we're going to use
03:38
the native preg match all. Now this takes in typically four arguments. The first one is going to be the actual regular expression string that we want to use, which we can see here. The next is going to be what we're looking in, so that's going to be the comment body. The next is going to be the extracted things that it's found. So this doesn't return a value, it sets it into a
04:03
variable that we provide here, and we're just going to call that mentions. Now let's just go ahead and look at this. So all we need to do here is now die dump mentions. Mentions will be created as a variable for us that we can now use. Let's go over and just try this out. So I'm just going to type hey in and hit post, and you can see here we get this slightly odd structure, but we'll change this
04:23
around in a second. But we basically get no matches. Let's try this again by saying at Alex, and yeah sure enough we do get a match here. So you can see that this is matched with the overall match with the at and then the username in here under Alex, because if we just take a look at this we've given this a name of username that we want to extract it out as. So it has found that data.
04:47
Now if we say and Tabby as well, what does this do? Well it gives us both of these usernames in this username part here. Now that's useful, but ideally what I want to do is use something like preg set order, and that's going to go ahead and give us the following. So let's say hey Alex and Tabby and hit post. That's going to give us two items with the username inside of there. That's
05:13
a lot more convenient for us to extract this out of the database a little bit later. So you can play around with this depending on your style, but that's pretty much what we want to do here. Okay so let's go ahead and just look at some of the other conditions that we've added in here, like the ability to use numbers hyphens and underscores, and just make sure that they match. So let's say
05:33
hey at Alex underscore gs1. That should still match it, and yep you can see it does. So this is looking good, and of course you can tweak that regular expression to do whatever you want. Now what we haven't done, and what's probably really important here if you are building this out, is we've allowed for things like spaces in our usernames which we don't want. So we want to
05:57
make sure that this maps up to the regular expression and how we're actually matching this. So let's get back over to our registration process, and let's just change over some of the rules that we have inside of here. So for the username we basically just want to add in another rule here, and that is the alpha underscore dash, and we're going to use ASCII just here as the modifier for
06:20
this particular rule. That's going to allow everything that we have added in our regular expression. So let's take this as well, and let's add this to our profile information form. Let's find the rules in here that we use, so they should be directly within here. Let's add these in here as well, and we should be good. So let's just check this out over in here. We're going to say
06:43
alex1, that looks good, alex underscore gs1, that looks good as well. So this will now detect everything that we are allowing as part of our usernames. Great, so we now have the ability to detect usernames in whichever format we've provided, but the question is how do we sync these to the database and associate them with the comments? Let's cover that next.
15 episodes•1 hr 52 mins

Overview

Add mentionable functionality to your Laravel applications and mention users, projects, issues… literally anything.

We’ll start by setting up a simple comment system with Livewire, then detect, sync, notify and test mentions step-by-step. Not using Livewire? Don’t worry, the core functionality works with any stack.

If you are using Alpine/Livewire, we’ll add mention support to textareas to get a list of users we’re able to mention when we hit a trigger key.

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

Episode discussion

No comments, yet. Be the first!