diff --git a/ui/admin/app/components/form/authenticate/index.hbs b/ui/admin/app/components/form/authenticate/index.hbs
new file mode 100644
index 000000000..e7ca752c2
--- /dev/null
+++ b/ui/admin/app/components/form/authenticate/index.hbs
@@ -0,0 +1,7 @@
+{{#if @model.type}}
+  {{component (concat "form/authenticate/" @model.type)
+    submit=@submit
+    cancel=false
+    disabled=@disabled
+  }}
+{{/if}}
diff --git a/ui/admin/app/components/form/authenticate/password/index.hbs b/ui/admin/app/components/form/authenticate/password/index.hbs
new file mode 100644
index 000000000..ee47910d8
--- /dev/null
+++ b/ui/admin/app/components/form/authenticate/password/index.hbs
@@ -0,0 +1,28 @@
+<Rose::Form
+  class="full-width"
+  @onSubmit={{fn this.submit @submit (hash
+    identification=this.identification
+    password=this.password
+  )}}
+  @cancel={{false}}
+  @disabled={{@disabled}}
+  as |form|
+>
+
+  <form.input
+    @name="identification"
+    @type="text"
+    @value={{this.identification}}
+    @label={{t "form.login_name.label"}} />
+
+  <form.input
+    @name="password"
+    @type="password"
+    @value={{this.password}}
+    @label={{t "form.password.label"}} />
+
+  <form.actions
+    @submitText={{t "actions.authenticate"}}
+    @showCancel={{false}} />
+
+</Rose::Form>
diff --git a/ui/admin/app/components/form/authenticate/password/index.js b/ui/admin/app/components/form/authenticate/password/index.js
new file mode 100644
index 000000000..d6336f382
--- /dev/null
+++ b/ui/admin/app/components/form/authenticate/password/index.js
@@ -0,0 +1,37 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { run } from '@ember/runloop';
+
+export default class FormAuthenticatePasswordComponent extends Component {
+  // =properties
+
+  /**
+   * New password property
+   * @type {string}
+   */
+  @tracked password;
+
+  // =methods
+
+  /**
+   * Unsets the password field.
+   */
+  resetPassword() {
+    this.password = null;
+  }
+
+  // =actions
+
+  /**
+   * Submit credentials, but reset the password first in case of failure.
+   * Callback with no arguments otherwise.
+   * @param {function} fn
+   * @param {object} creds
+   */
+  @action
+  submit(fn, creds) {
+    run(() => this.resetPassword());
+    run(() => fn(creds));
+  }
+}
diff --git a/ui/admin/app/routes/scopes/scope/authenticate/method.js b/ui/admin/app/routes/scopes/scope/authenticate/method.js
index 1caa35d95..cfb2c5acf 100644
--- a/ui/admin/app/routes/scopes/scope/authenticate/method.js
+++ b/ui/admin/app/routes/scopes/scope/authenticate/method.js
@@ -23,16 +23,6 @@ export default class ScopesScopeAuthenticateMethodRoute extends Route {
     return this.store.findRecord('auth-method', id, adapterOptions);
   }
 
-  /**
-   * Resets the password field on the controller so it is not
-   * inadvertantly retained in memory.
-   */
-  resetCredentials() {
-    this.controller.setProperties({
-      password: null,
-    });
-  }
-
   // =actions
 
   /**
@@ -43,7 +33,6 @@ export default class ScopesScopeAuthenticateMethodRoute extends Route {
   @loading
   @notifyError(() => 'errors.authentication-failed.title', { catch: true })
   async authenticate(creds) {
-    this.resetCredentials();
     const scope = this.modelFor('scopes.scope');
     const authMethod = this.modelFor('scopes.scope.authenticate.method');
     const authenticatorName = `authenticator:${authMethod.type}`;
diff --git a/ui/admin/app/templates/scopes/scope/authenticate/method.hbs b/ui/admin/app/templates/scopes/scope/authenticate/method.hbs
index 709c1f491..6428c8118 100644
--- a/ui/admin/app/templates/scopes/scope/authenticate/method.hbs
+++ b/ui/admin/app/templates/scopes/scope/authenticate/method.hbs
@@ -1,28 +1,5 @@
-<Rose::Form
-  class="full-width"
-  @onSubmit={{route-action "authenticate" (hash
-    identification=this.identification
-    password=this.password
-  )}}
-  @cancel={{false}}
+<Form::Authenticate
+  @model={{@model}}
+  @submit={{route-action "authenticate"}}
   @disabled={{is-loading}}
-  as |form|
->
-
-  <form.input
-    @name="identification"
-    @type="text"
-    @value={{this.identification}}
-    @label={{t "form.login_name.label"}} />
-
-  <form.input
-    @name="password"
-    @type="password"
-    @value={{this.password}}
-    @label={{t "form.password.label"}} />
-
-  <form.actions
-    @submitText={{t "actions.authenticate"}}
-    @showCancel={{false}} />
-
-</Rose::Form>
+/>