Jul 6, 2020 · Jul 6, 2020
diff --git a/typings/tutorial.d.ts b/typings/tutorial.d.ts
 import { ProgressStatus } from './index'

 export type Maybe<T> = T | null

 export type TutorialConfig = {
  setup?: Maybe<StepActions>
  /** A set of tasks for users linked to unit tests */
  steps: Array<Step>
  status?: ProgressStatus
 }

 /** A level task */
  solution: Maybe<StepActions>
  hints?: string[]
  subtasks?: string[]
  status?: ProgressStatus
 }

 /** A tutorial for use in VSCode CodeRoad */
diff --git a/web-app/src/containers/Tutorial/components/ContentMenu.tsx b/web-app/src/containers/Tutorial/components/ContentMenu.tsx
 import Icon from '../../../components/Icon'

 interface Props {
 tutorial: TT.Tutorial
 levels: TT.Level[]
  position: T.Position
  progress: T.Progress
  setTitle: (title: string) => void
  setContent: (content: string) => void
 }

 const ContentMenu = ({tutorial, position, progress, setTitle, setContent }: Props) => {
 const ContentMenu = ({levels, position, progress, setTitle, setContent }: Props) => {
  const setMenuContent = (levelId: string) => {
    const selectedLevel: TT.Level | undefined =tutorial.levels.find((l: TT.Level) => l.id === levelId)
    const selectedLevel: TT.Level | undefined = levels.find((l: TT.Level) => l.id === levelId)
    if (selectedLevel) {
      setTitle(selectedLevel.title)
      setContent(selectedLevel.content)
    }
  }
  return (
    <Menu>
      {tutorial.levels.map((level: TT.Level) => {
      {levels.map((level: TT.Level) => {
        const isCurrent = level.id === position.levelId
        const isComplete = progress.levels[level.id]
        let icon
diff --git a/web-app/src/containers/Tutorial/components/Level.tsx b/web-app/src/containers/Tutorial/components/Level.tsx
 }

 interface Props {
  tutorial: TT.Tutorial
  tutorial:Exclude<TT.Tutorial, 'config'>
  index: number
  status: 'COMPLETE' | 'ACTIVE' | 'INCOMPLETE'
  progress: T.Progress
  processes,
  testStatus,
 }: Props) => {
  const level = tutorial.levels[index]
  const level: TT.Level = tutorial.levels[index]

  console.log(level)

  const [title, setTitle] = React.useState<string>(level.title)
  const [content, setContent] = React.useState<string>(level.content)

  const menu = (
    <ContentMenu
 tutorial={tutorial}
 levels={tutorial.levels || []}
      position={position}
      progress={progress}
      setTitle={setTitle}
Original file line number	Diff line number	Diff line change
		@@ -1,3 +1,5 @@
		import { ProgressStatus } from './index'

		export type Maybe<T> = T \| null

		export type TutorialConfig = {
Expand All		@@ -19,6 +21,7 @@ export type Level = {
		setup?: Maybe<StepActions>
		/** A set of tasks for users linked to unit tests */
		steps: Array<Step>
		status?: ProgressStatus
		}

		/** A level task */
Expand All		@@ -29,6 +32,7 @@ export type Step = {
		solution: Maybe<StepActions>
		hints?: string[]
		subtasks?: string[]
		status?: ProgressStatus
		}

		/** A tutorial for use in VSCode CodeRoad */
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -5,24 +5,24 @@ import { Menu } from '@alifd/next'
		import Icon from '../../../components/Icon'

		interface Props {
		tutorial: TT.Tutorial
		levels: TT.Level[]
		position: T.Position
		progress: T.Progress
		setTitle: (title: string) => void
		setContent: (content: string) => void
		}

		const ContentMenu = ({tutorial, position, progress, setTitle, setContent }: Props) => {
		const ContentMenu = ({levels, position, progress, setTitle, setContent }: Props) => {
		const setMenuContent = (levelId: string) => {
		const selectedLevel: TT.Level \| undefined =tutorial.levels.find((l: TT.Level) => l.id === levelId)
		const selectedLevel: TT.Level \| undefined = levels.find((l: TT.Level) => l.id === levelId)
		if (selectedLevel) {
		setTitle(selectedLevel.title)
		setContent(selectedLevel.content)
		}
		}
		return (
		<Menu>
		{tutorial.levels.map((level: TT.Level) => {
		{levels.map((level: TT.Level) => {
		const isCurrent = level.id === position.levelId
		const isComplete = progress.levels[level.id]
		let icon
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -88,7 +88,7 @@ const styles = {
		}

		interface Props {
		tutorial: TT.Tutorial
		tutorial:Exclude<TT.Tutorial, 'config'>
		index: number
		status: 'COMPLETE' \| 'ACTIVE' \| 'INCOMPLETE'
		progress: T.Progress
Expand All		@@ -114,7 +114,9 @@ const Level = ({
		processes,
		testStatus,
		}: Props) => {
		const level = tutorial.levels[index]
		const level: TT.Level = tutorial.levels[index]

		console.log(level)

		const [title, setTitle] = React.useState<string>(level.title)
		const [content, setContent] = React.useState<string>(level.content)
Expand All		@@ -135,7 +137,7 @@ const Level = ({

		const menu = (
		<ContentMenu
		tutorial={tutorial}
		levels={tutorial.levels \|\| []}
		position={position}
		progress={progress}
		setTitle={setTitle}
Expand Down