WIP: react app

Initial implementation of the react app.

Before merging we should ensure that the full functionality is preserved (so closing #99 (closed)).

Goal

Initial react interface by Apr 16 or Apr 6

UI cleanup/streamlining is beyond the scope of this demo

Global

• Show course name (not for demo)
• Select grader (not for demo)

Student matching

• Submission validation: implement upload
• Remove "assigned"

Grading

• Add a problem dropdown

• Use a sidebar similar to student selection, "edit" should allow to edit feedback options

• UI for finding a student's submission based on the student name/number

• add feedback button/menu (should replace feedback option list, like edit student)

• also "custom feedback" (not for demonstration)

• Add UI for operating on students having a specific feedback option (not for demo)

• edit/delete feedback option (not for demonstration)

Results

• Exam selector

• stats, exam stats

  • Copy the plot generation code, make it an API endpoint (before replacing with plotly)
  • Add a minimal problem stats description + dropdown for problem selection

• email, mass email

• export

(maybe make results a dropdown/submenu)

Polishing the text descriptions

Notification

(not urgent for demo)

Frontend components

• Exam selector
• Problem selector
• Progress bar
• Student navigation (similar to submission, but with search by student)
• Problem image
• Feedback
  • Feedback list (oneline select multiple)
  • Add/Edit feedback (similar to edit student)
• Exam summary plot (for now an image, eventually plotly plot)
• Ploblem stats summary (feeback option frequencies, scores, score distrbutions), table-like
• Email template editor
• Email renderer
• Recipients selector:
  • custom
  • student
  • all
• Export (single dropdown?)

Backend calls

For now we use copy_number as submission id, should revisit this later (now all submission ids should appear with exam id and be wrapped into Submission.get(exam=exam, copy_number=submission_id)

• GET /exams
• GET /problems/<exam_id> {<problem_id>: <problem_name>}
• GET, POST, PUT /feedback/<problem_id> {<feedbackoption_id>: <feedback text>, <feeback description>, <feedback score>, <times used>}
• GET /submissions/<exam_id>
• GET /images/solutions/<exam_id>/<problem_id>/<submission_id>
• GET, PUT /solutions/feedback/<exam_id>/<problem_id>/<submission_id>
• GET /stats/<problem_id> {score: number of occurences} (null for ungraded)
• GET /images/summary/<exam_id>
• GET /email/template/<exam_id> (for now returns constant value)
• POST /email/render/<exam_id>/<submission_id> (takes template as a parameter)
• POST /email/send/<exam_id>/<submission_id> (may also send mass email, takes recipients and template as parameter)
• GET /export/<xlsx/xlsx_full/pd>/<exam_id>
• GET /export/full