[#13054] Make substrings of the name in dropdown selections of recipient to be searchable

[GraceXiehahaha]

Fixes #13054 (#13054)

Outline of Solution

Problem: Users were unable to easily search for specific substrings in the name when selecting recipients from a dropdown menu. The previous dropdown list did not have search functionality for substrings, which made it challenging to find and select specific recipients, especially in large lists.

Solution:
Modified the dropdown component to include a searchable input field.
Implemented logic that allows searching for substrings in the recipient names. This means users can now type partial names to filter down the options in the dropdown.
Updated related unit tests (question-submission-form.component.spec.ts) to verify that the new search functionality works correctly, including edge cases for partial name matches.

Changes Made:
Modified the component at src/web/app/components/question-submission-form/question-submission-form.component.ts to embed a text input.
Added styling to the input field to highlight when a name doesn't match any results. (If the input does not match any filter results, it will turn red.)
Updated the HTML and CSS to style the input field appropriately.
Enhanced the dropdown functionality to filter names by any substring.
Added new test cases to question-submission-form.component.spec.ts to verify substring search functionality.
Adjusted other relevant UI logic to ensure compatibility with the new feature.

Screenshots of the New UI:
Screenshot 1: Demonstration of the substring filtering:

Example 1: Typing "cha" will display all recipients whose names contain "cha", such as "Charlie Davis" and "Benny Charles".

Example 2: Typing "is" will filter to show all names containing the substring "is", like "Charlie Davis" and "Francis Gabriel".

Screenshot 2: Example of invalid input where there are no matching results:

Typing "Jerry" results in the input field turning red, indicating that no recipients match the given name. This immediate visual feedback helps users adjust their search term.

[LeeY0846]

The original inline text input design failed the E2E test because the input blocked the select, so we changed it to a simpler column stacking design. The functionalities remain the same.

[LeeY0846]

We update the solution again. The new solution uses an input element to mock the select style and functionality to pass the E2E tests with a better appearance than the additional search input design.

[LeeY0846]

It's weird that the failed tests were passed in my local environment for commit "Try to fix e2e tests".

I felt that adding a hidden select to avoid tests was not a good solution, and it also didn't work.
Since we cannot use a select to realise the feature required by #13054, perhaps we can change the e2e tests, such as changing the [select] class into [input] class in FeedbackMsqQuestionE2ETest.java:98 and changing the way to count options in FeedbackSubmitPageE2ETest.java:78.

Please let us know if these changes are acceptable, and we will be happy to complete this PR.