update plugin deletion error message (#7503)

frontend/src/MarketplacePage/InstalledPlugins.jsx

@@ -109,15 +109,29 @@ const InstalledPluginCard = ({ plugin, marketplacePlugin, fetchPlugins, isDevMod
     toast.success(`${capitalizeFirstLetter(name)} reloaded`);
   };
 
+  const pluginDeleteMessage = (
+    <>
+      Deleting <strong>{capitalizeFirstLetter(name)}</strong> plugin will result in the permanent removal of all
+      associated datasources and its dataqueries. This action cannot be undone. Are you sure you wish to proceed with
+      the deletion?
+    </>
+  );
+
   return (
     <>
       <ConfirmDialog
+        title={'Delete plugin'}
         show={isDeleteModalVisible}
-        message={'Are you sure you want to delete ' + capitalizeFirstLetter(name) + '?'}
+        message={pluginDeleteMessage}
+        confirmButtonText={'Delete'}
         confirmButtonLoading={isDeletingPlugin}
         onConfirm={executePluginDeletion}
         onCancel={cancelDeletePlugin}
         darkMode={darkMode}
+        footerStyle={{
+          borderTop: '1px solid var(--slate5)',
+          padding: '0.875rem 1.5rem',
+        }}
       />
       <div key={plugin.id} className="col-sm-6 col-lg-4">
         <div className="plugins-card">

frontend/src/_components/ConfirmDialog.jsx

@@ -17,6 +17,7 @@ export function ConfirmDialog({
   cancelButtonText = 'Cancel',
   backdropClassName,
   onCloseIconClick,
+  footerStyle,
 }) {
   darkMode = darkMode ?? (localStorage.getItem('darkMode') === 'true' || false);
   const [showModal, setShow] = useState(show);
@@ -73,7 +74,7 @@ export function ConfirmDialog({
       <Modal.Body className="confirm-dialogue-body" data-cy="modal-message">
         {message}
       </Modal.Body>
-      <Modal.Footer className="mt-3">
+      <Modal.Footer className="mt-3" style={footerStyle}>
         <ButtonSolid variant={cancelButtonType} onClick={handleClose} data-cy="cancel-button">
           {cancelButtonText ?? t('globals.cancel', 'Cancel')}
         </ButtonSolid>