diff --git a/editor.planx.uk/src/@planx/components/Checklist/Editor/Options.tsx b/editor.planx.uk/src/@planx/components/Checklist/Editor/Options.tsx
index 0080d90a92..62229141dc 100644
--- a/editor.planx.uk/src/@planx/components/Checklist/Editor/Options.tsx
+++ b/editor.planx.uk/src/@planx/components/Checklist/Editor/Options.tsx
@@ -2,6 +2,7 @@ import Delete from "@mui/icons-material/Delete";
 import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 import IconButton from "@mui/material/IconButton";
+import { OptionEditor } from "@planx/components/shared/OptionsEditor";
 import adjust from "ramda/src/adjust";
 import compose from "ramda/src/compose";
 import remove from "ramda/src/remove";
@@ -14,7 +15,6 @@ import InputRow from "ui/shared/InputRow";
 
 import { Option } from "../../shared";
 import type { Group } from "../model";
-import { OptionEditor } from "./OptionsEditor";
 
 export const Options: React.FC<{ formik: FormikHookReturn }> = ({ formik }) => {
   return (
diff --git a/editor.planx.uk/src/@planx/components/Checklist/Editor/components/Options.tsx b/editor.planx.uk/src/@planx/components/Checklist/Editor/components/Options.tsx
deleted file mode 100644
index ea42df93eb..0000000000
--- a/editor.planx.uk/src/@planx/components/Checklist/Editor/components/Options.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import Delete from "@mui/icons-material/Delete";
-import Box from "@mui/material/Box";
-import Button from "@mui/material/Button";
-import IconButton from "@mui/material/IconButton";
-import adjust from "ramda/src/adjust";
-import compose from "ramda/src/compose";
-import remove from "ramda/src/remove";
-import React from "react";
-import { FormikHookReturn } from "types";
-import ListManager from "ui/editor/ListManager/ListManager";
-import ModalSectionContent from "ui/editor/ModalSectionContent";
-import Input from "ui/shared/Input/Input";
-import InputRow from "ui/shared/InputRow";
-
-import { Option } from "../../../shared";
-import type { Group } from "../../model";
-import { OptionEditor } from "./OptionsEditor";
-
-export const Options: React.FC<{ formik: FormikHookReturn }> = ({ formik }) => {
-  return (
-    <ModalSectionContent subtitle="Options">
-      {formik.values.groupedOptions ? (
-        <Box>
-          {formik.values.groupedOptions.map(
-            (groupedOption: Group<Option>, groupIndex: number) => (
-              <Box key={groupIndex} mt={groupIndex === 0 ? 0 : 4}>
-                <Box display="flex" pb={1}>
-                  <InputRow>
-                    <Input
-                      required
-                      format="bold"
-                      name={`groupedOptions[${groupIndex}].title`}
-                      value={groupedOption.title}
-                      placeholder="Section Title"
-                      onChange={formik.handleChange}
-                    />
-                  </InputRow>
-                  <Box flex={0}>
-                    <IconButton
-                      title="Delete group"
-                      aria-label="Delete group"
-                      onClick={() => {
-                        formik.setFieldValue(
-                          `groupedOptions`,
-                          remove(groupIndex, 1, formik.values.groupedOptions),
-                        );
-                      }}
-                      size="large"
-                    >
-                      <Delete />
-                    </IconButton>
-                  </Box>
-                </Box>
-                <Box pl={{ md: 2 }}>
-                  <ListManager
-                    values={groupedOption.children}
-                    onChange={(newOptions) => {
-                      formik.setFieldValue(
-                        `groupedOptions[${groupIndex}].children`,
-                        newOptions,
-                      );
-                    }}
-                    newValue={() =>
-                      ({
-                        data: {
-                          text: "",
-                          description: "",
-                          val: "",
-                        },
-                      }) as Option
-                    }
-                    newValueLabel="add new option"
-                    Editor={OptionEditor}
-                    editorExtraProps={{
-                      groupIndex,
-                      showValueField: !!formik.values.fn,
-                      onMoveToGroup: (
-                        movedItemIndex: number,
-                        moveToGroupIndex: number,
-                      ) => {
-                        const item = groupedOption.children[movedItemIndex];
-                        formik.setFieldValue(
-                          "groupedOptions",
-                          compose(
-                            adjust(
-                              moveToGroupIndex,
-                              (option: Group<Option>) => ({
-                                ...option,
-                                children: [...option.children, item],
-                              }),
-                            ),
-                            adjust(groupIndex, (option: Group<Option>) => ({
-                              ...option,
-                              children: remove(
-                                movedItemIndex,
-                                1,
-                                option.children,
-                              ),
-                            })),
-                          )(formik.values.groupedOptions),
-                        );
-                      },
-                      groups: formik.values.groupedOptions.map(
-                        (opt: Group<Option>) => opt.title,
-                      ),
-                    }}
-                  />
-                </Box>
-              </Box>
-            ),
-          )}
-          <Box mt={1}>
-            <Button
-              size="large"
-              onClick={() => {
-                formik.setFieldValue(`groupedOptions`, [
-                  ...formik.values.groupedOptions,
-                  {
-                    title: "",
-                    children: [],
-                  },
-                ]);
-              }}
-            >
-              add new group
-            </Button>
-          </Box>
-        </Box>
-      ) : (
-        <ListManager
-          values={formik.values.options || []}
-          onChange={(newOptions) => {
-            formik.setFieldValue("options", newOptions);
-          }}
-          newValueLabel="add new option"
-          newValue={() =>
-            ({
-              data: {
-                text: "",
-                description: "",
-                val: "",
-              },
-            }) as Option
-          }
-          Editor={OptionEditor}
-          editorExtraProps={{ showValueField: !!formik.values.fn }}
-        />
-      )}
-    </ModalSectionContent>
-  );
-};
diff --git a/editor.planx.uk/src/@planx/components/Checklist/Editor/components/OptionsEditor.tsx b/editor.planx.uk/src/@planx/components/Checklist/Editor/components/OptionsEditor.tsx
deleted file mode 100644
index 034a5ecbea..0000000000
--- a/editor.planx.uk/src/@planx/components/Checklist/Editor/components/OptionsEditor.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-import React from "react";
-import ImgInput from "ui/editor/ImgInput/ImgInput";
-import SimpleMenu from "ui/editor/SimpleMenu";
-import Input from "ui/shared/Input/Input";
-import InputRow from "ui/shared/InputRow";
-import InputRowItem from "ui/shared/InputRowItem";
-
-import { FlagsSelect } from "../../../shared/FlagsSelect";
-import { OptionEditorProps } from "../../types";
-
-export const OptionEditor: React.FC<OptionEditorProps> = (props) => {
-  return (
-    <div style={{ width: "100%" }}>
-      <InputRow>
-        {props.value.id ? (
-          <input type="hidden" value={props.value.id} readOnly />
-        ) : null}
-        <InputRowItem width="200%">
-          <Input
-            required
-            format="bold"
-            multiline
-            value={props.value.data.text || ""}
-            onChange={(ev) => {
-              props.onChange({
-                ...props.value,
-                data: {
-                  ...props.value.data,
-                  text: ev.target.value,
-                },
-              });
-            }}
-            placeholder="Option"
-          />
-        </InputRowItem>
-
-        <ImgInput
-          img={props.value.data.img}
-          onChange={(img) => {
-            props.onChange({
-              ...props.value,
-              data: {
-                ...props.value.data,
-                img,
-              },
-            });
-          }}
-        />
-
-        {typeof props.index !== "undefined" &&
-          props.groups &&
-          props.onMoveToGroup && (
-            <SimpleMenu
-              items={props.groups.map((group, groupIndex) => ({
-                label: `Move to ${group || `group ${groupIndex}`}`,
-                onClick: () => {
-                  props.onMoveToGroup &&
-                    typeof props.index === "number" &&
-                    props.onMoveToGroup(props.index, groupIndex);
-                },
-                disabled: groupIndex === props.groupIndex,
-              }))}
-            />
-          )}
-      </InputRow>
-
-      {props.showValueField && (
-        <InputRow>
-          <Input
-            format="data"
-            value={props.value.data.val || ""}
-            placeholder="Data Value"
-            onChange={(ev) => {
-              props.onChange({
-                ...props.value,
-                data: {
-                  ...props.value.data,
-                  val: ev.target.value,
-                },
-              });
-            }}
-          />
-        </InputRow>
-      )}
-
-      <FlagsSelect
-        value={
-          Array.isArray(props.value.data.flag)
-            ? props.value.data.flag
-            : [props.value.data.flag]
-        }
-        onChange={(ev) => {
-          props.onChange({
-            ...props.value,
-            data: {
-              ...props.value.data,
-              flag: ev,
-            },
-          });
-        }}
-      />
-    </div>
-  );
-};
diff --git a/editor.planx.uk/src/@planx/components/Question/Editor.tsx b/editor.planx.uk/src/@planx/components/Question/Editor.tsx
index e60f851311..025590803b 100644
--- a/editor.planx.uk/src/@planx/components/Question/Editor.tsx
+++ b/editor.planx.uk/src/@planx/components/Question/Editor.tsx
@@ -10,14 +10,13 @@ import ModalSectionContent from "ui/editor/ModalSectionContent";
 import RichTextInput from "ui/editor/RichTextInput/RichTextInput";
 import Input from "ui/shared/Input/Input";
 import InputRow from "ui/shared/InputRow";
-import InputRowItem from "ui/shared/InputRowItem";
 import { Switch } from "ui/shared/Switch";
 
 import { InternalNotes } from "../../../ui/editor/InternalNotes";
 import { MoreInformation } from "../../../ui/editor/MoreInformation/MoreInformation";
 import { BaseNodeData, Option, parseBaseNodeData } from "../shared";
-import { FlagsSelect } from "../shared/FlagsSelect";
 import { ICONS } from "../shared/icons";
+import { OptionEditor } from "../shared/OptionsEditor";
 
 interface Props {
   node: {
@@ -34,100 +33,6 @@ interface Props {
   handleSubmit?: Function;
 }
 
-const OptionEditor: React.FC<{
-  value: Option;
-  onChange: (newVal: Option) => void;
-  showValueField?: boolean;
-}> = (props) => (
-  <div style={{ width: "100%" }}>
-    <InputRow>
-      {props.value.id && (
-        <input type="hidden" value={props.value.id} readOnly />
-      )}
-      <InputRowItem width="200%">
-        <Input
-          required
-          format="bold"
-          multiline
-          value={props.value.data.text || ""}
-          onChange={(ev) => {
-            props.onChange({
-              ...props.value,
-              data: {
-                ...props.value.data,
-                text: ev.target.value,
-              },
-            });
-          }}
-          placeholder="Option"
-        />
-      </InputRowItem>
-      <ImgInput
-        img={props.value.data.img}
-        onChange={(img) => {
-          props.onChange({
-            ...props.value,
-            data: {
-              ...props.value.data,
-              img,
-            },
-          });
-        }}
-      />
-    </InputRow>
-    <InputRow>
-      <Input
-        value={props.value.data.description || ""}
-        placeholder="Description"
-        multiline
-        onChange={(ev) => {
-          props.onChange({
-            ...props.value,
-            data: {
-              ...props.value.data,
-              description: ev.target.value,
-            },
-          });
-        }}
-      />
-    </InputRow>
-    {props.showValueField && (
-      <InputRow>
-        <Input
-          format="data"
-          value={props.value.data.val || ""}
-          placeholder="Data Value"
-          onChange={(ev) => {
-            props.onChange({
-              ...props.value,
-              data: {
-                ...props.value.data,
-                val: ev.target.value,
-              },
-            });
-          }}
-        />
-      </InputRow>
-    )}
-    <FlagsSelect
-      value={
-        Array.isArray(props.value.data.flag)
-          ? props.value.data.flag
-          : [props.value.data.flag]
-      }
-      onChange={(ev) => {
-        props.onChange({
-          ...props.value,
-          data: {
-            ...props.value.data,
-            flag: ev,
-          },
-        });
-      }}
-    />
-  </div>
-);
-
 export const Question: React.FC<Props> = (props) => {
   const type = TYPES.Question;
 
@@ -247,7 +152,10 @@ export const Question: React.FC<Props> = (props) => {
               }) as Option
             }
             Editor={OptionEditor}
-            editorExtraProps={{ showValueField: !!formik.values.fn }}
+            editorExtraProps={{
+              showValueField: !!formik.values.fn,
+              showDescriptionField: true,
+            }}
           />
         </ModalSectionContent>
       </ModalSection>
diff --git a/editor.planx.uk/src/@planx/components/shared/OptionsEditor.tsx b/editor.planx.uk/src/@planx/components/shared/OptionsEditor.tsx
new file mode 100644
index 0000000000..39227423ca
--- /dev/null
+++ b/editor.planx.uk/src/@planx/components/shared/OptionsEditor.tsx
@@ -0,0 +1,125 @@
+import React from "react";
+import ImgInput from "ui/editor/ImgInput/ImgInput";
+import SimpleMenu from "ui/editor/SimpleMenu";
+import Input from "ui/shared/Input/Input";
+import InputRow from "ui/shared/InputRow";
+import InputRowItem from "ui/shared/InputRowItem";
+
+import { Option } from "../shared";
+import { FlagsSelect } from "../shared/FlagsSelect";
+
+export const OptionEditor: React.FC<{
+  value: Option;
+  onChange: (newVal: Option) => void;
+  showValueField?: boolean;
+  showDescriptionField?: boolean;
+  index: number;
+  groupIndex?: number;
+  groups?: Array<string>;
+  onMoveToGroup?: (itemIndex: number, groupIndex: number) => void;
+}> = (props) => (
+  <div style={{ width: "100%" }}>
+    <InputRow>
+      {props.value.id && (
+        <input type="hidden" value={props.value.id} readOnly />
+      )}
+      <InputRowItem width="200%">
+        <Input
+          required
+          format="bold"
+          multiline
+          value={props.value.data.text || ""}
+          onChange={(ev) => {
+            props.onChange({
+              ...props.value,
+              data: {
+                ...props.value.data,
+                text: ev.target.value,
+              },
+            });
+          }}
+          placeholder="Option"
+        />
+      </InputRowItem>
+      <ImgInput
+        img={props.value.data.img}
+        onChange={(img) => {
+          props.onChange({
+            ...props.value,
+            data: {
+              ...props.value.data,
+              img,
+            },
+          });
+        }}
+      />
+    </InputRow>
+    <InputRow>
+      {props.showDescriptionField && (
+        <Input
+          value={props.value.data.description || ""}
+          placeholder="Description"
+          multiline
+          onChange={(ev) => {
+            props.onChange({
+              ...props.value,
+              data: {
+                ...props.value.data,
+                description: ev.target.value,
+              },
+            });
+          }}
+        />
+      )}
+      {typeof props.index !== "undefined" &&
+        props.groups &&
+        props.onMoveToGroup && (
+          <SimpleMenu
+            items={props.groups.map((group, groupIndex) => ({
+              label: `Move to ${group || `group ${groupIndex}`}`,
+              onClick: () => {
+                props.onMoveToGroup &&
+                  typeof props.index === "number" &&
+                  props.onMoveToGroup(props.index, groupIndex);
+              },
+              disabled: groupIndex === props.groupIndex,
+            }))}
+          />
+        )}
+    </InputRow>
+    {props.showValueField && (
+      <InputRow>
+        <Input
+          format="data"
+          value={props.value.data.val || ""}
+          placeholder="Data Value"
+          onChange={(ev) => {
+            props.onChange({
+              ...props.value,
+              data: {
+                ...props.value.data,
+                val: ev.target.value,
+              },
+            });
+          }}
+        />
+      </InputRow>
+    )}
+    <FlagsSelect
+      value={
+        Array.isArray(props.value.data.flag)
+          ? props.value.data.flag
+          : [props.value.data.flag]
+      }
+      onChange={(ev) => {
+        props.onChange({
+          ...props.value,
+          data: {
+            ...props.value.data,
+            flag: ev,
+          },
+        });
+      }}
+    />
+  </div>
+);