From 647cefee3d91b136ac5247bd3a96a2ca9f1bc375 Mon Sep 17 00:00:00 2001
From: shikelong <578622705@qq.com>
Date: Sat, 13 Nov 2021 20:00:01 +0800
Subject: [PATCH] =?UTF-8?q?feat(setting):=20=E4=B8=8A=E4=BC=A0=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E6=97=B6=E6=8C=89=E4=B8=8B=E5=9B=9E=E8=BD=A6=E5=BF=AB?=
 =?UTF-8?q?=E9=80=9F=E6=8F=90=E4=BA=A4=E5=9B=BE=E7=89=87=20issue=20#10?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/modals/AvatarCropper.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/web/src/components/modals/AvatarCropper.tsx b/web/src/components/modals/AvatarCropper.tsx
index ed4a712d..3943479a 100644
--- a/web/src/components/modals/AvatarCropper.tsx
+++ b/web/src/components/modals/AvatarCropper.tsx
@@ -2,9 +2,11 @@ import Cropper from 'react-easy-crop';
 import type { Area } from 'react-easy-crop/types';
 import _isNil from 'lodash/isNil';
 import { showToasts, t } from 'tailchat-shared';
-import React, { useRef, useState } from 'react';
+import React, { useState } from 'react';
 import { Button } from 'antd';
 import { ModalWrapper } from '../Modal';
+import { useGlobalKeyDown } from '@/hooks/useGlobalKeyDown';
+import { isEnterHotkey } from '@/utils/hot-key';
 
 const createImage = (url: string): Promise<HTMLImageElement> =>
   new Promise((resolve, reject) => {
@@ -105,6 +107,12 @@ export const ModalAvatarCropper: React.FC<{
   const [zoom, setZoom] = useState(1);
   const [area, setArea] = useState<Area>({ width: 0, height: 0, x: 0, y: 0 });
 
+  useGlobalKeyDown((e) => {
+    if (isEnterHotkey(e)) {
+      handleConfirm();
+    }
+  });
+
   const handleConfirm = async () => {
     const blobUrl = await getCroppedImg(
       await createImage(props.imageUrl),