Fix potential SSR issue

sveltia · Aug 12, 2023 · 34e1bba · 34e1bba
1 parent 1f0937c
commit 34e1bba
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/src/lib/components/global/global-toolbar/items/quick-search-bar.svelte b/src/lib/components/global/global-toolbar/items/quick-search-bar.svelte
@@ -1,5 +1,6 @@
 <script>
   import { SearchBar } from '@sveltia/ui';
+  import { onMount } from 'svelte';
   import { _ } from 'svelte-i18n';
   import { selectedCollection } from '$lib/services/contents';
   import { goBack, goto, parseLocation } from '$lib/services/navigation';
@@ -24,7 +25,6 @@
     }
   };
 
-  const focusShortcut = isMac ? 'Meta+F' : 'Ctrl+F';
   /**
    * @type {HTMLElement}
    */
@@ -33,13 +33,22 @@
    * @type {import('svelte').SvelteComponent}
    */
   let searchBar = undefined;
+  /**
+   * Keyboard shortcut to focus on the search bar. This has to be redefined within `onMount` because
+   * {@link isMac} requires `navigator` that doesn’t exist during SSR.
+   */
+  let focusShortcut = 'Ctrl+F';
 
   $: {
     // Restore search terms when the page is reloaded
     if (searchBar && $searchTerms !== searchBar?.value) {
       searchBar.value = $searchTerms;
     }
   }
+
+  onMount(() => {
+    focusShortcut = isMac() ? 'Meta+F' : 'Ctrl+F';
+  });
 </script>
 
 <svelte:window

diff --git a/src/lib/services/utils/events.js b/src/lib/services/utils/events.js
@@ -1,7 +1,8 @@
 /**
  * Check if the user agent is macOS.
+ * @returns {boolean} Result.
  */
-export const isMac =
+export const isMac = () =>
   /** @type {any} */ (navigator).userAgentData?.platform === 'macOS' ||
   navigator.platform.startsWith('Mac');