From ca3f229306ee808b4bb4382dd16da1c954513fc8 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Wed, 22 Jun 2022 11:15:39 +0400
Subject: [PATCH] Format Library: Add keyboard shortcut for inline code
 (#41816)

* Format Library: Add keyboard shortcut for inline code
* Update KeyboardShortcuts help modal
* Update snapshots
---
 .../keyboard-shortcut-help-modal/config.js    |  4 +++
 .../test/__snapshots__/index.js.snap          |  7 +++++
 .../keyboard-shortcut-help-modal/config.js    |  4 +++
 .../keyboard-shortcut-help-modal/config.js    |  4 +++
 packages/format-library/src/code/index.js     | 26 +++++++++++++------
 5 files changed, 37 insertions(+), 8 deletions(-)

diff --git a/packages/edit-post/src/components/keyboard-shortcut-help-modal/config.js b/packages/edit-post/src/components/keyboard-shortcut-help-modal/config.js
index b6a7ff314e956..83d548d465c72 100644
--- a/packages/edit-post/src/components/keyboard-shortcut-help-modal/config.js
+++ b/packages/edit-post/src/components/keyboard-shortcut-help-modal/config.js
@@ -28,4 +28,8 @@ export const textFormattingShortcuts = [
 		keyCombination: { modifier: 'primary', character: 'u' },
 		description: __( 'Underline the selected text.' ),
 	},
+	{
+		keyCombination: { modifier: 'access', character: 'x' },
+		description: __( 'Make the selected text inline code.' ),
+	},
 ];
diff --git a/packages/edit-post/src/components/keyboard-shortcut-help-modal/test/__snapshots__/index.js.snap b/packages/edit-post/src/components/keyboard-shortcut-help-modal/test/__snapshots__/index.js.snap
index 0dbdb2d790209..001689e7ea403 100644
--- a/packages/edit-post/src/components/keyboard-shortcut-help-modal/test/__snapshots__/index.js.snap
+++ b/packages/edit-post/src/components/keyboard-shortcut-help-modal/test/__snapshots__/index.js.snap
@@ -82,6 +82,13 @@ exports[`KeyboardShortcutHelpModal should match snapshot when the modal is activ
             "modifier": "primary",
           },
         },
+        Object {
+          "description": "Make the selected text inline code.",
+          "keyCombination": Object {
+            "character": "x",
+            "modifier": "access",
+          },
+        },
       ]
     }
     title="Text formatting"
diff --git a/packages/edit-site/src/components/keyboard-shortcut-help-modal/config.js b/packages/edit-site/src/components/keyboard-shortcut-help-modal/config.js
index 7b420cabfebb2..1e14ccf444dee 100644
--- a/packages/edit-site/src/components/keyboard-shortcut-help-modal/config.js
+++ b/packages/edit-site/src/components/keyboard-shortcut-help-modal/config.js
@@ -24,4 +24,8 @@ export const textFormattingShortcuts = [
 		keyCombination: { modifier: 'primary', character: 'u' },
 		description: __( 'Underline the selected text.' ),
 	},
+	{
+		keyCombination: { modifier: 'access', character: 'x' },
+		description: __( 'Make the selected text inline code.' ),
+	},
 ];
diff --git a/packages/edit-widgets/src/components/keyboard-shortcut-help-modal/config.js b/packages/edit-widgets/src/components/keyboard-shortcut-help-modal/config.js
index 7b420cabfebb2..1e14ccf444dee 100644
--- a/packages/edit-widgets/src/components/keyboard-shortcut-help-modal/config.js
+++ b/packages/edit-widgets/src/components/keyboard-shortcut-help-modal/config.js
@@ -24,4 +24,8 @@ export const textFormattingShortcuts = [
 		keyCombination: { modifier: 'primary', character: 'u' },
 		description: __( 'Underline the selected text.' ),
 	},
+	{
+		keyCombination: { modifier: 'access', character: 'x' },
+		description: __( 'Make the selected text inline code.' ),
+	},
 ];
diff --git a/packages/format-library/src/code/index.js b/packages/format-library/src/code/index.js
index a3ecd3374988e..f3651504d57ce 100644
--- a/packages/format-library/src/code/index.js
+++ b/packages/format-library/src/code/index.js
@@ -3,7 +3,10 @@
  */
 import { __ } from '@wordpress/i18n';
 import { toggleFormat, remove, applyFormat } from '@wordpress/rich-text';
-import { RichTextToolbarButton } from '@wordpress/block-editor';
+import {
+	RichTextToolbarButton,
+	RichTextShortcut,
+} from '@wordpress/block-editor';
 import { code as codeIcon } from '@wordpress/icons';
 
 const name = 'core/code';
@@ -51,13 +54,20 @@ export const code = {
 		}
 
 		return (
-			<RichTextToolbarButton
-				icon={ codeIcon }
-				title={ title }
-				onClick={ onClick }
-				isActive={ isActive }
-				role="menuitemcheckbox"
-			/>
+			<>
+				<RichTextShortcut
+					type="access"
+					character="x"
+					onUse={ onClick }
+				/>
+				<RichTextToolbarButton
+					icon={ codeIcon }
+					title={ title }
+					onClick={ onClick }
+					isActive={ isActive }
+					role="menuitemcheckbox"
+				/>
+			</>
 		);
 	},
 };