Merge pull request #13795 from influxdata/fix-variable-rename-overlay

Update variable rename overlay and argument type
pull/13796/head
Palakp41 2019-05-06 10:21:23 -07:00 committed by GitHub
commit bc80113bfb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 49 additions and 53 deletions

View File

@ -6,7 +6,6 @@ import {withRouter, WithRouterProps} from 'react-router'
// Components
import {Form, Input, Button, Grid, Columns} from '@influxdata/clockface'
import {Overlay} from 'src/clockface'
// Utils
import {validateVariableName} from 'src/variables/utils/validation'
@ -55,59 +54,54 @@ class RenameVariableOverlayForm extends PureComponent<Props, State> {
const {workingVariable, isNameValid} = this.state
return (
<Overlay.Container maxWidth={1000}>
<Overlay.Heading title="Rename Variable" onDismiss={onClose} />
<Overlay.Body>
<Form onSubmit={this.handleSubmit}>
<Grid>
<Grid.Row>
<Grid.Column widthXS={Columns.Six}>
<div className="overlay-flux-editor--spacing">
<Form.ValidationElement
label="Name"
<Form onSubmit={this.handleSubmit}>
<Grid>
<Grid.Row>
<Grid.Column widthXS={Columns.Six}>
<div className="overlay-flux-editor--spacing">
<Form.ValidationElement
label="Name"
value={workingVariable.name}
required={true}
validationFunc={this.handleNameValidation}
>
{status => (
<Input
placeholder="Rename your variable"
name="name"
autoFocus={true}
value={workingVariable.name}
required={true}
validationFunc={this.handleNameValidation}
>
{status => (
<Input
placeholder="Rename your variable"
name="name"
autoFocus={true}
value={workingVariable.name}
onChange={this.handleChangeInput}
status={status}
/>
)}
</Form.ValidationElement>
</div>
</Grid.Column>
</Grid.Row>
<Grid.Row>
<Grid.Column>
<Form.Footer>
<Button
text="Cancel"
color={ComponentColor.Danger}
onClick={onClose}
onChange={this.handleChangeInput}
status={status}
/>
<Button
text="Submit"
type={ButtonType.Submit}
color={ComponentColor.Primary}
status={
isNameValid
? ComponentStatus.Default
: ComponentStatus.Disabled
}
/>
</Form.Footer>
</Grid.Column>
</Grid.Row>
</Grid>
</Form>
</Overlay.Body>
</Overlay.Container>
)}
</Form.ValidationElement>
</div>
</Grid.Column>
</Grid.Row>
<Grid.Row>
<Grid.Column>
<Form.Footer>
<Button
text="Cancel"
color={ComponentColor.Danger}
onClick={onClose}
/>
<Button
text="Submit"
type={ButtonType.Submit}
color={ComponentColor.Primary}
status={
isNameValid
? ComponentStatus.Default
: ComponentStatus.Disabled
}
/>
</Form.Footer>
</Grid.Column>
</Grid.Row>
</Grid>
</Form>
)
}

View File

@ -70,7 +70,9 @@ class VariableRow extends PureComponent<Props & WithRouterProps> {
{this.labels}
</ComponentSpacer>
</IndexList.Cell>
<IndexList.Cell alignment={Alignment.Left}>Query</IndexList.Cell>
<IndexList.Cell alignment={Alignment.Left}>
{variable.arguments.type}
</IndexList.Cell>
<IndexList.Cell revealOnHover={true} alignment={Alignment.Right}>
<Button
text="Rename"