replace bootstrap modal with the one from ui framework (#2148)

superdesk · Dec 5, 2024 · e0cfeee · e0cfeee
1 parent 685e86f
commit e0cfeee
Showing 1 changed file with 17 additions and 26 deletions.
diff --git a/client/components/AddToPlanningModal/index.tsx b/client/components/AddToPlanningModal/index.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import {connect} from 'react-redux';
 
-import {Modal} from '../index';
+import {Modal} from 'superdesk-ui-framework/react';
 import {Button} from '../UI';
 import {AddToPlanningApp} from '../../apps';
 
@@ -55,39 +55,30 @@ export class AddToPlanningComponent extends React.Component {
 
         return (
             <Modal
-                show={true}
-                onHide={handleHide}
-                fill={true}
-            >
-                <Modal.Header>
+                visible={true}
+                onHide={actionInProgress ? null : handleCancel}
+                size="x-large"
+                contentPadding="none"
+                headerTemplate={(
                     <h3 className="modal__heading">
                         {gettext('Select an existing Planning Item or create a new one')}
                     </h3>
-                    {actionInProgress ? null : (
-                        <a className="icn-btn" onClick={handleCancel}>
-                            <i className="icon-close-small" />
-                        </a>
-                    )}
-                </Modal.Header>
-
-                <Modal.Body noPadding fullHeight noScroll>
-                    <div className="planning-app__modal AddToPlanning">
-                        <AddToPlanningApp
-                            addNewsItemToPlanning={newsItem}
-                            popupContainer={() => this.dom.popupContainer}
-                            onCancel={handleCancel}
-                        />
-                    </div>
-                </Modal.Body>
-
-                <Modal.Footer>
+                )}
+                footerTemplate={(
                     <Button
                         text={gettext('Ignore')}
                         disabled={actionInProgress}
                         onClick={handleCancel}
                     />
-                </Modal.Footer>
-                <div ref={(node) => this.dom.popupContainer = node} />
+                )}
+            >
+                <div className="planning-app__modal AddToPlanning">
+                    <AddToPlanningApp
+                        addNewsItemToPlanning={newsItem}
+                        popupContainer={() => this.dom.popupContainer}
+                        onCancel={handleCancel}
+                    />
+                </div>
             </Modal>
         );
     }