redesign and refactoring of the admin/task page.

[nataliagulko]

This page has huge performance issue. When I type something in fields or select items from dropdown in Modal, the whole page with table and all data is re-rendered. Need to be refactored into separate components and logical parts

[TattiMikhailava]

There are some difficulties with filling in the form fields. The coordinators show some properties, but these options do not help to organize the table data. It is also not clear how and when to mark task settings. One of the required fill ‘Task type’ defines settings of the assignment, if they are necessary to be marked.

Design solution

1. Add tips to fields.

2. Organize the task list in alphabetical order: Codejam
   Codewars
   CV (HTML)
   CV (Markdown)
   Google form test
   Group task
   HTML task
   Interview
   JS task
   Jupyter Notebook
   Kotlin task
   Objective-C task
   RS School app test
   Technical screening
   Cross-check.

3. Divide tasks into groups according to the required characteristics: ‘Criteria for the cross-check task’, ‘GitHub’, ‘JSON Attributes’.

4. Show these criteria as available if they are needed to be filled for some of tasks. Otherwise, the collapse component must have a disabled state.

The group of tasks, that has required settings for the cross-check:

1. Cross-check
2. Group task

The group of tasks, that has required settings for Github:

1. Codejam
2. JS task

The group of tasks, that has required settings for the JSON Attributes:

1. Interview
2. Technical screening
3. RS School app test
4. Codewars

The group of tasks, that has required settings for ‘GitHub’ and ‘JSON Attributes’:

1. Jupyter Notebook
2. Kotlin task
3. Objective-C task

Layout to implement.

[TattiMikhailava]

There are some difficulties with filling in the form fields. The coordinators show some properties, but these options do not help to organize the table data. It is also not clear how and when to mark task settings. One of the required fill ‘Task type’ defines settings of the assignment, if they are necessary to be marked.

Design solution

1. Add tips to fields.

2. Organize the task list in alphabetical order: Codejam
   Codewars
   CV (HTML)
   CV (Markdown)
   Google form test
   Group task
   HTML task
   Interview
   JS task
   Jupyter Notebook
   Kotlin task
   Objective-C task
   RS School app test
   Technical screening
   Cross-check.

3. Divide tasks into groups according to the required characteristics: ‘Criteria for the cross-check task’, ‘GitHub’, ‘JSON Attributes’.

4. Show these criteria as available if they are needed to be filled for some of tasks. Otherwise, the collapse component must have a disabled state.

The group of tasks, that has required settings for the cross-check:

1. Cross-check
2. Group task

The group of tasks, that has required settings for Github:

1. Codejam
2. JS task

The group of tasks, that has required settings for the JSON Attributes:

1. Interview
2. Technical screening
3. RS School app test
4. Codewars

The group of tasks, that has required settings for ‘GitHub’ and ‘JSON Attributes’:

1. Jupyter Notebook
2. Kotlin task
3. Objective-C task

Layout to implement.