Use proper modifier key in markdown text input on macOS (#1995)

* add os detect util, use meta key on macos

* pr feedback

diff --git a/src/shared/components/common/markdown-textarea.tsx b/src/shared/components/common/markdown-textarea.tsx
index 7d6117c2c00cde47c7cc4ccff045dd79e2c5c320..c6b42d737124c5e71ef87055aa6ba3fc733e95cb 100644 (file)
--- a/src/shared/components/common/markdown-textarea.tsx
+++ b/src/shared/components/common/markdown-textarea.tsx
@@ -1,4 +1,4 @@
-import { isBrowser } from "@utils/browser";
+import { isBrowser, platform } from "@utils/browser";
 import { numToSI, randomStr } from "@utils/helpers";
 import autosize from "autosize";
 import classNames from "classnames";
@@ -21,7 +21,6 @@ import { EmojiPicker } from "./emoji-picker";
 import { Icon, Spinner } from "./icon";
 import { LanguageSelect } from "./language-select";
 import ProgressBar from "./progress-bar";
-
 interface MarkdownTextAreaProps {
   /**
    * Initial content inside the textarea
@@ -477,7 +476,7 @@ export class MarkdownTextArea extends Component<
   // Keybind handler
   // Keybinds inspired by github comment area
   handleKeyBinds(i: MarkdownTextArea, event: KeyboardEvent) {
-    if (event.ctrlKey || event.metaKey) {
+    if (platform.isMac() ? event.metaKey : event.ctrlKey) {
       switch (event.key) {
         case "k": {
           i.handleInsertLink(i, event);

diff --git a/src/shared/utils/browser/index.ts b/src/shared/utils/browser/index.ts
index 321a4c9f46b7ee18637f855e349f77c76234f8a8..41701207ed5b5912043df9ef5dff900621142e0e 100644 (file)
--- a/src/shared/utils/browser/index.ts
+++ b/src/shared/utils/browser/index.ts
@@ -4,6 +4,7 @@ import dataBsTheme from "./data-bs-theme";
 import isBrowser from "./is-browser";
 import isDark from "./is-dark";
 import loadCss from "./load-css";
+import platform from "./platform";
 import restoreScrollPosition from "./restore-scroll-position";
 import saveScrollPosition from "./save-scroll-position";
 import setAuthCookie from "./set-auth-cookie";
@@ -16,6 +17,7 @@ export {
   isBrowser,
   isDark,
   loadCss,
+  platform,
   restoreScrollPosition,
   saveScrollPosition,
   setAuthCookie,

diff --git a/src/shared/utils/browser/platform.ts b/src/shared/utils/browser/platform.ts
new file mode 100644 (file)
index 0000000..9564d3f
--- /dev/null
+++ b/src/shared/utils/browser/platform.ts
@@ -0,0 +1,13 @@
+import { isBrowser } from "@utils/browser";
+
+const platformString = () =>
+  navigator.platform?.match(/mac|win|linux/i)?.[0].toLowerCase();
+const getPlatformPredicate = (platform: string) => () =>
+  isBrowser() && platformString() === platform;
+const isWin = getPlatformPredicate("win");
+const isMac = getPlatformPredicate("mac");
+const isLinux = getPlatformPredicate("linux");
+
+const platform = { isWin, isMac, isLinux };
+
+export default platform;