Full-Stack React Projects - Second Edition

Moving the lessons to rearrange the order

While updating lessons, the user will also be able to reorder each lesson on the list. There will be an up arrow button for each lesson, except for the very first lesson. This button will be added to each lesson item in the view as follows:

mern-classroom/client/course/EditCourse.js

{ index != 0 &&     <IconButton color="primary" onClick={moveUp(index)}>         <ArrowUp />    </IconButton>}

When the user clicks this button, the lesson in the current index will be moved up, and the lesson above it will be moved to its place in the array. The moveUp function will implement this behavior as follows:

mern-classroom/client/course/EditCourse.js

const moveUp = index => event => {      const lessons = course.lessons const ...