Fix 1448: Improve "All submissions" view

[sayravai]

Description

Implement a more performant and functional version of the current All Submissions page.

Why?

The current version only loads 50 latest submissions, and the "Show all submissions" does not load at all on very large courses.

How?

Database access was optimized to avoid duplicated queries repeated for each submission. The only issue remaining is the need for listing all the returned submission IDs in one WHERE ... IN (...) query, so it is not feasible to fetch many thousands of results at once. However, getting several hundreds of results now only takes tens of milliseconds instead of a second or so. The existing results table was not changed to use the DataTables plugin used in Participants and All Results pages, as we cannot typically load all the data into the table anyway. This was resolved by adding a search functionality, which can be used to reduce the result set below 500 submissions (the current maximum, can be adjusted). In the future, paging could be added if it's necessary to actually display all results at once for some reason.

A button to download all submissions (containing attachment files) within the current result set was added. This currently has some duplicated code in api/views (used in downloading attachments) and course/views (used in All submissions page), so this could at least partially be combined into an utility function to avoid the functionality being changed in one place but not the other in the future.

I had issues with the django-colortag rendering when running tests due to some mixup with using html_badge and html_label within A+, so I made some changes to the tag handling to make it more robust and also created unit tests for this.

Fixes #1448

Testing

Remember to add or update unit tests for new features and changes.

• How to test your changes in A-plus
• How to test accessibility

What type of test did you run?

• Accessibility test using the WAVE extension.
• Django unit tests.
• Selenium tests.
• Other test. (Add a description below)
• Manual testing.

[ADD A DESCRIPTION ABOUT WHAT YOU TESTED MANUALLY]

Did you test the changes in

• Chrome
• Firefox
• This pull request cannot be tested in the browser.

Think of what is affected by these changes and could become broken

Translation

• Did you modify or add new strings in the user interface? (Read about how to create translation)

Programming style

• Did you follow our style guides?
• Did you use Python type hinting in all functions that you added or edited? (type hints for function parameters and return values)

Have you updated the README or other relevant documentation?

• documents inside the doc directory.
• README.md.
• Aplus Manual.
• Other documentation (mention below which documentation).

Is it Done?

• Reviewer has finished the code review
• After the review, the developer has made changes accordingly
• Customer/Teacher has accepted the implementation of the feature

Clean up your git commit history before submitting the pull request!

[ihalaij1]

Works great!

I haven't looked at the code yet, but here are some things I noticed when testing.

[sayravai]

Thanks for the comments! I pushed fixes for the issues:

• Hardcoded background color removed for bootstrap-multiselect options.
• Removed title fields for the individual select options.
• Removed extra spaces from the main multiselect button title text, and capped the amount of selected options displayed to 30 + "..."
• Fixed the Search field positioning

Also the css is now formatted to allow easier editing further down the line, and I added icons for the Search fields on the All submissions page.

I did not touch the color of the accordion open/close button, as that is the default for the BS5 class "accordion-button". Maybe we can think of other ways to get users to notice the search options, or see if it becomes an issue...?

[ihalaij1]

Do you think it would take too much space if the Search accordion was open by default, instead of collapsed? @sayravai

[sayravai]

I would prefer to have it closed when there's no limiting search present in the URL, as one can see more results immediately. But maybe we can listen to user feedback on this, once the new page is in production? It's trivial to change it either way.

[ihalaij1]

Great!

I fixed the XSS issue.

[sayravai]

Thanks for the fixes!