fix(app): specify component for markdown uls (#14997)

When these are undefined, if react-markdown tries to render them it will
throw and that will crash the app. With these implemented with the same
StyledText passthrough as other text elements, it won't crash anymore -
though our styling rules aren't applied to the actual text in the ul.

Closes RQA-2566
Closes RQA-2587

app/src/molecules/ReleaseNotes/index.tsx

@@ -20,9 +20,9 @@ export function ReleaseNotes(props: ReleaseNotesProps): JSX.Element {
  <Markdown
  components={{
  div: undefined,
- ul: undefined,
+ ul: UnnumberedListText,
  h2: HeaderText,
- li: ParagraphText,
+ li: ListItemText,
  p: ParagraphText,
  a: ExternalLink,
  }}
@@ -47,3 +47,11 @@ function ParagraphText(props: JSX.IntrinsicAttributes): JSX.Element {
 function HeaderText(props: JSX.IntrinsicAttributes): JSX.Element {
  return <StyledText {...props} as="h3" />
 }
+
+function ListItemText(props: JSX.IntrinsicAttributes): JSX.Element {
+ return <StyledText {...props} as="li" />
+}
+
+function UnnumberedListText(props: JSX.IntrinsicAttributes): JSX.Element {
+ return <StyledText {...props} as="ul" />
+}

app/src/molecules/modals/styles.module.css

@@ -73,4 +73,4 @@
  max-height: 100%;
  overflow-y: auto;
  padding-bottom: 3rem;
-}
+}