Fix registering keyboard shortcuts

After refactoring shortcuts from native event to react events, we need to wrap
the editor into <ShortcutProvider>
Related PR WordPress/gutenberg#34539
[MAILPOET-4029]

Author: costasovo

mailpoet/assets/js/src/form_editor/components/editor.jsx

@@ -15,6 +15,7 @@ import {
   WritingFlow,
   ObserveTyping,
 } from '@wordpress/block-editor';
+import { ShortcutProvider } from '@wordpress/keyboard-shortcuts';
 import classnames from 'classnames';
 import fetchLinkSuggestions from '../utils/link_suggestions';
 import Header from './header.jsx';
@@ -93,59 +94,61 @@ export default () => {
   return (
     <>
       <CustomFontsStyleSheetLink />
-      <SlotFillProvider>
-        <div className={layoutClass}>
-          <div className="interface-interface-skeleton__editor">
-            <div className="interface-interface-skeleton__header">
-              <Header
-                isInserterOpened={isInserterOpened}
-                setIsInserterOpened={toggleInserter}
-              />
-            </div>
-            <div className="interface-interface-skeleton__body">
-              <BlockEditorProvider
-                value={formBlocks}
-                onInput={blocksChangedInBlockEditor}
-                onChange={blocksChangedInBlockEditor}
-                settings={editorSettings}
-                useSubRegistry={false}
-              >
-                {(isInserterOpened) && (
-                  <div className="interface-interface-skeleton__secondary-sidebar">
-                    <Inserter setIsInserterOpened={toggleInserter} />
-                  </div>
-                )}
-                <div className="interface-interface-skeleton__content">
-                  <BlockTools />
-                  <Notices />
-                  <UnsavedChangesNotice />
-                  <BlockSelectionClearer className="edit-post-visual-editor editor-styles-wrapper">
-                    <BlockEditorKeyboardShortcuts />
-                    <BlockEditorKeyboardShortcuts.Register />
-                    <div className="mailpoet_form">
-                      <WritingFlow>
-                        <ObserveTyping>
-                          <FormStylingBackground>
-                            <BlockList />
-                          </FormStylingBackground>
-                        </ObserveTyping>
-                      </WritingFlow>
+      <ShortcutProvider>
+        <SlotFillProvider>
+          <div className={layoutClass}>
+            <div className="interface-interface-skeleton__editor">
+              <div className="interface-interface-skeleton__header">
+                <Header
+                  isInserterOpened={isInserterOpened}
+                  setIsInserterOpened={toggleInserter}
+                />
+              </div>
+              <div className="interface-interface-skeleton__body">
+                <BlockEditorProvider
+                  value={formBlocks}
+                  onInput={blocksChangedInBlockEditor}
+                  onChange={blocksChangedInBlockEditor}
+                  settings={editorSettings}
+                  useSubRegistry={false}
+                >
+                  {(isInserterOpened) && (
+                    <div className="interface-interface-skeleton__secondary-sidebar">
+                      <Inserter setIsInserterOpened={toggleInserter} />
                     </div>
-                  </BlockSelectionClearer>
-                </div>
-                {(sidebarOpened) && (
-                  <div className="interface-interface-skeleton__sidebar">
-                    <Sidebar />
+                  )}
+                  <div className="interface-interface-skeleton__content">
+                    <BlockTools />
+                    <Notices />
+                    <UnsavedChangesNotice />
+                    <BlockSelectionClearer className="edit-post-visual-editor editor-styles-wrapper">
+                      <BlockEditorKeyboardShortcuts />
+                      <BlockEditorKeyboardShortcuts.Register />
+                      <div className="mailpoet_form">
+                        <WritingFlow>
+                          <ObserveTyping>
+                            <FormStylingBackground>
+                              <BlockList />
+                            </FormStylingBackground>
+                          </ObserveTyping>
+                        </WritingFlow>
+                      </div>
+                    </BlockSelectionClearer>
                   </div>
-                )}
-              </BlockEditorProvider>
+                  {(sidebarOpened) && (
+                    <div className="interface-interface-skeleton__sidebar">
+                      <Sidebar />
+                    </div>
+                  )}
+                </BlockEditorProvider>
+              </div>
+              <FormStyles />
+              <Fullscreen />
             </div>
-            <FormStyles />
-            <Fullscreen />
+            <Popover.Slot />
           </div>
-          <Popover.Slot />
-        </div>
-      </SlotFillProvider>
+        </SlotFillProvider>
+      </ShortcutProvider>
       <Preview />
       <Tutorial />
     </>