diff --git a/pages/exercises/[lessonSlug].tsx b/pages/exercises/[lessonSlug].tsx index 6992d03b0..cbd53e7b4 100644 --- a/pages/exercises/[lessonSlug].tsx +++ b/pages/exercises/[lessonSlug].tsx @@ -16,6 +16,7 @@ import { NewButton } from '../../components/theme/Button' import ExerciseCard, { ExerciseCardProps } from '../../components/ExerciseCard' import { ArrowLeftIcon } from '@primer/octicons-react' import GET_EXERCISES from '../../graphql/queries/getExercises' +import chunk from 'lodash/chunk' const exampleProblem = `const a = 5 a = a + 10 @@ -24,6 +25,7 @@ a = a + 10 const mockExercisePreviews: ExercisePreviewCardProps[] = [ { moduleName: 'Variables', state: 'ANSWERED', problem: exampleProblem }, { moduleName: 'Variables', state: 'NOT ANSWERED', problem: exampleProblem }, + { moduleName: 'Variables', state: 'ANSWERED', problem: exampleProblem }, { moduleName: 'Variables', state: 'ANSWERED', problem: exampleProblem } ] @@ -170,19 +172,20 @@ const ExerciseList = ({
-
- {mockExercisePreviews.map((exercisePreview, i) => ( - - ))} -
+ {chunk(mockExercisePreviews, 3).map((exercisePreviewChunk, i) => ( +
+ {exercisePreviewChunk.map((exercisePreview, j) => ( +
+ +
+ ))} +
+ ))}
)