Fixed autocomplete bug by enclosing div within a form tag #380

[aaryan-gautam]

Description

For issue #380, I have inserted a <form> that is wrapped around the <div> as it is needed for the autocomplete as given at MDN so the utilitiesRow variable now returns this <form>.
I have assigned a name attribute of utilities-form to the <form>.

Before:

After:

Testing Change

1. Save a login credential on the website on google chrome
2. Open settings to check whether the username is autofilled on click in room filter search and password for the security field.

Resolves #380

Signed-off-by: Aaryan Gautam aaryanyo123@gmail.com

[bwindels]

Thanks for your PR, I have left some comments

[bwindels]

won't this submit the form now when you hit enter on the filter field?

[bwindels]

Please don't introduce any unrelated white space changes

[bwindels]

probably only the filter field should be in the form, not the button links?

[pruthula0]

const utilitiesRow = t.form({ name: "utilities-form", onSubmit: (event) => { event.preventDefault(); // Prevent form submission // Additional code logic if needed }, }, [ // Form elements ]);

By adding the onSubmit event listener to the form element and calling event.preventDefault(), you can prevent the form from submitting when the enter key is pressed within the filter field or any other input field inside the form.