Function selection dropdown: UX issues

[barchukmov]

the process of choosing a function is not smooth

current behavior:

• selecting the field we have a blue field, without a dropdown list of options:

• on input of a character we get the following:

• the input panel had moved to the left side, by proxy of the 2 new panels opening.
• the dropdown list is now situated in the middle of the screen where the searchbox used to be at.
• the function name has now been filled, not only inline suggested, so continuing to write for example "h.264" after typing "h" will result is "h.264." and now prevents the user from being able write the function they are searching for.
• using the dropdown is now bugged, if the user tries to go down the suggested list appearing under the input field will result in the app choosing the next item on the list and close the dropdown without letting the user riffle through the options.
• deleting a character will delete all the input, remove the 2 panels on the right and get us to square one.

the ux i expect:

• pressing on the input should show a dropdown list of functions.
• as the user is writing the function name, the first option in the list that matches the string is inline suggested in the field, as the dropdown is being updated, the user is being let to write as much of the function name as they want.
• the user may go up and down the dropdown list.
• on blur, on enter, or on dropdown item selection, the most probable function is selected and now the 2 panels are shown, not before.
• the panels do not move the input panel to the left, so the expectation of the user of where things used to be before he looked down at the keyboard/started the function search is kept, the new panels appear on the side.
• as the user writes and deletes characters the app lets them without overtaking control not adding or removing characters in a way that's not expected from a text field.

tangential ideas:

• the dropdown preferably should be fuzzy and should account for common mistakes, like "mp4" for the encoders that use mp4 as a container, "png" for image, etc.
• "image" and "jpeg" should find a solution: all image formats are they're own category, or none of them, with me leaning towards every image format is it's own category.
• descriptions i think the dropdown will profit a lot from short description like "png - lossless format of images, supports compression and transparency" of tags like "web media format", "uncompressed", "popular", etc.
• imo, the app should start up with those two panels already up, empty, because the app isn't functional without them.

i am more than willing to submit a pull request with my attempt as i know a little java, i research with llms but i'll never submit llm written code - do notice if you like the idea and give feedback.