Skip to content

Conversation

@duvld
Copy link
Member

@duvld duvld commented Nov 11, 2025

🗒️ Checklist

  1. run linter locally
  2. update developer docs (API, README, inline, etc.), if any
  3. for user-facing doc changes create a Zulip thread at #Support Docs Updates, if any
  4. draft PR with a title <type>(<scope>)<!>: <title> DEV-1234
  5. assign yourself, tag PR: at least Front end and/or Back end or workflow
  6. fill in the template below and delete template comments
  7. review thyself: read the diff and repro the preview as written
  8. open PR & confirm that CI passes & request reviewers, if needed
  9. delete this section before merging

💭 Notes

The "best" solution would probably be to refactor all of radio.tsx to mantine, but that creates a bigger problem than this scope. Our radio.tsx (not using mantine) has the ability to de-select options, if we convert it to use mantine Radio, then there will be a regression to this feature. To offset this for the qualitative analysis project we introduced a clear button--this has not been done everywhere a radio.tsx is being used. Further investigation into this is needed, but out of scope of this PR

👀 Preview steps

  1. ℹ️ have an account and a project with a submission that can open NLP
  2. go to qualitative analysis and create a select one question
  3. 🔴 [on main] notice that select options are de-selectable
  4. 🟢 [on PR] notice that select options are not de-selectable and the clear button works as intended
  5. 🟢 notice that all other functionality is preserved

@duvld duvld self-assigned this Nov 11, 2025
@duvld duvld changed the title refactor(analysis): migrate select one form to mantine refactor(analysis): migrate select one form to mantine DEV-1194 Nov 11, 2025
@duvld duvld changed the title refactor(analysis): migrate select one form to mantine DEV-1194 refactor(analysis): migrate select one form to mantine DEV-1169 Nov 11, 2025
Comment on lines 75 to 84
<Stack gap={'xs'}>
{getOptions().map((option) => (
<Radio
value={option.value}
label={option.label}
onChange={(newResponse) => onRadioChange(newResponse.currentTarget.value)}
checked={response === option.value}
/>
))}
</Stack>
Copy link
Contributor

@Akuukis Akuukis Nov 12, 2025

Choose a reason for hiding this comment

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

please wrap in Radio.Group for better semantics, see Mantine and MDN

Copy link
Member

@magicznyleszek magicznyleszek left a comment

Choose a reason for hiding this comment

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

Generaly works fine (tested), but I have some more general questions :)

/>
<Stack gap={'xs'}>
{getOptions().map((option) => (
<Radio
Copy link
Member

Choose a reason for hiding this comment

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

I noticed that Radio doesn't have pointer cursor

@duvld duvld force-pushed the anji/dev-1169-select-one-to-mantine branch from a0969cd to d76a4ea Compare November 19, 2025 16:00
Base automatically changed from anji/dev-1194-clear-button to main November 19, 2025 16:11
@duvld duvld force-pushed the anji/dev-1169-select-one-to-mantine branch from d76a4ea to d1bde78 Compare November 19, 2025 20:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants