Skip to content

[EuiSuperDatePicker][EuiAutoRefresh][EuiRefreshInterval] Allow setting a minimum interval in milliseconds#7516

Merged
cee-chen merged 5 commits intoelastic:mainfrom
cee-chen:super-date-picker/min-interval
Feb 9, 2024
Merged

[EuiSuperDatePicker][EuiAutoRefresh][EuiRefreshInterval] Allow setting a minimum interval in milliseconds#7516
cee-chen merged 5 commits intoelastic:mainfrom
cee-chen:super-date-picker/min-interval

Conversation

@cee-chen
Copy link
Contributor

@cee-chen cee-chen commented Feb 6, 2024 •
edited by tkajtoch
Loading

Summary

closes #7512

This PR adds a refreshMinInterval prop to EuiSuperDatePicker and an minInterval prop to EuiAutoRefresh and EuiRefreshInterval, which primarily does the following:

  • Adds a browser min property to the number input, which affects the stepper and shows an invalid state/icon if the user types in a value below that min
  • Updates the onRefreshChange callback to never send back a refreshInterval value lower than than the passed minInterval value

QA

min_interval

  • Go to https://eui.elastic.co/pr_7516/#/templates/super-date-picker
  • Click the Playground button
  • ctrl+f for and toggle the isPaused prop to false
  • ctrl+f for and set the refreshMinInterval prop to, e.g. 20000
  • Click the auto refresh button, and confirm that the popover has an invalid highlight/icon on open
  • Type in, e.g. 100 and confirm the invalid state goes away
  • Change the number back to 1 and then set the unit to Minutes. Confirm the invalid icon goes away when in a higher unit that passes the min threshold

General checklist

  • Browser QA - N/A
    • Checked in Chrome, Safari, Edge, and Firefox
  • Docs site QA
    • Props have proper autodocs (using @default if default values are missing) and playground toggles
  • Code quality checklist
  • Release checklist
    • A changelog entry exists and is marked appropriately.
  • Designer checklist - N/A

@cee-chen cee-chen marked this pull request as ready for review February 6, 2024 21:09
@cee-chen cee-chen requested a review from a team as a code owner February 6, 2024 21:09
@kibanamachine
Copy link

kibanamachine commented Feb 6, 2024

Preview staging links for this PR:

@elasticmachine
Copy link
Collaborator

elasticmachine commented Feb 6, 2024

💚 Build Succeeded

@tkajtoch tkajtoch self-requested a review February 8, 2024 19:09
tkajtoch
tkajtoch approved these changes Feb 8, 2024
View reviewed changes
Copy link
Member

@tkajtoch tkajtoch left a comment

Choose a reason for hiding this comment

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

Looks and works great! 🚢

@cee-chen
Copy link
Contributor Author

cee-chen commented Feb 8, 2024

@thomasneirynck just wanted to quickly check in with you since this was your feature request - does the above functionality in the PR description/screencap / staging playground work for the use case you need in Kibana?

@cee-chen
Copy link
Contributor Author

cee-chen commented Feb 9, 2024

Going to go ahead and merge this so it gets into next week's release, but feel free to ping anytime @thomasneirynck if you have any questions about usage or need further functionality :)

@cee-chen cee-chen merged commit 890f762 into elastic:main Feb 9, 2024
@cee-chen cee-chen deleted the super-date-picker/min-interval branch February 9, 2024 22:30
@cee-chen cee-chen mentioned this pull request Feb 12, 2024
Merged
@thomasneirynck
Copy link

thomasneirynck commented Feb 13, 2024

thanks @cee-chen , I think this will work!

@thomasneirynck thomasneirynck mentioned this pull request Feb 13, 2024
Closed
cee-chen added a commit to elastic/kibana that referenced this pull request Feb 20, 2024
@cee-chen
Upgrade EUI to v93.1.1 (#176762)
2680755 
`v93.0.0` ⏩ `v93.1.1`

---

## [`v93.1.1`](https://github.com/elastic/eui/releases/v93.2.0)

**This is a patch release primarily intended for use by Kibana.**

- Added top-level `EuiTreeView.Item` export
([#7526](elastic/eui#7526))

## [`v93.1.0`](https://github.com/elastic/eui/releases/v93.1.0)

- Added `index` glyph to `EuiIcon`
([#7498](elastic/eui#7498))
- Updated `EuiHighlight` to accept an array of `search` strings, which
allows highlighting multiple, separate words within its children. This
new type and behavior *only* works if `highlightAll` is also set to
true. ([#7496](elastic/eui#7496))
- Updated `EuiContextMenu` with a new `panels.items.renderItem`
property, which allows rendering completely custom items next to
standard `EuiContextMenuItem` objects
([#7510](elastic/eui#7510))
- `EuiSuperDatePicker` updates:
- Updated `EuiSuperDatePicker` with a new `refreshIntervalUnits` prop.
Passing this prop allows controlling and overriding the default unit
rounding behavior. ([#7501](elastic/eui#7501))
- Updated `EuiAutoRefresh` and `EuiRefreshInterval` with a new
`intervalUnits` prop. Passing this prop allows controlling and
overriding the default unit rounding behavior.
([#7501](elastic/eui#7501))
- Updated `onRefreshChange` to pass back a new `intervalUnits` key that
contains the current interval unit format (seconds, minutes, or hours).
([#7501](elastic/eui#7501))
- Updated `EuiSuperDatePicker` with a new `canRoundRelativeUnits` prop,
which defaults to true (current behavior). To preserve displaying the
unit that users select for relative time, set this to false.
([#7502](elastic/eui#7502))
- Updated `EuiSuperDatePicker` with a new `refreshMinInterval` prop,
which accepts a minimum number in milliseconds
([#7516](elastic/eui#7516))
- Updated `EuiAutoRefresh` and `EuiRefreshInterval` with a new
`minInterval` prop, which accepts a minimum number in milliseconds
([#7516](elastic/eui#7516))

**Bug fixes**

- Fixed `EuiHighlight` to not parse `search` strings as regexes
([#7496](elastic/eui#7496))
- Fixed `EuiSuperDatePicker` submit bug when used within `<form>`
elements ([#7504](elastic/eui#7504))
- Fixed an `EuiTreeView` bug where `aria-expanded` was being applied to
items without expandable children
([#7513](elastic/eui#7513))

**CSS-in-JS conversions**

- Converted `EuiTreeView` to Emotion. Updates as part of the conversion:
([#7513](elastic/eui#7513))
  - Removed `.euiTreeView__wrapper` div node
  - Enforced consistent `icon` size based on `display` size
fkanout pushed a commit to fkanout/kibana that referenced this pull request Mar 4, 2024
@cee-chen @fkanout
Upgrade EUI to v93.1.1 (elastic#176762)
2b74c27 
`v93.0.0` ⏩ `v93.1.1`

---

## [`v93.1.1`](https://github.com/elastic/eui/releases/v93.2.0)

**This is a patch release primarily intended for use by Kibana.**

- Added top-level `EuiTreeView.Item` export
([elastic#7526](elastic/eui#7526))

## [`v93.1.0`](https://github.com/elastic/eui/releases/v93.1.0)

- Added `index` glyph to `EuiIcon`
([elastic#7498](elastic/eui#7498))
- Updated `EuiHighlight` to accept an array of `search` strings, which
allows highlighting multiple, separate words within its children. This
new type and behavior *only* works if `highlightAll` is also set to
true. ([elastic#7496](elastic/eui#7496))
- Updated `EuiContextMenu` with a new `panels.items.renderItem`
property, which allows rendering completely custom items next to
standard `EuiContextMenuItem` objects
([elastic#7510](elastic/eui#7510))
- `EuiSuperDatePicker` updates:
- Updated `EuiSuperDatePicker` with a new `refreshIntervalUnits` prop.
Passing this prop allows controlling and overriding the default unit
rounding behavior. ([elastic#7501](elastic/eui#7501))
- Updated `EuiAutoRefresh` and `EuiRefreshInterval` with a new
`intervalUnits` prop. Passing this prop allows controlling and
overriding the default unit rounding behavior.
([elastic#7501](elastic/eui#7501))
- Updated `onRefreshChange` to pass back a new `intervalUnits` key that
contains the current interval unit format (seconds, minutes, or hours).
([elastic#7501](elastic/eui#7501))
- Updated `EuiSuperDatePicker` with a new `canRoundRelativeUnits` prop,
which defaults to true (current behavior). To preserve displaying the
unit that users select for relative time, set this to false.
([elastic#7502](elastic/eui#7502))
- Updated `EuiSuperDatePicker` with a new `refreshMinInterval` prop,
which accepts a minimum number in milliseconds
([elastic#7516](elastic/eui#7516))
- Updated `EuiAutoRefresh` and `EuiRefreshInterval` with a new
`minInterval` prop, which accepts a minimum number in milliseconds
([elastic#7516](elastic/eui#7516))

**Bug fixes**

- Fixed `EuiHighlight` to not parse `search` strings as regexes
([elastic#7496](elastic/eui#7496))
- Fixed `EuiSuperDatePicker` submit bug when used within `<form>`
elements ([elastic#7504](elastic/eui#7504))
- Fixed an `EuiTreeView` bug where `aria-expanded` was being applied to
items without expandable children
([elastic#7513](elastic/eui#7513))

**CSS-in-JS conversions**

- Converted `EuiTreeView` to Emotion. Updates as part of the conversion:
([elastic#7513](elastic/eui#7513))
  - Removed `.euiTreeView__wrapper` div node
  - Enforced consistent `icon` size based on `display` size
@nickofthyme nickofthyme mentioned this pull request Jul 23, 2024
Merged
1 task
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@tkajtoch tkajtoch tkajtoch approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Allow minimum time-setting for auto refresh interval selector

5 participants

@cee-chen @kibanamachine @elasticmachine @thomasneirynck @tkajtoch

Comments