From 43fe49cd0ccfc41316a7acf58574a9f77e8eed3e Mon Sep 17 00:00:00 2001
From: David Oliver <david@doliver.co.uk>
Date: Thu, 6 Jun 2024 18:32:53 +0200
Subject: [PATCH] Consolidate Apple OS detection (#1915)

There were previously two functions that checked for Apple OS.

Converts previous OS module to Styling and modernises the function in Helpers.
---
 assets/js/entry/html.js         | 4 ++--
 assets/js/helpers.js            | 6 +++---
 assets/js/keyboard-shortcuts.js | 4 ++--
 assets/js/os.js                 | 6 ------
 assets/js/search-bar.js         | 8 ++++----
 assets/js/styling.js            | 6 ++++++
 6 files changed, 17 insertions(+), 17 deletions(-)
 delete mode 100644 assets/js/os.js
 create mode 100644 assets/js/styling.js

diff --git a/assets/js/entry/html.js b/assets/js/entry/html.js
index c6557dd9f..0a7ecee00 100644
--- a/assets/js/entry/html.js
+++ b/assets/js/entry/html.js
@@ -17,7 +17,7 @@ import { initialize as initTooltips } from '../tooltips/tooltips'
 import { initialize as initHintsPage } from '../tooltips/hint-page'
 import { initialize as initCopyButton } from '../copy-button'
 import { initialize as initSettings } from '../settings'
-import { initialize as initOs } from '../os'
+import { initialize as initStyling } from '../styling'
 import { initialize as initTabsets } from '../tabsets'
 import { initialize as initPreview} from '../preview'
 
@@ -31,7 +31,7 @@ onDocumentReady(() => {
   initTooltips()
   initHintsPage()
   initCopyButton()
-  initOs()
+  initStyling()
   initTabsets()
 
   if (isPreview) {
diff --git a/assets/js/helpers.js b/assets/js/helpers.js
index cc1304935..e6fd08258 100644
--- a/assets/js/helpers.js
+++ b/assets/js/helpers.js
@@ -213,10 +213,10 @@ export function getProjectNameAndVersion () {
 }
 
 /**
- * Return `true` if the client's OS is MacOS.
+ * Return `true` if the client's OS is Apple.
  *
  * @return {Boolean}
  */
-export function isMacOS () {
-  return /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)
+export function isAppleOS () {
+  return /(Macintosh|iPhone|iPad|iPod)/.test(window.navigator.userAgent)
 }
diff --git a/assets/js/keyboard-shortcuts.js b/assets/js/keyboard-shortcuts.js
index 561e225f0..797d94b88 100644
--- a/assets/js/keyboard-shortcuts.js
+++ b/assets/js/keyboard-shortcuts.js
@@ -1,4 +1,4 @@
-import { isMacOS, qs } from './helpers'
+import { isAppleOS, qs } from './helpers'
 import { toggleSidebar } from './sidebar/sidebar-drawer'
 import { focusSearchInput } from './search-bar'
 import { cycleTheme } from './theme'
@@ -72,7 +72,7 @@ function handleKeyDown (event) {
 
   const matchingShortcut = keyboardShortcuts.find(shortcut => {
     if (shortcut.hasModifier) {
-      if (isMacOS() && event.metaKey) { return shortcut.key === event.key }
+      if (isAppleOS() && event.metaKey) { return shortcut.key === event.key }
       if (event.ctrlKey) { return shortcut.key === event.key }
 
       return false
diff --git a/assets/js/os.js b/assets/js/os.js
deleted file mode 100644
index ed7df2cc1..000000000
--- a/assets/js/os.js
+++ /dev/null
@@ -1,6 +0,0 @@
-export function initialize () {
-  const appleDeviceExpr = /(Macintosh|iPhone|iPad|iPod)/
-
-  const osClass = appleDeviceExpr.test(window.navigator.userAgent) ? 'apple-os' : 'non-apple-os'
-  document.documentElement.classList.add(osClass)
-}
diff --git a/assets/js/search-bar.js b/assets/js/search-bar.js
index 7f02d894e..ab9ba3d73 100644
--- a/assets/js/search-bar.js
+++ b/assets/js/search-bar.js
@@ -10,7 +10,7 @@ import {
   AUTOCOMPLETE_CONTAINER_SELECTOR,
   AUTOCOMPLETE_SUGGESTION_LIST_SELECTOR
 } from './autocomplete/autocomplete-list'
-import { isMacOS, qs } from './helpers'
+import { isAppleOS, qs } from './helpers'
 
 const SEARCH_INPUT_SELECTOR = 'form.search-bar input'
 const SEARCH_CLOSE_BUTTON_SELECTOR = 'form.search-bar .search-close-button'
@@ -67,17 +67,17 @@ function addEventListeners () {
   }
 
   searchInput.addEventListener('keydown', event => {
-    const macOS = isMacOS()
+    const appleOS = isAppleOS()
 
     if (event.key === 'Escape') {
       clearSearch()
       searchInput.blur()
     } else if (event.key === 'Enter') {
       handleAutocompleteFormSubmission(event)
-    } else if (event.key === 'ArrowUp' || (macOS && event.ctrlKey && event.key === 'p')) {
+    } else if (event.key === 'ArrowUp' || (appleOS && event.ctrlKey && event.key === 'p')) {
       moveAutocompleteSelection(-1)
       event.preventDefault()
-    } else if (event.key === 'ArrowDown' || (macOS && event.ctrlKey && event.key === 'n')) {
+    } else if (event.key === 'ArrowDown' || (appleOS && event.ctrlKey && event.key === 'n')) {
       moveAutocompleteSelection(1)
       event.preventDefault()
     } else if (event.key === 'Tab') {
diff --git a/assets/js/styling.js b/assets/js/styling.js
new file mode 100644
index 000000000..75a7dfff7
--- /dev/null
+++ b/assets/js/styling.js
@@ -0,0 +1,6 @@
+import { isAppleOS } from './helpers'
+
+export function initialize () {
+  const osClass = isAppleOS() ? 'apple-os' : 'non-apple-os'
+  document.documentElement.classList.add(osClass)
+}