Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add autocomplete when creating connections and Kafka topic autocomplete #458

Merged
merged 4 commits into from Dec 19, 2023

Conversation

mwylde
Copy link
Member

@mwylde mwylde commented Dec 18, 2023

This PR adds infrastructure for providing autocomplete of connection details, and an initial use case for Kafka topics.

It looks like this:

image

There are several pieces to the implementation:

  • A method on the Connector trait that allows a connector to provide a map of paths -> completion values
  • An API that exposes this, /connector_profiles/{id}/autocomplete
  • A format autocomplete supported by our JsonForm library that renders an Autocomplete widget

The widget shows the status of the autocomplete fetch and reports errors if the fetch failed.

@jbeisen
Copy link
Collaborator

jbeisen commented Dec 18, 2023

Maybe we don't need this stracktrace

image

@mwylde
Copy link
Member Author

mwylde commented Dec 18, 2023

The stacktrace is there because you're running with RUST_BACKTRACE enabled. It won't show up for users.

@jbeisen
Copy link
Collaborator

jbeisen commented Dec 18, 2023

Maybe limit the size of this and make it scrolling?

image

Comment on lines 258 to 272
<UnorderedList
position={'absolute'}
top={20}
left={-3}
{...getMenuProps()}
bg={'gray.700'}
zIndex={100}
borderColor={'gray.500'}
borderWidth={'1px'}
borderRadius={8}
listStyleType={'none'}
w={'90%'}
display={isOpen && items.length > 0 ? 'block' : 'none'}
opacity={0.95}
overflow={'hidden'}
>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Have you considered using a component like this? I feel like it would solve some of this hacky positioning stuff.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I looked at that one. It didn't seem to support the behavior I wanted, where you're allowed to type something that is not included in the list. The closest it comes is "creatable items" where you can add something to the list, but that's an awkward UI experience I think. Building our own UI on top of downshift seemed like an easier, better supported option.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking at the gif of the "creatable items" I think it looks ideal, and you can customize it to clearly say that the user is creating a new topic.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That UI makes the list of items the source of truth, and the textbox is just referencing one of those. What I want is for the text box to be the source of truth, possibly filled in by the list of items.

Base automatically changed from profile_redesign2 to master December 19, 2023 00:02
@mwylde
Copy link
Member Author

mwylde commented Dec 19, 2023

Updated with feedback. The list now scrolls, and I'm also filtering out internal kafka topics (the ones that start with _) so they don't overwhelm the user's actual topics.

@mwylde mwylde merged commit 04055bd into master Dec 19, 2023
8 checks passed
@mwylde mwylde deleted the kafka_autocomplete branch December 19, 2023 17:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants