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.

Sign up for GitHub

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

[EuiSuperDatePicker] relative tab, timestamp: Use roundUp, switch pos with "Round To" btn #1827

Merged
merged 6 commits into from
Apr 26, 2019
Merged

[EuiSuperDatePicker] relative tab, timestamp: Use roundUp, switch pos with "Round To" btn #1827

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
c269752
Remove roundUp flag from formatTimeString function
kertal Apr 12, 2019
0f877ae
Add roundUp flag to displayed value of timestamp in relative tab
kertal Apr 24, 2019
d2b2f9e
Undo removal of roundup flag in datepicker popover button
kertal Apr 24, 2019
aad054b
Switch position of "Round to the X" button and timestamp string
kertal Apr 24, 2019
0140ecf
Switch position of "Round to the X" button and timestamp string
kertal Apr 24, 2019
6c29b2c
Add changelog
kertal Apr 25, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,7 @@ export function EuiDatePopoverContent({ value, roundUp, onChange, dateFormat })
dateFormat={dateFormat}
value={value}
onChange={onChange}
roundUp={roundUp}
/>
),
'data-test-subj': 'superDatePickerRelativeTab',
Expand Down
9 changes: 5 additions & 4 deletions src/components/date_picker/super_date_picker/date_popover/relative_tab.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export class EuiRelativeTab extends Component {

render() {
const isInvalid = this.state.count < 0;
const parsedValue = dateMath.parse(this.props.value);
const parsedValue = dateMath.parse(this.props.value, { roundUp: this.props.roundUp });
const formatedValue = isInvalid || !parsedValue || !parsedValue.isValid()
? ''
: parsedValue.format(this.props.dateFormat);
Expand Down Expand Up @@ -87,9 +87,6 @@ export class EuiRelativeTab extends Component {
</EuiFormRow>
</EuiFlexItem>
</EuiFlexGroup>
<EuiFormRow>
<EuiFieldText value={formatedValue} readOnly />
</EuiFormRow>
<EuiFormRow>
<EuiSwitch
data-test-subj={`superDatePickerRelativeDateRoundSwitch`}
Expand All @@ -98,6 +95,9 @@ export class EuiRelativeTab extends Component {
onChange={this.onRoundChange}
/>
</EuiFormRow>
<EuiFormRow>
Copy link
Contributor

Choose a reason for hiding this comment

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

Can you remove the EuiFormRow's from wrapping the readonly text and the switch? They're not providing anything but messing up some spacing. Then you can just some spacers like so:

<EuiSpacer size="s" />

<EuiSwitch ... />

<EuiSpacer size="m" />

<EuiFieldText ... />

Which should end up looking like this:

<EuiFieldText value={formatedValue} readOnly />
</EuiFormRow>
</EuiForm>
);
}
Expand All @@ -107,4 +107,5 @@ EuiRelativeTab.propTypes = {
dateFormat: PropTypes.string.isRequired,
value: PropTypes.string.isRequired,
onChange: PropTypes.func.isRequired,
roundUp: PropTypes.bool
};