refactor: improve Esc handling in forms

apps/client/src/features/app-settings/panel/feature-settings-panel/custom-fields/CustomFieldForm.tsx

@@ -7,6 +7,7 @@ import { customFieldLabelToKey, isAlphanumericWithSpace } from 'ontime-utils';
 import { maybeAxiosError } from '../../../../../common/api/utils';
 import SwatchSelect from '../../../../../common/components/input/colour-input/SwatchSelect';
 import useCustomFields from '../../../../../common/hooks-query/useCustomFields';
+import { preventEscape } from '../../../../../common/utils/keyEvent';
 import * as Panel from '../../../panel-utils/PanelUtils';
 
 import style from '../FeatureSettings.module.scss';
@@ -71,7 +72,11 @@ export default function CustomFieldForm(props: CustomFieldsFormProps) {
   const isEditMode = initialKey !== undefined;
 
   return (
-    <form onSubmit={handleSubmit(setupSubmit)} className={style.fieldForm}>
+    <form
+      onSubmit={handleSubmit(setupSubmit)}
+      className={style.fieldForm}
+      onKeyDown={(event) => preventEscape(event, onCancel)}
+    >
       <div className={style.twoCols}>
         <div>
           <Panel.Description>Label (only alphanumeric characters are allowed)</Panel.Description>