Skip to content

Conversation

yeonkim1213
Copy link
Contributor

@yeonkim1213 yeonkim1213 commented Sep 4, 2025

Does this PR close any open issues?

Closes #690

Give a longer description of what this PR addresses and why it's needed

export interface RankingResponse extends BaseResponse {
  type: 'ranking-sublist' | 'ranking-categorical' | 'ranking-pairwise';
  options: (StringOption | string)[];
  numItems?: number;
}
image

Provide pictures/videos of the behavior before and after these changes (optional)

Sub-list ranking mode

ranking-sublist.mov

Categorical binning mode

categorical.mov

Pairwise comparison mode

ranking-pairwise.mov

Are there any additional TODOs before this PR is ready to go?

TODOs:

  • Add index to sublist ranking
  • Add top-k ranking widget
  • Update pairwise ranking widget design
  • Check provenance is properly tracked in replay
  • Add disable next button until available items are used up
  • Remove ranking widget library and keep it in demo studies. Add reference in demo study
  • Fix trial stats for ranking widget

Reference

https://ui.mantine.dev/category/dnd/
https://dev.to/kelseyroche/a-beginners-guide-to-drag-and-drop-with-dnd-kit-in-react-5hfe

Copy link

github-actions bot commented Sep 4, 2025

A preview of 5cb988d is uploaded and can be seen here:

https://revisit.dev/study/PR817

Changes may take a few minutes to propagate.

@yeonkim1213 yeonkim1213 linked an issue Sep 16, 2025 that may be closed by this pull request
@yeonkim1213 yeonkim1213 marked this pull request as ready for review September 25, 2025 14:53
Copy link
Contributor

@JackWilb JackWilb left a comment

Choose a reason for hiding this comment

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

Some small fixes and some docs required

Also, please add a link to the response type from the typeDocReadme.md

Comment on lines 572 to 581
```js
{
"id": "ranking-sublist",
"type": "ranking-sublist",
"prompt": "Rank the following options",
"location": "belowStimulus",
"options": ["Option 1", "Option 2", "Option 3"]
"numItems": 2
}
```
Copy link
Contributor

Choose a reason for hiding this comment

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

Add some more docs, an example of each type

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Added docs and examples

Comment on lines 143 to 165
if ((matrixAnswers && matrixResponse.length > 0) || (rankingAnswers && rankingResponse.length > 0)) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const updatedValues: Record<string, any> = { ...answerValidator.values };
// Adjust object to have new matrix response values
matrixResponse.forEach((r) => {
const { id } = r;
updatedValues[id] = {
...answerValidator.getInputProps(id).value,
...matrixAnswers[id],
};
});

rankingResponse.forEach((r) => {
const { id } = r;
updatedValues[id] = {
...answerValidator.getInputProps(id).value,
...rankingAnswers[id],
};
});

// update answerValidator
answerValidator.setValues(updatedValues);
}
Copy link
Contributor

Choose a reason for hiding this comment

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

Do we need 2 ifs? 1 if is okay? no if?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Removed if statement

Copy link
Contributor

Choose a reason for hiding this comment

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

Duplicate some of this into demo-survey

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Duplicated to demo-survey

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.

Ranking widgets
2 participants