### TL;DR
This PR includes updates to the project settings.
### What changed?
The project settings have been refactored for better organization and readability.
### How to test?
To test this change, navigate to the project settings and ensure all options are functioning as expected.
### Why make this change?
This change was made to improve the user experience when navigating through the project settings.
---
### TL;DR
This pull request refactors the `SearchBar` and `Input` components, adding a `ref` to the former and removing an incorrect understanding of `react-hook-form` (yes, i prev "fix" the component) in the latter.
### What changed?
A ref is added to the SearchBar component for better control and handling. In the Input component, we have eliminated the usage of 'react-hook-form' and as a result, the 'register' prop is removed. This makes the component less reliant on specific libraries and more reusable.
### How to test?
Ensure that proper testing is done on the updated components. Make sure that the `SearchBar` works as expected with its ref and that Input does not depend on 'react-hook-form' anymore.
### Why make this change?
This change was made to improve the functionality of the `SearchBar` and the flexibility of the Input component, making them more effective and reusable respectively. The changes also align with the current code quality standards and best practices.
### TL;DR
This PR refactors the `UserSelect` component, adjusting the call to `getToggleButtonProps`.
### What changed?
The `getToggleButtonProps` method in the `UserSelect` component now takes in two separate objects, one for the `ref` and another for `suppressRefError`, instead of a single one.
### How to test?
Verify the component functionality hasn't changed and there are no reference errors.
### Why make this change?
This code changes improve the readability and maintainability of this component by clearly separating the component reference and error suppression configurations in separate objects.
### TL;DR
AddMemberDialog component now uses a Select dropdown for permissions instead of Checkboxes. CollaboratorsTabPanel now includes dismiss functionality for toasts.
### What changed?
- Updated AddMemberDialog to use a Select dropdown for permissions
- Added dismiss functionality for toasts in CollaboratorsTabPanel
### How to test?
Test the functionality of selecting permissions using the dropdown and toast dismissal in CollaboratorsTabPanel.
### Why make this change?
To improve user experience and UI consistency in permissions selection and toast management.
### TL;DR
Reordered the properties in the `ProjectSearchBar` component to follow better coding standards.
### What changed?
In `ProjectSearchBarDialog.tsx`, the 'getItemProps' object was moved to the end of the properties list within `ProjectSearchBarItem`.
### How to test?
Verify that the `ProjectSearchBar` component functions as intended and that no properties are unduly affected by this change.
### Why make this change?
This change enhances code readability and consistency, aligning the ordering of the properties more accurately with our standards.
### TL;DR
A refactor of the Icon components in the front-end package has been carried out. This includes `CollaboratorsIcon.tsx`, `CopyUnfilledIcon.tsx`, and `TrashIcon.tsx`.
### What changed?
Several attributes previously written in kebab-case were changed to camelCase to adhere to JSX syntax standards. These include `stroke-linecap`, `stroke-linejoin`, `fill-rule`, and `clip-rule`.
### How to test?
Ensure that the rendering and functionality of the icons in the application remain unchanged after this update.
### Why make this change?
The update ensures that our code complies with the preferred casing convention in JSX and avoids all potential related issues.
### TL;DR
This PR involves a minor change on the AddMemberDialog component style.
### What changed?
The 'justify-start' class was removed from the Modal.Footer in the AddMemberDialog.tsx.
### How to test?
Check the AddMemberDialog on the project settings page to make sure the style changes reflect accurately.
### Why make this change?
It's not specified the specific reason for the change, However, it's aimed towards improving the component's layout and presentation in the project settings page.
---
### TL;DR
Added a toast notification for 'Sign-in with Passkeys' feature which is still under development.
### What changed?
'The Sign-in with Passkey' button now triggers a toast notification informing the user that this feature is coming soon.
### How to test?
Click on the 'Sign-in with Passkey' button on the login page. You should see a notification with the message 'Sign-in with Passkeys is coming soon!'.
### Why make this change?
This change has been made to inform users about upcoming features in an interactive manner and ensure a smooth user experience by preventing confusion about non-functional buttons.
