Implementing Realtime comments
In this section, we will enhance the TicketComments component to immediately show the new comment list if there’s a new comment added – without any delay. It’s time for Realtime!
Before we use the Realtime feature, there’s a bit of prework to be done in the component to be able to update the existing comments in the UI with new comments coming from the Realtime service. We need to be able to change the comments value of our TicketComments component. And what’s better to change an existing value than a state?
So, change your TicketComments component to use a state for comments by passing initialComments as its initial value:
const [comments, setComments] = useState(initialComments || []);
Wonderful. Now, we’re able to change the comments array and, with it, update the UI, whenever needed. Next, I’ll show you how to enable Realtime and subscribe to the updates of the comments table.
