I'm working on a project that lets our content editors set up courses, each with a collection of lessons and potentially quizzes. I've got this working by having a custom Course type, and custom Lesson and Quiz types. When a course is created, content editors utilize a content relationship group field to include the lessons and quizzes. Right now it's getting all the data pulled in exactly how I need. That being said, I'm trying to figure out a more effective way to allow our users to navigate between lessons, essentially getting the next and previous items from the content relationship. Right now I've got a directory structure with two dynamic page routes:
[courseUid]
-- [lessonUid].tsx
So in [lessonUid].tsx I am querying the course by the courseUid passed into my dynamic page routes, and getting all the associated lessons and quizzes:
[lessonUid].tsx
const { courseUid, lessonUid } = req.query as { courseUid: string, lessonUid: string };
const course = await prismic.getByUID('course', courseUid, {
fetchLinks: ['lessons', 'quiz'],
});
Then I'm taking the length of the array returned from this query and getting the index of the current lesson from the lessonUid param:
const lessonIndex = course.data.content.map((content: { item: { uid: string } }) => {
return content.item.uid;
}).indexOf(lessonUid);
After this, I can set a constant for nextLesson or previousLesson like so:
const prevLesson = course.data.content[lessonIndex - 1];
const nextLesson = course.data.content[lessonIndex + 1];
That being said, this is a fair amount of manual work; what I'm wondering is, is there an easy way to get the previous and next items from a content relationship programatically? Directly in the query that is? I'd rather not have to do all of this work every time a lesson is requested. I'm open to getting the content in a completely different way as well, I just want to find a more efficient mode of getting the job done.