00:00:00 Now we can go back to our application and implement SMS notifications.
00:00:05 To implement our messaging functionality, we'll use AppWrite Messaging and we'll hook it up with the most popular SMS provider,
00:00:13 Twilio.
00:00:14 They have a very nice integration with Twilio.
00:00:17 So let's go to our console and under messaging, we can add a new provider.
00:00:22 Right on messaging, we can head over to providers.
00:00:26 And we can create a new provider.
00:00:28 We'll choose SMS and we'll choose Twilio and I can enter Twilio as the provider name.
00:00:36 Let's click next.
00:00:37 And here we'll have to enter a couple of account IDs for Twilio.
00:00:41 So head over to Twilio.
00:00:43 The link will be in the description and click start for free.
00:00:46 It'll allow you to create a new account.
00:00:48 I'll just sign up with Google.
00:00:50 Next, you'll have to enter your own phone number to be able to test it out.
00:00:55 And once you verify it, you'll be redirected to your dashboard.
00:00:59 It's going to look something like this, and you'll need to get your own Twilio phone number.
00:01:05 It's their virtual phone number.
00:01:07 It allows you to build and prototype different voice calls or text messaging.
00:01:11 So let's get a phone number.
00:01:13 Okay, that was simple.
00:01:15 I can see it right here.
00:01:16 And I also think that we have the account SID, the auth token, and all the other necessary info for AppRide.
00:01:24 So let's copy the account SID and paste it right here.
00:01:28 Next, we can copy the auth token, paste it here.
00:01:32 And next we need a Twilio phone number, which we can paste here.
00:01:36 Click create and make sure that Twilio is enabled.
00:01:39 I just quickly want to go here to phone numbers and go to manage.
00:01:45 and go to verified caller IDs, just to check something.
00:01:48 In here, you can see your own phone number, but if you want to give this deployed app to your friends, family, or potential employers to test out,
00:01:56 since we're still using the development version of Twilio, we can only receive messages to numbers that we have verified as caller IDs right here.
00:02:04 So if you would know that somebody else will be testing it, you have to add their phone number there.
00:02:10 Later on, once you put your app to production, this won't be necessary as Twilio will be able to send messages to any phone number.
00:02:17 But for now for testing, make sure that the number you want to be receiving the SMS notifications on is added right here.
00:02:24 Now we can go back to the code and create a new server action responsible for sending the SMS notification.
00:02:31 We can head over to appointment, actions.ts and we can create a new action.
00:02:40 Let me also make the code a bit bigger for you so you can see it.
00:02:44 I'll call it export const send SMS notification.
00:02:51 It's going to be an async action that will take in the user ID as well as the content of the message we're trying to send.
00:02:58 The user ID is of a type string and the content is of a type string as well.
00:03:05 We can open up a new try and catch block.
00:03:08 In the cache, we'll say something like const log the error.
00:03:12 And in the try, we'll create a new AppWrite messaging SMS.
00:03:17 Let me show you how simple it is.
00:03:19 I'm going to say const message is equal to await.
00:03:23 And now we need to put AppWrite messaging to use by importing messaging from AppWrite config and saying dot create SMS.
00:03:33 We call it, and right here you can see the different fields you have to pass to it, such as the message ID, which will be equal to id.unique.
00:03:42 We want to give it a unique ID, then the content of the message, then an array of topics, which can be empty in this case.
00:03:51 And then the array of users you want to send it over to.
00:03:54 In this case, I'll open up an array and just add one user ID to it.
00:03:59 Once you have the message, we can simply return it to the front end by saying return parse stringify message.
00:04:07 Now the question is, where will we use this SMS notification function?
00:04:11 We'll use it in the update appointment.
00:04:14 If I'm not mistaken, I also added a comment for ourselves to do that before.
00:04:19 Great.
00:04:20 So right here, if we don't have an error, once the appointment was updated, or let's say scheduled, then we can generate an SMS message.
00:04:30 Let me show you how simple it is.
00:04:32 I'm going to say const SMS message is equal to, and you can create a template string saying something like, hi.
00:04:42 It's carapulse.
00:04:43 Your appointment has been, and then we have the type here.
00:04:47 And remember what the type is?
00:04:49 It's either canceled or updated.
00:04:51 So let's modify it a bit depending on that.
00:04:54 We can provide a much more custom message by going to a new line like this, putting this in a new line as well, and then saying something along the lines of,
00:05:03 if the type is triple equal to schedule, then we can return a string of your appointment has been scheduled and we can also tap into the scheduling date
00:05:18 of the appointment by saying format date, but of course we'll have to turn this into a template string as well.
00:05:25 So let's do that right here.
00:05:28 Your appointment has been scheduled for format date time.
00:05:35 And then we pass in the appointment dot schedule like this.
00:05:40 And we can import the format date time from utils.
00:05:44 And after that, we have the second option, which is something along the lines of we regret to inform you that your appointment has been canceled.
00:05:58 And don't forget, we also have access to the cancellation reason.
00:06:01 So we can say reason, and we can render the appointment.cancellation reason.
00:06:11 Okay.
00:06:11 Now let's make sure that this is properly formatted.
00:06:14 There we go.
00:06:15 Hi, it's CarePulse.
00:06:17 If the type is schedule, your appointment has been scheduled for this date and time.
00:06:22 Else we regret to inform you that your appointment has been canceled.
00:06:26 And we can say for the following reason.
00:06:29 Okay, great.
00:06:31 Once we have the contents, which are highly customizable, as you can see, based on real data coming from our application,
00:06:38 we can now say, wait, send SMS notifications to this user with the following contents.
00:06:45 And that is it.
00:06:47 Now that you know how simple this is, you can add messaging to different parts of this application as well.
00:06:52 But I think that's more than enough.
00:06:54 The most important thing is to notify the patient when his appointment has been scheduled.
00:06:59 So let's go ahead and check it out in action.
00:07:02 And from now on, you'll be able to implement SMS messaging using AppRide and Twilio in any of your future applications in,
00:07:10 what, about 10 to 20 minutes?
00:07:12 Pretty cool.
00:07:14 Let's test it out.
00:07:15 So now I still have this previous appointment request has been successfully submitted page, which is great.
00:07:21 But now I want to head over to the admin side of things.
00:07:25 Remember, the SMS notification will be triggered when the admin schedules or cancels the appointment.
00:07:33 So let's give it a try.
00:07:34 I will go over to this last pending appointment by John Doe and I will click schedule.
00:07:41 I will modify the time a bit, let's say 4.30, and we'll say reason for appointment is good, notes, let's do it.
00:07:50 And I will schedule the appointment.
00:07:53 As you can see, the appointment with John Doe has been scheduled.
00:07:56 In the meantime, we also got two additional appointments we have scheduled not that long ago.
00:08:01 And now we can wait for the message.
00:08:03 Unfortunately, the message never came.
00:08:06 So I came back to the AppWrites dashboard to the messaging section and I quickly saw that a message has been created, which is great,
00:08:15 but it has a status of failed.
00:08:17 So let's check out the details and it says failed sending target to 1231232323 doesn't seem like a real number, does it?
00:08:27 and it has been not enabled by Twilio.
00:08:31 I told you we can only get it to our enabled numbers.
00:08:36 Where did this number come from?
00:08:38 Well, it came from the original number that we entered when creating this John Doe account.
00:08:45 So to fix it, let's head over to Auth.
00:08:48 You'll need to find your user account.
00:08:50 In this case, I'll go to Adrian add JS Mastery.
00:08:54 And if you scroll down, you can see a phone number attached to that user.
00:08:59 So we are in the Auth and we're checking the user with a specific name.
00:09:04 Make sure that you know which name this user has.
00:09:07 And then simply modify it to your real number, which you put under the Twilio verified call IDs.
00:09:14 I have just done that and I'm back on the dashboard.
00:09:17 I'll find the patient with that specific name so I know I'm targeting the right one with the right phone number.
00:09:23 And I can see that this one has been canceled, but now I actually want to schedule them.
00:09:28 They say that their leg hurts.
00:09:32 I'll say, not a problem.
00:09:34 Let's fix it.
00:09:36 And schedule the appointment.
00:09:38 And now I'm expecting a message to come to my phone.
00:09:41 And even though I cannot show it to you, in a matter of seconds, I got an SMS saying, send from your Twilio trial account.
00:09:49 Of course, later on it won't say that, but it says, Hi, it's Care Pulse.
00:09:53 Your appointment has been scheduled for...
00:09:57 Object, object.
00:09:58 No, that's not what we want to see.
00:10:00 So let's quickly go back to the code and fix the formatting.
00:10:03 Looking at the format date time, I think that I forgot to call a method on it because right now I'm returning an object,
00:10:11 but I want to call a date time because that's what we want to do with the format.
00:10:15 So .dateTime on it.
00:10:19 And it's actually good that I forgot to do that because it allowed me to add one more detail.
00:10:24 And that is we can say with doctor, and then we can enter the appointment dot primary physician.
00:10:34 Great.
00:10:34 So now we have even more information.
00:10:37 Let's save it.
00:10:38 And let's try to cancel this appointment now.
00:10:41 I'll say canceled.
00:10:43 Let's see if we get the cancellation SMS right now.
00:10:47 I got it in a second.
00:10:48 We regret to inform you that your appointment has been canceled.
00:10:51 And now let's say I'm a good doctor and I'll say, let's fix it after all.
00:10:57 I got some time for you.
00:11:00 I'm going to click schedule.
00:11:01 And this time I got the SMS saying your appointment has been scheduled for July 3rd, 2024, 2.06 PM.
00:11:10 With doctor undefined?
00:11:12 What is that?
00:11:13 I didn't know that's a doctor.
00:11:14 Oh, it looks like it was just a typo.
00:11:16 Primary physician should be spelled like this.
00:11:19 So if I correct it, the doctor undefined should now be a real doctor.
00:11:23 So if I go back and reschedule the appointment, We should get a new message saying Dr.
00:11:29 John Green.
00:11:32 This is great.
00:11:34 And with that, we have successfully completed Care Pulse, a healthcare management platform where patients can create their accounts and book appointments
00:11:45 with very complicated forms, as is typically the case in the healthcare industry.
00:11:50 And on the admin side, you can schedule and cancel them and they can at the same time get a notification letting them know about the state of their appointment.
00:11:59 At the same time, we're tracking the errors in the application and tracking the traces and everything is looking good.
00:12:05 So we know that's working.
00:12:07 And on the other hand, AppRite allowed us to implement authentication, databases, and now even messaging into our application super easily.
00:12:16 I mean, I didn't even anticipate that adding the SMS messaging will be this simple.
00:12:21 And as I said, if you wanted this to work with real phones, you would just need to upgrade to an actual real Twilio account.
00:12:27 For now, it's just a demo one.
00:12:29 But with that in mind and with everything being done, we are now ready to deploy our application.
