- {renderParts(navList, currentLesson, onOutsideClick)}
+
)}
@@ -95,123 +118,67 @@ export function Nav({ lesson: currentLesson, navList }: Props) {
);
}
-function renderParts(navList: NavList, currentLesson: Lesson, onLinkClick: () => void) {
+function NavListComponent({
+ items,
+ level,
+ activeItems,
+ className,
+ i18n,
+}: Omit
& { items: NavList; className?: string }) {
return (
-
-
- {navList.map((part, partIndex) => {
- const isPartActive = part.id === currentLesson.part.id;
-
- return (
- -
-
-
-
-
- {interpolateString(currentLesson.data.i18n!.partTemplate!, {
- index: partIndex + 1,
- title: part.title,
- })}
-
-
-
- {renderChapters(currentLesson, part, isPartActive, onLinkClick)}
-
-
-
- );
- })}
-
-
+
+
+ {items.map((item, index) => (
+
+ ))}
+
+
);
}
-function renderChapters(currentLesson: Lesson, part: NavItem, isPartActive: boolean, onLinkClick: () => void) {
- return (
-
-
- {part.sections?.map((chapter, chapterIndex) => {
- const isChapterActive = isPartActive && currentLesson.chapter.id === chapter.id;
+function NavListItem({ level, type, index, i18n, activeItems, id, title, href, sections }: NavItem & NavListItemProps) {
+ const isActive = activeItems[level] === id;
- return (
- -
-
-
-
- {chapter.title}
-
-
- {renderLessons(currentLesson, chapter, isPartActive, isChapterActive, onLinkClick)}
-
-
-
- );
- })}
-
-
- );
-}
+ if (!sections) {
+ return (
+
+
+ {title}
+
+
+ );
+ }
-function renderLessons(
- currentLesson: Lesson,
- chapter: NavItem,
- isPartActive: boolean,
- isChapterActive: boolean,
- onLinkClick: () => void,
-) {
return (
-
- {chapter.sections?.map((lesson, lessonIndex) => {
- const isActiveLesson = isPartActive && isChapterActive && lesson.id === currentLesson.id;
+
+ -
+
+
+ {type === 'part' ? interpolateString(i18n!.partTemplate!, { index: index + 1, title }) : title}
+
- return (
-
-
-
- {lesson.title}
-
-
- );
- })}
-
+
+
+
+
+
);
}
diff --git a/packages/types/src/entities/index.ts b/packages/types/src/entities/index.ts
index 3d0abf5f6..ed72fefa3 100644
--- a/packages/types/src/entities/index.ts
+++ b/packages/types/src/entities/index.ts
@@ -25,8 +25,7 @@ export interface Part {
order: number;
slug: string;
data: PartSchema;
- firstChapterId?: string;
- chapters: Record;
+ chapters: Record;
}
export interface Chapter {
@@ -34,16 +33,14 @@ export interface Chapter {
order: number;
slug: string;
data: ChapterSchema;
- firstLessonId?: string;
- lessons: Record;
}
export interface Lesson {
id: string;
order: number;
data: LessonSchema;
- part: { id: string; title: string };
- chapter: { id: string; title: string };
+ part?: { id: Part['id']; title: string };
+ chapter?: { id: Chapter['id']; title: string };
slug: string;
filepath: string;
editPageLink?: string;
@@ -64,6 +61,6 @@ export type CustomConfig = CustomSchema;
export interface Tutorial {
logoLink?: string;
- firstPartId?: string;
- parts: Record;
+ parts: Record;
+ lessons: Lesson[];
}
diff --git a/packages/types/src/entities/nav.ts b/packages/types/src/entities/nav.ts
index 9c0b21517..59dcd626e 100644
--- a/packages/types/src/entities/nav.ts
+++ b/packages/types/src/entities/nav.ts
@@ -1,6 +1,7 @@
export interface NavItem {
id: string;
title: string;
+ type?: 'part' | 'chapter' | 'lesson';
href?: string;
sections?: NavItem[];
}
diff --git a/packages/types/src/schemas/part.ts b/packages/types/src/schemas/part.ts
index ce3682e1b..0d269d011 100644
--- a/packages/types/src/schemas/part.ts
+++ b/packages/types/src/schemas/part.ts
@@ -9,6 +9,12 @@ export const partSchema = baseSchema.extend({
.describe(
'The list of chapters in this part. The order of this array defines the order of the chapters. If not specified a folder-based numbering system is used instead.',
),
+ lessons: z
+ .array(z.string())
+ .optional()
+ .describe(
+ 'The list of lessons in this part. The order of this array defines the order of the lessons. If not specified a folder-based numbering system is used instead.',
+ ),
});
export type PartSchema = z.infer;
diff --git a/packages/types/src/schemas/tutorial.ts b/packages/types/src/schemas/tutorial.ts
index 6ae8bf4fc..4a97c271a 100644
--- a/packages/types/src/schemas/tutorial.ts
+++ b/packages/types/src/schemas/tutorial.ts
@@ -10,6 +10,12 @@ export const tutorialSchema = webcontainerSchema.extend({
.describe(
'The list of parts in this tutorial. The order of this array defines the order of the parts. If not specified a folder-based numbering system is used instead.',
),
+ lessons: z
+ .array(z.string())
+ .optional()
+ .describe(
+ 'The list of lessons in this tutorial. The order of this array defines the order of the lessons. If not specified a folder-based numbering system is used instead.',
+ ),
});
export type TutorialSchema = z.infer;