<commit_before><div fxLayoutAlign="center">
  <mat-card>

    <h3 translate>TITLE_REGISTRATION</h3>

    <div class="form-container" id="registration-form">

      <div class="error" ng-if="error">{{ error }}</div>

      <mat-form-field appearance="outline">
        <mat-label translate>LABEL_EMAIL</mat-label>
        <input [formControl]="emailControl" type="text" matInput>
        <mat-error *ngIf="emailControl.invalid && emailControl.errors.required" translate>MANDATORY_EMAIL</mat-error>
        <mat-error *ngIf="emailControl.invalid && emailControl.errors.email" translate>INVALID_EMAIL</mat-error>
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label translate>LABEL_PASSWORD</mat-label>
        <input [formControl]="passwordControl" type="password" matInput>
        <mat-error *ngIf="passwordControl.invalid && passwordControl.errors.required" translate>MANDATORY_PASSWORD</mat-error>
        <mat-error
          *ngIf="passwordControl.invalid && (passwordControl.errors.minlength || passwordControl.errors.maxlength)" translate [translateParams]="{length: '5-20'}">INVALID_PASSWORD_LENGTH</mat-error>
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label translate>LABEL_PASSWORD_REPEAT</mat-label>
        <input [formControl]="repeatPasswordControl" type="password" matInput>
        <mat-error *ngIf="repeatPasswordControl.invalid && repeatPasswordControl.errors.required" translate>MANDATORY_PASSWORD_REPEAT</mat-error>
      </mat-form-field>

      <div class="security-container">

        <mat-form-field>
          <mat-label>{{'LABEL_SECURITY_QUESTION' | translate}}
            <i style="margin-left:10px;" class="fas fa-exclamation-circle"></i>
            <em style="margin-left:5px;" translate>CANNOT_BE_CHANGED_LATER</em>
          </mat-label>
          <mat-select [formControl]="securityQuestionControl" placeholder="" [(value)]="selected"
                      name="securityQuestion">
            <mat-option *ngFor="let question of securityQuestions" [value]="question.id">
              {{question.question}}
            </mat-option>
          </mat-select>
          <mat-error *ngIf="securityQuestionControl.invalid && securityQuestionControl.errors.required" translate>MANDATORY_SECURITY_QUESTION</mat-error>
        </mat-form-field>

        <mat-form-field appearance="outline">
          <input [formControl]="securityAnswerControl" type="text" matInput [placeholder]="'SECURITY_ANSWER_PLACEHOLDER' | translate">
          <mat-error *ngIf="securityAnswerControl.invalid && securityAnswerControl.errors.required" translate>MANDATORY_SECURITY_ANSWER</mat-error>
        </mat-form-field>
      </div>
    </div>

    <button type="submit"
            id="registerButton"
            mat-raised-button color="primary"
            style="margin-top:1px;"
            [disabled]="emailControl.invalid || passwordControl.invalid || repeatPasswordControl.invalid || securityQuestionControl.invalid || securityAnswerControl.invalid"
            (click)="save()">
      <i class="fas fa-user-plus fa-lg"></i>
      {{'BTN_REGISTER' | translate}}
    </button>

  </mat-card>
</div>
<commit_msg>Clear error message when focusing any form element<commit_after><div fxLayoutAlign="center">
  <mat-card>

    <h3 translate>TITLE_REGISTRATION</h3>

    <div class="form-container" id="registration-form">

      <div class="error" ng-if="error">{{ error }}</div>

      <mat-form-field appearance="outline">
        <mat-label translate>LABEL_EMAIL</mat-label>
        <input [formControl]="emailControl" (focus)="this.error=null" type="text" matInput>
        <mat-error *ngIf="emailControl.invalid && emailControl.errors.required" translate>MANDATORY_EMAIL</mat-error>
        <mat-error *ngIf="emailControl.invalid && emailControl.errors.email" translate>INVALID_EMAIL</mat-error>
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label translate>LABEL_PASSWORD</mat-label>
        <input [formControl]="passwordControl" (focus)="this.error=null" type="password" matInput>
        <mat-error *ngIf="passwordControl.invalid && passwordControl.errors.required" translate>MANDATORY_PASSWORD</mat-error>
        <mat-error
          *ngIf="passwordControl.invalid && (passwordControl.errors.minlength || passwordControl.errors.maxlength)" translate [translateParams]="{length: '5-20'}">INVALID_PASSWORD_LENGTH</mat-error>
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label translate>LABEL_PASSWORD_REPEAT</mat-label>
        <input [formControl]="repeatPasswordControl" (focus)="this.error=null" type="password" matInput>
        <mat-error *ngIf="repeatPasswordControl.invalid && repeatPasswordControl.errors.required" translate>MANDATORY_PASSWORD_REPEAT</mat-error>
      </mat-form-field>

      <div class="security-container">

        <mat-form-field>
          <mat-label>{{'LABEL_SECURITY_QUESTION' | translate}}
            <i style="margin-left:10px;" class="fas fa-exclamation-circle"></i>
            <em style="margin-left:5px;" translate>CANNOT_BE_CHANGED_LATER</em>
          </mat-label>
          <mat-select [formControl]="securityQuestionControl" placeholder="" [(value)]="selected"
                      (focus)="this.error=null" name="securityQuestion">
            <mat-option *ngFor="let question of securityQuestions" [value]="question.id">
              {{question.question}}
            </mat-option>
          </mat-select>
          <mat-error *ngIf="securityQuestionControl.invalid && securityQuestionControl.errors.required" translate>MANDATORY_SECURITY_QUESTION</mat-error>
        </mat-form-field>

        <mat-form-field appearance="outline">
          <input [formControl]="securityAnswerControl" (focus)="this.error=null" type="text" matInput [placeholder]="'SECURITY_ANSWER_PLACEHOLDER' | translate">
          <mat-error *ngIf="securityAnswerControl.invalid && securityAnswerControl.errors.required" translate>MANDATORY_SECURITY_ANSWER</mat-error>
        </mat-form-field>
      </div>
    </div>

    <button type="submit"
            id="registerButton"
            mat-raised-button color="primary"
            style="margin-top:1px;"
            [disabled]="emailControl.invalid || passwordControl.invalid || repeatPasswordControl.invalid || securityQuestionControl.invalid || securityAnswerControl.invalid"
            (click)="save()">
      <i class="fas fa-user-plus fa-lg"></i>
      {{'BTN_REGISTER' | translate}}
    </button>

  </mat-card>
</div>

{'fraction_non_alphanumeric': 0.1480748744483336, 'fraction_numerical': 0.0027393090853751333, 'mean_word_length': 3.5575589459084607, 'pattern_counts': {'":': 0, '<': 123, '<?xml version=': 0, '>': 123, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4251012', 'n_tokens_mistral': 1980, 'n_tokens_neox': 1929, 'n_words': 274}