Listing existing comments from the server

Right now, we only have test comments below each ticket. Let’s change that. In this section, we want to ensure that existing comments of a ticket are loaded at page load, and hence, are shown immediately with the ticket data.

Note

Since we add new comments to the database without any page refresh, for newly added comments, we want to use a real-time callback in the upcoming section. In this section, we make sure that all existing comments that are available when loading the page will be visible at page load.

Inside our client TicketComments component, we could use useEffect(() => {}, []), and inside of it, use the Supabase client to load all data from the comments table with supabase.from('comments').eq('ticket', ticket). That’s a completely valid option. However, this would be a lazy-loading approach as the ticket data would immediately be available from the server and, when the TicketComments...