diff --git a/packages/rocketchat-theme/client/imports/forms/button.css b/packages/rocketchat-theme/client/imports/forms/button.css
index 2f95263ceba..011bf1ef104 100644
--- a/packages/rocketchat-theme/client/imports/forms/button.css
+++ b/packages/rocketchat-theme/client/imports/forms/button.css
@@ -26,6 +26,10 @@
 		background: inherit;
 	}
 
+	&--invisible {
+		visibility: hidden;
+	}
+
 	&--primary {
 		color: var(--button-primary-text-color);
 		border: 0;
diff --git a/packages/rocketchat-ui/client/views/app/modal.html b/packages/rocketchat-ui/client/views/app/modal.html
index 93dac2c1083..8c6b18a2e33 100644
--- a/packages/rocketchat-ui/client/views/app/modal.html
+++ b/packages/rocketchat-ui/client/views/app/modal.html
@@ -39,9 +39,7 @@
 					{{/if}}
 				</main>
 				<div class="rc-modal__footer">
-					{{#if showCancelButton}}
-						<input class="rc-button rc-button--nude js-close" type="submit" data-button="cancel" value="{{cancelButtonText}}">
-					{{/if}}
+					<input class="rc-button rc-button--nude js-close {{#unless showCancelButton}}rc-button--invisible{{/unless}}" type="submit" data-button="cancel" value="{{cancelButtonText}}">
 					<input style="background-color:{{confirmButtonColor}}" class="rc-button rc-button--primary js-confirm" type="submit" data-button="create" value="{{confirmButtonText}}">
 				</div>
 			{{/if}}
diff --git a/packages/rocketchat-ui/client/views/app/modal.js b/packages/rocketchat-ui/client/views/app/modal.js
index 41fea8a9d1b..745db4dc901 100644
--- a/packages/rocketchat-ui/client/views/app/modal.js
+++ b/packages/rocketchat-ui/client/views/app/modal.js
@@ -34,7 +34,12 @@ this.modal = {
 		}
 	},
 	confirm(value) {
-		this.fn(value);
+		if (this.fn) {
+			this.fn(value);
+		} else {
+			this.close();
+		}
+
 		this.config.closeOnConfirm && this.close();
 	},
 	showInputError(text) {