diff --git a/src-web/components/core/HotKeyList.tsx b/src-web/components/core/HotKeyList.tsx
index 4e099489..1bb163ba 100644
--- a/src-web/components/core/HotKeyList.tsx
+++ b/src-web/components/core/HotKeyList.tsx
@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React from 'react';
+import React, { Fragment } from 'react';
 import type { HotkeyAction } from '../../hooks/useHotKey';
 import { HotKey } from './HotKey';
 import { HotKeyLabel } from './HotKeyLabel';
@@ -15,10 +15,10 @@ export const HotKeyList = ({ hotkeys, bottomSlot, className }: Props) => {
     <div className={classNames(className, 'h-full flex items-center justify-center')}>
       <div className="px-4 grid gap-2 grid-cols-[auto_auto]">
         {hotkeys.map((hotkey) => (
-          <>
+          <Fragment key={hotkey}>
             <HotKeyLabel className="truncate" action={hotkey} />
             <HotKey className="ml-4" action={hotkey} />
-          </>
+          </Fragment>
         ))}
         {bottomSlot}
       </div>