Repository: hashicorp/vault
File: ui/app/components/auth/form/base.ts (TypeScript)

Code before:
 * @param {object} cluster - The cluster model which contains information such as cluster id, name and boolean for if the cluster is in standby
 * @param {function} onError - callback if there is a login error
 * @param {function} onSuccess - calls onAuthResponse in auth/page redirects if successful
 */

interface Args {
  authType: string;
  cluster: ClusterModel;
  onError: CallableFunction;
  onSuccess: CallableFunction;
}

export default class AuthBase extends Component<Args> {
  @service declare readonly auth: AuthService;

  @action
  onSubmit(event: HTMLElementEvent<HTMLFormElement>) {
    event.preventDefault();
    const formData = new FormData(event.target as HTMLFormElement);
    const data: Record<string, FormDataEntryValue | null> = {};

    for (const key of formData.keys()) {
      const value = formData.get(key);
      // strip leading or trailing slashes from path for consistency
      data[key] = key === 'path' ? sanitizePath(value) : value;
    }

    // If path is not included in the submitted form data,
    // set it as the auth type which is the default path Vault expects.
    // The "token" auth method does not support custom login paths.
    if (this.args.authType !== 'token' && !Object.keys(data).includes('path')) {
      data['path'] = this.args.authType;
    }

    this.login.unlinked().perform(data);
  }

  login = task(
    waitFor(async (data) => {
      try {
        const authResponse = await this.auth.authenticate({
          clusterId: this.args.cluster.id,
          backend: this.args.authType,
          data,
          selectedAuth: this.args.authType,
        });

        // responsible for redirect after auth data is persisted
        this.onSuccess(authResponse);
      } catch (error) {
        this.onError(error as Error);

Review comment (security):
this may end up moving once the component is wired up and [auth logic](https://github.com/hashicorp/vault/blob/349e449d49fef4fcc836d29b84ec7c1336bdb9ca/ui/app/adapters/cluster.js#L178-L196) is removed from the clusterAdapter 

for now, serialization is happening here for consistency so it's not sprinkled all over the place like it is now 🥲 

Code after:
 * @param {string} authType - chosen login method type
 * @param {object} cluster - The cluster model which contains information such as cluster id, name and boolean for if the cluster is in standby
 * @param {function} onError - callback if there is a login error
 * @param {function} onSuccess - calls onAuthResponse in auth/page redirects if successful
 */

interface Args {
  authType: string;
  cluster: ClusterModel;
  onError: CallableFunction;
  onSuccess: CallableFunction;
}

export default class AuthBase extends Component<Args> {
  @service declare readonly auth: AuthService;

  @action
  onSubmit(event: HTMLElementEvent<HTMLFormElement>) {
    event.preventDefault();
    const formData = new FormData(event.target as HTMLFormElement);
    const data: Record<string, FormDataEntryValue | null> = {};

    for (const key of formData.keys()) {
      const value = formData.get(key);
      // strip leading or trailing slashes from path for consistency
      data[key] = key === 'path' ? sanitizePath(value) : value;
    }

    // If path is not included in the submitted form data,
    // set it as the auth type which is the default path Vault expects.
    // The "token" auth method does not support custom login paths.
    if (this.args.authType !== 'token' && !Object.keys(data).includes('path')) {
      data['path'] = this.args.authType;
    }

    this.login.unlinked().perform(data);
  }

  login = task(
    waitFor(async (formData) => {
      try {
        const authResponse = await this.auth.authenticate({
          clusterId: this.args.cluster.id,
          backend: this.args.authType,
          data: formData,
          selectedAuth: this.args.authType,
        });

        this.handleAuthResponse(authResponse);
      } catch (error) {
        this.onError(error as Error);