State variables structure

This page will include detailed information about the most important states and variables that we use in the app.

Do you see the classes selected in the dropdowns as well as the buttons with the icon numbers on it in the image below?

How are we able to store that inside of the code?´

We have a variable called multipleOptions, which is an array of Options.

type MultipleOptions = Array<Option>

What does each position of the array represent?

• The first position of the array corresponds to when the user has the button with the icon of number 1 selected.
• The second position of the array corresponds to when the user has the button with the icon of number 2 selected.
• The third position of the array corresponds to when the user has the button with the icon of number 3 selected.
• And so on ...

Now that we know what each position represents, what does the Option value in that position represent?

type Option = {
  id: number,
  icon: string,
  name: string,
  course_options: Array<CourseOption>
}

• It specifies the id, the name and the icon. In the case of the first option, which is the one selected in the image the name is "Horário 1"

And what about the CourseOption type?

type CourseOption = {
  course_id: number,
  picked_class_id: number,
  locked: boolean,
  filteredTeachers: Array<number>,
  hide: Array<lesson_type>,
}