From 664859cec824e0fd6135be776b7e7d5aca62ae18 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Wed, 23 Aug 2023 11:13:28 -0400
Subject: [PATCH 01/12] fix: markdown table in WIP

---
 package.json                                  |   3 +
 src/config/theme/popOverTheme.ts              |  14 +
 src/config/theme/theme.ts                     |   2 +
 src/forms/components/TableExtension.tsx       |   1 +
 src/forms/markdown/MarkdownField.tsx          |  30 +-
 src/forms/markdown/MarkdownToolbar.tsx        |   2 +
 src/forms/markdown/commands/ImageCommand.tsx  |   2 +
 src/forms/markdown/commands/LinkCommand.tsx   |   1 +
 src/forms/markdown/commands/TableCommand.tsx  | 167 +++++
 src/forms/markdown/commands/VideoCommand.tsx  |   1 +
 .../markdown/commands/useToolbarCommand.ts    |   2 +-
 src/forms/markdown/helpers/StyleProvider.tsx  |   3 +
 src/forms/markdown/helpers/typeMaps.tsx       |  18 +
 src/forms/markdown/toolbar/ToolbarTable.tsx   |  34 +
 .../projectDashboard/ProjectDashboard.tsx     |   8 +-
 yarn.lock                                     | 648 +++++++++++++++++-
 16 files changed, 926 insertions(+), 10 deletions(-)
 create mode 100644 src/config/theme/popOverTheme.ts
 create mode 100644 src/forms/components/TableExtension.tsx
 create mode 100644 src/forms/markdown/commands/TableCommand.tsx
 create mode 100644 src/forms/markdown/toolbar/ToolbarTable.tsx

diff --git a/package.json b/package.json
index 45bbfe03e..cb931d831 100644
--- a/package.json
+++ b/package.json
@@ -32,6 +32,9 @@
     "@hookform/resolvers": "^3.1.0",
     "@loadable/component": "^5.15.3",
     "@react-hookz/web": "^23.0.0",
+    "@remirror/extension-node-formatting": "^2.0.13",
+    "@remirror/extension-react-component": "^2.0.13",
+    "@remirror/extension-react-tables": "^2.2.18",
     "@remirror/pm": "^2.0.5",
     "@remirror/react": "^2.0.28",
     "@remirror/react-components": "^2.1.12",
diff --git a/src/config/theme/popOverTheme.ts b/src/config/theme/popOverTheme.ts
new file mode 100644
index 000000000..384782aa4
--- /dev/null
+++ b/src/config/theme/popOverTheme.ts
@@ -0,0 +1,14 @@
+import { popoverAnatomy } from '@chakra-ui/anatomy'
+import { createMultiStyleConfigHelpers } from '@chakra-ui/react'
+
+const { definePartsStyle, defineMultiStyleConfig } =
+  createMultiStyleConfigHelpers(popoverAnatomy.keys)
+
+const baseStyle = definePartsStyle({
+  body: {
+    bg: 'neutral.0',
+    borderRadius: '8px',
+  },
+})
+
+export const popOverTheme = defineMultiStyleConfig({ baseStyle })
diff --git a/src/config/theme/theme.ts b/src/config/theme/theme.ts
index ea0c72f58..8d105c9f6 100644
--- a/src/config/theme/theme.ts
+++ b/src/config/theme/theme.ts
@@ -5,6 +5,7 @@ import { alertTheme } from './alertTheme'
 import { drawerTheme } from './drawerTheme'
 import { menuTheme } from './menuTheme'
 import { modalTheme } from './modalTheme'
+import { popOverTheme } from './popOverTheme'
 
 export const theme = {
   initialColorMode: 'system',
@@ -247,6 +248,7 @@ export const theme = {
     Menu: menuTheme,
     Modal: modalTheme,
     Drawer: drawerTheme,
+    Popover: popOverTheme,
     Input: {
       defaultProps: {
         focusBorderColor: 'primary.400',
diff --git a/src/forms/components/TableExtension.tsx b/src/forms/components/TableExtension.tsx
new file mode 100644
index 000000000..403e5a1c4
--- /dev/null
+++ b/src/forms/components/TableExtension.tsx
@@ -0,0 +1 @@
+import { TableExtension } from '@remirror/extension-react-tables'
diff --git a/src/forms/markdown/MarkdownField.tsx b/src/forms/markdown/MarkdownField.tsx
index 7fb638939..348c1fdd9 100644
--- a/src/forms/markdown/MarkdownField.tsx
+++ b/src/forms/markdown/MarkdownField.tsx
@@ -1,10 +1,11 @@
 import { Box, Button, HStack, Text } from '@chakra-ui/react'
+// import { ReactComponentExtension } from '@remirror/extension-react-component'
 import { EditorComponent, Remirror, useRemirror } from '@remirror/react'
 import { ForwardedRef, useCallback } from 'react'
 import { Control } from 'react-hook-form'
 import { useTranslation } from 'react-i18next'
 import { BsGear } from 'react-icons/bs'
-import { InvalidContentHandler } from 'remirror'
+import { AnyExtension, InvalidContentHandler } from 'remirror'
 import {
   BlockquoteExtension,
   BoldExtension,
@@ -17,6 +18,7 @@ import {
   ItalicExtension,
   LinkExtension,
   MarkdownExtension,
+  NodeFormattingExtension,
   OrderedListExtension,
   PlaceholderExtension,
   TableExtension,
@@ -80,8 +82,8 @@ export const MarkdownField = ({
 
   const { uploadFile } = useSignedUpload()
 
-  const extensions = useCallback(
-    () => [
+  const extensions = useCallback<() => AnyExtension[]>(() => {
+    const exts = [
       new PlaceholderExtension({ placeholder }),
       new LinkExtension({
         autoLink: true,
@@ -92,7 +94,11 @@ export const MarkdownField = ({
       }),
       new MarkdownExtension({
         copyAsMarkdown: true,
-        htmlToMarkdown: (html) => turndownService.turndown(html),
+        htmlToMarkdown(html) {
+          console.log('checking html', html)
+          return `${html}`
+        },
+        // htmlToMarkdown: (html) => turndownService.turndown(html),
       }),
       new BoldExtension(),
       new UnderlineExtension(),
@@ -107,6 +113,7 @@ export const MarkdownField = ({
       new TrailingNodeExtension(),
       new BulletListExtension(),
       new TextExtension(),
+
       new ImageExtension({
         uploadHandler(files) {
           return files.map(
@@ -119,9 +126,14 @@ export const MarkdownField = ({
         },
         enableResizing: false,
       }),
-    ],
-    [placeholder, uploadFile],
-  )
+    ] as AnyExtension[]
+
+    if (!preview) {
+      exts.push(new NodeFormattingExtension())
+    }
+
+    return exts
+  }, [placeholder, uploadFile])
 
   const { manager } = useRemirror({
     extensions,
@@ -139,6 +151,9 @@ export const MarkdownField = ({
         orderedList: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
           <Box pl={5} ref={forwardRef} />
         ),
+        table: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
+          <Box mb={4} ref={forwardRef} />
+        ),
       },
     },
   })
@@ -165,6 +180,7 @@ export const MarkdownField = ({
         display="flex"
         justifyContent="space-between"
         alignItems="start"
+        mb={2}
         sx={
           stickyToolbar !== undefined && stickyToolbar !== false
             ? {
diff --git a/src/forms/markdown/MarkdownToolbar.tsx b/src/forms/markdown/MarkdownToolbar.tsx
index 6028fc1d2..72694708d 100644
--- a/src/forms/markdown/MarkdownToolbar.tsx
+++ b/src/forms/markdown/MarkdownToolbar.tsx
@@ -4,6 +4,7 @@ import { ToolbarBlocks } from './toolbar/ToolbarBlocks'
 import { ToolbarCommon } from './toolbar/ToolbarCommon'
 import { ToolbarHeading } from './toolbar/ToolbarHeading'
 import { ToolbarMedia } from './toolbar/ToolbarMedia'
+import { ToolbarTable } from './toolbar/ToolbarTable'
 
 export const MarkdownToolbar = ({ isDisabled }: { isDisabled?: boolean }) => {
   return (
@@ -12,6 +13,7 @@ export const MarkdownToolbar = ({ isDisabled }: { isDisabled?: boolean }) => {
       <ToolbarBlocks isDisabled={isDisabled} />
       <ToolbarHeading isDisabled={isDisabled} />
       <ToolbarMedia isDisabled={isDisabled} />
+      <ToolbarTable isDisabled={isDisabled} />
     </HStack>
   )
 }
diff --git a/src/forms/markdown/commands/ImageCommand.tsx b/src/forms/markdown/commands/ImageCommand.tsx
index d179b40ee..3183a7ee0 100644
--- a/src/forms/markdown/commands/ImageCommand.tsx
+++ b/src/forms/markdown/commands/ImageCommand.tsx
@@ -9,10 +9,12 @@ export const ImageCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
   const commands = useCommands()
 
   const modal = useInsertLinkModal(({ url, label }: MarkdownImage) => {
+    if (!commands.insertImage) return
     commands.insertImage({
       src: url,
       alt: label || 'image',
     })
+
     modal.onClose()
   })
 
diff --git a/src/forms/markdown/commands/LinkCommand.tsx b/src/forms/markdown/commands/LinkCommand.tsx
index 0578ec1fa..e1779a8c8 100644
--- a/src/forms/markdown/commands/LinkCommand.tsx
+++ b/src/forms/markdown/commands/LinkCommand.tsx
@@ -12,6 +12,7 @@ export const LinkCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
   const commands = useCommands()
 
   const modal = useInsertLinkModal(({ url, label }: MarkdownLink) => {
+    if (!commands.insertMarkdown) return
     commands.insertMarkdown(`[${label || url}](${url})`)
     modal.onClose()
   })
diff --git a/src/forms/markdown/commands/TableCommand.tsx b/src/forms/markdown/commands/TableCommand.tsx
new file mode 100644
index 000000000..1dbe916b0
--- /dev/null
+++ b/src/forms/markdown/commands/TableCommand.tsx
@@ -0,0 +1,167 @@
+import {
+  Box,
+  Checkbox,
+  HStack,
+  Popover,
+  PopoverArrow,
+  PopoverBody,
+  PopoverCloseButton,
+  PopoverContent,
+  PopoverTrigger,
+  Text,
+  useDisclosure,
+  VStack,
+} from '@chakra-ui/react'
+import { useCommands } from '@remirror/react'
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { BsTable } from 'react-icons/bs'
+import {
+  RiDeleteColumn,
+  RiDeleteRow,
+  RiInsertColumnRight,
+  RiInsertRowBottom,
+} from 'react-icons/ri'
+
+import { Body2, MonoBody2 } from '../../../components/typography'
+import { useDebounce } from '../../../hooks'
+import { ToolbarCommandButton } from './ToolbarCommandButton'
+
+interface TableCommandProps {
+  isDisabled?: boolean
+}
+
+const tableBoxes = [
+  [1, 2, 3, 4, 5, 6],
+  [1, 2, 3, 4, 5, 6],
+  [1, 2, 3, 4, 5, 6],
+  [1, 2, 3, 4, 5, 6],
+  [1, 2, 3, 4, 5, 6],
+]
+
+export const TableCommand = ({ isDisabled }: TableCommandProps) => {
+  const { t } = useTranslation()
+  const { isOpen, onOpen, onClose } = useDisclosure()
+  const [hasHeader, setHasHeader] = useState(true)
+
+  const commands = useCommands()
+
+  const debouncedIsOpen = useDebounce(isOpen, 200)
+
+  const [currentPosition, setCurrentPosition] = useState({ i: 0, j: 0 })
+
+  const handleTableCreate = ({ i, j }: { i: number; j: number }) => {
+    if (!commands.createTable) return
+    commands.createTable({
+      rowsCount: i + 1,
+      columnsCount: j + 1,
+    })
+    onClose()
+  }
+
+  return (
+    <>
+      <Popover
+        isOpen={debouncedIsOpen}
+        onClose={onClose}
+        placement={'bottom'}
+        closeOnBlur
+      >
+        <PopoverTrigger>
+          <ToolbarCommandButton
+            isDisabled={isDisabled}
+            name="table"
+            label="Table"
+            onMouseOver={onOpen}
+            onMouseLeave={onClose}
+          >
+            <BsTable />
+          </ToolbarCommandButton>
+        </PopoverTrigger>
+        <PopoverContent
+          maxWidth="200px"
+          onMouseOver={onOpen}
+          onMouseLeave={onClose}
+        >
+          <PopoverArrow />
+          <PopoverBody>
+            <VStack>
+              <HStack w="full" spacing="5px">
+                <ToolbarCommandButton
+                  isDisabled={isDisabled}
+                  name="addTableRowAfter"
+                  label="add row below selected"
+                  onClick={commands.addTableRowAfter}
+                >
+                  <RiInsertRowBottom />
+                </ToolbarCommandButton>
+                <ToolbarCommandButton
+                  isDisabled={isDisabled}
+                  name="addTableColumnAfter"
+                  label="add column to right of selected"
+                  onClick={commands.addTableColumnAfter}
+                >
+                  <RiInsertColumnRight />
+                </ToolbarCommandButton>
+                <ToolbarCommandButton
+                  isDisabled={isDisabled}
+                  name="deleteTableRow"
+                  label="delete selected row"
+                  onClick={commands.deleteTableRow}
+                >
+                  <RiDeleteRow />
+                </ToolbarCommandButton>
+                <ToolbarCommandButton
+                  isDisabled={isDisabled}
+                  name="deleteTableColumn"
+                  label="delete selected column"
+                  onClick={commands.deleteTableColumn}
+                >
+                  <RiDeleteColumn />
+                </ToolbarCommandButton>
+              </HStack>
+              <VStack spacing="0px" _hover={{ cursor: 'pointer' }}>
+                {tableBoxes.map((row, i) => (
+                  <HStack key={i} spacing="0px">
+                    {row.map((col, j) => (
+                      <Box
+                        key={j}
+                        padding="5px"
+                        onMouseEnter={() => setCurrentPosition({ i, j })}
+                        onClick={() => handleTableCreate({ i, j })}
+                      >
+                        <Box
+                          height="20px"
+                          width="20px"
+                          borderRadius="4px"
+                          backgroundColor={
+                            i <= currentPosition.i && j <= currentPosition.j
+                              ? 'neutral.300'
+                              : 'neutral.800'
+                          }
+                          transition="background-color 0.1s ease-in-out"
+                        />
+                      </Box>
+                    ))}
+                  </HStack>
+                ))}
+              </VStack>
+              <HStack w="full" justifyContent="space-between" spacing="0">
+                <Checkbox
+                  size="sm"
+                  isChecked={hasHeader}
+                  onChange={(e) => setHasHeader(e.target.checked)}
+                >
+                  <MonoBody2 semiBold> {t('headers')} </MonoBody2>
+                </Checkbox>
+                <MonoBody2 semiBold>{`${currentPosition.i + 1}X${
+                  currentPosition.j + 1
+                }`}</MonoBody2>
+              </HStack>
+            </VStack>
+          </PopoverBody>
+        </PopoverContent>
+      </Popover>
+    </>
+  )
+}
diff --git a/src/forms/markdown/commands/VideoCommand.tsx b/src/forms/markdown/commands/VideoCommand.tsx
index b4043ed56..74283e9d2 100644
--- a/src/forms/markdown/commands/VideoCommand.tsx
+++ b/src/forms/markdown/commands/VideoCommand.tsx
@@ -12,6 +12,7 @@ export const VideoCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
   const commands = useCommands()
 
   const modal = useInsertVideoModal(({ url }: MarkdownVideo) => {
+    if (!commands.addYouTubeVideo) return
     commands.addYouTubeVideo({ video: url })
     modal.onClose()
   })
diff --git a/src/forms/markdown/commands/useToolbarCommand.ts b/src/forms/markdown/commands/useToolbarCommand.ts
index da8bf540b..cb13b0952 100644
--- a/src/forms/markdown/commands/useToolbarCommand.ts
+++ b/src/forms/markdown/commands/useToolbarCommand.ts
@@ -11,7 +11,7 @@ export const useToolbarCommand = (name: string, cmd: string) => {
     (attrs?: any) => {
       if (command) {
         command(attrs)
-        commands.focus()
+        commands.focus?.()
       }
     },
     [command, commands],
diff --git a/src/forms/markdown/helpers/StyleProvider.tsx b/src/forms/markdown/helpers/StyleProvider.tsx
index e65cbea7d..d73f8c436 100644
--- a/src/forms/markdown/helpers/StyleProvider.tsx
+++ b/src/forms/markdown/helpers/StyleProvider.tsx
@@ -17,6 +17,9 @@ const Container = styled(Box, {
     '& a': {
       textDecoration: 'underline',
     },
+    '& tr, & th, & td': {
+      height: '10px',
+    },
     width: '100%',
   },
 })
diff --git a/src/forms/markdown/helpers/typeMaps.tsx b/src/forms/markdown/helpers/typeMaps.tsx
index cc6d199a6..5e37d942b 100644
--- a/src/forms/markdown/helpers/typeMaps.tsx
+++ b/src/forms/markdown/helpers/typeMaps.tsx
@@ -4,6 +4,12 @@ import {
   ListItem,
   ListProps,
   OrderedList,
+  Table,
+  Tbody,
+  Td,
+  Th,
+  Thead,
+  Tr,
   UnorderedList,
 } from '@chakra-ui/react'
 import {
@@ -49,6 +55,12 @@ export const typeMap = {
   paragraph: 'p',
   orderedList: OrderedList,
   text: TextHandler,
+  table: Table,
+  tableHeader: Thead,
+  tableHeaderCell: Th,
+  tbody: Tbody,
+  tableRow: Tr,
+  tableCell: Td,
 } satisfies MarkMap
 
 export const markMap = {
@@ -57,4 +69,10 @@ export const markMap = {
   code: 'code',
   link: createLinkHandler({ target: '_blank' }),
   underline: 'u',
+  table: 'table',
+  tableHeader: 'thead',
+  tableHeaderCell: 'th',
+  tbody: 'tbody',
+  tableRow: 'tr',
+  tableCell: 'td',
 } satisfies MarkMap
diff --git a/src/forms/markdown/toolbar/ToolbarTable.tsx b/src/forms/markdown/toolbar/ToolbarTable.tsx
new file mode 100644
index 000000000..2dc60ef0f
--- /dev/null
+++ b/src/forms/markdown/toolbar/ToolbarTable.tsx
@@ -0,0 +1,34 @@
+import { ButtonGroup } from '@chakra-ui/react'
+import { BiAlignLeft, BiAlignMiddle, BiAlignRight } from 'react-icons/bi'
+
+import { TableCommand } from '../commands/TableCommand'
+import { ToolbarCommand } from '../commands/ToolbarCommand'
+
+export const ToolbarTable = ({ isDisabled }: { isDisabled?: boolean }) => {
+  return (
+    <ButtonGroup isAttached py={1}>
+      <TableCommand isDisabled={isDisabled} />
+      <ToolbarCommand
+        cmd="leftAlign"
+        name="leftAlign"
+        label="align right"
+        Icon={BiAlignLeft}
+        isDisabled={isDisabled}
+      />
+      <ToolbarCommand
+        cmd="centerAlign"
+        name="centerAlign"
+        label="align center"
+        Icon={BiAlignMiddle}
+        isDisabled={isDisabled}
+      />
+      <ToolbarCommand
+        cmd="rightAlign"
+        name="rightAlign"
+        label="align right"
+        Icon={BiAlignRight}
+        isDisabled={isDisabled}
+      />
+    </ButtonGroup>
+  )
+}
diff --git a/src/pages/projectDashboard/ProjectDashboard.tsx b/src/pages/projectDashboard/ProjectDashboard.tsx
index f27580e28..c9346210c 100644
--- a/src/pages/projectDashboard/ProjectDashboard.tsx
+++ b/src/pages/projectDashboard/ProjectDashboard.tsx
@@ -16,6 +16,7 @@ export type DashboardSection = {
   label: string
   path: keyof PathsMap
   fullWidth?: boolean
+  semiFullWidth?: boolean
 }
 
 export const creatorSections: Record<string, DashboardSection> = {
@@ -43,6 +44,7 @@ export const projectSections: Record<string, DashboardSection> = {
   story: {
     label: 'Story',
     path: 'dashboardStory',
+    semiFullWidth: true,
   },
   wallet: {
     label: 'Connect wallet',
@@ -139,7 +141,11 @@ export const ProjectDashboard = () => {
           }}
           maxWidth={{
             base: '100%',
-            lg: activeSection?.fullWidth ? '100%' : '2xl',
+            lg: activeSection?.fullWidth
+              ? '100%'
+              : activeSection?.semiFullWidth
+              ? '4xl'
+              : '2xl',
           }}
           justifyItems="center"
         >
diff --git a/yarn.lock b/yarn.lock
index 1346cab13..310946572 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -87,6 +87,14 @@
   dependencies:
     "@babel/highlight" "^7.18.6"
 
+"@babel/code-frame@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.10.tgz#1c20e612b768fefa75f6e90d6ecb86329247f0a3"
+  integrity sha512-/KKIMG4UEL35WmI9OlvMhurwtytjvXoFcGNrOvyG9zIzA8YmPjVtIZUf7b05+TPO7G7/GEmLHDaoCgACHl9hhA==
+  dependencies:
+    "@babel/highlight" "^7.22.10"
+    chalk "^2.4.2"
+
 "@babel/code-frame@^7.22.5":
   version "7.22.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.5.tgz#234d98e1551960604f1246e6475891a570ad5658"
@@ -172,6 +180,27 @@
     json5 "^2.2.2"
     semver "^6.3.0"
 
+"@babel/core@^7.22.9":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.22.10.tgz#aad442c7bcd1582252cb4576747ace35bc122f35"
+  integrity sha512-fTmqbbUBAwCcre6zPzNngvsI0aNrPZe77AeqvDxWM9Nm+04RrJ3CAmGHA9f7lJQY6ZMhRztNemy4uslDxTX4Qw==
+  dependencies:
+    "@ampproject/remapping" "^2.2.0"
+    "@babel/code-frame" "^7.22.10"
+    "@babel/generator" "^7.22.10"
+    "@babel/helper-compilation-targets" "^7.22.10"
+    "@babel/helper-module-transforms" "^7.22.9"
+    "@babel/helpers" "^7.22.10"
+    "@babel/parser" "^7.22.10"
+    "@babel/template" "^7.22.5"
+    "@babel/traverse" "^7.22.10"
+    "@babel/types" "^7.22.10"
+    convert-source-map "^1.7.0"
+    debug "^4.1.0"
+    gensync "^1.0.0-beta.2"
+    json5 "^2.2.2"
+    semver "^6.3.1"
+
 "@babel/generator@^7.14.0", "@babel/generator@^7.18.13", "@babel/generator@^7.21.3":
   version "7.21.3"
   resolved "https://registry.npmjs.org/@babel/generator/-/generator-7.21.3.tgz"
@@ -192,6 +221,16 @@
     "@jridgewell/trace-mapping" "^0.3.17"
     jsesc "^2.5.1"
 
+"@babel/generator@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.22.10.tgz#c92254361f398e160645ac58831069707382b722"
+  integrity sha512-79KIf7YiWjjdZ81JnLujDRApWtl7BxTqWD88+FFdQEIOG8LJ0etDOM7CXuIgGJa55sGOwZVwuEsaLEm0PJ5/+A==
+  dependencies:
+    "@babel/types" "^7.22.10"
+    "@jridgewell/gen-mapping" "^0.3.2"
+    "@jridgewell/trace-mapping" "^0.3.17"
+    jsesc "^2.5.1"
+
 "@babel/generator@^7.22.7", "@babel/generator@^7.22.9":
   version "7.22.9"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.22.9.tgz#572ecfa7a31002fa1de2a9d91621fd895da8493d"
@@ -245,6 +284,17 @@
     lru-cache "^5.1.1"
     semver "^6.3.0"
 
+"@babel/helper-compilation-targets@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.10.tgz#01d648bbc25dd88f513d862ee0df27b7d4e67024"
+  integrity sha512-JMSwHD4J7SLod0idLq5PKgI+6g/hLD/iuWBq08ZX49xE14VpVEojJ5rHWptpirV2j020MvypRLAXAO50igCJ5Q==
+  dependencies:
+    "@babel/compat-data" "^7.22.9"
+    "@babel/helper-validator-option" "^7.22.5"
+    browserslist "^4.21.9"
+    lru-cache "^5.1.1"
+    semver "^6.3.1"
+
 "@babel/helper-compilation-targets@^7.22.5", "@babel/helper-compilation-targets@^7.22.6", "@babel/helper-compilation-targets@^7.22.9":
   version "7.22.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.9.tgz#f9d0a7aaaa7cd32a3f31c9316a69f5a9bcacb892"
@@ -594,6 +644,15 @@
     "@babel/traverse" "^7.21.5"
     "@babel/types" "^7.21.5"
 
+"@babel/helpers@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.22.10.tgz#ae6005c539dfbcb5cd71fb51bfc8a52ba63bc37a"
+  integrity sha512-a41J4NW8HyZa1I1vAndrraTlPZ/eZoga2ZgS7fEr0tZJGVU4xqdE80CEm0CcNjha5EZ8fTBYLKHF0kqDUuAwQw==
+  dependencies:
+    "@babel/template" "^7.22.5"
+    "@babel/traverse" "^7.22.10"
+    "@babel/types" "^7.22.10"
+
 "@babel/helpers@^7.22.6":
   version "7.22.6"
   resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.22.6.tgz#8e61d3395a4f0c5a8060f309fb008200969b5ecd"
@@ -612,6 +671,15 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.22.10.tgz#02a3f6d8c1cb4521b2fd0ab0da8f4739936137d7"
+  integrity sha512-78aUtVcT7MUscr0K5mIEnkwxPE0MaxkR5RxRwuHaQ+JuU5AmTPhY+do2mdzVTnIJJpyBglql2pehuBIWHug+WQ==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.22.5"
+    chalk "^2.4.2"
+    js-tokens "^4.0.0"
+
 "@babel/highlight@^7.22.5":
   version "7.22.5"
   resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.22.5.tgz#aa6c05c5407a67ebce408162b7ede789b4d22031"
@@ -631,6 +699,11 @@
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.8.tgz#642af7d0333eab9c0ad70b14ac5e76dbde7bfdf8"
   integrity sha512-6zavDGdzG3gUqAdWvlLFfk+36RilI+Pwyuuh7HItyeScCWP3k6i8vKclAQ0bM/0y/Kz/xiwvxhMv9MgTJP5gmA==
 
+"@babel/parser@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.10.tgz#e37634f9a12a1716136c44624ef54283cabd3f55"
+  integrity sha512-lNbdGsQb9ekfsnjFGhEiF4hfFqGgfOP3H3d27re3n+CGhNuTSUEQdfWk556sTLNTloczcdM5TYF2LhzmDQKyvQ==
+
 "@babel/parser@^7.22.5", "@babel/parser@^7.22.7":
   version "7.22.7"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.7.tgz#df8cf085ce92ddbdbf668a7f186ce848c9036cae"
@@ -1541,6 +1614,13 @@
   dependencies:
     regenerator-runtime "^0.13.11"
 
+"@babel/runtime@^7.21.5", "@babel/runtime@^7.22.3", "@babel/runtime@^7.22.6":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.10.tgz#ae3e9631fd947cb7e3610d3e9d8fef5f76696682"
+  integrity sha512-21t/fkKLMZI4pqP2wlmsQAWnYW1PDyKyyUV4vCi+B25ydmdaYTKXPwCj0BzSUnZf4seIiYvSA3jcZ3gdsMFkLQ==
+  dependencies:
+    regenerator-runtime "^0.14.0"
+
 "@babel/template@^7.18.10", "@babel/template@^7.20.7":
   version "7.20.7"
   resolved "https://registry.npmjs.org/@babel/template/-/template-7.20.7.tgz"
@@ -1591,6 +1671,22 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
+"@babel/traverse@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.22.10.tgz#20252acb240e746d27c2e82b4484f199cf8141aa"
+  integrity sha512-Q/urqV4pRByiNNpb/f5OSv28ZlGJiFiiTh+GAHktbIrkPhPbl90+uW6SmpoLyZqutrg9AEaEf3Q/ZBRHBXgxig==
+  dependencies:
+    "@babel/code-frame" "^7.22.10"
+    "@babel/generator" "^7.22.10"
+    "@babel/helper-environment-visitor" "^7.22.5"
+    "@babel/helper-function-name" "^7.22.5"
+    "@babel/helper-hoist-variables" "^7.22.5"
+    "@babel/helper-split-export-declaration" "^7.22.6"
+    "@babel/parser" "^7.22.10"
+    "@babel/types" "^7.22.10"
+    debug "^4.1.0"
+    globals "^11.1.0"
+
 "@babel/traverse@^7.22.6", "@babel/traverse@^7.22.8":
   version "7.22.8"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.22.8.tgz#4d4451d31bc34efeae01eac222b514a77aa4000e"
@@ -1625,6 +1721,15 @@
     "@babel/helper-validator-identifier" "^7.19.1"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.22.10":
+  version "7.22.10"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.22.10.tgz#4a9e76446048f2c66982d1a989dd12b8a2d2dc03"
+  integrity sha512-obaoigiLrlDZ7TUQln/8m4mSqIW2QFeOrCQc9r+xsaHGNoplVNYlRVpsfE8Vj35GEm2ZH4ZhrNYogs/3fj85kg==
+  dependencies:
+    "@babel/helper-string-parser" "^7.22.5"
+    "@babel/helper-validator-identifier" "^7.22.5"
+    to-fast-properties "^2.0.0"
+
 "@babel/types@^7.22.5", "@babel/types@^7.4.4":
   version "7.22.5"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.22.5.tgz#cd93eeaab025880a3a47ec881f4b096a5b786fbe"
@@ -2742,6 +2847,17 @@
     "@emotion/sheet" "^1.2.2"
     "@emotion/utils" "^1.2.1"
 
+"@emotion/css@^11.11.0":
+  version "11.11.2"
+  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-11.11.2.tgz#e5fa081d0c6e335352e1bc2b05953b61832dca5a"
+  integrity sha512-VJxe1ucoMYMS7DkiMdC2T7PWNbrEI0a39YRiyDvK2qq4lXwjRbVP/z4lpG+odCsRzadlR+1ywwrTzhdm5HNdew==
+  dependencies:
+    "@emotion/babel-plugin" "^11.11.0"
+    "@emotion/cache" "^11.11.0"
+    "@emotion/serialize" "^1.1.2"
+    "@emotion/sheet" "^1.2.2"
+    "@emotion/utils" "^1.2.1"
+
 "@emotion/hash@0.8.0":
   version "0.8.0"
   resolved "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz"
@@ -3124,6 +3240,13 @@
   resolved "https://registry.npmjs.org/@floating-ui/core/-/core-1.2.4.tgz"
   integrity sha512-SQOeVbMwb1di+mVWWJLpsUTToKfqVNioXys011beCAhyOIFtS+GQoW4EQSneuxzmQKddExDwQ+X0hLl4lJJaSQ==
 
+"@floating-ui/core@^1.4.1":
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.4.1.tgz#0d633f4b76052668afb932492ac452f7ebe97f17"
+  integrity sha512-jk3WqquEJRlcyu7997NtR5PibI+y5bi+LS3hPmguVClypenMsCY3CBa3LAQnozRCtCrYWSEtAdiskpamuJRFOQ==
+  dependencies:
+    "@floating-ui/utils" "^0.1.1"
+
 "@floating-ui/dom@^1.0.1":
   version "1.2.5"
   resolved "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.2.5.tgz"
@@ -3131,6 +3254,35 @@
   dependencies:
     "@floating-ui/core" "^1.2.4"
 
+"@floating-ui/dom@^1.3.0":
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.5.1.tgz#88b70defd002fe851f17b4a25efb2d3c04d7a8d7"
+  integrity sha512-KwvVcPSXg6mQygvA1TjbN/gh///36kKtllIF8SUm0qpFj8+rvYrpvlYdL1JoA71SHpDqgSSdGOSoQ0Mp3uY5aw==
+  dependencies:
+    "@floating-ui/core" "^1.4.1"
+    "@floating-ui/utils" "^0.1.1"
+
+"@floating-ui/react-dom@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-2.0.1.tgz#7972a4fc488a8c746cded3cfe603b6057c308a91"
+  integrity sha512-rZtAmSht4Lry6gdhAJDrCp/6rKN7++JnL1/Anbr/DdeyYXQPxvg/ivrbYvJulbRf4vL8b212suwMM2lxbv+RQA==
+  dependencies:
+    "@floating-ui/dom" "^1.3.0"
+
+"@floating-ui/react@^0.24.3":
+  version "0.24.8"
+  resolved "https://registry.yarnpkg.com/@floating-ui/react/-/react-0.24.8.tgz#e079e2836990be3fce9665ab509360a5447251a1"
+  integrity sha512-AuYeDoaR8jtUlUXtZ1IJ/6jtBkGnSpJXbGNzokBL87VDJ8opMq1Bgrc0szhK482ReQY6KZsMoZCVSb4xwalkBA==
+  dependencies:
+    "@floating-ui/react-dom" "^2.0.1"
+    aria-hidden "^1.2.3"
+    tabbable "^6.0.1"
+
+"@floating-ui/utils@^0.1.1":
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.1.1.tgz#1a5b1959a528e374e8037c4396c3e825d6cf4a83"
+  integrity sha512-m0G6wlnhm/AX0H12IOWtK8gASEMffnX08RtKkCgTdHb9JpHKGloI7icFfLg9ZmQeavcvR0PKmzxClyuFPSjKWw==
+
 "@giphy/js-analytics@*":
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/@giphy/js-analytics/-/js-analytics-4.3.2.tgz#9710c7eb6e401571d4219a870cb6b0d35df61cdc"
@@ -3793,6 +3945,15 @@
     "@jridgewell/resolve-uri" "3.1.0"
     "@jridgewell/sourcemap-codec" "1.4.14"
 
+"@linaria/core@4.2.10":
+  version "4.2.10"
+  resolved "https://registry.yarnpkg.com/@linaria/core/-/core-4.2.10.tgz#3f8d45b20205c167d326d558ee9a926039483767"
+  integrity sha512-S1W01W7L4SQnGpWzp8awyCpPIYUOEJ+OLjjXqKpIXOU+ozPwBt86Mjjdas9aZccVhNBWDja74cMCUAVp8yUpDQ==
+  dependencies:
+    "@linaria/logger" "^4.0.0"
+    "@linaria/tags" "^4.3.5"
+    "@linaria/utils" "^4.3.4"
+
 "@linaria/core@4.2.9":
   version "4.2.9"
   resolved "https://registry.yarnpkg.com/@linaria/core/-/core-4.2.9.tgz#4917bde18d064a29cff4fd86aa99621f953a2a2c"
@@ -3810,6 +3971,14 @@
     debug "^4.1.1"
     picocolors "^1.0.0"
 
+"@linaria/logger@^4.5.0":
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/@linaria/logger/-/logger-4.5.0.tgz#e5de815ffe7806822f47a559a512b98f66acea13"
+  integrity sha512-XdQLk242Cpcsc9a3Cz1ktOE5ysTo2TpxdeFQEPwMm8Z/+F/S6ZxBDdHYJL09srXWz3hkJr3oS2FPuMZNH1HIxw==
+  dependencies:
+    debug "^4.1.1"
+    picocolors "^1.0.0"
+
 "@linaria/tags@^4.3.4":
   version "4.3.5"
   resolved "https://registry.yarnpkg.com/@linaria/tags/-/tags-4.3.5.tgz#bf2e070d11179addf2f27a66cd29d8192e71ca89"
@@ -3819,6 +3988,15 @@
     "@linaria/logger" "^4.0.0"
     "@linaria/utils" "^4.3.4"
 
+"@linaria/tags@^4.3.5":
+  version "4.5.4"
+  resolved "https://registry.yarnpkg.com/@linaria/tags/-/tags-4.5.4.tgz#071ab024227433f783ea2d948904fc164731a912"
+  integrity sha512-HPxLB6HlJWLi6o8+8lTLegOmDnbMbuzEE+zzunaPZEGSoIIYx8HAv5VbY/sG/zNyxDElk6laiAwEVWN8h5/zxg==
+  dependencies:
+    "@babel/generator" "^7.22.9"
+    "@linaria/logger" "^4.5.0"
+    "@linaria/utils" "^4.5.3"
+
 "@linaria/utils@^4.3.3", "@linaria/utils@^4.3.4":
   version "4.3.4"
   resolved "https://registry.yarnpkg.com/@linaria/utils/-/utils-4.3.4.tgz#860db9131e498b62510e49dc6fd4a8f0ed44bf4d"
@@ -3833,6 +4011,24 @@
     "@linaria/logger" "^4.0.0"
     babel-merge "^3.0.0"
 
+"@linaria/utils@^4.5.3":
+  version "4.5.3"
+  resolved "https://registry.yarnpkg.com/@linaria/utils/-/utils-4.5.3.tgz#cf54f4096927ea347d01e814c1fb7aca7cf4063a"
+  integrity sha512-tSpxA3Zn0DKJ2n/YBnYAgiDY+MNvkmzAHrD8R9PKrpGaZ+wz1jQEmE1vGn1cqh8dJyWK0NzPAA8sf1cqa+RmAg==
+  dependencies:
+    "@babel/core" "^7.22.9"
+    "@babel/generator" "^7.22.9"
+    "@babel/plugin-proposal-export-namespace-from" "^7.18.9"
+    "@babel/plugin-syntax-dynamic-import" "^7.8.3"
+    "@babel/plugin-transform-modules-commonjs" "^7.22.5"
+    "@babel/template" "^7.22.5"
+    "@babel/traverse" "^7.22.8"
+    "@babel/types" "^7.22.5"
+    "@linaria/logger" "^4.5.0"
+    babel-merge "^3.0.0"
+    find-up "^5.0.0"
+    minimatch "^9.0.3"
+
 "@lingui/core@^3.17.2":
   version "3.17.2"
   resolved "https://registry.yarnpkg.com/@lingui/core/-/core-3.17.2.tgz#275aa19520477910ddf41a838ef91a8204bea7eb"
@@ -3842,11 +4038,32 @@
     "@messageformat/parser" "^5.0.0"
     make-plural "^6.2.2"
 
+"@lingui/core@^4.2.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@lingui/core/-/core-4.4.0.tgz#d043c2770673d70bafa6b850cfeec3c859844085"
+  integrity sha512-0ngEP+g4bt6f3cNqEzkU5796VkEEamxNXF/JD/QV9Ftxp8QBw91WqAoHjNYs3aYZOctCsRBR7FlvRQ6o2fDWDg==
+  dependencies:
+    "@babel/runtime" "^7.20.13"
+    "@lingui/message-utils" "4.4.0"
+    unraw "^2.0.1"
+
 "@lingui/detect-locale@^3.17.2":
   version "3.17.2"
   resolved "https://registry.yarnpkg.com/@lingui/detect-locale/-/detect-locale-3.17.2.tgz#9d7c2839f9ddd061261aaa479b908f06fe7e63f7"
   integrity sha512-rqyO16lj05WRfBuppo++mPzB1fQBFDhGqEFz5X97CbWXYp6AadOIkrm+pbn114Y2Yumy9QI7Cm4Ptbfk7CXO3Q==
 
+"@lingui/detect-locale@^4.2.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@lingui/detect-locale/-/detect-locale-4.4.0.tgz#6101a75833af9a4e27e9c9948238df351d1b324a"
+  integrity sha512-Mh4oLJ4KHSwcyWw7+bhQ8ErUCZjXDrZyILyHCcgq2S+HE2NG8M8OD/VBFajLW3dEUJPC9sRE8L2XTxYRNKlK6g==
+
+"@lingui/message-utils@4.4.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@lingui/message-utils/-/message-utils-4.4.0.tgz#88a7ff9c0ca10fdce25374a92fc27b932a96778a"
+  integrity sha512-SScnNuemsyHx2vyLvLsHgmAaCBHwnaAxUg3LkKoulqXe2Po8CmLBh1/28oNQ20ZhjwadUmy0unGalp9qqEBOkw==
+  dependencies:
+    "@messageformat/parser" "^5.0.0"
+
 "@loadable/component@^5.15.3":
   version "5.15.3"
   resolved "https://registry.npmjs.org/@loadable/component/-/component-5.15.3.tgz"
@@ -3930,11 +4147,30 @@
     prop-types "^15.8.1"
     react-is "^18.2.0"
 
+"@mui/base@5.0.0-beta.11":
+  version "5.0.0-beta.11"
+  resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-beta.11.tgz#0124d336f1931c6cd5f0008d015df5bd8fafd3a8"
+  integrity sha512-FdKZGPd8qmC3ZNke7CNhzcEgToc02M6WYZc9hcBsNQ17bgAd3s9F//1bDDYgMVBYxDM71V0sv/hBHlOY4I1ZVA==
+  dependencies:
+    "@babel/runtime" "^7.22.6"
+    "@emotion/is-prop-valid" "^1.2.1"
+    "@mui/types" "^7.2.4"
+    "@mui/utils" "^5.14.5"
+    "@popperjs/core" "^2.11.8"
+    clsx "^2.0.0"
+    prop-types "^15.8.1"
+    react-is "^18.2.0"
+
 "@mui/core-downloads-tracker@^5.13.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.13.1.tgz#ccfc3fd659c48379cec14cc60fb00bb711777d8f"
   integrity sha512-qDHtNDO72NcBQMhaWBt9EZMvNiO+OXjPg5Sdk/6LgRDw6Zr3HdEZ5n2FJ/qtYsaT/okGyCuQavQkcZCOCEVf/g==
 
+"@mui/core-downloads-tracker@^5.14.5":
+  version "5.14.5"
+  resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.14.5.tgz#c5854b89d57520c77253a79b20b784d5c2903fb6"
+  integrity sha512-+wpGH1USwPcKMFPMvXqYPC6fEvhxM3FzxC8lyDiNK/imLyyJ6y2DPb1Oue7OGIKJWBmYBqrWWtfovrxd1aJHTA==
+
 "@mui/material@^5.12.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.13.1.tgz#ecb0af2784ee8c552294475c285c8f2e644d8abc"
@@ -3953,6 +4189,24 @@
     react-is "^18.2.0"
     react-transition-group "^4.4.5"
 
+"@mui/material@^5.13.2":
+  version "5.14.5"
+  resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.14.5.tgz#4610b381fd159cd208c28e1d1f29c303ea24a518"
+  integrity sha512-4qa4GMfuZH0Ai3mttk5ccXP8a3sf7aPlAJwyMrUSz6h9hPri6BPou94zeu3rENhhmKLby9S/W1y+pmficy8JKA==
+  dependencies:
+    "@babel/runtime" "^7.22.6"
+    "@mui/base" "5.0.0-beta.11"
+    "@mui/core-downloads-tracker" "^5.14.5"
+    "@mui/system" "^5.14.5"
+    "@mui/types" "^7.2.4"
+    "@mui/utils" "^5.14.5"
+    "@types/react-transition-group" "^4.4.6"
+    clsx "^2.0.0"
+    csstype "^3.1.2"
+    prop-types "^15.8.1"
+    react-is "^18.2.0"
+    react-transition-group "^4.4.5"
+
 "@mui/private-theming@^5.13.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.13.1.tgz#c3e9a0b44f9c5a51b92cfcfb660536060cb61ed7"
@@ -3962,6 +4216,15 @@
     "@mui/utils" "^5.13.1"
     prop-types "^15.8.1"
 
+"@mui/private-theming@^5.14.5":
+  version "5.14.5"
+  resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.14.5.tgz#834e1569c31e2644665f98d902def79014053017"
+  integrity sha512-cC4C5RrpXpDaaZyH9QwmPhRLgz+f2SYbOty3cPkk4qPSOSfif2ZEcDD9HTENKDDd9deB+xkPKzzZhi8cxIx8Ig==
+  dependencies:
+    "@babel/runtime" "^7.22.6"
+    "@mui/utils" "^5.14.5"
+    prop-types "^15.8.1"
+
 "@mui/styled-engine@^5.12.3":
   version "5.12.3"
   resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.12.3.tgz#3307643d52c81947a624cdd0437536cc8109c4f0"
@@ -3972,6 +4235,16 @@
     csstype "^3.1.2"
     prop-types "^15.8.1"
 
+"@mui/styled-engine@^5.13.2":
+  version "5.13.2"
+  resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.13.2.tgz#c87bd61c0ab8086d34828b6defe97c02bcd642ef"
+  integrity sha512-VCYCU6xVtXOrIN8lcbuPmoG+u7FYuOERG++fpY74hPpEWkyFQG97F+/XfTQVYzlR2m7nPjnwVUgATcTCMEaMvw==
+  dependencies:
+    "@babel/runtime" "^7.21.0"
+    "@emotion/cache" "^11.11.0"
+    csstype "^3.1.2"
+    prop-types "^15.8.1"
+
 "@mui/system@^5.13.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.13.1.tgz#2296e3269dc6baa5914ea28d0cc9534f7b03a7b5"
@@ -3986,6 +4259,20 @@
     csstype "^3.1.2"
     prop-types "^15.8.1"
 
+"@mui/system@^5.14.5":
+  version "5.14.5"
+  resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.14.5.tgz#614394c4183d90df82c540e0e736ba72c1f95f8e"
+  integrity sha512-mextXZHDeGcR7E1kx43TRARrVXy+gI4wzpUgNv7MqZs1dvTVXQGVeAT6ydj9d6FUqHBPMNLGV/21vJOrpqsL+w==
+  dependencies:
+    "@babel/runtime" "^7.22.6"
+    "@mui/private-theming" "^5.14.5"
+    "@mui/styled-engine" "^5.13.2"
+    "@mui/types" "^7.2.4"
+    "@mui/utils" "^5.14.5"
+    clsx "^2.0.0"
+    csstype "^3.1.2"
+    prop-types "^15.8.1"
+
 "@mui/types@^7.2.4":
   version "7.2.4"
   resolved "https://registry.yarnpkg.com/@mui/types/-/types-7.2.4.tgz#b6fade19323b754c5c6de679a38f068fd50b9328"
@@ -4002,6 +4289,17 @@
     prop-types "^15.8.1"
     react-is "^18.2.0"
 
+"@mui/utils@^5.14.5":
+  version "5.14.5"
+  resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.14.5.tgz#98fb6060610b793a8478e70ffe5e4ed5bd922dba"
+  integrity sha512-6Hzw63VR9C5xYv+CbjndoRLU6Gntal8rJ5W+GUzkyHrGWIyYPWZPa6AevnyGioySNETATe1H9oXS8f/7qgIHJA==
+  dependencies:
+    "@babel/runtime" "^7.22.6"
+    "@types/prop-types" "^15.7.5"
+    "@types/react-is" "^18.2.1"
+    prop-types "^15.8.1"
+    react-is "^18.2.0"
+
 "@noble/curves@~0.8.3":
   version "0.8.3"
   resolved "https://registry.npmjs.org/@noble/curves/-/curves-0.8.3.tgz"
@@ -4195,6 +4493,11 @@
   resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.7.tgz#ccab5c8f7dc557a52ca3288c10075c9ccd37fff7"
   integrity sha512-Cr4OjIkipTtcXKjAsm8agyleBuDHvxzeBoa1v543lbv1YaIwQjESsVcmjiWiPEbC1FIeHOG/Op9kdCmAmiS3Kw==
 
+"@popperjs/core@^2.11.8":
+  version "2.11.8"
+  resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.8.tgz#6b79032e760a0899cd4204710beede972a3a185f"
+  integrity sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==
+
 "@popperjs/core@^2.9.2", "@popperjs/core@^2.9.3":
   version "2.11.6"
   resolved "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz"
@@ -4219,6 +4522,11 @@
   dependencies:
     "@babel/runtime" "^7.21.0"
 
+"@remirror/core-constants@^2.0.2":
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/@remirror/core-constants/-/core-constants-2.0.2.tgz#f05eccdc69e3a65e7d524b52548f567904a11a1a"
+  integrity sha512-dyHY+sMF0ihPus3O27ODd4+agdHMEmuRdyiZJ2CCWjPV5UFmn17ZbElvk6WOGVE4rdCJKZQCrPV2BcikOMLUGQ==
+
 "@remirror/core-helpers@^2.0.2", "@remirror/core-helpers@^2.0.3":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@remirror/core-helpers/-/core-helpers-2.0.3.tgz#fa4a0224a612016b9f16052ed0c5d817c69daa39"
@@ -4240,6 +4548,25 @@
     object.pick "^1.3.0"
     throttle-debounce "^3.0.1"
 
+"@remirror/core-helpers@^3.0.0":
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@remirror/core-helpers/-/core-helpers-3.0.0.tgz#3a35c2346bc23ebc3cee585b7840b5567755c5f1"
+  integrity sha512-tusEgQJIqg4qKj6HSBUFcyRnWnziw3neh4T9wOmsPGHFC3w9kl5KSrDb9UAgE8uX6y32FnS7vJ955mWOl3n50A==
+  dependencies:
+    "@remirror/core-constants" "^2.0.2"
+    "@remirror/types" "^1.0.1"
+    "@types/object.omit" "^3.0.0"
+    "@types/object.pick" "^1.3.2"
+    "@types/throttle-debounce" "^2.1.0"
+    case-anything "^2.1.13"
+    dash-get "^1.0.2"
+    deepmerge "^4.3.1"
+    fast-deep-equal "^3.1.3"
+    make-error "^1.3.6"
+    object.omit "^3.0.0"
+    object.pick "^1.3.0"
+    throttle-debounce "^3.0.1"
+
 "@remirror/core-types@^2.0.5":
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/@remirror/core-types/-/core-types-2.0.5.tgz#f6a5c56a555b57a9b88b2e8c2b7edba8bcc1042a"
@@ -4264,6 +4591,22 @@
     min-document "^2.19.0"
     parenthesis "^3.1.8"
 
+"@remirror/core-utils@^2.0.13":
+  version "2.0.13"
+  resolved "https://registry.yarnpkg.com/@remirror/core-utils/-/core-utils-2.0.13.tgz#a46bde5d18ea252664fa76f2428cb3cd9c20cd3d"
+  integrity sha512-5UggNc6Z2d7M8SVkstsVitID8DAHSKPrqet7Hfn4/dY+p4iMCOdwf9cLqcHMg3467k5/5/RvJPMTr9GQOEx7Hg==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core-constants" "^2.0.2"
+    "@remirror/core-helpers" "^3.0.0"
+    "@remirror/core-types" "^2.0.5"
+    "@remirror/messages" "^2.0.6"
+    "@types/min-document" "^2.19.0"
+    css-in-js-utils "^3.1.0"
+    get-dom-document "^0.1.3"
+    min-document "^2.19.0"
+    parenthesis "^3.1.8"
+
 "@remirror/core@^2.0.13", "@remirror/core@^2.0.15", "@remirror/core@^2.0.16":
   version "2.0.16"
   resolved "https://registry.yarnpkg.com/@remirror/core/-/core-2.0.16.tgz#11a185f28e6b071c814728b662cd8330e90218b0"
@@ -4281,6 +4624,23 @@
     nanoevents "^5.1.13"
     tiny-warning "^1.0.3"
 
+"@remirror/core@^2.0.17", "@remirror/core@^2.0.18", "@remirror/core@^2.0.19":
+  version "2.0.19"
+  resolved "https://registry.yarnpkg.com/@remirror/core/-/core-2.0.19.tgz#1ef089497e9404cd008ea6768b6a56223a0736fc"
+  integrity sha512-TGvDPUdKYqOiDQmt3+58GNBi4PX6QhBhII1qk9btZ/uFvG2/LLHEe+KN/BfBdvykGAu8CK9codLzg8NZd2fDEg==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@linaria/core" "4.2.10"
+    "@remirror/core-constants" "^2.0.2"
+    "@remirror/core-helpers" "^3.0.0"
+    "@remirror/core-types" "^2.0.5"
+    "@remirror/core-utils" "^2.0.13"
+    "@remirror/i18n" "^2.0.5"
+    "@remirror/icons" "^2.0.3"
+    "@remirror/messages" "^2.0.6"
+    nanoevents "^5.1.13"
+    tiny-warning "^1.0.3"
+
 "@remirror/dom@^2.0.16":
   version "2.0.16"
   resolved "https://registry.yarnpkg.com/@remirror/dom/-/dom-2.0.16.tgz#2823b4d92f057213d01cff927b7a0308fdeb2819"
@@ -4340,6 +4700,16 @@
     "@remirror/messages" "^2.0.3"
     "@remirror/theme" "^2.0.7"
 
+"@remirror/extension-callout@^2.0.15":
+  version "2.0.15"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-callout/-/extension-callout-2.0.15.tgz#1e5b882c66323e6429ac50b2f882bca5a24135a7"
+  integrity sha512-qn7o1JCy7k0rsybh57EtC8qRoZyEDkncxAtr4Rq1Z2PH/axuOJwwdIgeDadEGITpviRsqrh2L4ddogpDVWVImg==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.17"
+    "@remirror/messages" "^2.0.5"
+    "@remirror/theme" "^2.0.8"
+
 "@remirror/extension-code-block@^2.0.14":
   version "2.0.14"
   resolved "https://registry.yarnpkg.com/@remirror/extension-code-block/-/extension-code-block-2.0.14.tgz#542ff6d6c76ef61fb7ca8f7aac70efd620523491"
@@ -4352,6 +4722,18 @@
     "@types/refractor" "^3.0.2"
     refractor "^3.6.0"
 
+"@remirror/extension-code-block@^2.0.15":
+  version "2.0.18"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-code-block/-/extension-code-block-2.0.18.tgz#62140479751018f41e863a937281a7672508ae17"
+  integrity sha512-Qu51glo0xQMUlSYiFR20HmYEnOJF1OcbZYLTcF32oa8Uq1JWStv1DacQaACUQEhZ6DKgxFZxFBWbPLonzZ1bmw==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.19"
+    "@remirror/messages" "^2.0.6"
+    "@remirror/theme" "^2.0.9"
+    "@types/refractor" "^3.0.2"
+    refractor "^3.6.0"
+
 "@remirror/extension-code@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-code/-/extension-code-2.0.13.tgz#065cd7fdf02838bdcca1fe997e133ac4691537be"
@@ -4388,6 +4770,15 @@
     "@remirror/core" "^2.0.13"
     "@remirror/messages" "^2.0.3"
 
+"@remirror/extension-columns@^2.0.14":
+  version "2.0.14"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-columns/-/extension-columns-2.0.14.tgz#0d9da438d2b3dcf278216a49971daf59cd1b52b8"
+  integrity sha512-0WROpbsdCsuoHFTJB5daAIwjO4tGy9hVWx5kQk4P6bkLOW/qo5hSN6iQLi2mQsAG8pi7tn/NZtMNc1awWrRWhQ==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.17"
+    "@remirror/messages" "^2.0.5"
+
 "@remirror/extension-diff@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-diff/-/extension-diff-2.0.13.tgz#8540cd935aefc2ba25d9d75702ffd80149962524"
@@ -4471,6 +4862,15 @@
     "@remirror/core" "^2.0.15"
     "@remirror/messages" "^2.0.4"
 
+"@remirror/extension-events@^2.1.16":
+  version "2.1.16"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-events/-/extension-events-2.1.16.tgz#3e74c35a24c75b69ed6e51be446c5ba4a4427c37"
+  integrity sha512-QHmYyLqKSaYnxsbZOVI3cx543lrTOzooHdH3FKjh5KBiZ84vmqBdngKvZIMWj6/2iPMIE6y+kp4VOXqm8qrLKA==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.19"
+    "@remirror/messages" "^2.0.6"
+
 "@remirror/extension-find@^0.1.6":
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/@remirror/extension-find/-/extension-find-0.1.6.tgz#efdb5b6ca28aa0e517b031c2f3817425bbdeb6af"
@@ -4527,6 +4927,15 @@
     "@remirror/core" "^2.0.13"
     "@remirror/messages" "^2.0.3"
 
+"@remirror/extension-heading@^2.0.14":
+  version "2.0.14"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-heading/-/extension-heading-2.0.14.tgz#b9ccca44d9cb2c4cc48f16e7352f6c71d5f65cc1"
+  integrity sha512-jBBQhLSbEvR/IbSyzBLPN6P69zGoYrW/lxclMPccBxiqr/Rzc1ynJqrbXPQOzj3P43bRLdjXBKiy2VJWzqqO8Q==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.17"
+    "@remirror/messages" "^2.0.5"
+
 "@remirror/extension-history@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-history/-/extension-history-2.0.13.tgz#1bb1883b598fe5f7b9fd594795025afd76481435"
@@ -4612,6 +5021,17 @@
     "@remirror/messages" "^2.0.3"
     "@remirror/theme" "^2.0.7"
 
+"@remirror/extension-mention-atom@^2.0.17":
+  version "2.0.17"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-mention-atom/-/extension-mention-atom-2.0.17.tgz#2662c4f770b0ffa5ba0b9f88528004b7146bb471"
+  integrity sha512-RTHmhCrz8YVcMaifpKH8NB1aNxtgLRBG6ETyZgaPN2l9xcaRvtN5YHUb5myZsw0U4rUBXePI57/91j7QkxXw0Q==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.16"
+    "@remirror/extension-events" "^2.1.15"
+    "@remirror/messages" "^2.0.4"
+    "@remirror/theme" "^2.0.8"
+
 "@remirror/extension-mention@^2.0.15":
   version "2.0.15"
   resolved "https://registry.yarnpkg.com/@remirror/extension-mention/-/extension-mention-2.0.15.tgz#1bfe713db515c1ce62720ced36b112875780bf67"
@@ -4694,6 +5114,27 @@
     "@remirror/theme" "^2.0.7"
     jsx-dom-cjs "^8.0.5"
 
+"@remirror/extension-react-tables@^2.2.18":
+  version "2.2.18"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-react-tables/-/extension-react-tables-2.2.18.tgz#914db5daac8059f3658e39bc9e29758baa5e09d5"
+  integrity sha512-hv4edyYEBzZ0VhAHbzcfFxbLGbHhw1jGb20jU+qx1zPrgpMakdAl5qESMdy+1yyB7kHPRPGOpzpH62pkvm9HgQ==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@emotion/css" "^11.11.0"
+    "@linaria/core" "4.2.10"
+    "@remirror/core" "^2.0.19"
+    "@remirror/core-utils" "^2.0.13"
+    "@remirror/extension-positioner" "^2.1.8"
+    "@remirror/extension-tables" "^2.3.1"
+    "@remirror/icons" "^2.0.3"
+    "@remirror/messages" "^2.0.6"
+    "@remirror/preset-core" "^2.0.16"
+    "@remirror/react-components" "^2.1.17"
+    "@remirror/react-core" "^2.0.21"
+    "@remirror/react-hooks" "^2.0.25"
+    "@remirror/theme" "^2.0.9"
+    jsx-dom-cjs "^8.0.6"
+
 "@remirror/extension-search@^2.0.14":
   version "2.0.14"
   resolved "https://registry.yarnpkg.com/@remirror/extension-search/-/extension-search-2.0.14.tgz#a8b5429411041a437e1f92b12cb21e220f15819c"
@@ -4750,6 +5191,18 @@
     "@remirror/messages" "^2.0.3"
     "@remirror/theme" "^2.0.7"
 
+"@remirror/extension-tables@^2.3.1":
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-tables/-/extension-tables-2.3.1.tgz#43cbec67366f2810f877c3eb9c69eacfd788b20e"
+  integrity sha512-SJ/vIrEql+dSC1K2vWr+g9fGONGYMId4D4AZWq0E/ttENZo8jZqEeUAV+Z6NIfPJyScVsXKxolZAVGWfZ4JK6g==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.19"
+    "@remirror/extension-events" "^2.1.16"
+    "@remirror/extension-positioner" "^2.1.8"
+    "@remirror/messages" "^2.0.6"
+    "@remirror/theme" "^2.0.9"
+
 "@remirror/extension-text-case@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-text-case/-/extension-text-case-2.0.13.tgz#d3bd5923f48befe7fe9f5d275ed7301c3b88e7d3"
@@ -4771,6 +5224,18 @@
     "@remirror/theme" "^2.0.7"
     color2k "^2.0.2"
 
+"@remirror/extension-text-color@^2.0.15":
+  version "2.0.15"
+  resolved "https://registry.yarnpkg.com/@remirror/extension-text-color/-/extension-text-color-2.0.15.tgz#9aab912e041fe71298313b5aa7389268f3c877b6"
+  integrity sha512-BCcJ2zyt+pu7WGru9D9SfnodtPz0zxRibVqZOsRvNGJQN29Bvxs89e5tV+xTlAoXUz9gwxJrM6cn03umu18mbA==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.17"
+    "@remirror/i18n" "^2.0.4"
+    "@remirror/messages" "^2.0.5"
+    "@remirror/theme" "^2.0.8"
+    color2k "^2.0.2"
+
 "@remirror/extension-text-highlight@^2.0.14":
   version "2.0.14"
   resolved "https://registry.yarnpkg.com/@remirror/extension-text-highlight/-/extension-text-highlight-2.0.14.tgz#b3c36646fa9a200676a93078f31f57e48dc7dd7d"
@@ -4842,6 +5307,17 @@
     "@remirror/core-helpers" "^2.0.2"
     make-plural "^6.2.2"
 
+"@remirror/i18n@^2.0.4", "@remirror/i18n@^2.0.5":
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/@remirror/i18n/-/i18n-2.0.5.tgz#783e9118a875cd639576af26999d013f3e4523a6"
+  integrity sha512-oZ2umZav60iu+lBoVZxr7i11yUNRYpczVUXCsClNiHN55PDPMyYwNQ9CaEJdyQCvt0lb5WCmBNpnw1mbLaj7lQ==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@lingui/core" "^4.2.0"
+    "@lingui/detect-locale" "^4.2.0"
+    "@remirror/core-helpers" "^3.0.0"
+    make-plural "^6.2.2"
+
 "@remirror/icons@^2.0.2":
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/@remirror/icons/-/icons-2.0.2.tgz#a1222dd6afbacfd2ac184859ba3590335b357b85"
@@ -4850,6 +5326,14 @@
     "@babel/runtime" "^7.21.0"
     "@remirror/core-helpers" "^2.0.2"
 
+"@remirror/icons@^2.0.3":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@remirror/icons/-/icons-2.0.3.tgz#977e93b7f5cc1f0be03c77dc02005e1a70180c1e"
+  integrity sha512-ruOGU4FT6WJdXsdVwfNOurSaQvnk2Uo4AkMxxyLYkBPowxmR9Xe0lOn7d7UARai0wxmwFgX6IYaMSUVLIaaMCQ==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core-helpers" "^3.0.0"
+
 "@remirror/messages@^2.0.3", "@remirror/messages@^2.0.4":
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/@remirror/messages/-/messages-2.0.4.tgz#b577a6d7ff78c39e1e670e685aa13139364e34e0"
@@ -4859,6 +5343,15 @@
     "@lingui/core" "^3.17.2"
     "@remirror/core-helpers" "^2.0.2"
 
+"@remirror/messages@^2.0.5", "@remirror/messages@^2.0.6":
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/@remirror/messages/-/messages-2.0.6.tgz#6b87a69001c691354cef3fa03f43e634edec69ce"
+  integrity sha512-JVnfuzuul4tcvnjiSM7Jj6iKDOP4hfaw79SciZ7t+cc2+iWyAcDYSrFMDV4Q50T+2IfWTYlWtKGpIhG6sfZaWw==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@lingui/core" "^4.2.0"
+    "@remirror/core-helpers" "^3.0.0"
+
 "@remirror/pm@^2.0.5":
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/@remirror/pm/-/pm-2.0.5.tgz#021aca4726e41ef3540a3e18d1a689aea90a4c76"
@@ -5009,6 +5502,54 @@
     multishift "^2.0.8"
     react-color "^2.19.3"
 
+"@remirror/react-components@^2.1.17":
+  version "2.1.17"
+  resolved "https://registry.yarnpkg.com/@remirror/react-components/-/react-components-2.1.17.tgz#e9f68e1302b58c90c2a6671001946054140aa779"
+  integrity sha512-25BIEfYJO10cxpChyA2fKdmQw5VSDD/Ltcjlxps9DuXTYtjPD1WQnwVdpUyW43W2r7UsvZ2OcVGtQLdJw+RBiw==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@emotion/react" "^11.11.0"
+    "@emotion/styled" "^11.11.0"
+    "@floating-ui/react" "^0.24.3"
+    "@lingui/core" "^4.2.0"
+    "@mui/material" "^5.13.2"
+    "@remirror/core" "^2.0.17"
+    "@remirror/extension-blockquote" "^2.0.14"
+    "@remirror/extension-bold" "^2.0.13"
+    "@remirror/extension-callout" "^2.0.15"
+    "@remirror/extension-code" "^2.0.13"
+    "@remirror/extension-code-block" "^2.0.15"
+    "@remirror/extension-columns" "^2.0.14"
+    "@remirror/extension-find" "^0.1.6"
+    "@remirror/extension-font-size" "^2.0.13"
+    "@remirror/extension-heading" "^2.0.14"
+    "@remirror/extension-history" "^2.0.13"
+    "@remirror/extension-horizontal-rule" "^2.0.13"
+    "@remirror/extension-italic" "^2.0.13"
+    "@remirror/extension-list" "^2.0.16"
+    "@remirror/extension-node-formatting" "^2.0.13"
+    "@remirror/extension-positioner" "^2.1.8"
+    "@remirror/extension-strike" "^2.0.13"
+    "@remirror/extension-sub" "^2.0.13"
+    "@remirror/extension-sup" "^2.0.13"
+    "@remirror/extension-tables" "^2.2.10"
+    "@remirror/extension-text-color" "^2.0.15"
+    "@remirror/extension-underline" "^2.0.13"
+    "@remirror/extension-whitespace" "^2.0.13"
+    "@remirror/i18n" "^2.0.4"
+    "@remirror/icons" "^2.0.2"
+    "@remirror/messages" "^2.0.5"
+    "@remirror/react-core" "^2.0.20"
+    "@remirror/react-hooks" "^2.0.25"
+    "@remirror/react-utils" "^2.0.5"
+    "@remirror/theme" "^2.0.8"
+    "@seznam/compose-react-refs" "^1.0.6"
+    "@types/react-color" "^3.0.6"
+    create-context-state "^2.0.2"
+    match-sorter "^6.3.1"
+    multishift "^2.0.8"
+    react-color "^2.19.3"
+
 "@remirror/react-core@^2.0.17":
   version "2.0.17"
   resolved "https://registry.yarnpkg.com/@remirror/react-core/-/react-core-2.0.17.tgz#5604f327e0335bdd3678dd67016e90cb24eed865"
@@ -5030,6 +5571,27 @@
     resize-observer-polyfill "^1.5.1"
     tiny-warning "^1.0.3"
 
+"@remirror/react-core@^2.0.20", "@remirror/react-core@^2.0.21":
+  version "2.0.21"
+  resolved "https://registry.yarnpkg.com/@remirror/react-core/-/react-core-2.0.21.tgz#11ab05e476bf53849aa28680321957c1154b791f"
+  integrity sha512-8c7+e0Y0LmwErqR4nPdUs73WLFKGqVs/DuE9q0wxSfXWbArAFVAAZB4PWrpcbYMbb0jSvG7rKDgnFN8NM/1f5A==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.18"
+    "@remirror/extension-positioner" "^2.1.8"
+    "@remirror/extension-react-component" "^2.0.13"
+    "@remirror/i18n" "^2.0.4"
+    "@remirror/preset-core" "^2.0.16"
+    "@remirror/preset-react" "^2.0.14"
+    "@remirror/react-renderer" "^2.0.13"
+    "@remirror/react-utils" "^2.0.5"
+    "@remirror/theme" "^2.0.8"
+    "@seznam/compose-react-refs" "^1.0.6"
+    create-context-state "^2.0.2"
+    fast-deep-equal "^3.1.3"
+    resize-observer-polyfill "^1.5.1"
+    tiny-warning "^1.0.3"
+
 "@remirror/react-editors@^1.0.33":
   version "1.0.33"
   resolved "https://registry.yarnpkg.com/@remirror/react-editors/-/react-editors-1.0.33.tgz#119717d958ef61125cf4440a5c952082de9abc56"
@@ -5068,6 +5630,26 @@
     use-isomorphic-layout-effect "^1.1.2"
     use-previous "^1.2.0"
 
+"@remirror/react-hooks@^2.0.25":
+  version "2.0.25"
+  resolved "https://registry.yarnpkg.com/@remirror/react-hooks/-/react-hooks-2.0.25.tgz#ff459872ba4222ac248edb083e9ffa1fd6ed4a44"
+  integrity sha512-/qByk9+OSDVBFD5N3CalsXNvbHF0GEfOEhNstsBGvg0xxf0NsuvPj1rYcXnVHk+9mgx2TMh+EiOhfURRR2A9vg==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@remirror/core" "^2.0.17"
+    "@remirror/extension-emoji" "^2.0.17"
+    "@remirror/extension-events" "^2.1.15"
+    "@remirror/extension-history" "^2.0.13"
+    "@remirror/extension-mention" "^2.0.15"
+    "@remirror/extension-mention-atom" "^2.0.17"
+    "@remirror/extension-positioner" "^2.1.8"
+    "@remirror/i18n" "^2.0.4"
+    "@remirror/react-core" "^2.0.20"
+    "@remirror/react-utils" "^2.0.5"
+    multishift "^2.0.8"
+    use-isomorphic-layout-effect "^1.1.2"
+    use-previous "^1.2.0"
+
 "@remirror/react-renderer@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/react-renderer/-/react-renderer-2.0.13.tgz#2af76c30629c1c9782c7118984e103ae3a8baf2b"
@@ -5122,6 +5704,17 @@
     color2k "^2.0.2"
     csstype "^3.1.2"
 
+"@remirror/theme@^2.0.9":
+  version "2.0.9"
+  resolved "https://registry.yarnpkg.com/@remirror/theme/-/theme-2.0.9.tgz#0ae990448e90cfead0a6ff7d36b414165a9c663d"
+  integrity sha512-MI6j7C9KImVyfSBh9GR/WQCuLQKXRKQkE0HsS8Sc/BC8a/0n4QTt7dAg5/a/+MbakyymNaGlibCdts8URgGStg==
+  dependencies:
+    "@babel/runtime" "^7.22.3"
+    "@linaria/core" "4.2.10"
+    "@remirror/core-types" "^2.0.5"
+    color2k "^2.0.2"
+    csstype "^3.1.2"
+
 "@remirror/types@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@remirror/types/-/types-1.0.1.tgz#768502497a0fbbc23338a1586b893f729310cf70"
@@ -5742,6 +6335,13 @@
   dependencies:
     "@types/react" "*"
 
+"@types/react-is@^18.2.1":
+  version "18.2.1"
+  resolved "https://registry.yarnpkg.com/@types/react-is/-/react-is-18.2.1.tgz#61d01c2a6fc089a53520c0b66996d458fdc46863"
+  integrity sha512-wyUkmaaSZEzFZivD8F2ftSyAfk6L+DfFliVj/mYdOXbVjRcS87fQJLTnhk6dRZPuJjI+9g6RZJO4PNCngUrmyw==
+  dependencies:
+    "@types/react" "*"
+
 "@types/react-transition-group@^4.4.0":
   version "4.4.5"
   resolved "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.5.tgz"
@@ -6287,7 +6887,7 @@ argparse@^2.0.1:
   resolved "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-aria-hidden@^1.2.2:
+aria-hidden@^1.2.2, aria-hidden@^1.2.3:
   version "1.2.3"
   resolved "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.3.tgz"
   integrity sha512-xcLxITLe2HYa1cnYnwCjkOO1PqUHQpozB8x9AR0OgWN2woOBi5kSDVxKfd0b7sb1hw5qFeJhXm9H1nu3xSfLeQ==
@@ -6848,6 +7448,11 @@ case-anything@^2.1.10:
   resolved "https://registry.yarnpkg.com/case-anything/-/case-anything-2.1.11.tgz#39a00ff733f26e48729f5c6c7f23763ac8fa0467"
   integrity sha512-uzKDXzdM/x914cepWPzElU3y50NRKYhjkO4ittOHLq+rF6M0AgRLF/+yPR1tvwLNAh8WHEPTfhuciZGPfX+oyg==
 
+case-anything@^2.1.13:
+  version "2.1.13"
+  resolved "https://registry.yarnpkg.com/case-anything/-/case-anything-2.1.13.tgz#0cdc16278cb29a7fcdeb072400da3f342ba329e9"
+  integrity sha512-zlOQ80VrQ2Ue+ymH5OuM/DlDq64mEm+B9UTdHULv5osUMD6HalNTblf2b1u/m6QecjsnOkBpqVZ+XPwIVsy7Ng==
+
 caseless@~0.12.0:
   version "0.12.0"
   resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc"
@@ -7170,6 +7775,11 @@ clsx@^1.2.1:
   resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12"
   integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==
 
+clsx@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.0.0.tgz#12658f3fd98fafe62075595a5c30e43d18f3d00b"
+  integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
+
 codemirror@^5.65.12:
   version "5.65.13"
   resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.65.13.tgz#c098a6f409db8b5a7c5722788bd9fa3bb2367f2e"
@@ -7584,6 +8194,13 @@ create-context-state@^2.0.1:
   dependencies:
     "@babel/runtime" "^7.21.0"
 
+create-context-state@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/create-context-state/-/create-context-state-2.0.2.tgz#3a811c8e5bb082b35601747e501d1ec970ee4f7f"
+  integrity sha512-WIz5i5QYt0xvlpbpSnhl4RY7WfcPy8gWtqzE6xtr2hfhuR3WJTsa5V4Y7jgPt+Knp5r0yKbKK0myK59HW2+HHw==
+  dependencies:
+    "@babel/runtime" "^7.21.5"
+
 create-emotion@^10.0.27:
   version "10.0.27"
   resolved "https://registry.npmjs.org/create-emotion/-/create-emotion-10.0.27.tgz"
@@ -10518,6 +11135,13 @@ jsx-dom-cjs@^8.0.5:
   dependencies:
     csstype "^3.1.1"
 
+jsx-dom-cjs@^8.0.6:
+  version "8.0.7"
+  resolved "https://registry.yarnpkg.com/jsx-dom-cjs/-/jsx-dom-cjs-8.0.7.tgz#098c54680ebf5bb6f6d12cdea5cde3799c172212"
+  integrity sha512-dQWnuQ+bTm7o72ZlJU4glzeMX8KLxx5U+ZwmEAzVP1+roL7BSM0MrkWdHjdsuNgmxobZCJ+qgiot9EgbJPOoEg==
+  dependencies:
+    csstype "^3.1.2"
+
 keyv@^3.0.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz"
@@ -11042,6 +11666,13 @@ minimatch@^5.0.1:
   dependencies:
     brace-expansion "^2.0.1"
 
+minimatch@^9.0.3:
+  version "9.0.3"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.3.tgz#a6e00c3de44c3a542bfaae70abfc22420a6da825"
+  integrity sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==
+  dependencies:
+    brace-expansion "^2.0.1"
+
 minimist-options@4.1.0:
   version "4.1.0"
   resolved "https://registry.npmjs.org/minimist-options/-/minimist-options-4.1.0.tgz"
@@ -12637,6 +13268,11 @@ regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.7:
   resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz"
   integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
 
+regenerator-runtime@^0.14.0:
+  version "0.14.0"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
+  integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
+
 regenerator-transform@^0.15.1:
   version "0.15.1"
   resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.1.tgz#f6c4e99fc1b4591f780db2586328e4d9a9d8dc56"
@@ -13668,6 +14304,11 @@ symbol-tree@^3.2.4:
   resolved "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz"
   integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
 
+tabbable@^6.0.1:
+  version "6.2.0"
+  resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-6.2.0.tgz#732fb62bc0175cfcec257330be187dcfba1f3b97"
+  integrity sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==
+
 temp-dir@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/temp-dir/-/temp-dir-2.0.0.tgz"
@@ -14180,6 +14821,11 @@ unpipe@1.0.0, unpipe@~1.0.0:
   resolved "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz"
   integrity sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==
 
+unraw@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/unraw/-/unraw-2.0.1.tgz#7b51dcdfb1e43d59d5e52cdb44d349d029edbaba"
+  integrity sha512-tdOvLfRzHolwYcHS6HIX860MkK9LQ4+oLuNwFYL7bpgTEO64PZrcQxkisgwJYCfF8sKiWLwwu1c83DvMkbefIQ==
+
 untildify@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/untildify/-/untildify-4.0.0.tgz#2bc947b953652487e4600949fb091e3ae8cd919b"

From fbd1df95180b1270da114aa20d8ab373ce424f23 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Wed, 23 Aug 2023 16:16:52 -0400
Subject: [PATCH 02/12] fix: in progress

---
 src/forms/markdown/MarkdownField.tsx          | 21 ++++++++++---------
 .../markdown/helpers/PreviewRenderer.tsx      |  5 ++++-
 src/forms/markdown/helpers/StyleProvider.tsx  | 10 ++++++---
 3 files changed, 22 insertions(+), 14 deletions(-)

diff --git a/src/forms/markdown/MarkdownField.tsx b/src/forms/markdown/MarkdownField.tsx
index 348c1fdd9..c6a12e48d 100644
--- a/src/forms/markdown/MarkdownField.tsx
+++ b/src/forms/markdown/MarkdownField.tsx
@@ -1,6 +1,11 @@
 import { Box, Button, HStack, Text } from '@chakra-ui/react'
 // import { ReactComponentExtension } from '@remirror/extension-react-component'
-import { EditorComponent, Remirror, useRemirror } from '@remirror/react'
+import {
+  EditorComponent,
+  Remirror,
+  TableComponents,
+  useRemirror,
+} from '@remirror/react'
 import { ForwardedRef, useCallback } from 'react'
 import { Control } from 'react-hook-form'
 import { useTranslation } from 'react-i18next'
@@ -94,11 +99,6 @@ export const MarkdownField = ({
       }),
       new MarkdownExtension({
         copyAsMarkdown: true,
-        htmlToMarkdown(html) {
-          console.log('checking html', html)
-          return `${html}`
-        },
-        // htmlToMarkdown: (html) => turndownService.turndown(html),
       }),
       new BoldExtension(),
       new UnderlineExtension(),
@@ -142,9 +142,9 @@ export const MarkdownField = ({
     react: {
       nodeViewComponents: {
         image: imageHandler,
-        paragraph: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
-          <Box mb={4} ref={forwardRef} />
-        ),
+        // paragraph: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
+        //   <Box mb={4} ref={forwardRef} />
+        // ),
         bulletList: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
           <Box pl={5} ref={forwardRef} />
         ),
@@ -152,7 +152,7 @@ export const MarkdownField = ({
           <Box pl={5} ref={forwardRef} />
         ),
         table: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
-          <Box mb={4} ref={forwardRef} />
+          <Box mb={0} ref={forwardRef} />
         ),
       },
     },
@@ -221,6 +221,7 @@ export const MarkdownField = ({
       )}
       <StyleProvider flex={flex} display={isEditorMode ? 'none' : undefined}>
         <EditorComponent />
+        <TableComponents enableTableCellMenu={false} />
       </StyleProvider>
       <SaveModule name={name} control={control} />
     </Remirror>
diff --git a/src/forms/markdown/helpers/PreviewRenderer.tsx b/src/forms/markdown/helpers/PreviewRenderer.tsx
index 7c63c17df..98d809517 100644
--- a/src/forms/markdown/helpers/PreviewRenderer.tsx
+++ b/src/forms/markdown/helpers/PreviewRenderer.tsx
@@ -10,13 +10,16 @@ export const PreviewRenderer = ({
   manager: RemirrorManager<any>
   content?: RemirrorContentType
 }) => {
+  const newContent = content?.toString().replaceAll(/\n/g, '\\n')
+  console.log('checking content', content)
+  console.log('checking newContent', newContent)
   return (
     <RemirrorRenderer
       typeMap={typeMap}
       markMap={markMap}
       json={getRemirrorJSON(
         manager.createState({
-          content,
+          content: newContent,
           stringHandler: 'markdown',
         }),
       )}
diff --git a/src/forms/markdown/helpers/StyleProvider.tsx b/src/forms/markdown/helpers/StyleProvider.tsx
index d73f8c436..d15bda214 100644
--- a/src/forms/markdown/helpers/StyleProvider.tsx
+++ b/src/forms/markdown/helpers/StyleProvider.tsx
@@ -17,9 +17,6 @@ const Container = styled(Box, {
     '& a': {
       textDecoration: 'underline',
     },
-    '& tr, & th, & td': {
-      height: '10px',
-    },
     width: '100%',
   },
 })
@@ -76,6 +73,13 @@ export const StyleProvider = ({
                   flexDirection: 'column',
                   flexGrow: 1,
                 },
+              '& div.tableWrapper': {
+                padding: '10px',
+                paddingBottom: '20px',
+                '& th, & td': {
+                  paddingX: '5px',
+                },
+              },
             }
           : {}
       }

From 350a9d2d1e254ff8f7c5c303c6ce4dc2a965e66a Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Wed, 23 Aug 2023 22:46:09 -0400
Subject: [PATCH 03/12] fix: finalize table feature for story markdown editor
 and viewer

---
 package.json                                  |   2 -
 .../components/TableCellMenuComponent.tsx     |  69 ++
 src/forms/components/TableExtension.tsx       |   1 -
 src/forms/markdown/MarkdownField.tsx          |  13 +-
 .../markdown/helpers/PreviewRenderer.tsx      |  38 +-
 src/forms/markdown/helpers/StyleProvider.tsx  |   7 +
 src/forms/markdown/helpers/typeMaps.tsx       |  40 +-
 src/translations/English.json                 |   8 +-
 yarn.lock                                     | 648 +-----------------
 9 files changed, 161 insertions(+), 665 deletions(-)
 create mode 100644 src/forms/components/TableCellMenuComponent.tsx
 delete mode 100644 src/forms/components/TableExtension.tsx

diff --git a/package.json b/package.json
index cb931d831..49e29f55c 100644
--- a/package.json
+++ b/package.json
@@ -33,8 +33,6 @@
     "@loadable/component": "^5.15.3",
     "@react-hookz/web": "^23.0.0",
     "@remirror/extension-node-formatting": "^2.0.13",
-    "@remirror/extension-react-component": "^2.0.13",
-    "@remirror/extension-react-tables": "^2.2.18",
     "@remirror/pm": "^2.0.5",
     "@remirror/react": "^2.0.28",
     "@remirror/react-components": "^2.1.12",
diff --git a/src/forms/components/TableCellMenuComponent.tsx b/src/forms/components/TableCellMenuComponent.tsx
new file mode 100644
index 000000000..47fcd767e
--- /dev/null
+++ b/src/forms/components/TableCellMenuComponent.tsx
@@ -0,0 +1,69 @@
+import { ChevronDownIcon } from '@chakra-ui/icons'
+import {
+  IconButton,
+  Menu,
+  MenuButton,
+  MenuItem,
+  MenuItemProps,
+  MenuList,
+  VStack,
+} from '@chakra-ui/react'
+import { useCommands } from '@remirror/react'
+import { useTranslation } from 'react-i18next'
+
+export const TableCellMenuComponent = () => {
+  const { t } = useTranslation()
+  const commands = useCommands()
+
+  const ModifiedMenuItem = (props: MenuItemProps) => {
+    return (
+      <MenuItem
+        paddingX="10px"
+        paddingY="5px"
+        _hover={{ bg: 'neutral.200' }}
+        {...props}
+      />
+    )
+  }
+
+  return (
+    <Menu>
+      <MenuButton
+        mr="5px"
+        size="sm"
+        as={IconButton}
+        icon={<ChevronDownIcon />}
+        border="1px solid"
+        borderRadius="4px"
+        borderColor="neutral.200"
+        _hover={{ color: 'primary.400', borderColor: 'primary.400' }}
+      />
+      <MenuList
+        as={VStack}
+        bg="neutral.0"
+        border="1px solid"
+        borderColor="neutral.200"
+        borderRadius={'4px'}
+      >
+        <ModifiedMenuItem onClick={() => commands.addTableRowBefore()}>
+          {t('Add row above')}
+        </ModifiedMenuItem>
+        <ModifiedMenuItem onClick={() => commands.addTableRowAfter()}>
+          {t('Add row below')}
+        </ModifiedMenuItem>
+        <ModifiedMenuItem onClick={() => commands.addTableColumnBefore()}>
+          {t('Add column left')}
+        </ModifiedMenuItem>
+        <ModifiedMenuItem onClick={() => commands.addTableColumnAfter()}>
+          {t('Add column right')}
+        </ModifiedMenuItem>
+        <ModifiedMenuItem onClick={() => commands.deleteTableColumn()}>
+          {t('Remove column')}
+        </ModifiedMenuItem>
+        <ModifiedMenuItem onClick={() => commands.deleteTableRow()}>
+          {t('Remove row')}
+        </ModifiedMenuItem>
+      </MenuList>
+    </Menu>
+  )
+}
diff --git a/src/forms/components/TableExtension.tsx b/src/forms/components/TableExtension.tsx
deleted file mode 100644
index 403e5a1c4..000000000
--- a/src/forms/components/TableExtension.tsx
+++ /dev/null
@@ -1 +0,0 @@
-import { TableExtension } from '@remirror/extension-react-tables'
diff --git a/src/forms/markdown/MarkdownField.tsx b/src/forms/markdown/MarkdownField.tsx
index c6a12e48d..67891b79a 100644
--- a/src/forms/markdown/MarkdownField.tsx
+++ b/src/forms/markdown/MarkdownField.tsx
@@ -1,5 +1,4 @@
 import { Box, Button, HStack, Text } from '@chakra-ui/react'
-// import { ReactComponentExtension } from '@remirror/extension-react-component'
 import {
   EditorComponent,
   Remirror,
@@ -36,6 +35,7 @@ import TurndownService from 'turndown'
 import { useSignedUpload } from '../../hooks'
 import { useMobileMode } from '../../utils'
 import { ReactHookTextArea } from '../components/ReactHookTextArea'
+import { TableCellMenuComponent } from '../components/TableCellMenuComponent'
 import { PreviewRenderer } from './helpers/PreviewRenderer'
 import { SaveModule } from './helpers/SaveModule'
 import { StyleProvider } from './helpers/StyleProvider'
@@ -113,7 +113,6 @@ export const MarkdownField = ({
       new TrailingNodeExtension(),
       new BulletListExtension(),
       new TextExtension(),
-
       new ImageExtension({
         uploadHandler(files) {
           return files.map(
@@ -142,18 +141,12 @@ export const MarkdownField = ({
     react: {
       nodeViewComponents: {
         image: imageHandler,
-        // paragraph: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
-        //   <Box mb={4} ref={forwardRef} />
-        // ),
         bulletList: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
           <Box pl={5} ref={forwardRef} />
         ),
         orderedList: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
           <Box pl={5} ref={forwardRef} />
         ),
-        table: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
-          <Box mb={0} ref={forwardRef} />
-        ),
       },
     },
   })
@@ -221,7 +214,9 @@ export const MarkdownField = ({
       )}
       <StyleProvider flex={flex} display={isEditorMode ? 'none' : undefined}>
         <EditorComponent />
-        <TableComponents enableTableCellMenu={false} />
+        <TableComponents
+          tableCellMenuProps={{ Component: TableCellMenuComponent }}
+        />
       </StyleProvider>
       <SaveModule name={name} control={control} />
     </Remirror>
diff --git a/src/forms/markdown/helpers/PreviewRenderer.tsx b/src/forms/markdown/helpers/PreviewRenderer.tsx
index 98d809517..0d910915e 100644
--- a/src/forms/markdown/helpers/PreviewRenderer.tsx
+++ b/src/forms/markdown/helpers/PreviewRenderer.tsx
@@ -10,19 +10,49 @@ export const PreviewRenderer = ({
   manager: RemirrorManager<any>
   content?: RemirrorContentType
 }) => {
-  const newContent = content?.toString().replaceAll(/\n/g, '\\n')
-  console.log('checking content', content)
-  console.log('checking newContent', newContent)
+  // const newContent = formatString(content?.toString() || '')
+
   return (
     <RemirrorRenderer
       typeMap={typeMap}
       markMap={markMap}
       json={getRemirrorJSON(
         manager.createState({
-          content: newContent,
+          content,
           stringHandler: 'markdown',
         }),
       )}
     />
   )
 }
+
+// export const matchMarkDownSpecialKeysAtLineEnd =
+//   /\n(?!.*(\*|_|#|-|\||`|[0-9]+(\.|\))))/g
+
+// const formatString = (value: string): string => {
+//   const adjustForLineChange = value
+//     ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '\\\n')
+//     : ''
+
+//   const adjustedForMultiParagrah = adjustForLineChange.replaceAll(
+//     /\n\n/g,
+//     '\n\\\n',
+//   )
+
+//   const finalValue = getRidOfEndSlash(adjustedForMultiParagrah)
+
+//   console.log('before content', JSON.stringify(value))
+//   console.log('medium content', JSON.stringify(adjustForLineChange))
+//   console.log('after content', JSON.stringify(adjustedForMultiParagrah))
+
+//   return finalValue
+// }
+
+// const getRidOfEndSlash = (value: string): string => {
+//   if (value[value.length - 2] === '\\') {
+//     const newValue = value.slice(0, value.length - 2)
+//     return getRidOfEndSlash(newValue)
+//   }
+
+//   return value
+// }
diff --git a/src/forms/markdown/helpers/StyleProvider.tsx b/src/forms/markdown/helpers/StyleProvider.tsx
index d15bda214..f6c4f1c10 100644
--- a/src/forms/markdown/helpers/StyleProvider.tsx
+++ b/src/forms/markdown/helpers/StyleProvider.tsx
@@ -5,12 +5,19 @@ import { useMemo } from 'react'
 import { RemirrorThemeType } from 'remirror'
 
 import { useCustomTheme } from '../../../utils'
+import { tableCellStyles } from './typeMaps'
 
 const Container = styled(Box, {
   baseStyle: {
     '& p, & iframe, & h1, & h2, & h3, & h4, & h5': {
       mt: 4,
     },
+    '& table': {
+      '& p': {
+        margin: '0px',
+      },
+      ...tableCellStyles,
+    },
     '& iframe': {
       minHeight: '28em',
     },
diff --git a/src/forms/markdown/helpers/typeMaps.tsx b/src/forms/markdown/helpers/typeMaps.tsx
index 5e37d942b..a6efdda89 100644
--- a/src/forms/markdown/helpers/typeMaps.tsx
+++ b/src/forms/markdown/helpers/typeMaps.tsx
@@ -40,6 +40,44 @@ export const listItemHandler = ({ children }: ListProps) => {
   return <ListItem>{children}</ListItem>
 }
 
+export const tableCellStyles = {
+  '& th, & td': {
+    padding: '3px 8px',
+    border: '1px solid',
+    borderColor: 'neutral.200',
+  },
+}
+
+export const tableHandler = (props: any) => {
+  const hasHeader =
+    props?.children[0]?.props?.json?.content[0]?.type === 'tableHeaderCell'
+
+  return (
+    <Table
+      w="full"
+      variant="simple"
+      borderColor="neutral.200"
+      sx={{
+        ...tableCellStyles,
+      }}
+    >
+      {hasHeader && <Thead>{props.children[0]}</Thead>}
+
+      {
+        <Tbody>
+          {props.children.map((child: any, index: number) => {
+            if (hasHeader && index === 0) {
+              return null
+            }
+
+            return child
+          })}
+        </Tbody>
+      }
+    </Table>
+  )
+}
+
 export const typeMap = {
   blockquote: 'blockquote',
   bulletList: unorderedListHandler,
@@ -55,7 +93,7 @@ export const typeMap = {
   paragraph: 'p',
   orderedList: OrderedList,
   text: TextHandler,
-  table: Table,
+  table: tableHandler,
   tableHeader: Thead,
   tableHeaderCell: Th,
   tbody: Tbody,
diff --git a/src/translations/English.json b/src/translations/English.json
index 1c62d1c2d..baedb431a 100644
--- a/src/translations/English.json
+++ b/src/translations/English.json
@@ -655,5 +655,11 @@
   "There's a new version of Geyser!":"There's a new version of Geyser!",
   "Restart the app to load the new version":"Restart the app to load the new version",
   "Not now":"Not now",
-  "Restart app":"Restart app"
+  "Restart app":"Restart app",
+  "Add row above":"Add row above",
+  "Add row below":"Add row below",
+  "Add column left":"Add column left",
+  "Add column right":"Add column right",
+  "Remove column":"Remove column",
+  "Remove row":"Remove row"
 }
diff --git a/yarn.lock b/yarn.lock
index 310946572..1346cab13 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -87,14 +87,6 @@
   dependencies:
     "@babel/highlight" "^7.18.6"
 
-"@babel/code-frame@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.10.tgz#1c20e612b768fefa75f6e90d6ecb86329247f0a3"
-  integrity sha512-/KKIMG4UEL35WmI9OlvMhurwtytjvXoFcGNrOvyG9zIzA8YmPjVtIZUf7b05+TPO7G7/GEmLHDaoCgACHl9hhA==
-  dependencies:
-    "@babel/highlight" "^7.22.10"
-    chalk "^2.4.2"
-
 "@babel/code-frame@^7.22.5":
   version "7.22.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.5.tgz#234d98e1551960604f1246e6475891a570ad5658"
@@ -180,27 +172,6 @@
     json5 "^2.2.2"
     semver "^6.3.0"
 
-"@babel/core@^7.22.9":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.22.10.tgz#aad442c7bcd1582252cb4576747ace35bc122f35"
-  integrity sha512-fTmqbbUBAwCcre6zPzNngvsI0aNrPZe77AeqvDxWM9Nm+04RrJ3CAmGHA9f7lJQY6ZMhRztNemy4uslDxTX4Qw==
-  dependencies:
-    "@ampproject/remapping" "^2.2.0"
-    "@babel/code-frame" "^7.22.10"
-    "@babel/generator" "^7.22.10"
-    "@babel/helper-compilation-targets" "^7.22.10"
-    "@babel/helper-module-transforms" "^7.22.9"
-    "@babel/helpers" "^7.22.10"
-    "@babel/parser" "^7.22.10"
-    "@babel/template" "^7.22.5"
-    "@babel/traverse" "^7.22.10"
-    "@babel/types" "^7.22.10"
-    convert-source-map "^1.7.0"
-    debug "^4.1.0"
-    gensync "^1.0.0-beta.2"
-    json5 "^2.2.2"
-    semver "^6.3.1"
-
 "@babel/generator@^7.14.0", "@babel/generator@^7.18.13", "@babel/generator@^7.21.3":
   version "7.21.3"
   resolved "https://registry.npmjs.org/@babel/generator/-/generator-7.21.3.tgz"
@@ -221,16 +192,6 @@
     "@jridgewell/trace-mapping" "^0.3.17"
     jsesc "^2.5.1"
 
-"@babel/generator@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.22.10.tgz#c92254361f398e160645ac58831069707382b722"
-  integrity sha512-79KIf7YiWjjdZ81JnLujDRApWtl7BxTqWD88+FFdQEIOG8LJ0etDOM7CXuIgGJa55sGOwZVwuEsaLEm0PJ5/+A==
-  dependencies:
-    "@babel/types" "^7.22.10"
-    "@jridgewell/gen-mapping" "^0.3.2"
-    "@jridgewell/trace-mapping" "^0.3.17"
-    jsesc "^2.5.1"
-
 "@babel/generator@^7.22.7", "@babel/generator@^7.22.9":
   version "7.22.9"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.22.9.tgz#572ecfa7a31002fa1de2a9d91621fd895da8493d"
@@ -284,17 +245,6 @@
     lru-cache "^5.1.1"
     semver "^6.3.0"
 
-"@babel/helper-compilation-targets@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.10.tgz#01d648bbc25dd88f513d862ee0df27b7d4e67024"
-  integrity sha512-JMSwHD4J7SLod0idLq5PKgI+6g/hLD/iuWBq08ZX49xE14VpVEojJ5rHWptpirV2j020MvypRLAXAO50igCJ5Q==
-  dependencies:
-    "@babel/compat-data" "^7.22.9"
-    "@babel/helper-validator-option" "^7.22.5"
-    browserslist "^4.21.9"
-    lru-cache "^5.1.1"
-    semver "^6.3.1"
-
 "@babel/helper-compilation-targets@^7.22.5", "@babel/helper-compilation-targets@^7.22.6", "@babel/helper-compilation-targets@^7.22.9":
   version "7.22.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.9.tgz#f9d0a7aaaa7cd32a3f31c9316a69f5a9bcacb892"
@@ -644,15 +594,6 @@
     "@babel/traverse" "^7.21.5"
     "@babel/types" "^7.21.5"
 
-"@babel/helpers@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.22.10.tgz#ae6005c539dfbcb5cd71fb51bfc8a52ba63bc37a"
-  integrity sha512-a41J4NW8HyZa1I1vAndrraTlPZ/eZoga2ZgS7fEr0tZJGVU4xqdE80CEm0CcNjha5EZ8fTBYLKHF0kqDUuAwQw==
-  dependencies:
-    "@babel/template" "^7.22.5"
-    "@babel/traverse" "^7.22.10"
-    "@babel/types" "^7.22.10"
-
 "@babel/helpers@^7.22.6":
   version "7.22.6"
   resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.22.6.tgz#8e61d3395a4f0c5a8060f309fb008200969b5ecd"
@@ -671,15 +612,6 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@babel/highlight@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.22.10.tgz#02a3f6d8c1cb4521b2fd0ab0da8f4739936137d7"
-  integrity sha512-78aUtVcT7MUscr0K5mIEnkwxPE0MaxkR5RxRwuHaQ+JuU5AmTPhY+do2mdzVTnIJJpyBglql2pehuBIWHug+WQ==
-  dependencies:
-    "@babel/helper-validator-identifier" "^7.22.5"
-    chalk "^2.4.2"
-    js-tokens "^4.0.0"
-
 "@babel/highlight@^7.22.5":
   version "7.22.5"
   resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.22.5.tgz#aa6c05c5407a67ebce408162b7ede789b4d22031"
@@ -699,11 +631,6 @@
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.8.tgz#642af7d0333eab9c0ad70b14ac5e76dbde7bfdf8"
   integrity sha512-6zavDGdzG3gUqAdWvlLFfk+36RilI+Pwyuuh7HItyeScCWP3k6i8vKclAQ0bM/0y/Kz/xiwvxhMv9MgTJP5gmA==
 
-"@babel/parser@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.10.tgz#e37634f9a12a1716136c44624ef54283cabd3f55"
-  integrity sha512-lNbdGsQb9ekfsnjFGhEiF4hfFqGgfOP3H3d27re3n+CGhNuTSUEQdfWk556sTLNTloczcdM5TYF2LhzmDQKyvQ==
-
 "@babel/parser@^7.22.5", "@babel/parser@^7.22.7":
   version "7.22.7"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.7.tgz#df8cf085ce92ddbdbf668a7f186ce848c9036cae"
@@ -1614,13 +1541,6 @@
   dependencies:
     regenerator-runtime "^0.13.11"
 
-"@babel/runtime@^7.21.5", "@babel/runtime@^7.22.3", "@babel/runtime@^7.22.6":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.10.tgz#ae3e9631fd947cb7e3610d3e9d8fef5f76696682"
-  integrity sha512-21t/fkKLMZI4pqP2wlmsQAWnYW1PDyKyyUV4vCi+B25ydmdaYTKXPwCj0BzSUnZf4seIiYvSA3jcZ3gdsMFkLQ==
-  dependencies:
-    regenerator-runtime "^0.14.0"
-
 "@babel/template@^7.18.10", "@babel/template@^7.20.7":
   version "7.20.7"
   resolved "https://registry.npmjs.org/@babel/template/-/template-7.20.7.tgz"
@@ -1671,22 +1591,6 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
-"@babel/traverse@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.22.10.tgz#20252acb240e746d27c2e82b4484f199cf8141aa"
-  integrity sha512-Q/urqV4pRByiNNpb/f5OSv28ZlGJiFiiTh+GAHktbIrkPhPbl90+uW6SmpoLyZqutrg9AEaEf3Q/ZBRHBXgxig==
-  dependencies:
-    "@babel/code-frame" "^7.22.10"
-    "@babel/generator" "^7.22.10"
-    "@babel/helper-environment-visitor" "^7.22.5"
-    "@babel/helper-function-name" "^7.22.5"
-    "@babel/helper-hoist-variables" "^7.22.5"
-    "@babel/helper-split-export-declaration" "^7.22.6"
-    "@babel/parser" "^7.22.10"
-    "@babel/types" "^7.22.10"
-    debug "^4.1.0"
-    globals "^11.1.0"
-
 "@babel/traverse@^7.22.6", "@babel/traverse@^7.22.8":
   version "7.22.8"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.22.8.tgz#4d4451d31bc34efeae01eac222b514a77aa4000e"
@@ -1721,15 +1625,6 @@
     "@babel/helper-validator-identifier" "^7.19.1"
     to-fast-properties "^2.0.0"
 
-"@babel/types@^7.22.10":
-  version "7.22.10"
-  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.22.10.tgz#4a9e76446048f2c66982d1a989dd12b8a2d2dc03"
-  integrity sha512-obaoigiLrlDZ7TUQln/8m4mSqIW2QFeOrCQc9r+xsaHGNoplVNYlRVpsfE8Vj35GEm2ZH4ZhrNYogs/3fj85kg==
-  dependencies:
-    "@babel/helper-string-parser" "^7.22.5"
-    "@babel/helper-validator-identifier" "^7.22.5"
-    to-fast-properties "^2.0.0"
-
 "@babel/types@^7.22.5", "@babel/types@^7.4.4":
   version "7.22.5"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.22.5.tgz#cd93eeaab025880a3a47ec881f4b096a5b786fbe"
@@ -2847,17 +2742,6 @@
     "@emotion/sheet" "^1.2.2"
     "@emotion/utils" "^1.2.1"
 
-"@emotion/css@^11.11.0":
-  version "11.11.2"
-  resolved "https://registry.yarnpkg.com/@emotion/css/-/css-11.11.2.tgz#e5fa081d0c6e335352e1bc2b05953b61832dca5a"
-  integrity sha512-VJxe1ucoMYMS7DkiMdC2T7PWNbrEI0a39YRiyDvK2qq4lXwjRbVP/z4lpG+odCsRzadlR+1ywwrTzhdm5HNdew==
-  dependencies:
-    "@emotion/babel-plugin" "^11.11.0"
-    "@emotion/cache" "^11.11.0"
-    "@emotion/serialize" "^1.1.2"
-    "@emotion/sheet" "^1.2.2"
-    "@emotion/utils" "^1.2.1"
-
 "@emotion/hash@0.8.0":
   version "0.8.0"
   resolved "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz"
@@ -3240,13 +3124,6 @@
   resolved "https://registry.npmjs.org/@floating-ui/core/-/core-1.2.4.tgz"
   integrity sha512-SQOeVbMwb1di+mVWWJLpsUTToKfqVNioXys011beCAhyOIFtS+GQoW4EQSneuxzmQKddExDwQ+X0hLl4lJJaSQ==
 
-"@floating-ui/core@^1.4.1":
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.4.1.tgz#0d633f4b76052668afb932492ac452f7ebe97f17"
-  integrity sha512-jk3WqquEJRlcyu7997NtR5PibI+y5bi+LS3hPmguVClypenMsCY3CBa3LAQnozRCtCrYWSEtAdiskpamuJRFOQ==
-  dependencies:
-    "@floating-ui/utils" "^0.1.1"
-
 "@floating-ui/dom@^1.0.1":
   version "1.2.5"
   resolved "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.2.5.tgz"
@@ -3254,35 +3131,6 @@
   dependencies:
     "@floating-ui/core" "^1.2.4"
 
-"@floating-ui/dom@^1.3.0":
-  version "1.5.1"
-  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.5.1.tgz#88b70defd002fe851f17b4a25efb2d3c04d7a8d7"
-  integrity sha512-KwvVcPSXg6mQygvA1TjbN/gh///36kKtllIF8SUm0qpFj8+rvYrpvlYdL1JoA71SHpDqgSSdGOSoQ0Mp3uY5aw==
-  dependencies:
-    "@floating-ui/core" "^1.4.1"
-    "@floating-ui/utils" "^0.1.1"
-
-"@floating-ui/react-dom@^2.0.1":
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-2.0.1.tgz#7972a4fc488a8c746cded3cfe603b6057c308a91"
-  integrity sha512-rZtAmSht4Lry6gdhAJDrCp/6rKN7++JnL1/Anbr/DdeyYXQPxvg/ivrbYvJulbRf4vL8b212suwMM2lxbv+RQA==
-  dependencies:
-    "@floating-ui/dom" "^1.3.0"
-
-"@floating-ui/react@^0.24.3":
-  version "0.24.8"
-  resolved "https://registry.yarnpkg.com/@floating-ui/react/-/react-0.24.8.tgz#e079e2836990be3fce9665ab509360a5447251a1"
-  integrity sha512-AuYeDoaR8jtUlUXtZ1IJ/6jtBkGnSpJXbGNzokBL87VDJ8opMq1Bgrc0szhK482ReQY6KZsMoZCVSb4xwalkBA==
-  dependencies:
-    "@floating-ui/react-dom" "^2.0.1"
-    aria-hidden "^1.2.3"
-    tabbable "^6.0.1"
-
-"@floating-ui/utils@^0.1.1":
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.1.1.tgz#1a5b1959a528e374e8037c4396c3e825d6cf4a83"
-  integrity sha512-m0G6wlnhm/AX0H12IOWtK8gASEMffnX08RtKkCgTdHb9JpHKGloI7icFfLg9ZmQeavcvR0PKmzxClyuFPSjKWw==
-
 "@giphy/js-analytics@*":
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/@giphy/js-analytics/-/js-analytics-4.3.2.tgz#9710c7eb6e401571d4219a870cb6b0d35df61cdc"
@@ -3945,15 +3793,6 @@
     "@jridgewell/resolve-uri" "3.1.0"
     "@jridgewell/sourcemap-codec" "1.4.14"
 
-"@linaria/core@4.2.10":
-  version "4.2.10"
-  resolved "https://registry.yarnpkg.com/@linaria/core/-/core-4.2.10.tgz#3f8d45b20205c167d326d558ee9a926039483767"
-  integrity sha512-S1W01W7L4SQnGpWzp8awyCpPIYUOEJ+OLjjXqKpIXOU+ozPwBt86Mjjdas9aZccVhNBWDja74cMCUAVp8yUpDQ==
-  dependencies:
-    "@linaria/logger" "^4.0.0"
-    "@linaria/tags" "^4.3.5"
-    "@linaria/utils" "^4.3.4"
-
 "@linaria/core@4.2.9":
   version "4.2.9"
   resolved "https://registry.yarnpkg.com/@linaria/core/-/core-4.2.9.tgz#4917bde18d064a29cff4fd86aa99621f953a2a2c"
@@ -3971,14 +3810,6 @@
     debug "^4.1.1"
     picocolors "^1.0.0"
 
-"@linaria/logger@^4.5.0":
-  version "4.5.0"
-  resolved "https://registry.yarnpkg.com/@linaria/logger/-/logger-4.5.0.tgz#e5de815ffe7806822f47a559a512b98f66acea13"
-  integrity sha512-XdQLk242Cpcsc9a3Cz1ktOE5ysTo2TpxdeFQEPwMm8Z/+F/S6ZxBDdHYJL09srXWz3hkJr3oS2FPuMZNH1HIxw==
-  dependencies:
-    debug "^4.1.1"
-    picocolors "^1.0.0"
-
 "@linaria/tags@^4.3.4":
   version "4.3.5"
   resolved "https://registry.yarnpkg.com/@linaria/tags/-/tags-4.3.5.tgz#bf2e070d11179addf2f27a66cd29d8192e71ca89"
@@ -3988,15 +3819,6 @@
     "@linaria/logger" "^4.0.0"
     "@linaria/utils" "^4.3.4"
 
-"@linaria/tags@^4.3.5":
-  version "4.5.4"
-  resolved "https://registry.yarnpkg.com/@linaria/tags/-/tags-4.5.4.tgz#071ab024227433f783ea2d948904fc164731a912"
-  integrity sha512-HPxLB6HlJWLi6o8+8lTLegOmDnbMbuzEE+zzunaPZEGSoIIYx8HAv5VbY/sG/zNyxDElk6laiAwEVWN8h5/zxg==
-  dependencies:
-    "@babel/generator" "^7.22.9"
-    "@linaria/logger" "^4.5.0"
-    "@linaria/utils" "^4.5.3"
-
 "@linaria/utils@^4.3.3", "@linaria/utils@^4.3.4":
   version "4.3.4"
   resolved "https://registry.yarnpkg.com/@linaria/utils/-/utils-4.3.4.tgz#860db9131e498b62510e49dc6fd4a8f0ed44bf4d"
@@ -4011,24 +3833,6 @@
     "@linaria/logger" "^4.0.0"
     babel-merge "^3.0.0"
 
-"@linaria/utils@^4.5.3":
-  version "4.5.3"
-  resolved "https://registry.yarnpkg.com/@linaria/utils/-/utils-4.5.3.tgz#cf54f4096927ea347d01e814c1fb7aca7cf4063a"
-  integrity sha512-tSpxA3Zn0DKJ2n/YBnYAgiDY+MNvkmzAHrD8R9PKrpGaZ+wz1jQEmE1vGn1cqh8dJyWK0NzPAA8sf1cqa+RmAg==
-  dependencies:
-    "@babel/core" "^7.22.9"
-    "@babel/generator" "^7.22.9"
-    "@babel/plugin-proposal-export-namespace-from" "^7.18.9"
-    "@babel/plugin-syntax-dynamic-import" "^7.8.3"
-    "@babel/plugin-transform-modules-commonjs" "^7.22.5"
-    "@babel/template" "^7.22.5"
-    "@babel/traverse" "^7.22.8"
-    "@babel/types" "^7.22.5"
-    "@linaria/logger" "^4.5.0"
-    babel-merge "^3.0.0"
-    find-up "^5.0.0"
-    minimatch "^9.0.3"
-
 "@lingui/core@^3.17.2":
   version "3.17.2"
   resolved "https://registry.yarnpkg.com/@lingui/core/-/core-3.17.2.tgz#275aa19520477910ddf41a838ef91a8204bea7eb"
@@ -4038,32 +3842,11 @@
     "@messageformat/parser" "^5.0.0"
     make-plural "^6.2.2"
 
-"@lingui/core@^4.2.0":
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/@lingui/core/-/core-4.4.0.tgz#d043c2770673d70bafa6b850cfeec3c859844085"
-  integrity sha512-0ngEP+g4bt6f3cNqEzkU5796VkEEamxNXF/JD/QV9Ftxp8QBw91WqAoHjNYs3aYZOctCsRBR7FlvRQ6o2fDWDg==
-  dependencies:
-    "@babel/runtime" "^7.20.13"
-    "@lingui/message-utils" "4.4.0"
-    unraw "^2.0.1"
-
 "@lingui/detect-locale@^3.17.2":
   version "3.17.2"
   resolved "https://registry.yarnpkg.com/@lingui/detect-locale/-/detect-locale-3.17.2.tgz#9d7c2839f9ddd061261aaa479b908f06fe7e63f7"
   integrity sha512-rqyO16lj05WRfBuppo++mPzB1fQBFDhGqEFz5X97CbWXYp6AadOIkrm+pbn114Y2Yumy9QI7Cm4Ptbfk7CXO3Q==
 
-"@lingui/detect-locale@^4.2.0":
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/@lingui/detect-locale/-/detect-locale-4.4.0.tgz#6101a75833af9a4e27e9c9948238df351d1b324a"
-  integrity sha512-Mh4oLJ4KHSwcyWw7+bhQ8ErUCZjXDrZyILyHCcgq2S+HE2NG8M8OD/VBFajLW3dEUJPC9sRE8L2XTxYRNKlK6g==
-
-"@lingui/message-utils@4.4.0":
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/@lingui/message-utils/-/message-utils-4.4.0.tgz#88a7ff9c0ca10fdce25374a92fc27b932a96778a"
-  integrity sha512-SScnNuemsyHx2vyLvLsHgmAaCBHwnaAxUg3LkKoulqXe2Po8CmLBh1/28oNQ20ZhjwadUmy0unGalp9qqEBOkw==
-  dependencies:
-    "@messageformat/parser" "^5.0.0"
-
 "@loadable/component@^5.15.3":
   version "5.15.3"
   resolved "https://registry.npmjs.org/@loadable/component/-/component-5.15.3.tgz"
@@ -4147,30 +3930,11 @@
     prop-types "^15.8.1"
     react-is "^18.2.0"
 
-"@mui/base@5.0.0-beta.11":
-  version "5.0.0-beta.11"
-  resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-beta.11.tgz#0124d336f1931c6cd5f0008d015df5bd8fafd3a8"
-  integrity sha512-FdKZGPd8qmC3ZNke7CNhzcEgToc02M6WYZc9hcBsNQ17bgAd3s9F//1bDDYgMVBYxDM71V0sv/hBHlOY4I1ZVA==
-  dependencies:
-    "@babel/runtime" "^7.22.6"
-    "@emotion/is-prop-valid" "^1.2.1"
-    "@mui/types" "^7.2.4"
-    "@mui/utils" "^5.14.5"
-    "@popperjs/core" "^2.11.8"
-    clsx "^2.0.0"
-    prop-types "^15.8.1"
-    react-is "^18.2.0"
-
 "@mui/core-downloads-tracker@^5.13.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.13.1.tgz#ccfc3fd659c48379cec14cc60fb00bb711777d8f"
   integrity sha512-qDHtNDO72NcBQMhaWBt9EZMvNiO+OXjPg5Sdk/6LgRDw6Zr3HdEZ5n2FJ/qtYsaT/okGyCuQavQkcZCOCEVf/g==
 
-"@mui/core-downloads-tracker@^5.14.5":
-  version "5.14.5"
-  resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.14.5.tgz#c5854b89d57520c77253a79b20b784d5c2903fb6"
-  integrity sha512-+wpGH1USwPcKMFPMvXqYPC6fEvhxM3FzxC8lyDiNK/imLyyJ6y2DPb1Oue7OGIKJWBmYBqrWWtfovrxd1aJHTA==
-
 "@mui/material@^5.12.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.13.1.tgz#ecb0af2784ee8c552294475c285c8f2e644d8abc"
@@ -4189,24 +3953,6 @@
     react-is "^18.2.0"
     react-transition-group "^4.4.5"
 
-"@mui/material@^5.13.2":
-  version "5.14.5"
-  resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.14.5.tgz#4610b381fd159cd208c28e1d1f29c303ea24a518"
-  integrity sha512-4qa4GMfuZH0Ai3mttk5ccXP8a3sf7aPlAJwyMrUSz6h9hPri6BPou94zeu3rENhhmKLby9S/W1y+pmficy8JKA==
-  dependencies:
-    "@babel/runtime" "^7.22.6"
-    "@mui/base" "5.0.0-beta.11"
-    "@mui/core-downloads-tracker" "^5.14.5"
-    "@mui/system" "^5.14.5"
-    "@mui/types" "^7.2.4"
-    "@mui/utils" "^5.14.5"
-    "@types/react-transition-group" "^4.4.6"
-    clsx "^2.0.0"
-    csstype "^3.1.2"
-    prop-types "^15.8.1"
-    react-is "^18.2.0"
-    react-transition-group "^4.4.5"
-
 "@mui/private-theming@^5.13.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.13.1.tgz#c3e9a0b44f9c5a51b92cfcfb660536060cb61ed7"
@@ -4216,15 +3962,6 @@
     "@mui/utils" "^5.13.1"
     prop-types "^15.8.1"
 
-"@mui/private-theming@^5.14.5":
-  version "5.14.5"
-  resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.14.5.tgz#834e1569c31e2644665f98d902def79014053017"
-  integrity sha512-cC4C5RrpXpDaaZyH9QwmPhRLgz+f2SYbOty3cPkk4qPSOSfif2ZEcDD9HTENKDDd9deB+xkPKzzZhi8cxIx8Ig==
-  dependencies:
-    "@babel/runtime" "^7.22.6"
-    "@mui/utils" "^5.14.5"
-    prop-types "^15.8.1"
-
 "@mui/styled-engine@^5.12.3":
   version "5.12.3"
   resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.12.3.tgz#3307643d52c81947a624cdd0437536cc8109c4f0"
@@ -4235,16 +3972,6 @@
     csstype "^3.1.2"
     prop-types "^15.8.1"
 
-"@mui/styled-engine@^5.13.2":
-  version "5.13.2"
-  resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.13.2.tgz#c87bd61c0ab8086d34828b6defe97c02bcd642ef"
-  integrity sha512-VCYCU6xVtXOrIN8lcbuPmoG+u7FYuOERG++fpY74hPpEWkyFQG97F+/XfTQVYzlR2m7nPjnwVUgATcTCMEaMvw==
-  dependencies:
-    "@babel/runtime" "^7.21.0"
-    "@emotion/cache" "^11.11.0"
-    csstype "^3.1.2"
-    prop-types "^15.8.1"
-
 "@mui/system@^5.13.1":
   version "5.13.1"
   resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.13.1.tgz#2296e3269dc6baa5914ea28d0cc9534f7b03a7b5"
@@ -4259,20 +3986,6 @@
     csstype "^3.1.2"
     prop-types "^15.8.1"
 
-"@mui/system@^5.14.5":
-  version "5.14.5"
-  resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.14.5.tgz#614394c4183d90df82c540e0e736ba72c1f95f8e"
-  integrity sha512-mextXZHDeGcR7E1kx43TRARrVXy+gI4wzpUgNv7MqZs1dvTVXQGVeAT6ydj9d6FUqHBPMNLGV/21vJOrpqsL+w==
-  dependencies:
-    "@babel/runtime" "^7.22.6"
-    "@mui/private-theming" "^5.14.5"
-    "@mui/styled-engine" "^5.13.2"
-    "@mui/types" "^7.2.4"
-    "@mui/utils" "^5.14.5"
-    clsx "^2.0.0"
-    csstype "^3.1.2"
-    prop-types "^15.8.1"
-
 "@mui/types@^7.2.4":
   version "7.2.4"
   resolved "https://registry.yarnpkg.com/@mui/types/-/types-7.2.4.tgz#b6fade19323b754c5c6de679a38f068fd50b9328"
@@ -4289,17 +4002,6 @@
     prop-types "^15.8.1"
     react-is "^18.2.0"
 
-"@mui/utils@^5.14.5":
-  version "5.14.5"
-  resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.14.5.tgz#98fb6060610b793a8478e70ffe5e4ed5bd922dba"
-  integrity sha512-6Hzw63VR9C5xYv+CbjndoRLU6Gntal8rJ5W+GUzkyHrGWIyYPWZPa6AevnyGioySNETATe1H9oXS8f/7qgIHJA==
-  dependencies:
-    "@babel/runtime" "^7.22.6"
-    "@types/prop-types" "^15.7.5"
-    "@types/react-is" "^18.2.1"
-    prop-types "^15.8.1"
-    react-is "^18.2.0"
-
 "@noble/curves@~0.8.3":
   version "0.8.3"
   resolved "https://registry.npmjs.org/@noble/curves/-/curves-0.8.3.tgz"
@@ -4493,11 +4195,6 @@
   resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.7.tgz#ccab5c8f7dc557a52ca3288c10075c9ccd37fff7"
   integrity sha512-Cr4OjIkipTtcXKjAsm8agyleBuDHvxzeBoa1v543lbv1YaIwQjESsVcmjiWiPEbC1FIeHOG/Op9kdCmAmiS3Kw==
 
-"@popperjs/core@^2.11.8":
-  version "2.11.8"
-  resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.8.tgz#6b79032e760a0899cd4204710beede972a3a185f"
-  integrity sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==
-
 "@popperjs/core@^2.9.2", "@popperjs/core@^2.9.3":
   version "2.11.6"
   resolved "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz"
@@ -4522,11 +4219,6 @@
   dependencies:
     "@babel/runtime" "^7.21.0"
 
-"@remirror/core-constants@^2.0.2":
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/@remirror/core-constants/-/core-constants-2.0.2.tgz#f05eccdc69e3a65e7d524b52548f567904a11a1a"
-  integrity sha512-dyHY+sMF0ihPus3O27ODd4+agdHMEmuRdyiZJ2CCWjPV5UFmn17ZbElvk6WOGVE4rdCJKZQCrPV2BcikOMLUGQ==
-
 "@remirror/core-helpers@^2.0.2", "@remirror/core-helpers@^2.0.3":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@remirror/core-helpers/-/core-helpers-2.0.3.tgz#fa4a0224a612016b9f16052ed0c5d817c69daa39"
@@ -4548,25 +4240,6 @@
     object.pick "^1.3.0"
     throttle-debounce "^3.0.1"
 
-"@remirror/core-helpers@^3.0.0":
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/@remirror/core-helpers/-/core-helpers-3.0.0.tgz#3a35c2346bc23ebc3cee585b7840b5567755c5f1"
-  integrity sha512-tusEgQJIqg4qKj6HSBUFcyRnWnziw3neh4T9wOmsPGHFC3w9kl5KSrDb9UAgE8uX6y32FnS7vJ955mWOl3n50A==
-  dependencies:
-    "@remirror/core-constants" "^2.0.2"
-    "@remirror/types" "^1.0.1"
-    "@types/object.omit" "^3.0.0"
-    "@types/object.pick" "^1.3.2"
-    "@types/throttle-debounce" "^2.1.0"
-    case-anything "^2.1.13"
-    dash-get "^1.0.2"
-    deepmerge "^4.3.1"
-    fast-deep-equal "^3.1.3"
-    make-error "^1.3.6"
-    object.omit "^3.0.0"
-    object.pick "^1.3.0"
-    throttle-debounce "^3.0.1"
-
 "@remirror/core-types@^2.0.5":
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/@remirror/core-types/-/core-types-2.0.5.tgz#f6a5c56a555b57a9b88b2e8c2b7edba8bcc1042a"
@@ -4591,22 +4264,6 @@
     min-document "^2.19.0"
     parenthesis "^3.1.8"
 
-"@remirror/core-utils@^2.0.13":
-  version "2.0.13"
-  resolved "https://registry.yarnpkg.com/@remirror/core-utils/-/core-utils-2.0.13.tgz#a46bde5d18ea252664fa76f2428cb3cd9c20cd3d"
-  integrity sha512-5UggNc6Z2d7M8SVkstsVitID8DAHSKPrqet7Hfn4/dY+p4iMCOdwf9cLqcHMg3467k5/5/RvJPMTr9GQOEx7Hg==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core-constants" "^2.0.2"
-    "@remirror/core-helpers" "^3.0.0"
-    "@remirror/core-types" "^2.0.5"
-    "@remirror/messages" "^2.0.6"
-    "@types/min-document" "^2.19.0"
-    css-in-js-utils "^3.1.0"
-    get-dom-document "^0.1.3"
-    min-document "^2.19.0"
-    parenthesis "^3.1.8"
-
 "@remirror/core@^2.0.13", "@remirror/core@^2.0.15", "@remirror/core@^2.0.16":
   version "2.0.16"
   resolved "https://registry.yarnpkg.com/@remirror/core/-/core-2.0.16.tgz#11a185f28e6b071c814728b662cd8330e90218b0"
@@ -4624,23 +4281,6 @@
     nanoevents "^5.1.13"
     tiny-warning "^1.0.3"
 
-"@remirror/core@^2.0.17", "@remirror/core@^2.0.18", "@remirror/core@^2.0.19":
-  version "2.0.19"
-  resolved "https://registry.yarnpkg.com/@remirror/core/-/core-2.0.19.tgz#1ef089497e9404cd008ea6768b6a56223a0736fc"
-  integrity sha512-TGvDPUdKYqOiDQmt3+58GNBi4PX6QhBhII1qk9btZ/uFvG2/LLHEe+KN/BfBdvykGAu8CK9codLzg8NZd2fDEg==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@linaria/core" "4.2.10"
-    "@remirror/core-constants" "^2.0.2"
-    "@remirror/core-helpers" "^3.0.0"
-    "@remirror/core-types" "^2.0.5"
-    "@remirror/core-utils" "^2.0.13"
-    "@remirror/i18n" "^2.0.5"
-    "@remirror/icons" "^2.0.3"
-    "@remirror/messages" "^2.0.6"
-    nanoevents "^5.1.13"
-    tiny-warning "^1.0.3"
-
 "@remirror/dom@^2.0.16":
   version "2.0.16"
   resolved "https://registry.yarnpkg.com/@remirror/dom/-/dom-2.0.16.tgz#2823b4d92f057213d01cff927b7a0308fdeb2819"
@@ -4700,16 +4340,6 @@
     "@remirror/messages" "^2.0.3"
     "@remirror/theme" "^2.0.7"
 
-"@remirror/extension-callout@^2.0.15":
-  version "2.0.15"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-callout/-/extension-callout-2.0.15.tgz#1e5b882c66323e6429ac50b2f882bca5a24135a7"
-  integrity sha512-qn7o1JCy7k0rsybh57EtC8qRoZyEDkncxAtr4Rq1Z2PH/axuOJwwdIgeDadEGITpviRsqrh2L4ddogpDVWVImg==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.17"
-    "@remirror/messages" "^2.0.5"
-    "@remirror/theme" "^2.0.8"
-
 "@remirror/extension-code-block@^2.0.14":
   version "2.0.14"
   resolved "https://registry.yarnpkg.com/@remirror/extension-code-block/-/extension-code-block-2.0.14.tgz#542ff6d6c76ef61fb7ca8f7aac70efd620523491"
@@ -4722,18 +4352,6 @@
     "@types/refractor" "^3.0.2"
     refractor "^3.6.0"
 
-"@remirror/extension-code-block@^2.0.15":
-  version "2.0.18"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-code-block/-/extension-code-block-2.0.18.tgz#62140479751018f41e863a937281a7672508ae17"
-  integrity sha512-Qu51glo0xQMUlSYiFR20HmYEnOJF1OcbZYLTcF32oa8Uq1JWStv1DacQaACUQEhZ6DKgxFZxFBWbPLonzZ1bmw==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.19"
-    "@remirror/messages" "^2.0.6"
-    "@remirror/theme" "^2.0.9"
-    "@types/refractor" "^3.0.2"
-    refractor "^3.6.0"
-
 "@remirror/extension-code@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-code/-/extension-code-2.0.13.tgz#065cd7fdf02838bdcca1fe997e133ac4691537be"
@@ -4770,15 +4388,6 @@
     "@remirror/core" "^2.0.13"
     "@remirror/messages" "^2.0.3"
 
-"@remirror/extension-columns@^2.0.14":
-  version "2.0.14"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-columns/-/extension-columns-2.0.14.tgz#0d9da438d2b3dcf278216a49971daf59cd1b52b8"
-  integrity sha512-0WROpbsdCsuoHFTJB5daAIwjO4tGy9hVWx5kQk4P6bkLOW/qo5hSN6iQLi2mQsAG8pi7tn/NZtMNc1awWrRWhQ==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.17"
-    "@remirror/messages" "^2.0.5"
-
 "@remirror/extension-diff@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-diff/-/extension-diff-2.0.13.tgz#8540cd935aefc2ba25d9d75702ffd80149962524"
@@ -4862,15 +4471,6 @@
     "@remirror/core" "^2.0.15"
     "@remirror/messages" "^2.0.4"
 
-"@remirror/extension-events@^2.1.16":
-  version "2.1.16"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-events/-/extension-events-2.1.16.tgz#3e74c35a24c75b69ed6e51be446c5ba4a4427c37"
-  integrity sha512-QHmYyLqKSaYnxsbZOVI3cx543lrTOzooHdH3FKjh5KBiZ84vmqBdngKvZIMWj6/2iPMIE6y+kp4VOXqm8qrLKA==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.19"
-    "@remirror/messages" "^2.0.6"
-
 "@remirror/extension-find@^0.1.6":
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/@remirror/extension-find/-/extension-find-0.1.6.tgz#efdb5b6ca28aa0e517b031c2f3817425bbdeb6af"
@@ -4927,15 +4527,6 @@
     "@remirror/core" "^2.0.13"
     "@remirror/messages" "^2.0.3"
 
-"@remirror/extension-heading@^2.0.14":
-  version "2.0.14"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-heading/-/extension-heading-2.0.14.tgz#b9ccca44d9cb2c4cc48f16e7352f6c71d5f65cc1"
-  integrity sha512-jBBQhLSbEvR/IbSyzBLPN6P69zGoYrW/lxclMPccBxiqr/Rzc1ynJqrbXPQOzj3P43bRLdjXBKiy2VJWzqqO8Q==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.17"
-    "@remirror/messages" "^2.0.5"
-
 "@remirror/extension-history@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-history/-/extension-history-2.0.13.tgz#1bb1883b598fe5f7b9fd594795025afd76481435"
@@ -5021,17 +4612,6 @@
     "@remirror/messages" "^2.0.3"
     "@remirror/theme" "^2.0.7"
 
-"@remirror/extension-mention-atom@^2.0.17":
-  version "2.0.17"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-mention-atom/-/extension-mention-atom-2.0.17.tgz#2662c4f770b0ffa5ba0b9f88528004b7146bb471"
-  integrity sha512-RTHmhCrz8YVcMaifpKH8NB1aNxtgLRBG6ETyZgaPN2l9xcaRvtN5YHUb5myZsw0U4rUBXePI57/91j7QkxXw0Q==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.16"
-    "@remirror/extension-events" "^2.1.15"
-    "@remirror/messages" "^2.0.4"
-    "@remirror/theme" "^2.0.8"
-
 "@remirror/extension-mention@^2.0.15":
   version "2.0.15"
   resolved "https://registry.yarnpkg.com/@remirror/extension-mention/-/extension-mention-2.0.15.tgz#1bfe713db515c1ce62720ced36b112875780bf67"
@@ -5114,27 +4694,6 @@
     "@remirror/theme" "^2.0.7"
     jsx-dom-cjs "^8.0.5"
 
-"@remirror/extension-react-tables@^2.2.18":
-  version "2.2.18"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-react-tables/-/extension-react-tables-2.2.18.tgz#914db5daac8059f3658e39bc9e29758baa5e09d5"
-  integrity sha512-hv4edyYEBzZ0VhAHbzcfFxbLGbHhw1jGb20jU+qx1zPrgpMakdAl5qESMdy+1yyB7kHPRPGOpzpH62pkvm9HgQ==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@emotion/css" "^11.11.0"
-    "@linaria/core" "4.2.10"
-    "@remirror/core" "^2.0.19"
-    "@remirror/core-utils" "^2.0.13"
-    "@remirror/extension-positioner" "^2.1.8"
-    "@remirror/extension-tables" "^2.3.1"
-    "@remirror/icons" "^2.0.3"
-    "@remirror/messages" "^2.0.6"
-    "@remirror/preset-core" "^2.0.16"
-    "@remirror/react-components" "^2.1.17"
-    "@remirror/react-core" "^2.0.21"
-    "@remirror/react-hooks" "^2.0.25"
-    "@remirror/theme" "^2.0.9"
-    jsx-dom-cjs "^8.0.6"
-
 "@remirror/extension-search@^2.0.14":
   version "2.0.14"
   resolved "https://registry.yarnpkg.com/@remirror/extension-search/-/extension-search-2.0.14.tgz#a8b5429411041a437e1f92b12cb21e220f15819c"
@@ -5191,18 +4750,6 @@
     "@remirror/messages" "^2.0.3"
     "@remirror/theme" "^2.0.7"
 
-"@remirror/extension-tables@^2.3.1":
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-tables/-/extension-tables-2.3.1.tgz#43cbec67366f2810f877c3eb9c69eacfd788b20e"
-  integrity sha512-SJ/vIrEql+dSC1K2vWr+g9fGONGYMId4D4AZWq0E/ttENZo8jZqEeUAV+Z6NIfPJyScVsXKxolZAVGWfZ4JK6g==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.19"
-    "@remirror/extension-events" "^2.1.16"
-    "@remirror/extension-positioner" "^2.1.8"
-    "@remirror/messages" "^2.0.6"
-    "@remirror/theme" "^2.0.9"
-
 "@remirror/extension-text-case@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/extension-text-case/-/extension-text-case-2.0.13.tgz#d3bd5923f48befe7fe9f5d275ed7301c3b88e7d3"
@@ -5224,18 +4771,6 @@
     "@remirror/theme" "^2.0.7"
     color2k "^2.0.2"
 
-"@remirror/extension-text-color@^2.0.15":
-  version "2.0.15"
-  resolved "https://registry.yarnpkg.com/@remirror/extension-text-color/-/extension-text-color-2.0.15.tgz#9aab912e041fe71298313b5aa7389268f3c877b6"
-  integrity sha512-BCcJ2zyt+pu7WGru9D9SfnodtPz0zxRibVqZOsRvNGJQN29Bvxs89e5tV+xTlAoXUz9gwxJrM6cn03umu18mbA==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.17"
-    "@remirror/i18n" "^2.0.4"
-    "@remirror/messages" "^2.0.5"
-    "@remirror/theme" "^2.0.8"
-    color2k "^2.0.2"
-
 "@remirror/extension-text-highlight@^2.0.14":
   version "2.0.14"
   resolved "https://registry.yarnpkg.com/@remirror/extension-text-highlight/-/extension-text-highlight-2.0.14.tgz#b3c36646fa9a200676a93078f31f57e48dc7dd7d"
@@ -5307,17 +4842,6 @@
     "@remirror/core-helpers" "^2.0.2"
     make-plural "^6.2.2"
 
-"@remirror/i18n@^2.0.4", "@remirror/i18n@^2.0.5":
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/@remirror/i18n/-/i18n-2.0.5.tgz#783e9118a875cd639576af26999d013f3e4523a6"
-  integrity sha512-oZ2umZav60iu+lBoVZxr7i11yUNRYpczVUXCsClNiHN55PDPMyYwNQ9CaEJdyQCvt0lb5WCmBNpnw1mbLaj7lQ==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@lingui/core" "^4.2.0"
-    "@lingui/detect-locale" "^4.2.0"
-    "@remirror/core-helpers" "^3.0.0"
-    make-plural "^6.2.2"
-
 "@remirror/icons@^2.0.2":
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/@remirror/icons/-/icons-2.0.2.tgz#a1222dd6afbacfd2ac184859ba3590335b357b85"
@@ -5326,14 +4850,6 @@
     "@babel/runtime" "^7.21.0"
     "@remirror/core-helpers" "^2.0.2"
 
-"@remirror/icons@^2.0.3":
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/@remirror/icons/-/icons-2.0.3.tgz#977e93b7f5cc1f0be03c77dc02005e1a70180c1e"
-  integrity sha512-ruOGU4FT6WJdXsdVwfNOurSaQvnk2Uo4AkMxxyLYkBPowxmR9Xe0lOn7d7UARai0wxmwFgX6IYaMSUVLIaaMCQ==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core-helpers" "^3.0.0"
-
 "@remirror/messages@^2.0.3", "@remirror/messages@^2.0.4":
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/@remirror/messages/-/messages-2.0.4.tgz#b577a6d7ff78c39e1e670e685aa13139364e34e0"
@@ -5343,15 +4859,6 @@
     "@lingui/core" "^3.17.2"
     "@remirror/core-helpers" "^2.0.2"
 
-"@remirror/messages@^2.0.5", "@remirror/messages@^2.0.6":
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/@remirror/messages/-/messages-2.0.6.tgz#6b87a69001c691354cef3fa03f43e634edec69ce"
-  integrity sha512-JVnfuzuul4tcvnjiSM7Jj6iKDOP4hfaw79SciZ7t+cc2+iWyAcDYSrFMDV4Q50T+2IfWTYlWtKGpIhG6sfZaWw==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@lingui/core" "^4.2.0"
-    "@remirror/core-helpers" "^3.0.0"
-
 "@remirror/pm@^2.0.5":
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/@remirror/pm/-/pm-2.0.5.tgz#021aca4726e41ef3540a3e18d1a689aea90a4c76"
@@ -5502,54 +5009,6 @@
     multishift "^2.0.8"
     react-color "^2.19.3"
 
-"@remirror/react-components@^2.1.17":
-  version "2.1.17"
-  resolved "https://registry.yarnpkg.com/@remirror/react-components/-/react-components-2.1.17.tgz#e9f68e1302b58c90c2a6671001946054140aa779"
-  integrity sha512-25BIEfYJO10cxpChyA2fKdmQw5VSDD/Ltcjlxps9DuXTYtjPD1WQnwVdpUyW43W2r7UsvZ2OcVGtQLdJw+RBiw==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@emotion/react" "^11.11.0"
-    "@emotion/styled" "^11.11.0"
-    "@floating-ui/react" "^0.24.3"
-    "@lingui/core" "^4.2.0"
-    "@mui/material" "^5.13.2"
-    "@remirror/core" "^2.0.17"
-    "@remirror/extension-blockquote" "^2.0.14"
-    "@remirror/extension-bold" "^2.0.13"
-    "@remirror/extension-callout" "^2.0.15"
-    "@remirror/extension-code" "^2.0.13"
-    "@remirror/extension-code-block" "^2.0.15"
-    "@remirror/extension-columns" "^2.0.14"
-    "@remirror/extension-find" "^0.1.6"
-    "@remirror/extension-font-size" "^2.0.13"
-    "@remirror/extension-heading" "^2.0.14"
-    "@remirror/extension-history" "^2.0.13"
-    "@remirror/extension-horizontal-rule" "^2.0.13"
-    "@remirror/extension-italic" "^2.0.13"
-    "@remirror/extension-list" "^2.0.16"
-    "@remirror/extension-node-formatting" "^2.0.13"
-    "@remirror/extension-positioner" "^2.1.8"
-    "@remirror/extension-strike" "^2.0.13"
-    "@remirror/extension-sub" "^2.0.13"
-    "@remirror/extension-sup" "^2.0.13"
-    "@remirror/extension-tables" "^2.2.10"
-    "@remirror/extension-text-color" "^2.0.15"
-    "@remirror/extension-underline" "^2.0.13"
-    "@remirror/extension-whitespace" "^2.0.13"
-    "@remirror/i18n" "^2.0.4"
-    "@remirror/icons" "^2.0.2"
-    "@remirror/messages" "^2.0.5"
-    "@remirror/react-core" "^2.0.20"
-    "@remirror/react-hooks" "^2.0.25"
-    "@remirror/react-utils" "^2.0.5"
-    "@remirror/theme" "^2.0.8"
-    "@seznam/compose-react-refs" "^1.0.6"
-    "@types/react-color" "^3.0.6"
-    create-context-state "^2.0.2"
-    match-sorter "^6.3.1"
-    multishift "^2.0.8"
-    react-color "^2.19.3"
-
 "@remirror/react-core@^2.0.17":
   version "2.0.17"
   resolved "https://registry.yarnpkg.com/@remirror/react-core/-/react-core-2.0.17.tgz#5604f327e0335bdd3678dd67016e90cb24eed865"
@@ -5571,27 +5030,6 @@
     resize-observer-polyfill "^1.5.1"
     tiny-warning "^1.0.3"
 
-"@remirror/react-core@^2.0.20", "@remirror/react-core@^2.0.21":
-  version "2.0.21"
-  resolved "https://registry.yarnpkg.com/@remirror/react-core/-/react-core-2.0.21.tgz#11ab05e476bf53849aa28680321957c1154b791f"
-  integrity sha512-8c7+e0Y0LmwErqR4nPdUs73WLFKGqVs/DuE9q0wxSfXWbArAFVAAZB4PWrpcbYMbb0jSvG7rKDgnFN8NM/1f5A==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.18"
-    "@remirror/extension-positioner" "^2.1.8"
-    "@remirror/extension-react-component" "^2.0.13"
-    "@remirror/i18n" "^2.0.4"
-    "@remirror/preset-core" "^2.0.16"
-    "@remirror/preset-react" "^2.0.14"
-    "@remirror/react-renderer" "^2.0.13"
-    "@remirror/react-utils" "^2.0.5"
-    "@remirror/theme" "^2.0.8"
-    "@seznam/compose-react-refs" "^1.0.6"
-    create-context-state "^2.0.2"
-    fast-deep-equal "^3.1.3"
-    resize-observer-polyfill "^1.5.1"
-    tiny-warning "^1.0.3"
-
 "@remirror/react-editors@^1.0.33":
   version "1.0.33"
   resolved "https://registry.yarnpkg.com/@remirror/react-editors/-/react-editors-1.0.33.tgz#119717d958ef61125cf4440a5c952082de9abc56"
@@ -5630,26 +5068,6 @@
     use-isomorphic-layout-effect "^1.1.2"
     use-previous "^1.2.0"
 
-"@remirror/react-hooks@^2.0.25":
-  version "2.0.25"
-  resolved "https://registry.yarnpkg.com/@remirror/react-hooks/-/react-hooks-2.0.25.tgz#ff459872ba4222ac248edb083e9ffa1fd6ed4a44"
-  integrity sha512-/qByk9+OSDVBFD5N3CalsXNvbHF0GEfOEhNstsBGvg0xxf0NsuvPj1rYcXnVHk+9mgx2TMh+EiOhfURRR2A9vg==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@remirror/core" "^2.0.17"
-    "@remirror/extension-emoji" "^2.0.17"
-    "@remirror/extension-events" "^2.1.15"
-    "@remirror/extension-history" "^2.0.13"
-    "@remirror/extension-mention" "^2.0.15"
-    "@remirror/extension-mention-atom" "^2.0.17"
-    "@remirror/extension-positioner" "^2.1.8"
-    "@remirror/i18n" "^2.0.4"
-    "@remirror/react-core" "^2.0.20"
-    "@remirror/react-utils" "^2.0.5"
-    multishift "^2.0.8"
-    use-isomorphic-layout-effect "^1.1.2"
-    use-previous "^1.2.0"
-
 "@remirror/react-renderer@^2.0.13":
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/@remirror/react-renderer/-/react-renderer-2.0.13.tgz#2af76c30629c1c9782c7118984e103ae3a8baf2b"
@@ -5704,17 +5122,6 @@
     color2k "^2.0.2"
     csstype "^3.1.2"
 
-"@remirror/theme@^2.0.9":
-  version "2.0.9"
-  resolved "https://registry.yarnpkg.com/@remirror/theme/-/theme-2.0.9.tgz#0ae990448e90cfead0a6ff7d36b414165a9c663d"
-  integrity sha512-MI6j7C9KImVyfSBh9GR/WQCuLQKXRKQkE0HsS8Sc/BC8a/0n4QTt7dAg5/a/+MbakyymNaGlibCdts8URgGStg==
-  dependencies:
-    "@babel/runtime" "^7.22.3"
-    "@linaria/core" "4.2.10"
-    "@remirror/core-types" "^2.0.5"
-    color2k "^2.0.2"
-    csstype "^3.1.2"
-
 "@remirror/types@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@remirror/types/-/types-1.0.1.tgz#768502497a0fbbc23338a1586b893f729310cf70"
@@ -6335,13 +5742,6 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react-is@^18.2.1":
-  version "18.2.1"
-  resolved "https://registry.yarnpkg.com/@types/react-is/-/react-is-18.2.1.tgz#61d01c2a6fc089a53520c0b66996d458fdc46863"
-  integrity sha512-wyUkmaaSZEzFZivD8F2ftSyAfk6L+DfFliVj/mYdOXbVjRcS87fQJLTnhk6dRZPuJjI+9g6RZJO4PNCngUrmyw==
-  dependencies:
-    "@types/react" "*"
-
 "@types/react-transition-group@^4.4.0":
   version "4.4.5"
   resolved "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.5.tgz"
@@ -6887,7 +6287,7 @@ argparse@^2.0.1:
   resolved "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-aria-hidden@^1.2.2, aria-hidden@^1.2.3:
+aria-hidden@^1.2.2:
   version "1.2.3"
   resolved "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.3.tgz"
   integrity sha512-xcLxITLe2HYa1cnYnwCjkOO1PqUHQpozB8x9AR0OgWN2woOBi5kSDVxKfd0b7sb1hw5qFeJhXm9H1nu3xSfLeQ==
@@ -7448,11 +6848,6 @@ case-anything@^2.1.10:
   resolved "https://registry.yarnpkg.com/case-anything/-/case-anything-2.1.11.tgz#39a00ff733f26e48729f5c6c7f23763ac8fa0467"
   integrity sha512-uzKDXzdM/x914cepWPzElU3y50NRKYhjkO4ittOHLq+rF6M0AgRLF/+yPR1tvwLNAh8WHEPTfhuciZGPfX+oyg==
 
-case-anything@^2.1.13:
-  version "2.1.13"
-  resolved "https://registry.yarnpkg.com/case-anything/-/case-anything-2.1.13.tgz#0cdc16278cb29a7fcdeb072400da3f342ba329e9"
-  integrity sha512-zlOQ80VrQ2Ue+ymH5OuM/DlDq64mEm+B9UTdHULv5osUMD6HalNTblf2b1u/m6QecjsnOkBpqVZ+XPwIVsy7Ng==
-
 caseless@~0.12.0:
   version "0.12.0"
   resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc"
@@ -7775,11 +7170,6 @@ clsx@^1.2.1:
   resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12"
   integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==
 
-clsx@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.0.0.tgz#12658f3fd98fafe62075595a5c30e43d18f3d00b"
-  integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
-
 codemirror@^5.65.12:
   version "5.65.13"
   resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.65.13.tgz#c098a6f409db8b5a7c5722788bd9fa3bb2367f2e"
@@ -8194,13 +7584,6 @@ create-context-state@^2.0.1:
   dependencies:
     "@babel/runtime" "^7.21.0"
 
-create-context-state@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/create-context-state/-/create-context-state-2.0.2.tgz#3a811c8e5bb082b35601747e501d1ec970ee4f7f"
-  integrity sha512-WIz5i5QYt0xvlpbpSnhl4RY7WfcPy8gWtqzE6xtr2hfhuR3WJTsa5V4Y7jgPt+Knp5r0yKbKK0myK59HW2+HHw==
-  dependencies:
-    "@babel/runtime" "^7.21.5"
-
 create-emotion@^10.0.27:
   version "10.0.27"
   resolved "https://registry.npmjs.org/create-emotion/-/create-emotion-10.0.27.tgz"
@@ -11135,13 +10518,6 @@ jsx-dom-cjs@^8.0.5:
   dependencies:
     csstype "^3.1.1"
 
-jsx-dom-cjs@^8.0.6:
-  version "8.0.7"
-  resolved "https://registry.yarnpkg.com/jsx-dom-cjs/-/jsx-dom-cjs-8.0.7.tgz#098c54680ebf5bb6f6d12cdea5cde3799c172212"
-  integrity sha512-dQWnuQ+bTm7o72ZlJU4glzeMX8KLxx5U+ZwmEAzVP1+roL7BSM0MrkWdHjdsuNgmxobZCJ+qgiot9EgbJPOoEg==
-  dependencies:
-    csstype "^3.1.2"
-
 keyv@^3.0.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz"
@@ -11666,13 +11042,6 @@ minimatch@^5.0.1:
   dependencies:
     brace-expansion "^2.0.1"
 
-minimatch@^9.0.3:
-  version "9.0.3"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.3.tgz#a6e00c3de44c3a542bfaae70abfc22420a6da825"
-  integrity sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==
-  dependencies:
-    brace-expansion "^2.0.1"
-
 minimist-options@4.1.0:
   version "4.1.0"
   resolved "https://registry.npmjs.org/minimist-options/-/minimist-options-4.1.0.tgz"
@@ -13268,11 +12637,6 @@ regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.7:
   resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz"
   integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
 
-regenerator-runtime@^0.14.0:
-  version "0.14.0"
-  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
-  integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
-
 regenerator-transform@^0.15.1:
   version "0.15.1"
   resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.1.tgz#f6c4e99fc1b4591f780db2586328e4d9a9d8dc56"
@@ -14304,11 +13668,6 @@ symbol-tree@^3.2.4:
   resolved "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz"
   integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
 
-tabbable@^6.0.1:
-  version "6.2.0"
-  resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-6.2.0.tgz#732fb62bc0175cfcec257330be187dcfba1f3b97"
-  integrity sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==
-
 temp-dir@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/temp-dir/-/temp-dir-2.0.0.tgz"
@@ -14821,11 +14180,6 @@ unpipe@1.0.0, unpipe@~1.0.0:
   resolved "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz"
   integrity sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==
 
-unraw@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/unraw/-/unraw-2.0.1.tgz#7b51dcdfb1e43d59d5e52cdb44d349d029edbaba"
-  integrity sha512-tdOvLfRzHolwYcHS6HIX860MkK9LQ4+oLuNwFYL7bpgTEO64PZrcQxkisgwJYCfF8sKiWLwwu1c83DvMkbefIQ==
-
 untildify@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/untildify/-/untildify-4.0.0.tgz#2bc947b953652487e4600949fb091e3ae8cd919b"

From 3b02573f534cc2882479f774c2f667d48056498a Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Thu, 24 Aug 2023 12:16:42 -0400
Subject: [PATCH 04/12] fix: insert hardbreak after images and videos

---
 src/forms/markdown/commands/ImageCommand.tsx |  2 +
 src/forms/markdown/commands/TableCommand.tsx | 75 +++-----------------
 src/forms/markdown/commands/VideoCommand.tsx |  1 +
 3 files changed, 13 insertions(+), 65 deletions(-)

diff --git a/src/forms/markdown/commands/ImageCommand.tsx b/src/forms/markdown/commands/ImageCommand.tsx
index 3183a7ee0..8aec9cdde 100644
--- a/src/forms/markdown/commands/ImageCommand.tsx
+++ b/src/forms/markdown/commands/ImageCommand.tsx
@@ -15,6 +15,8 @@ export const ImageCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
       alt: label || 'image',
     })
 
+    commands.insertHardBreak()
+
     modal.onClose()
   })
 
diff --git a/src/forms/markdown/commands/TableCommand.tsx b/src/forms/markdown/commands/TableCommand.tsx
index 1dbe916b0..d151ad458 100644
--- a/src/forms/markdown/commands/TableCommand.tsx
+++ b/src/forms/markdown/commands/TableCommand.tsx
@@ -1,29 +1,19 @@
 import {
   Box,
-  Checkbox,
   HStack,
   Popover,
   PopoverArrow,
   PopoverBody,
-  PopoverCloseButton,
   PopoverContent,
   PopoverTrigger,
-  Text,
   useDisclosure,
   VStack,
 } from '@chakra-ui/react'
 import { useCommands } from '@remirror/react'
 import { useState } from 'react'
-import { useTranslation } from 'react-i18next'
 import { BsTable } from 'react-icons/bs'
-import {
-  RiDeleteColumn,
-  RiDeleteRow,
-  RiInsertColumnRight,
-  RiInsertRowBottom,
-} from 'react-icons/ri'
 
-import { Body2, MonoBody2 } from '../../../components/typography'
+import { MonoBody2 } from '../../../components/typography'
 import { useDebounce } from '../../../hooks'
 import { ToolbarCommandButton } from './ToolbarCommandButton'
 
@@ -32,17 +22,15 @@ interface TableCommandProps {
 }
 
 const tableBoxes = [
-  [1, 2, 3, 4, 5, 6],
-  [1, 2, 3, 4, 5, 6],
-  [1, 2, 3, 4, 5, 6],
-  [1, 2, 3, 4, 5, 6],
-  [1, 2, 3, 4, 5, 6],
+  [1, 2, 3, 4, 5],
+  [1, 2, 3, 4, 5],
+  [1, 2, 3, 4, 5],
+  [1, 2, 3, 4, 5],
+  [1, 2, 3, 4, 5],
 ]
 
 export const TableCommand = ({ isDisabled }: TableCommandProps) => {
-  const { t } = useTranslation()
   const { isOpen, onOpen, onClose } = useDisclosure()
-  const [hasHeader, setHasHeader] = useState(true)
 
   const commands = useCommands()
 
@@ -79,47 +67,13 @@ export const TableCommand = ({ isDisabled }: TableCommandProps) => {
           </ToolbarCommandButton>
         </PopoverTrigger>
         <PopoverContent
-          maxWidth="200px"
+          maxWidth="170px"
           onMouseOver={onOpen}
           onMouseLeave={onClose}
         >
           <PopoverArrow />
           <PopoverBody>
             <VStack>
-              <HStack w="full" spacing="5px">
-                <ToolbarCommandButton
-                  isDisabled={isDisabled}
-                  name="addTableRowAfter"
-                  label="add row below selected"
-                  onClick={commands.addTableRowAfter}
-                >
-                  <RiInsertRowBottom />
-                </ToolbarCommandButton>
-                <ToolbarCommandButton
-                  isDisabled={isDisabled}
-                  name="addTableColumnAfter"
-                  label="add column to right of selected"
-                  onClick={commands.addTableColumnAfter}
-                >
-                  <RiInsertColumnRight />
-                </ToolbarCommandButton>
-                <ToolbarCommandButton
-                  isDisabled={isDisabled}
-                  name="deleteTableRow"
-                  label="delete selected row"
-                  onClick={commands.deleteTableRow}
-                >
-                  <RiDeleteRow />
-                </ToolbarCommandButton>
-                <ToolbarCommandButton
-                  isDisabled={isDisabled}
-                  name="deleteTableColumn"
-                  label="delete selected column"
-                  onClick={commands.deleteTableColumn}
-                >
-                  <RiDeleteColumn />
-                </ToolbarCommandButton>
-              </HStack>
               <VStack spacing="0px" _hover={{ cursor: 'pointer' }}>
                 {tableBoxes.map((row, i) => (
                   <HStack key={i} spacing="0px">
@@ -146,18 +100,9 @@ export const TableCommand = ({ isDisabled }: TableCommandProps) => {
                   </HStack>
                 ))}
               </VStack>
-              <HStack w="full" justifyContent="space-between" spacing="0">
-                <Checkbox
-                  size="sm"
-                  isChecked={hasHeader}
-                  onChange={(e) => setHasHeader(e.target.checked)}
-                >
-                  <MonoBody2 semiBold> {t('headers')} </MonoBody2>
-                </Checkbox>
-                <MonoBody2 semiBold>{`${currentPosition.i + 1}X${
-                  currentPosition.j + 1
-                }`}</MonoBody2>
-              </HStack>
+              <MonoBody2 semiBold>{`${currentPosition.i + 1}X${
+                currentPosition.j + 1
+              }`}</MonoBody2>
             </VStack>
           </PopoverBody>
         </PopoverContent>
diff --git a/src/forms/markdown/commands/VideoCommand.tsx b/src/forms/markdown/commands/VideoCommand.tsx
index 74283e9d2..dc3b40571 100644
--- a/src/forms/markdown/commands/VideoCommand.tsx
+++ b/src/forms/markdown/commands/VideoCommand.tsx
@@ -14,6 +14,7 @@ export const VideoCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
   const modal = useInsertVideoModal(({ url }: MarkdownVideo) => {
     if (!commands.addYouTubeVideo) return
     commands.addYouTubeVideo({ video: url })
+    commands.insertHardBreak()
     modal.onClose()
   })
 

From e46b51bcff6fc908d263cd2f43f15214ef784603 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Thu, 24 Aug 2023 17:02:43 -0400
Subject: [PATCH 05/12] fix: issues with markdown and add multi line feature

---
 package.json                                  |   2 +
 src/forms/markdown/MarkdownField.tsx          |  11 +-
 .../markdown/helpers/PreviewRenderer.tsx      |  42 +--
 src/forms/markdown/helpers/SaveModule.tsx     |  11 +-
 src/forms/markdown/helpers/htmlToMarkdown.tsx | 277 ++++++++++++++++++
 src/forms/markdown/helpers/index.ts           |   5 +
 yarn.lock                                     |  14 +-
 7 files changed, 323 insertions(+), 39 deletions(-)
 create mode 100644 src/forms/markdown/helpers/htmlToMarkdown.tsx
 create mode 100644 src/forms/markdown/helpers/index.ts

diff --git a/package.json b/package.json
index 49e29f55c..7157f093e 100644
--- a/package.json
+++ b/package.json
@@ -42,6 +42,7 @@
     "bech32": "^2.0.0",
     "buffer": "^6.0.3",
     "classnames": "^2.3.2",
+    "dompurify": "^3.0.5",
     "dotenv": "^16.0.3",
     "express": "^4.18.2",
     "framer-motion": "^8.5.2",
@@ -98,6 +99,7 @@
     "@testing-library/react": "^13.4.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^14.4.3",
+    "@types/dompurify": "^3.0.2",
     "@types/loadable__component": "^5.13.4",
     "@types/luxon": "^3.2.0",
     "@types/node": "^18.11.18",
diff --git a/src/forms/markdown/MarkdownField.tsx b/src/forms/markdown/MarkdownField.tsx
index 67891b79a..8f9603827 100644
--- a/src/forms/markdown/MarkdownField.tsx
+++ b/src/forms/markdown/MarkdownField.tsx
@@ -36,10 +36,12 @@ import { useSignedUpload } from '../../hooks'
 import { useMobileMode } from '../../utils'
 import { ReactHookTextArea } from '../components/ReactHookTextArea'
 import { TableCellMenuComponent } from '../components/TableCellMenuComponent'
-import { PreviewRenderer } from './helpers/PreviewRenderer'
-import { SaveModule } from './helpers/SaveModule'
-import { StyleProvider } from './helpers/StyleProvider'
-import { imageHandler } from './helpers/typeMaps'
+import {
+  imageHandler,
+  PreviewRenderer,
+  SaveModule,
+  StyleProvider,
+} from './helpers'
 import { MarkdownToolbar } from './MarkdownToolbar'
 
 const turndownService = new TurndownService()
@@ -76,7 +78,6 @@ export const MarkdownField = ({
 }: Props) => {
   const { t } = useTranslation()
   const isMobile = useMobileMode()
-
   const onError: InvalidContentHandler = useCallback(
     ({ json, invalidContent, transformers }) => {
       // Automatically remove all invalid nodes and marks.
diff --git a/src/forms/markdown/helpers/PreviewRenderer.tsx b/src/forms/markdown/helpers/PreviewRenderer.tsx
index 0d910915e..72c63f255 100644
--- a/src/forms/markdown/helpers/PreviewRenderer.tsx
+++ b/src/forms/markdown/helpers/PreviewRenderer.tsx
@@ -1,4 +1,5 @@
 import { RemirrorRenderer } from '@remirror/react'
+import DOMPurify from 'dompurify'
 import { getRemirrorJSON, RemirrorContentType, RemirrorManager } from 'remirror'
 
 import { markMap, typeMap } from './typeMaps'
@@ -10,7 +11,9 @@ export const PreviewRenderer = ({
   manager: RemirrorManager<any>
   content?: RemirrorContentType
 }) => {
-  // const newContent = formatString(content?.toString() || '')
+  const newContent = FormatWhiteSpaceForMarkDownString(
+    content?.toString() || '',
+  )
 
   return (
     <RemirrorRenderer
@@ -18,7 +21,7 @@ export const PreviewRenderer = ({
       markMap={markMap}
       json={getRemirrorJSON(
         manager.createState({
-          content,
+          content: newContent,
           stringHandler: 'markdown',
         }),
       )}
@@ -26,33 +29,12 @@ export const PreviewRenderer = ({
   )
 }
 
-// export const matchMarkDownSpecialKeysAtLineEnd =
-//   /\n(?!.*(\*|_|#|-|\||`|[0-9]+(\.|\))))/g
-
-// const formatString = (value: string): string => {
-//   const adjustForLineChange = value
-//     ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '\\\n')
-//     : ''
-
-//   const adjustedForMultiParagrah = adjustForLineChange.replaceAll(
-//     /\n\n/g,
-//     '\n\\\n',
-//   )
-
-//   const finalValue = getRidOfEndSlash(adjustedForMultiParagrah)
+export const matchMarkDownSpecialKeysAtLineEnd = /\n(?!.*(\||#|\[|>))/g
 
-//   console.log('before content', JSON.stringify(value))
-//   console.log('medium content', JSON.stringify(adjustForLineChange))
-//   console.log('after content', JSON.stringify(adjustedForMultiParagrah))
+export const FormatWhiteSpaceForMarkDownString = (value: string): string => {
+  const adjustForLineChange = value
+    ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '<br />')
+    : ''
 
-//   return finalValue
-// }
-
-// const getRidOfEndSlash = (value: string): string => {
-//   if (value[value.length - 2] === '\\') {
-//     const newValue = value.slice(0, value.length - 2)
-//     return getRidOfEndSlash(newValue)
-//   }
-
-//   return value
-// }
+  return DOMPurify.sanitize(adjustForLineChange)
+}
diff --git a/src/forms/markdown/helpers/SaveModule.tsx b/src/forms/markdown/helpers/SaveModule.tsx
index 56832388b..265dea021 100644
--- a/src/forms/markdown/helpers/SaveModule.tsx
+++ b/src/forms/markdown/helpers/SaveModule.tsx
@@ -2,6 +2,8 @@ import { useDebouncedCallback } from '@react-hookz/web'
 import { useHelpers, useRemirrorContext } from '@remirror/react'
 import { Control, useController, useFormContext } from 'react-hook-form'
 
+import { htmlToMarkdown } from './htmlToMarkdown'
+
 export function SaveModule(props: { control?: Control; name?: string }) {
   const {
     field: { onChange },
@@ -11,11 +13,14 @@ export function SaveModule(props: { control?: Control; name?: string }) {
   })
   const { trigger } = useFormContext()
 
-  const { getMarkdown } = useHelpers()
+  const { getHTML } = useHelpers()
 
   const changeCallback = useDebouncedCallback(
-    (ctx) => {
-      onChange(getMarkdown(ctx.state))
+    async (ctx) => {
+      const html = getHTML(ctx.state)
+      const newHTML = html.replaceAll('<p style=""></p>', '<br>')
+      const newMarkdown = htmlToMarkdown(newHTML)
+      onChange(newMarkdown)
       trigger(props.name ?? 'content')
     },
     [],
diff --git a/src/forms/markdown/helpers/htmlToMarkdown.tsx b/src/forms/markdown/helpers/htmlToMarkdown.tsx
new file mode 100644
index 000000000..3c5b47528
--- /dev/null
+++ b/src/forms/markdown/helpers/htmlToMarkdown.tsx
@@ -0,0 +1,277 @@
+/**
+ * @module
+ *
+ * Use `turndown` to provide a github flavoured markdown converter and the
+ * default common mark converter.
+ */
+import {
+  defaultImport,
+  ErrorConstant,
+  invariant,
+  isElementDomNode,
+} from '@remirror/core'
+import _TurndownService from 'turndown'
+
+const TurndownService = defaultImport(_TurndownService)
+
+/**
+ * Converts the provide HTML to markdown.
+ */
+export function htmlToMarkdown(html: string): string {
+  return turndownService.turndown(html)
+}
+
+/**
+ * A tableRow is a heading row if:
+ * - the parent is a THEAD
+ * - or if its the first child of the TABLE or the first TBODY (possibly
+ *   following a blank THEAD)
+ * - and every cell is a TH
+ */
+function isHeadingRow(tableRow: Node): tableRow is HTMLTableRowElement {
+  const { parentNode } = tableRow
+
+  if (!isElementDomNode(parentNode)) {
+    return false
+  }
+
+  if (parentNode.nodeName === 'THEAD') {
+    return true
+  }
+
+  if (parentNode.nodeName !== 'TABLE' && !isFirstTbody(parentNode)) {
+    return false
+  }
+
+  const childNodes = [...tableRow.childNodes]
+  return (
+    childNodes.every((n) => n.nodeName === 'TH') &&
+    childNodes.some((n) => Boolean(n.textContent))
+  )
+}
+
+/**
+ * Controller cells are generated by the React Tables extension, and provide Node Views for adding/removing columns and rows
+ *
+ * However they should not be included in markdown output.
+ */
+function isControllerHeadingCell(cell: unknown): cell is HTMLTableCellElement {
+  return isElementDomNode(cell) && cell.matches('th[data-controller-cell]')
+}
+
+/**
+ * A tableRow is a controller heading row if:
+ * - the parent is a THEAD
+ * - or if its the first child of the TABLE or the first TBODY (possibly
+ *   following a blank THEAD)
+ * - and every cell is a controller cell
+ */
+function isControllerHeadingRow(
+  tableRow: Node,
+): tableRow is HTMLTableRowElement {
+  const { parentNode } = tableRow
+
+  if (!isElementDomNode(parentNode)) {
+    return false
+  }
+
+  if (parentNode.nodeName !== 'TABLE' && !isFirstTbody(parentNode)) {
+    return false
+  }
+
+  const childNodes = [...tableRow.childNodes]
+  return childNodes.every((n) => isControllerHeadingCell(n))
+}
+
+/**
+ * Check whether this is the first `tbody` in the table.
+ */
+function isFirstTbody(element: Node): element is HTMLTableSectionElement {
+  if (element.nodeName !== 'TBODY') {
+    return false
+  }
+
+  const { previousSibling } = element
+
+  if (!previousSibling) {
+    return true
+  }
+
+  return (
+    isElementDomNode(previousSibling) &&
+    previousSibling.nodeName === 'THEAD' &&
+    !previousSibling.textContent?.trim()
+  )
+}
+
+/**
+ * Markdown does not support nested tables, check if current table has a table ancestor node
+ */
+function isNestedTable(element: HTMLElement): boolean {
+  const currentTable = element.closest('table')
+
+  if (!currentTable) {
+    return false
+  }
+
+  const { parentNode } = currentTable
+
+  if (!parentNode) {
+    return true
+  }
+
+  return Boolean((parentNode as HTMLElement).closest('table'))
+}
+
+/**
+ * Create a cell from the table.
+ */
+function cell(content: string, node: Node) {
+  const childNodes = []
+
+  for (const n of node.parentNode?.childNodes ?? []) {
+    if (isControllerHeadingCell(n)) {
+      continue
+    }
+
+    childNodes.push(n)
+  }
+
+  const index = childNodes.indexOf(node as ChildNode)
+  const prefix = index === 0 ? '| ' : ' '
+
+  return `${prefix + content.trim()} |`
+}
+
+/**
+ * Create the turndown service which will be used to convert html to markdown.
+ *
+ * This supports html by default.
+ */
+const turndownService = new TurndownService({
+  codeBlockStyle: 'fenced',
+  headingStyle: 'atx',
+})
+  .addRule('taskListItems', {
+    filter: (node) =>
+      node.nodeName === 'LI' && node.hasAttribute('data-task-list-item'),
+    replacement(content, node) {
+      const isChecked = (node as HTMLElement).hasAttribute('data-checked')
+      return `- ${isChecked ? '[x]' : '[ ]'} ${content.trimStart()}`
+    },
+  })
+  .addRule('tableCell', {
+    filter: ['th', 'td'],
+    replacement(content, node) {
+      if (isControllerHeadingCell(node)) {
+        return ''
+      }
+
+      return cell(content, node as ChildNode)
+    },
+  })
+  .addRule('tableRow', {
+    filter: 'tr',
+    replacement(content, node) {
+      let borderCells = ''
+      const alignMap = { left: ':--', right: '--:', center: ':-:' }
+
+      // Get child nodes ignoring controller cells
+      const childNodes = [...node.childNodes].filter(
+        (n) => !isControllerHeadingCell(n),
+      )
+
+      if (isHeadingRow(node)) {
+        for (const childNode of childNodes) {
+          if (!isElementDomNode(childNode)) {
+            // This should never happen.
+            continue
+          }
+
+          let border = '---'
+          const align = (
+            childNode.getAttribute('align') ?? ''
+          ).toLowerCase() as keyof typeof alignMap
+
+          if (align) {
+            border = alignMap[align] || border
+          }
+
+          borderCells += cell(border, childNode)
+        }
+      }
+
+      return `\n${content}${borderCells ? `\n${borderCells}` : ''}`
+    },
+  })
+  .addRule('table', {
+    // Only convert tables with a heading row. Tables with no heading row are kept
+    // using `keep` (see below).
+    filter(node) {
+      if (node.nodeName !== 'TABLE') {
+        return false
+      }
+
+      if (isNestedTable(node)) {
+        return false
+      }
+
+      const rows = [...(node as HTMLTableElement).rows].filter(
+        (r) =>
+          // Remove controller rows
+          !isControllerHeadingRow(r),
+      )
+      if (rows[0]) return isHeadingRow(rows[0])
+      return false
+    },
+
+    replacement(content) {
+      // Ensure there are no blank lines
+      content = content.replace('\n\n', '\n')
+      return `\n\n${content}\n\n`
+    },
+  })
+  .addRule('tableSection', {
+    filter: ['thead', 'tbody', 'tfoot'],
+    replacement(content) {
+      return content
+    },
+  })
+  .keep(
+    (node) =>
+      node.nodeName === 'TABLE' &&
+      !isHeadingRow((node as HTMLTableElement).rows[0] as any),
+  )
+  .keep((node) => node.nodeName === 'TABLE' && isNestedTable(node))
+  .addRule('strikethrough', {
+    filter: ['del', 's', 'strike' as 'del'],
+    replacement(content) {
+      return `~${content}~`
+    },
+  })
+
+  // Add improved code block support from html.
+  .addRule('fencedCodeBlock', {
+    filter: (node, options) =>
+      Boolean(
+        options.codeBlockStyle === 'fenced' &&
+          node.nodeName === 'PRE' &&
+          node.firstChild &&
+          node.firstChild.nodeName === 'CODE',
+      ),
+
+    replacement(_, node, options) {
+      invariant(isElementDomNode(node.firstChild), {
+        code: ErrorConstant.EXTENSION,
+        message: `Invalid node \`${node.firstChild?.nodeName}\` encountered for codeblock when converting html to markdown.`,
+      })
+
+      const className = node.firstChild.getAttribute('class') ?? ''
+      const language =
+        className.match(/(?:lang|language)-(\S+)/)?.[1] ??
+        node.firstChild.getAttribute('data-code-block-language') ??
+        ''
+
+      return `\n\n${options.fence}${language}\n${node.firstChild.textContent}\n${options.fence}\n\n`
+    },
+  })
diff --git a/src/forms/markdown/helpers/index.ts b/src/forms/markdown/helpers/index.ts
new file mode 100644
index 000000000..1b42a768f
--- /dev/null
+++ b/src/forms/markdown/helpers/index.ts
@@ -0,0 +1,5 @@
+export * from './htmlToMarkdown'
+export * from './PreviewRenderer'
+export * from './SaveModule'
+export * from './StyleProvider'
+export * from './typeMaps'
diff --git a/yarn.lock b/yarn.lock
index 1346cab13..d6b628548 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5521,6 +5521,13 @@
   resolved "https://registry.yarnpkg.com/@types/direction/-/direction-1.0.0.tgz#6a0962feade8502f9e986e87abe1130b611b13be"
   integrity sha512-et1wmqXm/5smJ8lTJfBnwD12/2Y7eVJLKbuaRT0h2xaKAoo1h8Dz2Io22GObDLFwxY1ddXRTLH3Gq5v44Fl/2w==
 
+"@types/dompurify@^3.0.2":
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/@types/dompurify/-/dompurify-3.0.2.tgz#c1cd33a475bc49c43c2a7900e41028e2136a4553"
+  integrity sha512-YBL4ziFebbbfQfH5mlC+QTJsvh0oJUrWbmxKMyEdL7emlHJqGR2Qb34TEFKj+VCayBvjKy3xczMFNhugThUsfQ==
+  dependencies:
+    "@types/trusted-types" "*"
+
 "@types/estree@*":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.1.tgz#aa22750962f3bf0e79d753d3cc067f010c95f194"
@@ -5835,7 +5842,7 @@
   resolved "https://registry.yarnpkg.com/@types/throttle-debounce/-/throttle-debounce-2.1.0.tgz#1c3df624bfc4b62f992d3012b84c56d41eab3776"
   integrity sha512-5eQEtSCoESnh2FsiLTxE121IiE60hnMqcb435fShf4bpLRjEu1Eoekht23y6zXS9Ts3l+Szu3TARnTsA0GkOkQ==
 
-"@types/trusted-types@^2.0.2":
+"@types/trusted-types@*", "@types/trusted-types@^2.0.2":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@types/trusted-types/-/trusted-types-2.0.3.tgz#a136f83b0758698df454e328759dbd3d44555311"
   integrity sha512-NfQ4gyz38SL8sDNrSixxU2Os1a5xcdFxipAFxYEuLUlvU2uDwS4NUpsImcf1//SlWItCVMMLiylsxbmNMToV/g==
@@ -8032,6 +8039,11 @@ dompurify@^2.2.2:
   resolved "https://registry.npmjs.org/dompurify/-/dompurify-2.4.5.tgz"
   integrity sha512-jggCCd+8Iqp4Tsz0nIvpcb22InKEBrGz5dw3EQJMs8HPJDsKbFIO3STYtAvCfDx26Muevn1MHVI0XxjgFfmiSA==
 
+dompurify@^3.0.5:
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-3.0.5.tgz#eb3d9cfa10037b6e73f32c586682c4b2ab01fbed"
+  integrity sha512-F9e6wPGtY+8KNMRAVfxeCOHU0/NPWMSENNq4pQctuXRqqdEPW7q3CrLbR5Nse044WwacyjHGOMlvNsBe1y6z9A==
+
 dot-case@^3.0.4:
   version "3.0.4"
   resolved "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz"

From bc25d9b7976e13c5b7e35164e3e4c796e868d846 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Fri, 25 Aug 2023 11:25:34 -0400
Subject: [PATCH 06/12] fix: finalize video fixes and sanitize html

---
 src/forms/markdown/commands/ImageCommand.tsx   | 1 +
 src/forms/markdown/commands/VideoCommand.tsx   | 1 +
 src/forms/markdown/helpers/PreviewRenderer.tsx | 7 ++++---
 src/forms/markdown/helpers/htmlToMarkdown.tsx  | 1 +
 4 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/forms/markdown/commands/ImageCommand.tsx b/src/forms/markdown/commands/ImageCommand.tsx
index 8aec9cdde..0c5e5314e 100644
--- a/src/forms/markdown/commands/ImageCommand.tsx
+++ b/src/forms/markdown/commands/ImageCommand.tsx
@@ -10,6 +10,7 @@ export const ImageCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
 
   const modal = useInsertLinkModal(({ url, label }: MarkdownImage) => {
     if (!commands.insertImage) return
+    commands.insertHardBreak()
     commands.insertImage({
       src: url,
       alt: label || 'image',
diff --git a/src/forms/markdown/commands/VideoCommand.tsx b/src/forms/markdown/commands/VideoCommand.tsx
index dc3b40571..c2ab9d47e 100644
--- a/src/forms/markdown/commands/VideoCommand.tsx
+++ b/src/forms/markdown/commands/VideoCommand.tsx
@@ -13,6 +13,7 @@ export const VideoCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
 
   const modal = useInsertVideoModal(({ url }: MarkdownVideo) => {
     if (!commands.addYouTubeVideo) return
+    commands.insertHardBreak()
     commands.addYouTubeVideo({ video: url })
     commands.insertHardBreak()
     modal.onClose()
diff --git a/src/forms/markdown/helpers/PreviewRenderer.tsx b/src/forms/markdown/helpers/PreviewRenderer.tsx
index 72c63f255..a72be2b38 100644
--- a/src/forms/markdown/helpers/PreviewRenderer.tsx
+++ b/src/forms/markdown/helpers/PreviewRenderer.tsx
@@ -29,12 +29,13 @@ export const PreviewRenderer = ({
   )
 }
 
-export const matchMarkDownSpecialKeysAtLineEnd = /\n(?!.*(\||#|\[|>))/g
+export const matchMarkDownSpecialKeysAtLineEnd =
+  /(?<!.*(\|\n|\||>))\n(?!.*(\n\||\||#|\[|>))/g
 
 export const FormatWhiteSpaceForMarkDownString = (value: string): string => {
   const adjustForLineChange = value
-    ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '<br />')
+    ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '<br>')
     : ''
 
-  return DOMPurify.sanitize(adjustForLineChange)
+  return DOMPurify.sanitize(adjustForLineChange, { ADD_TAGS: ['iframe'] })
 }
diff --git a/src/forms/markdown/helpers/htmlToMarkdown.tsx b/src/forms/markdown/helpers/htmlToMarkdown.tsx
index 3c5b47528..f740ee340 100644
--- a/src/forms/markdown/helpers/htmlToMarkdown.tsx
+++ b/src/forms/markdown/helpers/htmlToMarkdown.tsx
@@ -152,6 +152,7 @@ const turndownService = new TurndownService({
   codeBlockStyle: 'fenced',
   headingStyle: 'atx',
 })
+  .keep(['iframe'])
   .addRule('taskListItems', {
     filter: (node) =>
       node.nodeName === 'LI' && node.hasAttribute('data-task-list-item'),

From d4628d5e1452613f5f7039935a78a1aa81e1eb19 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Fri, 25 Aug 2023 20:46:11 -0400
Subject: [PATCH 07/12] fix: add twitter embed inside markdown

---
 index.html                                    | 16 ++++
 src/constants/components/id.ts                |  5 ++
 src/forms/markdown/MarkdownField.tsx          | 15 +++-
 src/forms/markdown/commands/TweetCommand.tsx  | 74 +++++++++++++++++++
 .../markdown/helpers/PreviewRenderer.tsx      |  4 +-
 src/forms/markdown/helpers/StyleProvider.tsx  | 15 +++-
 src/forms/markdown/helpers/typeMaps.tsx       | 60 ++++++++++++++-
 .../markdown/modals/InsertTwitterModal.tsx    | 64 ++++++++++++++++
 .../markdown/modals/InsertVideoModal.tsx      |  7 +-
 src/forms/markdown/toolbar/ToolbarMedia.tsx   |  2 +
 src/forms/validations/twitter.ts              | 12 +++
 src/translations/English.json                 |  7 +-
 src/types/types.ts                            |  2 +
 13 files changed, 274 insertions(+), 9 deletions(-)
 create mode 100644 src/forms/markdown/commands/TweetCommand.tsx
 create mode 100644 src/forms/markdown/modals/InsertTwitterModal.tsx
 create mode 100644 src/forms/validations/twitter.ts

diff --git a/index.html b/index.html
index a266caab3..d224a7670 100644
--- a/index.html
+++ b/index.html
@@ -42,6 +42,22 @@
         a.appendChild(r);
     })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
   </script>
+  <script>window.twttr = (function(d, s, id) {
+    var js, fjs = d.getElementsByTagName(s)[0],
+      t = window.twttr || {};
+    if (d.getElementById(id)) return t;
+    js = d.createElement(s);
+    js.id = id;
+    js.src = "https://platform.twitter.com/widgets.js";
+    fjs.parentNode.insertBefore(js, fjs);
+  
+    t._e = [];
+    t.ready = function(f) {
+      t._e.push(f);
+    };
+  
+    return t;
+  }(document, "script", "twitter-wjs"));</script>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root"></div>
diff --git a/src/constants/components/id.ts b/src/constants/components/id.ts
index cd9fc495c..ed3be575c 100644
--- a/src/constants/components/id.ts
+++ b/src/constants/components/id.ts
@@ -22,6 +22,11 @@ export const ID = {
       contribution: 'project-activity-list-container',
       leaderboard: 'project-leaderboard-list-container',
     },
+    story: {
+      markdown: {
+        container: 'project-story-markdown-container',
+      },
+    },
   },
   profile: {
     tabs: 'user-profile-tab-container',
diff --git a/src/forms/markdown/MarkdownField.tsx b/src/forms/markdown/MarkdownField.tsx
index 8f9603827..ee60045e1 100644
--- a/src/forms/markdown/MarkdownField.tsx
+++ b/src/forms/markdown/MarkdownField.tsx
@@ -37,6 +37,7 @@ import { useMobileMode } from '../../utils'
 import { ReactHookTextArea } from '../components/ReactHookTextArea'
 import { TableCellMenuComponent } from '../components/TableCellMenuComponent'
 import {
+  FrameHandler,
   imageHandler,
   PreviewRenderer,
   SaveModule,
@@ -108,7 +109,18 @@ export const MarkdownField = ({
       new BlockquoteExtension(),
       new OrderedListExtension(),
       new CodeExtension(),
-      new IframeExtension(),
+      new IframeExtension({
+        enableResizing: false,
+        extraAttributes: {
+          width: '100%',
+          scolling: 'no',
+          style: {
+            default: JSON.stringify({ width: '100%', height: '400px' }),
+            parseDOM: (domNode) => domNode.getAttribute('style'),
+            toDOM: (attrs) => ['style', (attrs.style as string) || ''],
+          },
+        },
+      }),
       new HardBreakExtension(),
       new TableExtension(),
       new TrailingNodeExtension(),
@@ -148,6 +160,7 @@ export const MarkdownField = ({
         orderedList: ({ forwardRef }: { forwardRef: ForwardedRef<any> }) => (
           <Box pl={5} ref={forwardRef} />
         ),
+        iframe: (props: any) => FrameHandler(props),
       },
     },
   })
diff --git a/src/forms/markdown/commands/TweetCommand.tsx b/src/forms/markdown/commands/TweetCommand.tsx
new file mode 100644
index 000000000..f60dd9913
--- /dev/null
+++ b/src/forms/markdown/commands/TweetCommand.tsx
@@ -0,0 +1,74 @@
+import { Box } from '@chakra-ui/react'
+import { useCommands } from '@remirror/react'
+import { BsTwitter } from 'react-icons/bs'
+
+import { useDarkMode } from '../../../utils'
+import {
+  InsertTwitterModal,
+  MarkdownTwitter,
+  useInsertTwitterModal,
+} from '../modals/InsertTwitterModal'
+import { ToolbarCommandButton } from './ToolbarCommandButton'
+
+export const TweetCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
+  const commands = useCommands()
+  const isDarkMode = useDarkMode()
+
+  const modal = useInsertTwitterModal(async ({ url }: MarkdownTwitter) => {
+    if (!commands.addYouTubeVideo) return
+    commands.insertHardBreak()
+
+    const UrlSplit = url.split('/').filter((val) => val && val !== '/')
+
+    const tweetId = UrlSplit[UrlSplit.length - 1]
+
+    if (!tweetId) return
+
+    const value = await twttr.widgets.createTweet(
+      tweetId,
+      document.getElementById('tweet-container'),
+      {
+        width: '350px',
+        theme: isDarkMode ? 'dark' : 'light',
+      },
+    )
+
+    console.log('inner html', value.innerHTML)
+
+    commands.insertHtml(value.innerHTML, {})
+    commands.insertHardBreak()
+
+    const element = document.getElementById('tweet-container')
+    if (element) {
+      element.innerHTML = ''
+    }
+
+    modal.onClose()
+  })
+
+  return (
+    <>
+      <ToolbarCommandButton
+        name="video"
+        label="Insert video"
+        onClick={() => modal.onOpen()}
+        isDisabled={isDisabled}
+      >
+        <BsTwitter />
+      </ToolbarCommandButton>
+      {modal.isOpen ? <InsertTwitterModal {...modal} /> : null}
+      <Box
+        display="fixed !important"
+        left={-10000}
+        id="tweet-container"
+        borderRadius="12px"
+        overflow="hidden"
+        sx={{
+          '& .twitter-tweet': {
+            margin: '0 auto !important',
+          },
+        }}
+      ></Box>
+    </>
+  )
+}
diff --git a/src/forms/markdown/helpers/PreviewRenderer.tsx b/src/forms/markdown/helpers/PreviewRenderer.tsx
index a72be2b38..faf689bfd 100644
--- a/src/forms/markdown/helpers/PreviewRenderer.tsx
+++ b/src/forms/markdown/helpers/PreviewRenderer.tsx
@@ -30,11 +30,11 @@ export const PreviewRenderer = ({
 }
 
 export const matchMarkDownSpecialKeysAtLineEnd =
-  /(?<!.*(\|\n|\||>))\n(?!.*(\n\||\||#|\[|>))/g
+  /(?<!.*(\|\n|\||>))\n(?!.*(\*|_|#|-|\[|>|\n\||\||`|[0-9]+(\.|\))))/g
 
 export const FormatWhiteSpaceForMarkDownString = (value: string): string => {
   const adjustForLineChange = value
-    ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '<br>')
+    ? value.replaceAll(matchMarkDownSpecialKeysAtLineEnd, '<br />')
     : ''
 
   return DOMPurify.sanitize(adjustForLineChange, { ADD_TAGS: ['iframe'] })
diff --git a/src/forms/markdown/helpers/StyleProvider.tsx b/src/forms/markdown/helpers/StyleProvider.tsx
index f6c4f1c10..a7522d968 100644
--- a/src/forms/markdown/helpers/StyleProvider.tsx
+++ b/src/forms/markdown/helpers/StyleProvider.tsx
@@ -1,9 +1,10 @@
 import { Box, BoxProps, styled } from '@chakra-ui/react'
 import { ThemeProvider } from '@remirror/react-components'
 import { AllStyledComponent } from '@remirror/styles/emotion'
-import { useMemo } from 'react'
+import { useEffect, useMemo } from 'react'
 import { RemirrorThemeType } from 'remirror'
 
+import { ID } from '../../../constants'
 import { useCustomTheme } from '../../../utils'
 import { tableCellStyles } from './typeMaps'
 
@@ -21,6 +22,11 @@ const Container = styled(Box, {
     '& iframe': {
       minHeight: '28em',
     },
+    '& div.remirror-iframe-custom': {
+      width: '100% !important',
+      height: 'auto !important',
+      marginBottom: '20px',
+    },
     '& a': {
       textDecoration: 'underline',
     },
@@ -57,8 +63,15 @@ export const StyleProvider = ({
     [colors],
   )
 
+  useEffect(() => {
+    twttr.widgets.load(
+      document.getElementById(ID.project.story.markdown.container),
+    )
+  }, [])
+
   return (
     <Container
+      id={ID.project.story.markdown.container}
       sx={
         flex
           ? {
diff --git a/src/forms/markdown/helpers/typeMaps.tsx b/src/forms/markdown/helpers/typeMaps.tsx
index a6efdda89..ab8866229 100644
--- a/src/forms/markdown/helpers/typeMaps.tsx
+++ b/src/forms/markdown/helpers/typeMaps.tsx
@@ -1,5 +1,7 @@
 import {
+  Box,
   Divider,
+  HStack,
   Image,
   ListItem,
   ListProps,
@@ -15,7 +17,6 @@ import {
 import {
   Callout,
   CodeBlock,
-  createIFrameHandler,
   createLinkHandler,
   Doc,
   Heading,
@@ -78,6 +79,61 @@ export const tableHandler = (props: any) => {
   )
 }
 
+export const FrameHandler = (props: any) => {
+  const colorMode = localStorage.getItem('chakra-ui-color-mode')
+
+  const newSrc = `${props.node.attrs.src}`.replace(
+    /theme=dark|theme=light/,
+    `theme=${colorMode || 'light'}`,
+  )
+
+  const splitValues =
+    `${props.node.attrs.style}`
+      .replaceAll(/"|\{|\}/g, '')
+      .replaceAll(',', ';')
+      .split(';') || []
+
+  const newStyle = {} as { [key: string]: string | number }
+
+  splitValues.map((acc: any) => {
+    const [key, value] = acc.split(':')
+    if (key && value) {
+      newStyle[key.trim()] = value.trim()
+    }
+  })
+
+  const isTwitter = newSrc.toLowerCase().includes('twitter')
+
+  return (
+    <HStack w="full" justifyContent="center">
+      <Box
+        w="full"
+        h="full"
+        minHeight={'450px'}
+        maxWidth={isTwitter ? '540px' : '100%'}
+        display="flex"
+        borderRadius="12px"
+        overflowY="auto"
+        position="relative"
+      >
+        <iframe
+          id={newSrc}
+          src={newSrc}
+          height={props.node.attrs.height}
+          width={props.node.attrs.width}
+          style={{
+            ...newStyle,
+            height: '100%',
+            margin: '0px',
+            overflow: 'hidden',
+          }}
+          allowFullScreen
+        />
+      </Box>
+    </HStack>
+  )
+}
+
 export const typeMap = {
   blockquote: 'blockquote',
   bulletList: unorderedListHandler,
@@ -87,7 +143,7 @@ export const typeMap = {
   hardBreak: 'br',
   heading: Heading,
   horizontalRule: Divider,
-  iframe: createIFrameHandler({ style: { width: '100%' } }),
+  iframe: FrameHandler,
   image: imageHandler,
   listItem: listItemHandler,
   paragraph: 'p',
diff --git a/src/forms/markdown/modals/InsertTwitterModal.tsx b/src/forms/markdown/modals/InsertTwitterModal.tsx
new file mode 100644
index 000000000..2657a9fcb
--- /dev/null
+++ b/src/forms/markdown/modals/InsertTwitterModal.tsx
@@ -0,0 +1,64 @@
+import { Button, VStack } from '@chakra-ui/react'
+import { yupResolver } from '@hookform/resolvers/yup'
+import { SubmitHandler, useForm } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
+import * as yup from 'yup'
+
+import { Modal } from '../../../components/layouts/Modal'
+import { useModal, UseModalReturn } from '../../../hooks/useModal'
+import { TextField } from '../../components/TextField'
+import { validateTwitterUrl } from '../../validations/twitter'
+
+const schema = yup.object({
+  url: yup
+    .string()
+    .required('URL is required')
+    .test('twitter', 'Must be a valid twitter URL', validateTwitterUrl),
+})
+
+export interface MarkdownTwitter {
+  url: string
+}
+
+export const useInsertTwitterModal = (
+  onSubmit: SubmitHandler<MarkdownTwitter>,
+) => {
+  return useModal<{ onSubmit: SubmitHandler<MarkdownTwitter> }>(
+    {},
+    { onSubmit },
+  )
+}
+
+export const InsertTwitterModal = ({
+  props: { onSubmit },
+  ...modal
+}: UseModalReturn<{ onSubmit: SubmitHandler<MarkdownTwitter> }>) => {
+  const { t } = useTranslation()
+  const form = useForm<MarkdownTwitter>({
+    resolver: yupResolver(schema),
+  })
+
+  return (
+    <Modal title={t('Insert tweet')} {...modal}>
+      <form
+        onSubmit={(e) => {
+          e.stopPropagation()
+          e.preventDefault()
+          form.handleSubmit(onSubmit)(e)
+        }}
+      >
+        <VStack spacing={4}>
+          <TextField
+            control={form.control}
+            name="url"
+            label="Tweet URL"
+            required
+          />
+          <Button w="100%" variant="primary" type="submit">
+            {t('Insert')}
+          </Button>
+        </VStack>
+      </form>
+    </Modal>
+  )
+}
diff --git a/src/forms/markdown/modals/InsertVideoModal.tsx b/src/forms/markdown/modals/InsertVideoModal.tsx
index a445d7160..064164c38 100644
--- a/src/forms/markdown/modals/InsertVideoModal.tsx
+++ b/src/forms/markdown/modals/InsertVideoModal.tsx
@@ -1,6 +1,7 @@
 import { Button, VStack } from '@chakra-ui/react'
 import { yupResolver } from '@hookform/resolvers/yup'
 import { SubmitHandler, useForm } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import * as yup from 'yup'
 
 import { Modal } from '../../../components/layouts/Modal'
@@ -27,12 +28,14 @@ export const InsertVideoModal = ({
   props: { onSubmit },
   ...modal
 }: UseModalReturn<{ onSubmit: SubmitHandler<MarkdownVideo> }>) => {
+  const { t } = useTranslation()
+
   const form = useForm<MarkdownVideo>({
     resolver: yupResolver(schema),
   })
 
   return (
-    <Modal title="Insert video" {...modal}>
+    <Modal title={t('Insert video')} {...modal}>
       <form
         onSubmit={(e) => {
           e.stopPropagation()
@@ -48,7 +51,7 @@ export const InsertVideoModal = ({
             required
           />
           <Button w="100%" variant="primary" type="submit">
-            Insert
+            {t('Insert')}
           </Button>
         </VStack>
       </form>
diff --git a/src/forms/markdown/toolbar/ToolbarMedia.tsx b/src/forms/markdown/toolbar/ToolbarMedia.tsx
index 145d9fa71..c4404bdcd 100644
--- a/src/forms/markdown/toolbar/ToolbarMedia.tsx
+++ b/src/forms/markdown/toolbar/ToolbarMedia.tsx
@@ -2,6 +2,7 @@ import { ButtonGroup } from '@chakra-ui/react'
 
 import { ImageCommand } from '../commands/ImageCommand'
 import { LinkCommand } from '../commands/LinkCommand'
+import { TweetCommand } from '../commands/TweetCommand'
 import { VideoCommand } from '../commands/VideoCommand'
 
 export const ToolbarMedia = ({ isDisabled }: { isDisabled?: boolean }) => {
@@ -10,6 +11,7 @@ export const ToolbarMedia = ({ isDisabled }: { isDisabled?: boolean }) => {
       <LinkCommand isDisabled={isDisabled} />
       <ImageCommand isDisabled={isDisabled} />
       <VideoCommand isDisabled={isDisabled} />
+      <TweetCommand isDisabled={isDisabled} />
     </ButtonGroup>
   )
 }
diff --git a/src/forms/validations/twitter.ts b/src/forms/validations/twitter.ts
new file mode 100644
index 000000000..eb5130602
--- /dev/null
+++ b/src/forms/validations/twitter.ts
@@ -0,0 +1,12 @@
+export function validateTwitterUrl(url?: string | null) {
+  if (url) {
+    const regExp =
+      /https?:\/\/(?:www\.)?twitter\.com\/[A-Za-z0-9_]+\/status\/\d+/
+
+    const match = url.match(regExp)
+
+    return Boolean(match?.length)
+  }
+
+  return false
+}
diff --git a/src/translations/English.json b/src/translations/English.json
index baedb431a..104ed6f19 100644
--- a/src/translations/English.json
+++ b/src/translations/English.json
@@ -661,5 +661,10 @@
   "Add column left":"Add column left",
   "Add column right":"Add column right",
   "Remove column":"Remove column",
-  "Remove row":"Remove row"
+  "Remove row":"Remove row",
+  "Insert video":"Insert video",
+  "Insert":"Insert",
+  "Must be a valid twitter URL":"Must be a valid twitter URL",
+  "URL is required":"URL is required",
+  "Insert tweet":"Insert tweet"
 }
diff --git a/src/types/types.ts b/src/types/types.ts
index bfa6257ec..53226b809 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -17,3 +17,5 @@ export type FormError<T> = {
 export type MutationInput<T> = {
   input: T
 }
+
+declare let twttr: any

From 2857ac7feb091cc702a95175b7b1b017d47eff65 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Sat, 26 Aug 2023 12:36:33 -0400
Subject: [PATCH 08/12] fix: type issue

---
 src/types/types.ts | 2 --
 src/vite-env.d.ts  | 2 ++
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/types/types.ts b/src/types/types.ts
index 53226b809..bfa6257ec 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -17,5 +17,3 @@ export type FormError<T> = {
 export type MutationInput<T> = {
   input: T
 }
-
-declare let twttr: any
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index 2398943ff..c383eaf55 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -11,3 +11,5 @@ type ImportMetaEnv = {
 type ImportMeta = {
   readonly env: ImportMetaEnv
 }
+
+declare const twttr: any

From b5a82e14b782846024aad06bfe3402df271b5ea8 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Sat, 26 Aug 2023 17:05:32 -0400
Subject: [PATCH 09/12] chore: create menu item as separate component

---
 .../components/TableCellMenuComponent.tsx     | 22 +++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/forms/components/TableCellMenuComponent.tsx b/src/forms/components/TableCellMenuComponent.tsx
index 47fcd767e..a7b350324 100644
--- a/src/forms/components/TableCellMenuComponent.tsx
+++ b/src/forms/components/TableCellMenuComponent.tsx
@@ -15,17 +15,6 @@ export const TableCellMenuComponent = () => {
   const { t } = useTranslation()
   const commands = useCommands()
 
-  const ModifiedMenuItem = (props: MenuItemProps) => {
-    return (
-      <MenuItem
-        paddingX="10px"
-        paddingY="5px"
-        _hover={{ bg: 'neutral.200' }}
-        {...props}
-      />
-    )
-  }
-
   return (
     <Menu>
       <MenuButton
@@ -67,3 +56,14 @@ export const TableCellMenuComponent = () => {
     </Menu>
   )
 }
+
+const ModifiedMenuItem = (props: MenuItemProps) => {
+  return (
+    <MenuItem
+      paddingX="10px"
+      paddingY="5px"
+      _hover={{ bg: 'neutral.200' }}
+      {...props}
+    />
+  )
+}

From 74a7cbfe1742e728173afc154659f39ac47ac19c Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Sat, 26 Aug 2023 17:06:28 -0400
Subject: [PATCH 10/12] fix: use row count and column count constants instead
 of array constant

---
 src/forms/markdown/commands/TableCommand.tsx | 16 +++++++---------
 src/forms/markdown/commands/TweetCommand.tsx |  2 --
 2 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/forms/markdown/commands/TableCommand.tsx b/src/forms/markdown/commands/TableCommand.tsx
index d151ad458..872790095 100644
--- a/src/forms/markdown/commands/TableCommand.tsx
+++ b/src/forms/markdown/commands/TableCommand.tsx
@@ -21,17 +21,15 @@ interface TableCommandProps {
   isDisabled?: boolean
 }
 
-const tableBoxes = [
-  [1, 2, 3, 4, 5],
-  [1, 2, 3, 4, 5],
-  [1, 2, 3, 4, 5],
-  [1, 2, 3, 4, 5],
-  [1, 2, 3, 4, 5],
-]
+const TABLE_ROW_COUNT = 5
+const TABLE_COLUMN_COUNT = 5
+
+const tableBoxes = Array.from({ length: TABLE_ROW_COUNT }, (_, i) =>
+  Array.from({ length: TABLE_COLUMN_COUNT }, (_, j) => `${i + 1}${j + 1}`),
+)
 
 export const TableCommand = ({ isDisabled }: TableCommandProps) => {
   const { isOpen, onOpen, onClose } = useDisclosure()
-
   const commands = useCommands()
 
   const debouncedIsOpen = useDebounce(isOpen, 200)
@@ -77,7 +75,7 @@ export const TableCommand = ({ isDisabled }: TableCommandProps) => {
               <VStack spacing="0px" _hover={{ cursor: 'pointer' }}>
                 {tableBoxes.map((row, i) => (
                   <HStack key={i} spacing="0px">
-                    {row.map((col, j) => (
+                    {row.map((_, j) => (
                       <Box
                         key={j}
                         padding="5px"
diff --git a/src/forms/markdown/commands/TweetCommand.tsx b/src/forms/markdown/commands/TweetCommand.tsx
index f60dd9913..639400284 100644
--- a/src/forms/markdown/commands/TweetCommand.tsx
+++ b/src/forms/markdown/commands/TweetCommand.tsx
@@ -33,8 +33,6 @@ export const TweetCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
       },
     )
 
-    console.log('inner html', value.innerHTML)
-
     commands.insertHtml(value.innerHTML, {})
     commands.insertHardBreak()
 

From 0c4ef54e4668c24ae4e0302ba7542b5c4d0af178 Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Sat, 26 Aug 2023 17:15:20 -0400
Subject: [PATCH 11/12] fix: add error handling around twttr widgets

---
 src/forms/markdown/commands/TweetCommand.tsx | 38 ++++++++++++--------
 src/forms/markdown/helpers/StyleProvider.tsx | 11 ++++--
 src/translations/English.json                |  3 +-
 3 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/src/forms/markdown/commands/TweetCommand.tsx b/src/forms/markdown/commands/TweetCommand.tsx
index 639400284..56d3e87a0 100644
--- a/src/forms/markdown/commands/TweetCommand.tsx
+++ b/src/forms/markdown/commands/TweetCommand.tsx
@@ -2,7 +2,7 @@ import { Box } from '@chakra-ui/react'
 import { useCommands } from '@remirror/react'
 import { BsTwitter } from 'react-icons/bs'
 
-import { useDarkMode } from '../../../utils'
+import { useDarkMode, useNotification } from '../../../utils'
 import {
   InsertTwitterModal,
   MarkdownTwitter,
@@ -13,9 +13,9 @@ import { ToolbarCommandButton } from './ToolbarCommandButton'
 export const TweetCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
   const commands = useCommands()
   const isDarkMode = useDarkMode()
+  const { toast } = useNotification()
 
   const modal = useInsertTwitterModal(async ({ url }: MarkdownTwitter) => {
-    if (!commands.addYouTubeVideo) return
     commands.insertHardBreak()
 
     const UrlSplit = url.split('/').filter((val) => val && val !== '/')
@@ -24,21 +24,29 @@ export const TweetCommand = ({ isDisabled }: { isDisabled?: boolean }) => {
 
     if (!tweetId) return
 
-    const value = await twttr.widgets.createTweet(
-      tweetId,
-      document.getElementById('tweet-container'),
-      {
-        width: '350px',
-        theme: isDarkMode ? 'dark' : 'light',
-      },
-    )
+    try {
+      const value = await twttr.widgets.createTweet(
+        tweetId,
+        document.getElementById('tweet-container'),
+        {
+          width: '350px',
+          theme: isDarkMode ? 'dark' : 'light',
+        },
+      )
 
-    commands.insertHtml(value.innerHTML, {})
-    commands.insertHardBreak()
+      commands.insertHtml(value.innerHTML, {})
+      commands.insertHardBreak()
 
-    const element = document.getElementById('tweet-container')
-    if (element) {
-      element.innerHTML = ''
+      const element = document.getElementById('tweet-container')
+      if (element) {
+        element.innerHTML = ''
+      }
+    } catch {
+      toast({
+        status: 'error',
+        title: 'Failed to insert tweet',
+        description: 'Please try again',
+      })
     }
 
     modal.onClose()
diff --git a/src/forms/markdown/helpers/StyleProvider.tsx b/src/forms/markdown/helpers/StyleProvider.tsx
index a7522d968..843e3768a 100644
--- a/src/forms/markdown/helpers/StyleProvider.tsx
+++ b/src/forms/markdown/helpers/StyleProvider.tsx
@@ -1,6 +1,7 @@
 import { Box, BoxProps, styled } from '@chakra-ui/react'
 import { ThemeProvider } from '@remirror/react-components'
 import { AllStyledComponent } from '@remirror/styles/emotion'
+import { captureException } from '@sentry/react'
 import { useEffect, useMemo } from 'react'
 import { RemirrorThemeType } from 'remirror'
 
@@ -64,9 +65,13 @@ export const StyleProvider = ({
   )
 
   useEffect(() => {
-    twttr.widgets.load(
-      document.getElementById(ID.project.story.markdown.container),
-    )
+    twttr.widgets
+      .load(document.getElementById(ID.project.story.markdown.container))
+      .catch((e: any) =>
+        captureException(e, {
+          tags: { area: 'twitter-widgets' },
+        }),
+      )
   }, [])
 
   return (
diff --git a/src/translations/English.json b/src/translations/English.json
index 104ed6f19..7fee2cae8 100644
--- a/src/translations/English.json
+++ b/src/translations/English.json
@@ -666,5 +666,6 @@
   "Insert":"Insert",
   "Must be a valid twitter URL":"Must be a valid twitter URL",
   "URL is required":"URL is required",
-  "Insert tweet":"Insert tweet"
+  "Insert tweet":"Insert tweet",
+  "Failed to insert tweet":"Failed to insert tweet"
 }

From 569f1c221c1a00b2122f4f3768d9a08bee108a2e Mon Sep 17 00:00:00 2001
From: sajald77 <sazzaldulal@gmail.com>
Date: Sun, 27 Aug 2023 18:03:07 -0400
Subject: [PATCH 12/12] fix: remove unhandled rejection error from bitcoin api

---
 src/api/bitcoin.ts | 36 ++++++++++++++++++++++--------------
 1 file changed, 22 insertions(+), 14 deletions(-)

diff --git a/src/api/bitcoin.ts b/src/api/bitcoin.ts
index 9ac2d1b61..f434172f7 100644
--- a/src/api/bitcoin.ts
+++ b/src/api/bitcoin.ts
@@ -1,16 +1,15 @@
-import { AxiosResponse } from 'axios'
-import axios from 'axios'
-
+const USD_QUOTE_KEY = 'usdQuote'
+const BACKUP_QUOTE = 26088
 const quoteSources = [
   {
-    name: 'bitstamp',
-    url: 'https://www.bitstamp.net/api/v2/ticker/btcusd/',
-    lastPrice: (response: AxiosResponse) => Number(response.data.last),
+    name: 'blockchain.info',
+    url: 'https://blockchain.info/ticker',
+    lastPrice: (response: any) => Number(response.USD.last),
   },
   {
-    name: 'bitfinex',
-    url: 'https://api-pub.bitfinex.com/v2/ticker/tBTCUSD',
-    lastPrice: (response: AxiosResponse) => Number(response.data[6]),
+    name: 'bitstamp',
+    url: 'https://www.bitstamp.net/api/v2/ticker/btcusd/',
+    lastPrice: (response: any) => Number(response.data.last),
   },
 ]
 
@@ -18,16 +17,25 @@ const getUsdQuote = async (): Promise<number> => {
   const requests = quoteSources.map(
     ({ url, lastPrice }) =>
       new Promise((resolve, reject) => {
-        axios
-          .get(url)
-          .then((response: AxiosResponse) => resolve(lastPrice(response)))
+        fetch(url)
+          .then((response: Response) => response.json())
+          .then((response: any) => resolve(lastPrice(response)))
           .catch((error: Error) => reject(error))
       }),
   )
 
-  const usdQuote = (await Promise.any(requests)) as number
+  let usdQuote = Number(await Promise.any(requests))
+
+  if (!usdQuote) {
+    usdQuote = Number(localStorage.getItem(USD_QUOTE_KEY)) || 0
+  }
+
+  if (!usdQuote) {
+    alert('Failed to fetch bitcoin rates')
+    usdQuote = BACKUP_QUOTE
+  }
 
-  if (!usdQuote) throw new Error('Could not get bitcoin/usd quote')
+  localStorage.setItem(USD_QUOTE_KEY, String(usdQuote))
 
   return usdQuote
 }