Disallow system buckets to be deleted or renamed

pull/15058/head
Palak Bhojani 2019-09-09 10:28:01 -07:00
parent 719f296d2d
commit 0c3ec69f37
2 changed files with 66 additions and 61 deletions

View File

@ -1,6 +1,6 @@
// Libraries
import React, {PureComponent} from 'react'
import {withRouter, WithRouterProps} from 'react-router'
import React, { PureComponent } from 'react'
import { withRouter, WithRouterProps } from 'react-router'
import _ from 'lodash'
// Components
@ -13,11 +13,11 @@ import {
} from '@influxdata/clockface'
import BucketContextMenu from 'src/buckets/components/BucketContextMenu'
import BucketAddDataButton from 'src/buckets/components/BucketAddDataButton'
import {FeatureFlag} from 'src/shared/utils/featureFlag'
import { FeatureFlag } from 'src/shared/utils/featureFlag'
// Types
import {Bucket} from 'src/types'
import {DataLoaderType} from 'src/types/dataLoaders'
import { Bucket } from 'src/types'
import { DataLoaderType } from 'src/types/dataLoaders'
export interface PrettyBucket extends Bucket {
ruleString: string
@ -35,7 +35,7 @@ interface Props {
class BucketRow extends PureComponent<Props & WithRouterProps> {
public render() {
const {bucket, onDeleteBucket} = this.props
const { bucket, onDeleteBucket } = this.props
return (
<ResourceCard
testID="bucket--card"
@ -54,55 +54,52 @@ class BucketRow extends PureComponent<Props & WithRouterProps> {
<FlexBox
direction={FlexDirection.Row}
margin={ComponentSize.Small}
style={{marginTop: '4px'}}
style={{ marginTop: '4px' }}
>
<BucketAddDataButton
onAddCollector={this.handleAddCollector}
onAddLineProtocol={this.handleAddLineProtocol}
onAddScraper={this.handleAddScraper}
/>
{this.renameDeleteButtons}
{this.renameButton}
<FeatureFlag name="deleteWithPredicate">
<Button
text="Delete Data By Filter"
testID="bucket-delete-task"
size={ComponentSize.ExtraSmall}
onClick={this.handleDeleteData}
/>
</FeatureFlag>
</FlexBox>
</ResourceCard>
)
}
private renameDeleteButtons() {
const {bucket} = this.props
{
if (bucket.type === 'user') {
return (
<>
<Button
text="Rename"
testID="bucket-rename"
size={ComponentSize.ExtraSmall}
onClick={this.handleRenameBucket}
/>
<FeatureFlag name="deleteWithPredicate">
<Button
text="Delete Data By Filter"
testID="bucket-delete-task"
size={ComponentSize.ExtraSmall}
onClick={this.handleDeleteData}
/>
</FeatureFlag>
</>
)
} else return <></>
}
private get renameButton() {
const { bucket } = this.props
if (bucket.type === 'user') {
console.log("here")
return (
<Button
text="Rename"
testID="bucket-rename"
size={ComponentSize.ExtraSmall}
onClick={this.handleRenameBucket}
/>
)
} else return <></>
}
private handleDeleteData = () => {
const {onDeleteData, bucket} = this.props
const { onDeleteData, bucket } = this.props
onDeleteData(bucket)
}
private handleRenameBucket = () => {
const {
params: {orgID},
bucket: {id},
params: { orgID },
bucket: { id },
router,
} = this.props
@ -111,8 +108,8 @@ class BucketRow extends PureComponent<Props & WithRouterProps> {
private handleNameClick = (): void => {
const {
params: {orgID},
bucket: {id},
params: { orgID },
bucket: { id },
router,
} = this.props
@ -121,8 +118,8 @@ class BucketRow extends PureComponent<Props & WithRouterProps> {
private handleAddCollector = (): void => {
const {
params: {orgID},
bucket: {id},
params: { orgID },
bucket: { id },
} = this.props
const link = `/orgs/${orgID}/load-data/buckets/${id}/telegrafs/new`
@ -131,8 +128,8 @@ class BucketRow extends PureComponent<Props & WithRouterProps> {
private handleAddLineProtocol = (): void => {
const {
params: {orgID},
bucket: {id},
params: { orgID },
bucket: { id },
} = this.props
const link = `/orgs/${orgID}/load-data/buckets/${id}/line-protocols/new`
@ -141,8 +138,8 @@ class BucketRow extends PureComponent<Props & WithRouterProps> {
private handleAddScraper = (): void => {
const {
params: {orgID},
bucket: {id},
params: { orgID },
bucket: { id },
} = this.props
const link = `/orgs/${orgID}/load-data/buckets/${id}/scrapers/new`

View File

@ -1,8 +1,8 @@
// Libraries
import React, {PureComponent} from 'react'
import React, { PureComponent } from 'react'
// Components
import {Context, Alignment, ComponentSize} from 'src/clockface'
import { Context, Alignment, ComponentSize } from 'src/clockface'
import {
ButtonShape,
@ -14,7 +14,7 @@ import {
} from '@influxdata/clockface'
// Types
import {PrettyBucket} from 'src/buckets/components/BucketCard'
import { PrettyBucket } from 'src/buckets/components/BucketCard'
interface Props {
bucket: PrettyBucket
@ -23,7 +23,7 @@ interface Props {
export default class BucketContextMenu extends PureComponent<Props> {
public render() {
const {bucket, onDeleteBucket} = this.props
const { bucket, onDeleteBucket } = this.props
return (
<>
@ -33,23 +33,31 @@ export default class BucketContextMenu extends PureComponent<Props> {
direction={FlexDirection.Row}
margin={ComponentSize.Small}
>
<Context.Menu
icon={IconFont.Trash}
color={ComponentColor.Danger}
shape={ButtonShape.Default}
text="Delete Bucket"
testID="context-delete-menu"
>
<Context.Item
label="Confirm"
action={onDeleteBucket}
value={bucket}
testID="context-delete-task"
/>
</Context.Menu>
{this.deleteButton}
</FlexBox>
</Context>
</>
)
}
private get deleteButton() {
const { bucket, onDeleteBucket } = this.props
if (bucket.type === "user") {
return (<Context.Menu
icon={IconFont.Trash}
color={ComponentColor.Danger}
shape={ButtonShape.Default}
text="Delete Bucket"
testID="context-delete-menu"
>
<Context.Item
label="Confirm"
action={onDeleteBucket}
value={bucket}
testID="context-delete-task"
/>
</Context.Menu>)
}
else return (<></>)
}
}