Create cohorts page for students

[Haroogle]

Create basic layout for page

-Route should /cohorts/:id where the id will be the user's id data 1) This will be linked to the studentsPage component 2) The students wireframe will show a list of students in their cohort, a list of teachers available to them and the list of their exercises.

-Students component should contain multiple components for 1) A list of students from same cohort studentsList 2) A list of teachers component for teachers that are available to students teachersList 3) a list of students exercises myExercises

-Have a CSS page to organise the grid

State

-State [studentPage, setStudentPage] in an empty array to updated from objects in an initialStudentPageState such as studentsList, teachersList and myExercises in an empty string. Will be passed as props to {StudentPage} from {CohortsPage}

1) The CohortsPage component see issue #99

2) Only students with same cohort ID will fetch data for that user in his cohort

• fetching data of all the student's names

• Exercises will have its own URL to fetch from

Possible Condition Render for Teachers and Students

function nonStudent() {
  return <h1>Teachers</h1>;
}

function isStudent() {
  return <h1>Students</h1>;
}

function nonStudent(props) {
  const isTeacher = props.isTeacher;

 if (isTeacher) {
    return <nonStudent/>;
  }
  return <isStudent/>;
}

[dogezen]

@Haroogle -> please refer to comment https://github.com/boolean-uk/team-dev-frontend-client/issues/109 for similar feedback; this needs much more detail

• what are the compponents you need
• wireframe
• where will the code live (which folder and what file)?
• how are you going to conditionally render the page for student vs the page for teachers?

[dogezen]

Missing: where are you storing state and where are you loading it

Missing: what is the name of the CohortsPage component? CohortsPage? and where will this file need to be created

Missing: there are a lot of sub-components, when completing work for this issue, will you just have PLACEHOLDERS? like a div with a bg color, to simulate the missing components?

[Auenc]

Great, I think this is good to go!