diff --git a/src/web/app/components/question-submission-form/question-submission-form.component.html b/src/web/app/components/question-submission-form/question-submission-form.component.html
index c31c3eec43e..66fd3283571 100644
--- a/src/web/app/components/question-submission-form/question-submission-form.component.html
+++ b/src/web/app/components/question-submission-form/question-submission-form.component.html
@@ -69,7 +69,7 @@ <h2 class="question-details"><b>Question {{ model.questionNumber }}: </b>{{ mode
               <div id="recipient-name-qn-{{ model.questionNumber }}-idx-{{ i }}" *ngIf="formMode === QuestionSubmissionFormMode.FIXED_RECIPIENT">
                 <b>{{ getRecipientName(recipientSubmissionFormModel.recipientIdentifier) }} </b> <span>({{ model.recipientType | recipientTypeName:model.giverType }})</span>
               </div>
-              <div class="row evaluee-select align-items-center" *ngIf="formMode === QuestionSubmissionFormMode.FLEXIBLE_RECIPIENT">                
+              <div class="row evaluee-select align-items-center" *ngIf="formMode === QuestionSubmissionFormMode.FLEXIBLE_RECIPIENT">
                 <input type="text"
                         id="recipient-input-qn-{{ model.questionNumber }}-idx-{{ i }}"
                         class="form-control fw-bold col"
@@ -92,7 +92,6 @@ <h2 class="question-details"><b>Question {{ model.questionNumber }}: </b>{{ mode
                   {{ getSelectionOptionLabel(recipient) }}
                 </div>
               </div>
-
             </div>
             <div class="margin-top-20px" [ngClass]="isMCQDropDownEnabled ? 'col-12' : 'col'">
               <tm-contribution-question-edit-answer-form *ngIf="model.questionType === FeedbackQuestionType.CONTRIB" [questionDetails]="model.questionDetails"
diff --git a/src/web/app/components/question-submission-form/question-submission-form.component.spec.ts b/src/web/app/components/question-submission-form/question-submission-form.component.spec.ts
index e527d471ae5..c91b66809db 100644
--- a/src/web/app/components/question-submission-form/question-submission-form.component.spec.ts
+++ b/src/web/app/components/question-submission-form/question-submission-form.component.spec.ts
@@ -1158,26 +1158,7 @@ describe('QuestionSubmissionFormComponent', () => {
     expect(component.isSavedForRecipient('recipientId')).toBeTruthy();
   });
 
-  it('filterRecipients: should filter recipient list in the dropdown list and update dropdown visibility', ()=>{
-
-    const value = 'alice';
-    const index = 0;
-
-    component.model.recipientList = [
-      { recipientIdentifier: '0', recipientName: 'Alice Betsy' },
-      { recipientIdentifier: '1', recipientName: 'Benny Charles' }
-    ];
-
-    component.getSelectionOptionLabel = (recipient: any) => recipient.recipientName;
-    component.filterRecipients(value, index);
-    
-    expect(component.filteredRecipients[index].length).toBe(1);
-    expect(component.filteredRecipients[index][0].recipientName).toBe('Alice Betsy');
-
-    expect(component.dropdownVisible[index]).toBe(true);
-  })
-
-  it('filterRecipients: should filter recipient list in the dropdown list and update dropdown visibility', ()=>{
+  it('filterRecipients: should filter recipient list in the dropdown list and update dropdown visibility', () => {
 
       const value = 'alex';
       const index = 0;
@@ -1188,38 +1169,35 @@ describe('QuestionSubmissionFormComponent', () => {
         { recipientIdentifier: '2', recipientName: 'Group 2 | Tutorial 13 | Alex Kim' },
         { recipientIdentifier: '3', recipientName: 'Lecture #1 @ Room A | Jason Doe' },
         { recipientIdentifier: '4', recipientName: 'Lab Session *10* | Annie K. & John L.' },
-        { recipientIdentifier: '5', recipientName: 'Group 3: Research Team | Dr. Alex Smith' }
+        { recipientIdentifier: '5', recipientName: 'Group 3: Research Team | Dr. Alex Smith' },
       ];
 
       component.getSelectionOptionLabel = (recipient: any) => recipient.recipientName;
       component.filterRecipients(value, index);
 
-      // Testing for the filtered recipients based on 'alex'
       expect(component.filteredRecipients[index].length).toBe(2);
       expect(component.filteredRecipients[index][0].recipientName).toBe('Group 2 | Tutorial 13 | Alex Kim');
       expect(component.filteredRecipients[index][1].recipientName).toBe('Group 3: Research Team | Dr. Alex Smith');
 
-      // Dropdown should be visible for the filtered results
       expect(component.dropdownVisible[index]).toBe(true);
   });
-  
-  it('filterRecipients: should filter recipient list and resuld should be empty and dropdown should not be visible', ()=>{
+
+  it('filterRecipients: should filter the list with no results, hiding the dropdown', () => {
 
     const value = 'alice';
     const index = 0;
 
     component.model.recipientList = [
       { recipientIdentifier: '0', recipientName: 'Matty Betsy' },
-      { recipientIdentifier: '1', recipientName: 'Benny Charles' }
+      { recipientIdentifier: '1', recipientName: 'Benny Charles' },
     ];
 
     component.getSelectionOptionLabel = (recipient: any) => recipient.recipientName;
     component.filterRecipients(value, index);
-    
     expect(component.filteredRecipients[index].length).toBe(0);
     expect(component.filteredRecipients[index][0]).toBeUndefined();
 
     expect(component.dropdownVisible[index]).toBe(false);
-  })
+  });
 
 });
diff --git a/src/web/app/components/question-submission-form/question-submission-form.component.ts b/src/web/app/components/question-submission-form/question-submission-form.component.ts
index a2743eb6d59..2633530bc56 100644
--- a/src/web/app/components/question-submission-form/question-submission-form.component.ts
+++ b/src/web/app/components/question-submission-form/question-submission-form.component.ts
@@ -58,8 +58,8 @@ export class QuestionSubmissionFormComponent implements DoCheck {
   isMCQDropDownEnabled: boolean = false;
   isSaved: boolean = false;
   hasResponseChanged: boolean = false;
-  dropdownVisible: boolean[] = []; 
-  filteredRecipients: any[][] = []; 
+  dropdownVisible: boolean[] = [];
+  filteredRecipients: any[][] = [];
   displayedRecipientName: string[] = [];
 
   @Input()
@@ -600,40 +600,40 @@ export class QuestionSubmissionFormComponent implements DoCheck {
   }
 
   /**
-   * Filters the recipient list based on the input value and updates the filtered recipients array at the specified index.
+   * Filters the recipient list by input value and updates the filtered recipients array at the given index.
    */
-  filterRecipients(value: string, index: number) {
+  filterRecipients(value: string, index: number): void {
 
-    this.filteredRecipients[index] = this.model.recipientList.filter(recipient =>
-      this.getSelectionOptionLabel(recipient).toLowerCase().includes(value.toLowerCase())
+    this.filteredRecipients[index] = this.model.recipientList.filter((recipient) =>
+      this.getSelectionOptionLabel(recipient).toLowerCase().includes(value.toLowerCase()),
     );
-    this.dropdownVisible[index] = this.filteredRecipients[index].length > 0; 
+    this.dropdownVisible[index] = this.filteredRecipients[index].length > 0;
   }
 
   /**
    * Sets the dropdown visibility to true for the specified recipient index.
    */
-  showDropdown(index: number) {
+  showDropdown(index: number): void {
     this.dropdownVisible[index] = true;
   }
 
   /**
    * Hides the dropdown for the specified recipient index after a short delay.
    */
-  hideDropdown(index: number) {
+  hideDropdown(index: number): void {
     setTimeout(() => {
-      this.dropdownVisible[index] = false; 
-    }, 100); 
+      this.dropdownVisible[index] = false;
+    }, 100);
   }
 
   /**
    * Updates the recipient selection in the form model and sets the displayed name for the selected recipient.
    */
-  selectRecipient(recipient: any, recipientSubmissionFormModel: any, index: number) {
-    recipientSubmissionFormModel.recipientIdentifier = recipient.recipientIdentifier; 
-    this.displayedRecipientName[index] = recipient.recipientName; 
-    this.filteredRecipients[index] = []; 
-    this.dropdownVisible[index] = false; 
+  selectRecipient(recipient: any, recipientSubmissionFormModel: any, index: number): void {
+    recipientSubmissionFormModel.recipientIdentifier = recipient.recipientIdentifier;
+    this.displayedRecipientName[index] = recipient.recipientName;
+    this.filteredRecipients[index] = [];
+    this.dropdownVisible[index] = false;
   }
 
   /**
@@ -646,5 +646,4 @@ export class QuestionSubmissionFormComponent implements DoCheck {
           (r: FeedbackResponseRecipient) => r.recipientIdentifier === recipientIdentifier);
       return recipient ? recipient.recipientName : '';
     }
-  
 }