Description
In src/components/CreatePollDialog.jsx, addOption() (line 7) lets a teacher add unlimited poll option fields, but there is no corresponding remove/delete control for any individual option once added. If a teacher adds an extra option by mistake, the only way to recover is to close the dialog and start the poll over from scratch. Separately, handleSubmit's validation (options.some(o => !o), line 16) only rejects an empty string — an option consisting purely of whitespace (e.g. " ") passes validation and gets submitted as a real poll option.
Steps to Reproduce
Missing remove control:
- Go to: Dashboard → open a lecture → launch "Create Poll".
- Click "+ Add Option" three or four times.
- Try to remove one of the extra options.
- Expected: each option row has a delete/remove button.
- Actual: no such control exists — the only option is to close the whole dialog and re-enter everything.
Whitespace-only option:
- In the same dialog, type a real question.
- For one option, type only spaces (e.g.
" ").
- Fill the other option(s) normally and click "Launch Poll".
- Expected: submission is blocked with a validation message, since the option is effectively empty.
- Actual: the poll launches with a blank-looking option that has zero visible content but registers as filled.
Expected Behavior
- Each option input should have an adjacent remove ("×") button once there are more than 2 options (2 should be the practical minimum for a poll).
- Submission validation should trim option values before checking for emptiness, so whitespace-only entries are rejected the same as truly empty ones.
Actual Behavior
- Options can only be added, never removed, once the dialog is open.
options.some(o => !o) does not catch " " since a non-empty string is truthy.
Screenshots
N/A — straightforward to confirm by opening the dialog and counting the controls vs. clicking "+ Add Option" multiple times.
Environment
- Browser: Any (Chrome 125, Firefox 127, Safari)
- OS: Cross-platform
- Node.js version: 20.x
Affected Page / Component
Additional Context
Suggested fix for removal:
```jsx
const removeOption = (index) => {
if (options.length <= 2) return; // keep a minimum of 2 options
setOptions(options.filter((_, i) => i !== index));
};
```
…with a small "×" button rendered next to each option input (hidden or disabled when options.length <= 2).
Suggested fix for whitespace validation:
```js
const handleSubmit = () => {
const trimmedQuestion = question.trim();
const trimmedOptions = options.map(o => o.trim());
if (!trimmedQuestion || trimmedOptions.some(o => !o)) return;
onSubmit({
id: Date.now(),
question: trimmedQuestion,
options: trimmedOptions.map(label => ({ label, votes: 0 })),
active: true
});
onClose();
};
```
/assign
Description
In
src/components/CreatePollDialog.jsx,addOption()(line 7) lets a teacher add unlimited poll option fields, but there is no corresponding remove/delete control for any individual option once added. If a teacher adds an extra option by mistake, the only way to recover is to close the dialog and start the poll over from scratch. Separately,handleSubmit's validation (options.some(o => !o), line 16) only rejects an empty string — an option consisting purely of whitespace (e.g." ") passes validation and gets submitted as a real poll option.Steps to Reproduce
Missing remove control:
Whitespace-only option:
" ").Expected Behavior
Actual Behavior
options.some(o => !o)does not catch" "since a non-empty string is truthy.Screenshots
N/A — straightforward to confirm by opening the dialog and counting the controls vs. clicking "+ Add Option" multiple times.
Environment
Affected Page / Component
src/components/CreatePollDialog.jsxAdditional Context
Suggested fix for removal:
```jsx
const removeOption = (index) => {
if (options.length <= 2) return; // keep a minimum of 2 options
setOptions(options.filter((_, i) => i !== index));
};
```
…with a small "×" button rendered next to each option input (hidden or disabled when
options.length <= 2).Suggested fix for whitespace validation:
```js
const handleSubmit = () => {
const trimmedQuestion = question.trim();
const trimmedOptions = options.map(o => o.trim());
if (!trimmedQuestion || trimmedOptions.some(o => !o)) return;
onSubmit({
id: Date.now(),
question: trimmedQuestion,
options: trimmedOptions.map(label => ({ label, votes: 0 })),
active: true
});
onClose();
};
```
/assign