From the course: Master React 19 and Next.js 16 with Hands-On Projects and Real-World Applications

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Restrict chat rooms to a single course

Restrict chat rooms to a single course

Hello, and welcome! In this session, you'll learn how to fetch a list of courses and allow users to select a course and display its details, setting the foundation for showing messages that belong only to that selected course. This will ensure conversations are focused, relevant, and easy to navigate. Let's start inside our chat page component. I've added a state variable, selectedCourse, initialized to null using the useState hook. This will store the ID of the currently selected course. Ok, let's add another piece of state to hold the list of all available courses. We are declaring a state variable called courses, initialized as an empty array. We'll fetch the course data from our database and store it in this array using a function to update the state. Alright now that we have our state set up, let's create a new file to handle our server actions. Inside the src slash app slash chat directory, we'll create a file named actions dot js. This is where we'll put the code responsible…

Contents