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

[APM] Removes refresh logic from date picker #33278

Merged

Conversation

jasonrhodes
Copy link
Member

Closes #33216
Blocked by elastic/eui#1732

Summary

  • Removes the refresh logic we implemented in our app in favor of the new onRefresh prop in EUI's SuperDatePicker
  • Fixes tests so they handle the async nature of the new onRefresh functionality
  • Fixes a bug with URL updates that are identical, but don't look identical to the browser because the new URL is encoded but the existing URL has already been decoded by Angular -- in those cases, clicking "Refresh" on the date picker would add identical entries to the stack and make the back button appear as if it was broken. Now we check the encoded versions of the current URL and the next URL and if they are the same, we use history.replace() instead of history.push() to prevent this problem
  • New tests for this replace vs push functionality

@jasonrhodes jasonrhodes requested a review from a team as a code owner March 14, 2019 23:27
@elasticmachine
Copy link
Contributor

💔 Build Failed

const { push, replace } = this.props.history;
const update = currentSearch === nextSearch ? replace : push;

update({ ...this.props.location, search: nextSearch });
Copy link
Member

@sorenlouv sorenlouv Mar 14, 2019

Choose a reason for hiding this comment

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

Do we need to do the update, if they are the same? Would the following cause issues?

if(currentSearch !== nextSearch) {
  this.props.history.push({ ...this.props.location, search: nextSearch });
}

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 we still need to do the update because it re-calculates the relative range.

@@ -39,25 +39,10 @@ class DatePickerComponent extends React.Component<Props> {

public componentDidMount() {
this.dispatchTimeRangeUpdate();
Copy link
Member

@sorenlouv sorenlouv Mar 14, 2019

Choose a reason for hiding this comment

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

Does the DatePickerComponent still need to be stateful?
My line of thought: EUI date picker is just ui controls for changing the date. If we wanted (and our users were super geeky), we should be able to remove the ui controls, and users should still be able to control the date via the url (the primary set of controls).

Btw. This is not super relevant for this PR - just thinking out loud :)

Copy link
Member Author

Choose a reason for hiding this comment

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

Cool, not sure if I follow yet. Are you saying other parts of the app should be able to control the date via URL? Because we already do that in the charts for the drag to select a time range, and it all works -- are you thinking that because of that, the url manipulation shouldn't happen in our date picker wrapper?

Copy link
Member

@sorenlouv sorenlouv Mar 15, 2019

Choose a reason for hiding this comment

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

Are you saying other parts of the app should be able to control the date via URL

I'm saying that the rest of the application should be able to work properly and read the date from the url, without the date picker.
Right now, if you removed the date picker the rest of the app wouldn't work, right?

Because we already do that in the charts for the drag to select a time range, and it all works

The chart manipulates the url (I hope). So should the date picker. Only exception is the refresh button, which should invoke a refresh action in redux.

Copy link
Member

@sorenlouv sorenlouv left a comment

Choose a reason for hiding this comment

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

Lgtm

@sorenlouv
Copy link
Member

retest

@elasticmachine
Copy link
Contributor

💔 Build Failed

@jasonrhodes jasonrhodes force-pushed the apm-remove-datepicker-refresh_33216 branch from e5b1e44 to 334d88b Compare March 19, 2019 19:06
@elasticmachine
Copy link
Contributor

💔 Build Failed

@jasonrhodes
Copy link
Member Author

retest

@elasticmachine
Copy link
Contributor

💚 Build Succeeded

@jasonrhodes jasonrhodes merged commit e8c1bff into elastic:master Mar 19, 2019
@jasonrhodes jasonrhodes deleted the apm-remove-datepicker-refresh_33216 branch March 19, 2019 22:10
jasonrhodes added a commit to jasonrhodes/kibana that referenced this pull request Mar 19, 2019
jasonrhodes added a commit that referenced this pull request Mar 20, 2019
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.

3 participants