[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>
This commit is contained in:
Devin Binnie
2025-02-18 10:58:28 -05:00
committed by GitHub
parent 34963cbaa8
commit 4d754efdd7
44 changed files with 1854 additions and 927 deletions

View File

@@ -10,36 +10,32 @@ import DestructiveConfirmationModal from './DestructiveConfirmModal';
type Props = {
show: boolean;
serverName: string;
onHide: () => void;
onAccept: React.MouseEventHandler<HTMLButtonElement>;
onCancel: React.MouseEventHandler<HTMLButtonElement>;
onAccept: () => void;
onCancel: () => void;
};
function RemoveServerModal(props: Props) {
const intl = useIntl();
const {serverName, ...rest} = props;
const {...rest} = props;
return (
<DestructiveConfirmationModal
{...rest}
id='removeServerModal'
title={intl.formatMessage({id: 'renderer.components.removeServerModal.title', defaultMessage: 'Remove Server'})}
acceptLabel={intl.formatMessage({id: 'label.remove', defaultMessage: 'Remove'})}
cancelLabel={intl.formatMessage({id: 'label.cancel', defaultMessage: 'Cancel'})}
body={(
<Modal.Body>
<p>
<FormattedMessage
id='renderer.components.removeServerModal.body'
defaultMessage='This will remove the server from your Desktop App but will not delete any of its data - you can add the server back to the app at any time.'
/>
</p>
<p>
<FormattedMessage
id='renderer.components.removeServerModal.confirm'
defaultMessage='Confirm you wish to remove the {serverName} server?'
values={{serverName}}
/>
</p>
<FormattedMessage
id='renderer.components.removeServerModal.body'
defaultMessage='This will remove the server from your Desktop App but will not delete any of its data - you can add the server back at any time.'
/>
<br/><br/>
<FormattedMessage
id='renderer.components.removeServerModal.confirm'
defaultMessage='Are you sure you wish to remove the server?'
/>
</Modal.Body>
)}
/>