AI: address review on PR #475

frontend/src/components/TagSearch.tsx

@@ -3,7 +3,7 @@
 import { useEffect, useRef, useState } from 'react'
 import { useLocation } from 'react-router-dom'
 
-import { useLocale, useLocaleNavigate } from '@/lib/useLocale'
+import { useLocale, useLocaleNavigate, useVerticalPreview } from '@/lib/useLocale'
 import { useUITranslation } from '@/lib/useUITranslation'
 import { apiGet } from '@/lib/api'
 import { inputClass } from '@/lib/utils'
@@ -18,6 +18,7 @@ import type { Tag } from '@/types'
 const TagSearch: FC = () => {
   const { message } = useUITranslation ('shared')
   const locale = useLocale ()
+  const verticalPreview = useVerticalPreview ()
   const location = useLocation ()
   const navigate = useLocaleNavigate ()
   const compositionFlgRef = useRef (false)
@@ -105,13 +106,13 @@ const TagSearch: FC = () => {
 
     switch (ev.key)
     {
-    case 'ArrowDown':
+    case verticalPreview ? 'ArrowRight' : 'ArrowDown':
       ev.preventDefault ()
       setActiveIndex (i => Math.min (i + 1, suggestions.length - 1))
       setSuggestionsVsbl (true)
       break
 
-    case 'ArrowUp':
+    case verticalPreview ? 'ArrowLeft' : 'ArrowUp':
       ev.preventDefault ()
       setActiveIndex (i => Math.max (i - 1, -1))
       setSuggestionsVsbl (true)

frontend/src/components/TagSearchBox.tsx

@@ -15,7 +15,7 @@ const TagSearchBox: FC<Props> = ({ suggestions, activeIndex, onSelect }) => {
     return
 
   return (
-      <ul className="absolute left-0 right-0 z-50 w-full
+      <ul className="tag-search-suggestions absolute left-0 right-0 z-50 w-full
 		     bg-gray-100 dark:bg-gray-800 border dark:border-gray-600
 		     rounded shadow">
 	{suggestions.map ((tag, i) => (