Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add search bar to metrics feature watchlist #1353

Merged
merged 10 commits into from
Oct 7, 2021

Conversation

ashleyzhang
Copy link
Contributor

@ashleyzhang ashleyzhang commented May 4, 2021

Description

This PR adds a search bar to each tab of the watchlist in the metrics feature so that instructors can search students by name, email, or violated metrics condition.

Screen Shot 2021-05-04 at 4 53 47 PM

Motivation and Context

Especially when a tab in the watchlist has a large number of students, instructors may want to search for particular students.

How Has This Been Tested?

Ensure that there are students in the watchlist by adjusting the metrics conditions.

  1. In the search bar that appears in the header on each tab, type something into the search bar. There should be suggestions offered below as you type.
  2. Click enter on the search input, and the watchlist entries should be filtered down to any instances that contain the search input in either the email or the name, or if the search input is a metrics condition, then it should filter down to any instances that have violated that condition.
  3. When there are no students in a tab, the same empty message as before should appear.
  4. When clicking enter in the search bar without entering text, nothing should happen.
  5. When there are no students that match the search input, the search bar header should still appear but with no rows below.

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

  • My change requires a change to the documentation, which is located at Autolab Docs
  • I have updated the documentation accordingly, included in this PR

Other issues / help required

In the future, we can iterate on this to implement a more comprehensive search feature that allows instructors to search by multiple categories (i.e. multiple violated conditions or a violated condition and a name). Also, please let me know if you have any design suggestions!

If unsure, feel free to submit first and we'll help you along.

@amartinez116 amartinez116 requested a review from victorhuangwq May 4, 2021 21:06
}
}

function add_instance_to_dict(
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the params are long, could convert it into a javascript object

Copy link
Contributor

@victorhuangwq victorhuangwq left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In general the search feature is intuitive to use, and the categories chosen are great.
There are some repetition in the code, which hopefully could be reduced.
Lastly, we would strongly prefer to modify the on-click behavior of results: https://fomantic-ui.com/modules/search.html#/settings

} else {
$('#archived_tab').html(archived_html);
}
pending_empty_message = "There are no pending students in need of attention";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NIT: could reduce the duplication in the following chunk of code

@@ -319,9 +364,55 @@ function get_watchlist_function(){
}
});

$("#pending_search").keypress(function (e) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NIT: reduce the repetition here

$('.ui.icon').popup();
$('.ui.circular.label.condition').popup();

$('#pending_search').search({
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NIT: similar situation here

}
});
$("#resolved_search").keypress(function (e) {
var code = (e.keyCode ? e.keyCode : e.which);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Contributor

@victorhuangwq victorhuangwq left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested locally, functionality seems complete. Great work :)

@ashleyzhang ashleyzhang merged commit 3196238 into master Oct 7, 2021
@ashleyzhang ashleyzhang deleted the metrics-watchlist-search branch October 7, 2021 21:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants