ST2936 polls: fix PollQuestion deletion bug (#1806)

Author: shn-liqd

adhocracy4/polls/static/PollDashboard/EditPollChoice.jsx

@@ -2,9 +2,9 @@ import React from 'react'
 import django from 'django'
 import FormFieldError from '../../../static/FormFieldError'
 
-export const EditPollChoice = (props) => {
+export const EditPollChoice = React.forwardRef((props, ref) => {
   return (
-    <div className="form-group">
+    <div className="form-group" ref={ref}>
       <div htmlFor={'id_choices-' + props.id + '-name'}>
         {django.pgettext('noun', 'Answer')} {props.index}
         {props.choiceId &&
@@ -43,4 +43,6 @@ export const EditPollChoice = (props) => {
       />
     </div>
   )
-}
+})
+
+EditPollChoice.displayName = 'EditPollChoice'

adhocracy4/polls/static/PollDashboard/EditPollManagement.jsx

@@ -242,6 +242,7 @@ export const EditPollManagement = (props) => {
                 ? (
                   <EditPollOpenQuestion
                     id={key}
+                    key={key}
                     question={question}
                     onLabelChange={(label) => handleQuestionLabel(index, label)}
                     onHelptextChange={(helptext) => handleQuestionHelpText(index, helptext)}
@@ -254,6 +255,7 @@ export const EditPollManagement = (props) => {
                 : (
                   <EditPollQuestion
                     id={key}
+                    key={key}
                     question={question}
                     onLabelChange={(label) => handleQuestionLabel(index, label)}
                     onHelptextChange={(helptext) => handleQuestionHelpText(index, helptext)}

adhocracy4/polls/static/PollDashboard/EditPollOpenQuestion.jsx

@@ -3,11 +3,11 @@ import django from 'django'
 import FormFieldError from '../../../static/FormFieldError'
 import { HelptextForm } from './HelptextForm'
 
-export const EditPollOpenQuestion = (props) => {
+export const EditPollOpenQuestion = React.forwardRef((props, ref) => {
   const [hasHelptext, setHasHelptext] = useState(props.question.help_text)
 
   return (
-    <section className="editpoll__question-container">
+    <section ref={ref} className="editpoll__question-container">
       <div className="editpoll__question">
         <div className="editpoll__question--border">
           <div className="form-group">
@@ -80,4 +80,6 @@ export const EditPollOpenQuestion = (props) => {
       </div>
     </section>
   )
-}
+})
+
+EditPollOpenQuestion.displayName = 'EditPollOpenQuestion'

adhocracy4/polls/static/PollDashboard/EditPollQuestion.jsx

@@ -6,11 +6,11 @@ import { HelptextForm } from './HelptextForm'
 
 const FlipMove = require('react-flip-move').default
 
-export const EditPollQuestion = (props) => {
+export const EditPollQuestion = React.forwardRef((props, ref) => {
   const [hasHelptext, setHasHelptext] = useState(props.question.help_text)
   const hasOtherOption = props.question.choices.find(c => c.is_other_choice)
   return (
-    <section className="editpoll__question-container">
+    <section ref={ref} className="editpoll__question-container">
       <div className="editpoll__question">
         <div className="form-group editpoll__question--border">
           <label
@@ -162,4 +162,6 @@ export const EditPollQuestion = (props) => {
       </div>
     </section>
   )
-}
+})
+
+EditPollQuestion.displayName = 'EditPollQuestion'