From 2d0f8e3846b4c2bfdc4a5ac02cea0f3458e7d975 Mon Sep 17 00:00:00 2001
From: crazywoola <427733928@qq.com>
Date: Tue, 10 Dec 2024 10:41:47 +0800
Subject: [PATCH] fix: lint

---
 .../base/file-uploader/audio-preview.tsx           |  7 +++----
 .../components/base/file-uploader/pdf-preview.tsx  | 10 ++++------
 .../base/file-uploader/video-preview.tsx           |  6 ++----
 .../base/image-uploader/image-preview.tsx          | 14 ++++++--------
 web/hooks/use-keyboard-short.ts                    |  8 --------
 5 files changed, 15 insertions(+), 30 deletions(-)
 delete mode 100644 web/hooks/use-keyboard-short.ts

diff --git a/web/app/components/base/file-uploader/audio-preview.tsx b/web/app/components/base/file-uploader/audio-preview.tsx
index 78e48fe3c70d35..9a1ed440e25f08 100644
--- a/web/app/components/base/file-uploader/audio-preview.tsx
+++ b/web/app/components/base/file-uploader/audio-preview.tsx
@@ -2,7 +2,8 @@ import type { FC } from 'react'
 import { createPortal } from 'react-dom'
 import { RiCloseLine } from '@remixicon/react'
 import React from 'react'
-import { useKeyboardShortcuts } from '@/hooks/use-keyboard-short'
+
+import { useHotkeys } from 'react-hotkeys-hook'
 
 type AudioPreviewProps = {
   url: string
@@ -14,9 +15,7 @@ const AudioPreview: FC<AudioPreviewProps> = ({
   title,
   onCancel,
 }) => {
-  useKeyboardShortcuts({
-    esc: onCancel,
-  })
+  useHotkeys('esc', onCancel)
 
   return createPortal(
     <div
diff --git a/web/app/components/base/file-uploader/pdf-preview.tsx b/web/app/components/base/file-uploader/pdf-preview.tsx
index 661ff76c0e6586..2893e2a809251c 100644
--- a/web/app/components/base/file-uploader/pdf-preview.tsx
+++ b/web/app/components/base/file-uploader/pdf-preview.tsx
@@ -5,9 +5,9 @@ import { PdfHighlighter, PdfLoader } from 'react-pdf-highlighter'
 import { t } from 'i18next'
 import { RiCloseLine, RiZoomInLine, RiZoomOutLine } from '@remixicon/react'
 import React, { useState } from 'react'
+import { useHotkeys } from 'react-hotkeys-hook'
 import Loading from '@/app/components/base/loading'
 import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
-import { useKeyboardShortcuts } from '@/hooks/use-keyboard-short'
 import Tooltip from '@/app/components/base/tooltip'
 
 type PdfPreviewProps = {
@@ -41,11 +41,9 @@ const PdfPreview: FC<PdfPreviewProps> = ({
     })
   }
 
-  useKeyboardShortcuts({
-    esc: onCancel,
-    up: zoomIn,
-    down: zoomOut,
-  })
+  useHotkeys('esc', onCancel)
+  useHotkeys('up', zoomIn)
+  useHotkeys('down', zoomOut)
 
   return createPortal(
     <div
diff --git a/web/app/components/base/file-uploader/video-preview.tsx b/web/app/components/base/file-uploader/video-preview.tsx
index badb37071a8bcd..0378f37ddf8070 100644
--- a/web/app/components/base/file-uploader/video-preview.tsx
+++ b/web/app/components/base/file-uploader/video-preview.tsx
@@ -2,7 +2,7 @@ import type { FC } from 'react'
 import { createPortal } from 'react-dom'
 import { RiCloseLine } from '@remixicon/react'
 import React from 'react'
-import { useKeyboardShortcuts } from '@/hooks/use-keyboard-short'
+import { useHotkeys } from 'react-hotkeys-hook'
 
 type VideoPreviewProps = {
   url: string
@@ -14,9 +14,7 @@ const VideoPreview: FC<VideoPreviewProps> = ({
   title,
   onCancel,
 }) => {
-  useKeyboardShortcuts({
-    esc: onCancel,
-  })
+  useHotkeys('esc', onCancel)
 
   return createPortal(
     <div
diff --git a/web/app/components/base/image-uploader/image-preview.tsx b/web/app/components/base/image-uploader/image-preview.tsx
index e92d39770950d8..748e6ba8daa088 100644
--- a/web/app/components/base/image-uploader/image-preview.tsx
+++ b/web/app/components/base/image-uploader/image-preview.tsx
@@ -3,9 +3,9 @@ import React, { useCallback, useEffect, useRef, useState } from 'react'
 import { t } from 'i18next'
 import { createPortal } from 'react-dom'
 import { RiAddBoxLine, RiCloseLine, RiDownloadCloud2Line, RiFileCopyLine, RiZoomInLine, RiZoomOutLine } from '@remixicon/react'
+import { useHotkeys } from 'react-hotkeys-hook'
 import Tooltip from '@/app/components/base/tooltip'
 import Toast from '@/app/components/base/toast'
-import { useKeyboardShortcuts } from '@/hooks/use-keyboard-short'
 
 type ImagePreviewProps = {
   url: string
@@ -193,13 +193,11 @@ const ImagePreview: FC<ImagePreviewProps> = ({
     }
   }, [handleMouseUp])
 
-  useKeyboardShortcuts({
-    esc: onCancel,
-    up: zoomIn,
-    down: zoomOut,
-    left: onPrev || (() => {}),
-    right: onNext || (() => {}),
-  })
+  useHotkeys('esc', onCancel)
+  useHotkeys('up', zoomIn)
+  useHotkeys('down', zoomOut)
+  useHotkeys('left', onPrev || (() => {}))
+  useHotkeys('right', onNext || (() => {}))
 
   return createPortal(
     <div className='fixed inset-0 p-8 flex items-center justify-center bg-black/80 z-[1000] image-preview-container'
diff --git a/web/hooks/use-keyboard-short.ts b/web/hooks/use-keyboard-short.ts
deleted file mode 100644
index 7bcff3bb86661a..00000000000000
--- a/web/hooks/use-keyboard-short.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { useHotkeys } from 'react-hotkeys-hook'
-
-export function useKeyboardShortcuts(shortcuts: { [x: string]: any }) {
-  Object.keys(shortcuts).forEach((key) => {
-    const action = shortcuts[key]
-    useHotkeys(key, action)
-  })
-}