[MM-61716][MM-62643] Introduce Modal component, remove bootstrap and react-bootstrap from most modals, update styles (#3317)

* Introduce Modal, add some styles from the webapp

* Remove bootstrap from LoadingScreen/WelcomeScreen

* Migrate add/edit server modal to Modal, remove bootstrap

* Migrate remove server modal to Modal, remove bootstrap

* Migrate certificate modal to Modal, remove bootstrap

* Migrate login and permission modals to Modal, remove Bootstrap

* Misc fixes

* E2E tests for current modals

* Update src/renderer/components/Modal.tsx

Co-authored-by: Daniel Espino García <larkox@gmail.com>

* Update src/renderer/components/Modal.tsx

Co-authored-by: Daniel Espino García <larkox@gmail.com>

* PR feedback

---------

Co-authored-by: Daniel Espino García <larkox@gmail.com>
Co-authored-by: Mattermost Build <build@mattermost.com>

src/renderer/components/DestructiveConfirmModal.tsx

@@ -3,20 +3,23 @@
 // See LICENSE.txt for license information.
 
 import React from 'react';
-import {Button, Modal} from 'react-bootstrap';
+
+import {Modal} from './Modal';
 
 type Props = {
+    id: string;
     title: string;
     body: React.ReactNode;
     acceptLabel: string;
     cancelLabel: string;
     onHide: () => void;
-    onAccept: React.MouseEventHandler<HTMLButtonElement>;
-    onCancel: React.MouseEventHandler<HTMLButtonElement>;
+    onAccept: () => void;
+    onCancel: () => void;
 };
 
 export default function DestructiveConfirmationModal(props: Props) {
     const {
+        id,
         title,
         body,
         acceptLabel,
@@ -27,23 +30,18 @@ export default function DestructiveConfirmationModal(props: Props) {
         ...rest} = props;
     return (
         <Modal
-            onHide={onHide}
+            id={id}
+            onExited={onHide}
+            isDeleteModal={true}
+            modalHeaderText={title}
+            handleCancel={onCancel}
+            handleConfirm={onAccept}
+            confirmButtonText={acceptLabel}
+            cancelButtonText={cancelLabel}
+            confirmButtonClassName='btn-danger'
             {...rest}
         >
-            <Modal.Header closeButton={true}>
-                <Modal.Title>{title}</Modal.Title>
-            </Modal.Header>
             {body}
-            <Modal.Footer>
-                <Button
-                    variant='link'
-                    onClick={onCancel}
-                >{cancelLabel}</Button>
-                <Button
-                    variant='danger'
-                    onClick={onAccept}
-                >{acceptLabel}</Button>
-            </Modal.Footer>
         </Modal>
     );
 }