added types to course pages and components

components/Course/CourseContent.tsx

@@ -1,14 +1,15 @@
 import dynamic from "next/dynamic"
 import { CheckIcon } from "@heroicons/react/outline"
 import CourseProgress from "./CourseProgress"
+import { Lesson } from "common"
 
 const CourseNextLessonBtn = dynamic(() => import("./CourseNextLessonBtn"), {
   ssr: false,
 })
 
 type Props = {
   title: string
-  lessons: object[]
+  lessons: Lesson[]
   learnFeatures: string[]
   progressService: object
   course: string

components/Course/CourseNextLessonBtn.tsx

@@ -1,11 +1,18 @@
 import Link from "next/link"
 import { isLessonCompleted } from "../../utils/machineUtils"
+import { Lesson } from "common"
+
+type Props = {
+  lessons: Lesson[]
+  progressService: object
+  course: string
+}
 
 export default function CourseNextLessonBtn({
   lessons,
   progressService,
   course,
-}) {
+}: Props) {
   const incompleLessons = lessons
     .map((lesson) => {
       if (!isLessonCompleted(progressService, `${course}/${lesson.slug}`)) {

components/Course/CourseProgress.tsx

@@ -1,6 +1,7 @@
 import dynamic from "next/dynamic"
 import Link from "next/link"
 import { isLessonCompleted } from "../../utils/machineUtils"
+import { Lesson } from "common"
 
 const ProgressLine = dynamic(() => import("../Progress/ProgressLine"), {
   ssr: false,
@@ -18,7 +19,17 @@ function classNames(...classes) {
   return classes.filter(Boolean).join(" ")
 }
 
-export default function CourseProgress({ lessons, progressService, course }) {
+type Props = {
+  lessons: Lesson[]
+  course: string
+  progressService: object
+}
+
+export default function CourseProgress({
+  lessons,
+  progressService,
+  course,
+}: Props) {
   return (
     <nav aria-label="Progress" className="mt-12" data-test="course-steps">
       <ol className="overflow-hidden">

components/Progress/ProgressLine.tsx

@@ -1,7 +1,9 @@
+import { Lesson } from "common"
+
 type Props = {
   index: number
   isCompleted: boolean
-  lessons: []
+  lessons: Lesson[]
 }
 
 export default function ProgressLine({ index, isCompleted, lessons }: Props) {

types/common.d.ts

@@ -1,28 +1,50 @@
-export type LessonTableOfContents = {
-  content: string
-  slug: string
-  lvl: number
-  current?: boolean
-}
-
-export type Lessons = {
-  title: string
-  description: string
-  slug: string
-  challenges: []
+export interface Challenge {
+  challengeType: string
+  question: string
+  answers: string[]
+  correctAnswerIndex: number
 }
 
 export interface ChallengeAnswer {
   id: string
   answeredCorrectly?: boolean
   skipped?: boolean
 }
+
+export type Course = {
+  title: string
+  slug: string
+  description: string
+  image: string
+  learnFeatures: string[]
+  lessons: Lessons[]
+}
+
 export interface EventPayload {
   type: string
   id: string
   challengeIndex: number
 }
 
+export type Lesson = {
+  title: string
+  description: string
+  slug: string
+  challenges?: Challenge[]
+}
+
+export type LessonTableOfContents = {
+  content: string
+  slug: string
+  lvl: number
+  current?: boolean
+}
+
+export interface MultipleChoiceChallenge extends Challenge {
+  answers: []
+  correctAnswerIndex: string
+}
+
 export interface MultipleChoicePayload extends EventPayload {
   userAnswerIndex: number
 }
@@ -32,13 +54,3 @@ export interface ProgressContext {
   lessons: object[]
   disableChallenges: boolean
 }
-
-export interface Challenge {
-  challengeType: string
-  question: string
-}
-
-export interface MultipleChoiceChallenge extends Challenge {
-  answers: []
-  correctAnswerIndex: string
-}