Skip to content

[LOOKUP_JOIN] Add new row to index (PART 1)#224567

Merged
sddonne merged 19 commits intoelastic:feature/lookup-join-uxfrom
sddonne:lookup-join-add-column
Jun 20, 2025
Merged

[LOOKUP_JOIN] Add new row to index (PART 1)#224567
sddonne merged 19 commits intoelastic:feature/lookup-join-uxfrom
sddonne:lookup-join-add-column

Conversation

@sddonne
Copy link
Contributor

@sddonne sddonne commented Jun 19, 2025

Summary

  • Added the component for adding new rows and columns.
  • Saves the row as a new doc synchronously.
  • Shows a toast after saving new row.
  • Shows a toast if request fails.
  • Shows a validation error if no input has been filled.

Pendings

  • Refresh rows after adding new rows.
  • Virtual scroll.
  • Validations.
image

Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

  • Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
  • Documentation was added for features that require explanation or tutorials
  • Unit or functional tests were updated or added to match the most common scenarios
  • If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the docker list
  • This was checked for breaking HTTP API changes, and any breaking changes have been approved by the breaking-change committee. The release_note:breaking label should be applied in these situations.
  • Flaky Test Runner was used on any tests changed
  • The PR description includes the appropriate Release Notes section, and the correct release_note:* label is applied per the guidelines

Identify risks

Does this PR introduce any risks? For example, consider risks like hard to test bugs, performance regression, potential of data loss.

Describe the risk, its severity, and mitigation for each identified risk. Invite stakeholders and evaluate how to proceed before merging.

[columns, updateRow]
);

const saveNewRow = async (event: React.FormEvent<HTMLFormElement>) => {
Copy link
Contributor

Choose a reason for hiding this comment

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

I think it's worth using the useCallback here

Copy link
Contributor Author

Choose a reason for hiding this comment

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

yep, totally right: 359e34a

<EuiFlexGroup gutterSize="s" alignItems="center">
<EuiFlexGroup
gutterSize="s"
tabIndex={0}
Copy link
Contributor

Choose a reason for hiding this comment

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

do we need a tabIndex here?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

It's a suggestion from EUI about scrollable sections: https://eui.elastic.co/docs/utilities/scroll/

autoFocus = false,
className = '',
}: ValueInputProps) => {
const [editValue, setEditValue] = useState(value);
Copy link
Contributor

Choose a reason for hiding this comment

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

I don't think we should maintain a local state here, both value and onChange passed from the parent component

Suggested change
const [editValue, setEditValue] = useState(value);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

For now it's only there because of the onKeyDown = Enter check, that event does not have the target.value.
But it's also going to be needed if we are some validations in here.

@sddonne sddonne marked this pull request as ready for review June 20, 2025 12:59
@sddonne sddonne requested a review from a team as a code owner June 20, 2025 12:59
@sddonne sddonne merged commit 8959bb8 into elastic:feature/lookup-join-ux Jun 20, 2025
8 of 10 checks passed
@elasticmachine
Copy link
Contributor

elasticmachine commented Jun 20, 2025

💔 Build Failed

Failed CI Steps

History

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants