Add select input with a search box

[Ahd-Kabeer-Hadi]

Issue Description

In the file app\join-waiting-list\page.tsx, we are currently using a selectbox. However, we need to implement a more responsive solution similar to the responsive combobox from Shadcn. This requires refactoring to integrate it as a standard UI component, consistent with our existing form components and in harmony with our theme.

Acceptance Criteria

• [ ] The component should be reusable like existing form inputs and must accept dynamic values and style classes.
• [ ] The component should adhere to the website's theme colours and styles.
• [ ] The component should include filtering, searching, and an optional input field if the given list is not available.
• [ ] If a user types something that's not in the enum list, the 'other' option should be filtered and selectable.
• [ ] If the user selects 'other', another input field should become visible to enter the value.

Expected UI sample (sample only needs necessary changes as in AC)

Current UI

Instructions

Before starting development, please follow these steps:

1. Create a branch on your local machine with the name of the token.
2. Ensure that you're working on this branch for the duration of the development process.

Best Practices for Open Source Contribution:

1. Read the Contribution Guidelines: Familiarise yourself with the project's contribution guidelines. These guidelines usually outline how to contribute, coding standards, and other important information.

2. Understand the Project: Take the time to understand the project's goals, architecture, and existing codebase before making any contributions. This ensures that your contributions align with the project's objectives.

3. Follow Coding Standards: Adhere to the coding style and standards established by the project. Consistent coding style makes it easier for others to read and maintain the code.

4. Document Your Code: Provide clear and concise comments within your code to explain its purpose, functionality, and any important considerations. Good documentation makes it easier for other developers to understand and use your code.

5. Test Your Changes: Thoroughly test your changes to ensure they work as intended and do not introduce any regressions. Write unit tests whenever possible to automate the testing process and increase confidence in your changes.

6. Keep Your Pull Requests Small and Focused: Break your changes into smaller, focused pull requests rather than large, monolithic ones. This makes it easier for maintainers to review your code and for other contributors to understand the changes.

7. Be Responsive to Feedback: Be open to feedback and constructive criticism from maintainers and other contributors. Address any feedback promptly and be willing to make necessary adjustments to your code.

8. Be Patient and Respectful: Open source projects often have diverse communities with different perspectives and priorities. Be patient and respectful when discussing ideas or providing feedback, and always assume good intentions from other contributors.

9. Contribute Positively: Contribute to a positive and inclusive community by being supportive of others, encouraging collaboration, and fostering a welcoming environment for all contributors.

10. Celebrate Your Contributions: Your contributions, no matter how small, are valuable to the project. Celebrate your achievements and the contributions of others to build a positive and thriving open source community.

[Ahd-Kabeer-Hadi]

@firoz3130 what's the update?

[nithin9000]

@Ahd.Kabeer Hadi can i start working on this

[Ahd-Kabeer-Hadi]

@nithin6x9 have you setup the repo? if then please collaborate with @firoz3130 , I think he has already done some progress by now

[nithin9000]

@Ahd-Kabeer-Hadi yeah i have the repo locally and will connect with firoz

[Ahd-Kabeer-Hadi]

@firoz3130 @nithin6x9 both of you can refer the SelectInput.tsx from components/ui for a kick start,

and please keep the acceptance Criteria in mind working on it

[itsOmSarraf]

@Ahd-Kabeer-Hadi can i take up from here, will get it done

[Ahd-Kabeer-Hadi]

@itsOmSarraf, @firoz3130 has brought up a solution for now, we need to optimize the form submitting behaviour can you do that?

[Ahd-Kabeer-Hadi]

@firoz3130 hope you are doing it otherwise @itsOmSarraf you can take this now

[firoz3130]

I was able to achieve this much. I was not satisfied with the colors schemes here , Thats what I was trying to change these days I think it would be better for the 2nd person to take up this now.