feat: Рефакторинг модальных окон с заменой на простой подход со встроенным backdrop для улучшения UX. Обновление компонентов CommandPalette, ConfirmDialog, ConfirmDiffModal, ConfirmModal, FormModal, ImportModal, SettingsModal и WsUpdateModal для повышения удобства использования и унификации интерфейса.

frontend/src/components/FormModal.jsx

@@ -1,8 +1,6 @@
-import Modal from './Modal';
-
 /**
  * FormModal - модальное окно с формой
- * Автоматически обрабатывает submit и отображает кнопки действий
+ * Простой подход со встроенным backdrop (как в HistoryModal)
  */
 function FormModal({ 
   show, 
@@ -17,8 +15,11 @@ function FormModal({
   loading = false,
   submitVariant = 'primary',
   disabled = false,
-  ...modalProps 
+  size = 'md',
+  centered = false
 }) {
+  if (!show) return null;
+
   const handleSubmit = (e) => {
     e.preventDefault();
     onSubmit?.(e);
@@ -29,44 +30,62 @@ function FormModal({
     if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') {
       handleSubmit(e);
     }
+    // ESC для закрытия
+    if (e.key === 'Escape') {
+      onClose?.();
+    }
   };
 
   return (
-    <Modal
-      show={show}
-      onClose={onClose}
-      title={title}
-      footer={
-        <>
-          <button 
-            type="button" 
-            className="btn btn-secondary" 
-            onClick={onClose}
-            disabled={loading}
-          >
-            {CancelIcon && <CancelIcon className="icon me-2" />}
-            {cancelLabel}
-          </button>
-          <button 
-            type="submit" 
-            className={`btn btn-${submitVariant}`}
-            onClick={handleSubmit}
-            disabled={loading || disabled}
-          >
-            {loading && <span className="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true" />}
-            {!loading && SubmitIcon && <SubmitIcon className="icon me-2" />}
-            {submitLabel}
-          </button>
-        </>
-      }
-      {...modalProps}
+    <div 
+      className="modal show d-block" 
+      role="dialog" 
+      aria-modal="true"
+      style={{ backgroundColor: 'rgba(0,0,0,0.5)' }}
+      onKeyDown={handleKeyDown}
     >
-      <form onSubmit={handleSubmit} onKeyDown={handleKeyDown}>
-        {children}
-      </form>
-    </Modal>
+      <div 
+        className={`modal-dialog${size !== 'md' ? ` modal-${size}` : ''}${centered ? ' modal-dialog-centered' : ''}`}
+        role="document"
+      >
+        <div className="modal-content" tabIndex={-1}>
+          <form onSubmit={handleSubmit}>
+            <div className="modal-header">
+              <h5 className="modal-title">{title}</h5>
+              <button type="button" className="btn-close" onClick={onClose} />
+            </div>
+            
+            <div className="modal-body">
+              {children}
+            </div>
+            
+            <div className="modal-footer">
+              <button 
+                type="button" 
+                className="btn btn-secondary" 
+                onClick={onClose}
+                disabled={loading}
+              >
+                {CancelIcon && <CancelIcon className="me-2" size={16} />}
+                {cancelLabel}
+              </button>
+              <button 
+                type="submit" 
+                className={`btn btn-${submitVariant}`}
+                disabled={loading || disabled}
+              >
+                {loading && (
+                  <span className="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true" />
+                )}
+                {!loading && SubmitIcon && <SubmitIcon className="me-2" size={16} />}
+                {submitLabel}
+              </button>
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
   );
 }
 
 export default FormModal;
-