Various Polish Stories (#11123)
* Decrease space below overlay headings * Make panels contrast with background when nested in a tabbed page * Improve styling of user settings page * Improve styling of Labels and Tokens pages * Polish Bucket overlays * Link to org profile from dashboards list * Refer to actual resource type instead of "This Resource" * Link homepage card to collectors page * Update test snapshotspull/11122/head
alexpaxton
GitHub
parent
2a3b82bd3f
commit
cf7ab909fb
|
|
@ -121,6 +121,6 @@ $overlay-min-height: 150px;
|
|||
|
||||
.overlay--body {
|
||||
padding: $overlay-gutter;
|
||||
padding-top: 18px;
|
||||
padding-top: 0;
|
||||
min-height: $overlay-min-height;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@
|
|||
|
||||
$panel-gutter: $ix-marg-b * 2;
|
||||
$panel-background: $g3-castle;
|
||||
$panel-nested-background: $g4-onyx;
|
||||
|
||||
.panel {
|
||||
display: flex;
|
||||
|
|
@ -55,3 +56,13 @@ $panel-background: $g3-castle;
|
|||
.panel-body hr {
|
||||
margin: $ix-marg-c 0;
|
||||
}
|
||||
|
||||
// Panels Nested inside Tabbed Pages
|
||||
// ----------------------------------------------------------------------------
|
||||
.tabbed-page .panel {
|
||||
background-color: $panel-nested-background;
|
||||
|
||||
.panel-footer {
|
||||
background-color: mix($panel-nested-background, $g3-castle, 50%);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -98,6 +98,7 @@ export default class DashboardsIndexTableRow extends PureComponent<Props> {
|
|||
limitChildCount={4}
|
||||
className="index-list--labels"
|
||||
onEdit={this.handleEditLabels}
|
||||
resourceName="this Dashboard"
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
|
@ -107,6 +108,7 @@ export default class DashboardsIndexTableRow extends PureComponent<Props> {
|
|||
limitChildCount={4}
|
||||
className="index-list--labels"
|
||||
onEdit={this.handleEditLabels}
|
||||
resourceName="this Dashboard"
|
||||
>
|
||||
{dashboard.labels.map(label => (
|
||||
<Label
|
||||
|
|
@ -147,10 +149,15 @@ export default class DashboardsIndexTableRow extends PureComponent<Props> {
|
|||
return dashboard.name || DEFAULT_DASHBOARD_NAME
|
||||
}
|
||||
|
||||
private get ownerName(): string {
|
||||
private get ownerName(): JSX.Element {
|
||||
const {dashboard, orgs} = this.props
|
||||
const ownerOrg = orgs.find(o => o.id === dashboard.orgID)
|
||||
return ownerOrg.name
|
||||
|
||||
return (
|
||||
<Link to={`/organizations/${dashboard.orgID}/members_tab`}>
|
||||
{ownerOrg.name}
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
private get nameClassName(): string {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
// Libraries
|
||||
import React, {PureComponent} from 'react'
|
||||
import {Link} from 'react-router'
|
||||
import {connect} from 'react-redux'
|
||||
|
||||
// Components
|
||||
import GradientBorder from 'src/shared/components/cells/GradientBorder'
|
||||
|
|
@ -8,15 +9,25 @@ import DashboardingGraphic from 'src/me/graphics/DashboardingGraphic'
|
|||
import ExploreGraphic from 'src/me/graphics/ExploreGraphic'
|
||||
import CollectorGraphic from 'src/me/graphics/CollectorGraphic'
|
||||
|
||||
// Types
|
||||
import {Organization} from 'src/types/v2'
|
||||
|
||||
// Styles
|
||||
import 'src/me/components/GettingStarted.scss'
|
||||
|
||||
export default class GettingStarted extends PureComponent {
|
||||
interface StateProps {
|
||||
orgs: Organization[]
|
||||
}
|
||||
|
||||
class GettingStarted extends PureComponent<StateProps> {
|
||||
public render() {
|
||||
return (
|
||||
<div className="getting-started">
|
||||
<div className="getting-started--container">
|
||||
<Link to={`/data-explorer`} className="getting-started--card">
|
||||
<Link
|
||||
to={this.firstOrgCollectorLink}
|
||||
className="getting-started--card"
|
||||
>
|
||||
<GradientBorder />
|
||||
<CollectorGraphic />
|
||||
<h3 className="getting-started--title">
|
||||
|
|
@ -50,4 +61,23 @@ export default class GettingStarted extends PureComponent {
|
|||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
private get firstOrgCollectorLink(): string {
|
||||
const {orgs} = this.props
|
||||
|
||||
const firstOrgID = orgs[0].id
|
||||
|
||||
return `/organizations/${firstOrgID}/collectors_tab`
|
||||
}
|
||||
}
|
||||
|
||||
const mstp = (state): StateProps => {
|
||||
const {orgs} = state
|
||||
|
||||
return {orgs}
|
||||
}
|
||||
|
||||
export default connect<StateProps>(
|
||||
mstp,
|
||||
null
|
||||
)(GettingStarted)
|
||||
|
|
|
|||
|
|
@ -35,15 +35,15 @@ export class Settings extends PureComponent<StateProps, State> {
|
|||
const {me} = this.state
|
||||
|
||||
return (
|
||||
<Panel>
|
||||
<Panel.Header title="About Me">
|
||||
<Button text="Edit About Me" />
|
||||
</Panel.Header>
|
||||
<Panel.Body>
|
||||
<Form>
|
||||
<Grid>
|
||||
<Grid.Row>
|
||||
<Grid.Column widthXS={Columns.Six}>
|
||||
<Grid>
|
||||
<Grid.Row>
|
||||
<Grid.Column widthXS={Columns.Six}>
|
||||
<Panel>
|
||||
<Panel.Header title="About Me">
|
||||
<Button text="Edit About Me" />
|
||||
</Panel.Header>
|
||||
<Panel.Body>
|
||||
<Form>
|
||||
<Form.Element label="Username">
|
||||
<Input
|
||||
value={me.name}
|
||||
|
|
@ -54,12 +54,12 @@ export class Settings extends PureComponent<StateProps, State> {
|
|||
onChange={this.handleChangeInput}
|
||||
/>
|
||||
</Form.Element>
|
||||
</Grid.Column>
|
||||
</Grid.Row>
|
||||
</Grid>
|
||||
</Form>
|
||||
</Panel.Body>
|
||||
</Panel>
|
||||
</Form>
|
||||
</Panel.Body>
|
||||
</Panel>
|
||||
</Grid.Column>
|
||||
</Grid.Row>
|
||||
</Grid>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,10 +3,11 @@ import React, {PureComponent, ChangeEvent} from 'react'
|
|||
import {connect} from 'react-redux'
|
||||
|
||||
// Components
|
||||
import {Panel, Input, Spinner} from 'src/clockface'
|
||||
import {IconFont, Input, Spinner} from 'src/clockface'
|
||||
import ResourceFetcher from 'src/shared/components/resource_fetcher'
|
||||
import TokenList from 'src/me/components/account/TokensList'
|
||||
import FilterList from 'src/shared/components/Filter'
|
||||
import TabbedPageHeader from 'src/shared/components/tabbed_page/TabbedPageHeader'
|
||||
|
||||
// APIs
|
||||
import {getAuthorizations} from 'src/authorizations/apis'
|
||||
|
|
@ -44,37 +45,36 @@ export class Tokens extends PureComponent<Props, State> {
|
|||
const {searchTerm} = this.state
|
||||
|
||||
return (
|
||||
<Panel>
|
||||
<Panel.Body>
|
||||
<>
|
||||
<TabbedPageHeader>
|
||||
<Input
|
||||
icon={IconFont.Search}
|
||||
value={searchTerm}
|
||||
placeholder="Filter tokens by column"
|
||||
placeholder="Filter Tokens..."
|
||||
onChange={this.handleChangeSearchTerm}
|
||||
widthPixels={256}
|
||||
/>
|
||||
</Panel.Body>
|
||||
<Panel.Body>
|
||||
<ResourceFetcher<Authorization[]> fetcher={getAuthorizations}>
|
||||
{(fetchedAuths, loading) => (
|
||||
<Spinner loading={loading}>
|
||||
<FilterList<Authorization>
|
||||
list={fetchedAuths}
|
||||
searchTerm={searchTerm}
|
||||
searchKeys={this.searchKeys}
|
||||
>
|
||||
{filteredAuths => (
|
||||
<TokenList
|
||||
auths={filteredAuths}
|
||||
onNotify={onNotify}
|
||||
searchTerm={searchTerm}
|
||||
/>
|
||||
)}
|
||||
</FilterList>
|
||||
</Spinner>
|
||||
)}
|
||||
</ResourceFetcher>
|
||||
</Panel.Body>
|
||||
</Panel>
|
||||
</TabbedPageHeader>
|
||||
<ResourceFetcher<Authorization[]> fetcher={getAuthorizations}>
|
||||
{(fetchedAuths, loading) => (
|
||||
<Spinner loading={loading}>
|
||||
<FilterList<Authorization>
|
||||
list={fetchedAuths}
|
||||
searchTerm={searchTerm}
|
||||
searchKeys={this.searchKeys}
|
||||
>
|
||||
{filteredAuths => (
|
||||
<TokenList
|
||||
auths={filteredAuths}
|
||||
onNotify={onNotify}
|
||||
searchTerm={searchTerm}
|
||||
/>
|
||||
)}
|
||||
</FilterList>
|
||||
</Spinner>
|
||||
)}
|
||||
</ResourceFetcher>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -82,11 +82,13 @@ export default class TokenList extends PureComponent<Props, State> {
|
|||
|
||||
private get emptyState(): JSX.Element {
|
||||
const {searchTerm} = this.props
|
||||
let emptyStateText = 'Could not find any tokens'
|
||||
let emptyStateText =
|
||||
'There are not any Tokens associated with this account. Contact your administrator'
|
||||
|
||||
if (searchTerm) {
|
||||
emptyStateText = 'Looks like no tokens match your search term'
|
||||
emptyStateText = 'No Tokens match your search term'
|
||||
}
|
||||
|
||||
return (
|
||||
<EmptyState size={ComponentSize.Large}>
|
||||
<EmptyState.Text text={emptyStateText} />
|
||||
|
|
|
|||
|
|
@ -13,81 +13,81 @@ exports[`Account rendering renders! 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<Panel>
|
||||
<Grid>
|
||||
<div
|
||||
className="panel"
|
||||
className="grid--container"
|
||||
>
|
||||
<PanelHeader
|
||||
title="About Me"
|
||||
<Select
|
||||
type={[Function]}
|
||||
>
|
||||
<div
|
||||
className="panel-header"
|
||||
<GridRow
|
||||
key=".0"
|
||||
>
|
||||
<div
|
||||
className="panel-title"
|
||||
className="grid--row"
|
||||
>
|
||||
About Me
|
||||
</div>
|
||||
<div
|
||||
className="panel-controls"
|
||||
>
|
||||
<ComponentSpacer
|
||||
align="right"
|
||||
<GridColumn
|
||||
widthXS={6}
|
||||
>
|
||||
<div
|
||||
className="component-spacer component-spacer--right component-spacer--horizontal"
|
||||
className="grid--column col-xs-6"
|
||||
>
|
||||
<Button
|
||||
active={false}
|
||||
color="default"
|
||||
shape="none"
|
||||
size="sm"
|
||||
status="default"
|
||||
text="Edit About Me"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="button button-sm button-default"
|
||||
disabled={false}
|
||||
tabIndex={0}
|
||||
title="Edit About Me"
|
||||
type="button"
|
||||
<Panel>
|
||||
<div
|
||||
className="panel"
|
||||
>
|
||||
Edit About Me
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
</ComponentSpacer>
|
||||
</div>
|
||||
</div>
|
||||
</PanelHeader>
|
||||
<PanelBody>
|
||||
<div
|
||||
className="panel-body"
|
||||
>
|
||||
<Form>
|
||||
<form
|
||||
className="form--wrapper"
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<Grid>
|
||||
<div
|
||||
className="grid--container"
|
||||
>
|
||||
<Select
|
||||
type={[Function]}
|
||||
>
|
||||
<GridRow
|
||||
key=".0"
|
||||
<PanelHeader
|
||||
title="About Me"
|
||||
>
|
||||
<div
|
||||
className="grid--row"
|
||||
className="panel-header"
|
||||
>
|
||||
<GridColumn
|
||||
widthXS={6}
|
||||
<div
|
||||
className="panel-title"
|
||||
>
|
||||
<div
|
||||
className="grid--column col-xs-6"
|
||||
About Me
|
||||
</div>
|
||||
<div
|
||||
className="panel-controls"
|
||||
>
|
||||
<ComponentSpacer
|
||||
align="right"
|
||||
>
|
||||
<div
|
||||
className="component-spacer component-spacer--right component-spacer--horizontal"
|
||||
>
|
||||
<Button
|
||||
active={false}
|
||||
color="default"
|
||||
shape="none"
|
||||
size="sm"
|
||||
status="default"
|
||||
text="Edit About Me"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="button button-sm button-default"
|
||||
disabled={false}
|
||||
tabIndex={0}
|
||||
title="Edit About Me"
|
||||
type="button"
|
||||
>
|
||||
Edit About Me
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
</ComponentSpacer>
|
||||
</div>
|
||||
</div>
|
||||
</PanelHeader>
|
||||
<PanelBody>
|
||||
<div
|
||||
className="panel-body"
|
||||
>
|
||||
<Form>
|
||||
<form
|
||||
className="form--wrapper"
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<FormElement
|
||||
label="Username"
|
||||
|
|
@ -148,18 +148,18 @@ exports[`Account rendering renders! 1`] = `
|
|||
</Input>
|
||||
</div>
|
||||
</FormElement>
|
||||
</div>
|
||||
</GridColumn>
|
||||
</form>
|
||||
</Form>
|
||||
</div>
|
||||
</GridRow>
|
||||
</Select>
|
||||
</div>
|
||||
</Grid>
|
||||
</form>
|
||||
</Form>
|
||||
</div>
|
||||
</PanelBody>
|
||||
</PanelBody>
|
||||
</div>
|
||||
</Panel>
|
||||
</div>
|
||||
</GridColumn>
|
||||
</div>
|
||||
</GridRow>
|
||||
</Select>
|
||||
</div>
|
||||
</Panel>
|
||||
</Grid>
|
||||
</Settings>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -4,135 +4,250 @@ exports[`Account rendering renders! 1`] = `
|
|||
<Tokens
|
||||
authorizationsLink="api/v2/authorizations"
|
||||
>
|
||||
<Panel>
|
||||
<TabbedPageHeader>
|
||||
<div
|
||||
className="panel"
|
||||
className="tabbed-page-section--header"
|
||||
>
|
||||
<PanelBody>
|
||||
<Input
|
||||
autoFocus={false}
|
||||
autocomplete="off"
|
||||
disabledTitleText="This input is disabled"
|
||||
icon="search"
|
||||
name=""
|
||||
onChange={[Function]}
|
||||
placeholder="Filter Tokens..."
|
||||
size="sm"
|
||||
spellCheck={false}
|
||||
status="default"
|
||||
titleText=""
|
||||
value=""
|
||||
widthPixels={256}
|
||||
>
|
||||
<div
|
||||
className="panel-body"
|
||||
className="input input-sm input--has-icon"
|
||||
style={
|
||||
Object {
|
||||
"width": "256px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Input
|
||||
<input
|
||||
autoComplete="off"
|
||||
autoFocus={false}
|
||||
autocomplete="off"
|
||||
disabledTitleText="This input is disabled"
|
||||
className="input-field"
|
||||
disabled={false}
|
||||
name=""
|
||||
onChange={[Function]}
|
||||
placeholder="Filter tokens by column"
|
||||
size="sm"
|
||||
placeholder="Filter Tokens..."
|
||||
spellCheck={false}
|
||||
status="default"
|
||||
titleText=""
|
||||
title=""
|
||||
value=""
|
||||
widthPixels={256}
|
||||
>
|
||||
<div
|
||||
className="input input-sm"
|
||||
style={
|
||||
Object {
|
||||
"width": "256px",
|
||||
}
|
||||
}
|
||||
>
|
||||
<input
|
||||
autoComplete="off"
|
||||
autoFocus={false}
|
||||
className="input-field"
|
||||
disabled={false}
|
||||
name=""
|
||||
onChange={[Function]}
|
||||
placeholder="Filter tokens by column"
|
||||
spellCheck={false}
|
||||
title=""
|
||||
value=""
|
||||
/>
|
||||
<div
|
||||
className="input-shadow"
|
||||
/>
|
||||
</div>
|
||||
</Input>
|
||||
/>
|
||||
<span
|
||||
className="input-icon icon search"
|
||||
/>
|
||||
<div
|
||||
className="input-shadow"
|
||||
/>
|
||||
</div>
|
||||
</PanelBody>
|
||||
<PanelBody>
|
||||
<div
|
||||
className="panel-body"
|
||||
</Input>
|
||||
</div>
|
||||
</TabbedPageHeader>
|
||||
<ResourceFetcher
|
||||
fetcher={[Function]}
|
||||
>
|
||||
<Spinner
|
||||
loading="Done"
|
||||
>
|
||||
<FilterList
|
||||
list={
|
||||
Array [
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "030444b11fb10000",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "1",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
]
|
||||
}
|
||||
searchKeys={
|
||||
Array [
|
||||
"status",
|
||||
"description",
|
||||
]
|
||||
}
|
||||
searchTerm=""
|
||||
>
|
||||
<TokenList
|
||||
auths={
|
||||
Array [
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "030444b11fb10000",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "1",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
]
|
||||
}
|
||||
searchTerm=""
|
||||
>
|
||||
<ResourceFetcher
|
||||
fetcher={[Function]}
|
||||
>
|
||||
<Spinner
|
||||
loading="Done"
|
||||
<IndexList>
|
||||
<table
|
||||
className="index-list"
|
||||
>
|
||||
<FilterList
|
||||
list={
|
||||
Array [
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "030444b11fb10000",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "1",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
]
|
||||
<IndexListHeader>
|
||||
<thead
|
||||
className="index-list--header"
|
||||
>
|
||||
<tr>
|
||||
<IndexListHeaderCell
|
||||
alignment="left"
|
||||
columnName="Description"
|
||||
>
|
||||
<th
|
||||
className="index-list--header-cell index-list--align-left"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"width": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
Description
|
||||
</th>
|
||||
</IndexListHeaderCell>
|
||||
<IndexListHeaderCell
|
||||
alignment="left"
|
||||
columnName="Status"
|
||||
>
|
||||
<th
|
||||
className="index-list--header-cell index-list--align-left"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"width": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
Status
|
||||
</th>
|
||||
</IndexListHeaderCell>
|
||||
</tr>
|
||||
</thead>
|
||||
</IndexListHeader>
|
||||
<IndexListBody
|
||||
columnCount={2}
|
||||
emptyState={
|
||||
<EmptyState
|
||||
size="lg"
|
||||
>
|
||||
<EmptyStateText
|
||||
text="There are not any Tokens associated with this account. Contact your administrator"
|
||||
/>
|
||||
</EmptyState>
|
||||
}
|
||||
searchKeys={
|
||||
Array [
|
||||
"status",
|
||||
"description",
|
||||
]
|
||||
}
|
||||
searchTerm=""
|
||||
>
|
||||
<TokenList
|
||||
auths={
|
||||
Array [
|
||||
<tbody
|
||||
className="index-list--body"
|
||||
>
|
||||
<TokenRow
|
||||
auth={
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "030444b11fb10000",
|
||||
|
|
@ -159,7 +274,96 @@ exports[`Account rendering renders! 1`] = `
|
|||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
}
|
||||
}
|
||||
key="030444b11fb10000"
|
||||
onClickDescription={[Function]}
|
||||
>
|
||||
<IndexListRow
|
||||
disabled={false}
|
||||
>
|
||||
<tr
|
||||
className="index-list--row"
|
||||
>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<a
|
||||
data-test="token-description-030444b11fb10000"
|
||||
href="#"
|
||||
onClick={[Function]}
|
||||
>
|
||||
im a token
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
active
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="right"
|
||||
revealOnHover={true}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--show-hover index-list--align-right"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<ComponentSpacer
|
||||
align="right"
|
||||
>
|
||||
<div
|
||||
className="component-spacer component-spacer--right component-spacer--horizontal"
|
||||
>
|
||||
<Button
|
||||
active={false}
|
||||
color="danger"
|
||||
shape="none"
|
||||
size="xs"
|
||||
status="default"
|
||||
text="Delete"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="button button-xs button-danger"
|
||||
disabled={false}
|
||||
tabIndex={0}
|
||||
title="Delete"
|
||||
type="button"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
</ComponentSpacer>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
</tr>
|
||||
</IndexListRow>
|
||||
</TokenRow>
|
||||
<TokenRow
|
||||
auth={
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "1",
|
||||
|
|
@ -186,328 +390,116 @@ exports[`Account rendering renders! 1`] = `
|
|||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
},
|
||||
]
|
||||
}
|
||||
searchTerm=""
|
||||
>
|
||||
<IndexList>
|
||||
<table
|
||||
className="index-list"
|
||||
>
|
||||
<IndexListHeader>
|
||||
<thead
|
||||
className="index-list--header"
|
||||
>
|
||||
<tr>
|
||||
<IndexListHeaderCell
|
||||
alignment="left"
|
||||
columnName="Description"
|
||||
>
|
||||
<th
|
||||
className="index-list--header-cell index-list--align-left"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"width": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
Description
|
||||
</th>
|
||||
</IndexListHeaderCell>
|
||||
<IndexListHeaderCell
|
||||
alignment="left"
|
||||
columnName="Status"
|
||||
>
|
||||
<th
|
||||
className="index-list--header-cell index-list--align-left"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"width": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
Status
|
||||
</th>
|
||||
</IndexListHeaderCell>
|
||||
</tr>
|
||||
</thead>
|
||||
</IndexListHeader>
|
||||
<IndexListBody
|
||||
columnCount={2}
|
||||
emptyState={
|
||||
<EmptyState
|
||||
size="lg"
|
||||
>
|
||||
<EmptyStateText
|
||||
text="Could not find any tokens"
|
||||
/>
|
||||
</EmptyState>
|
||||
}
|
||||
>
|
||||
<tbody
|
||||
className="index-list--body"
|
||||
>
|
||||
<TokenRow
|
||||
auth={
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "030444b11fb10000",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
}
|
||||
}
|
||||
key="030444b11fb10000"
|
||||
onClickDescription={[Function]}
|
||||
>
|
||||
<IndexListRow
|
||||
disabled={false}
|
||||
>
|
||||
<tr
|
||||
className="index-list--row"
|
||||
>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<a
|
||||
data-test="token-description-030444b11fb10000"
|
||||
href="#"
|
||||
onClick={[Function]}
|
||||
>
|
||||
im a token
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
active
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="right"
|
||||
revealOnHover={true}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--show-hover index-list--align-right"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<ComponentSpacer
|
||||
align="right"
|
||||
>
|
||||
<div
|
||||
className="component-spacer component-spacer--right component-spacer--horizontal"
|
||||
>
|
||||
<Button
|
||||
active={false}
|
||||
color="danger"
|
||||
shape="none"
|
||||
size="xs"
|
||||
status="default"
|
||||
text="Delete"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="button button-xs button-danger"
|
||||
disabled={false}
|
||||
tabIndex={0}
|
||||
title="Delete"
|
||||
type="button"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
</ComponentSpacer>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
</tr>
|
||||
</IndexListRow>
|
||||
</TokenRow>
|
||||
<TokenRow
|
||||
auth={
|
||||
Object {
|
||||
"description": "im a token",
|
||||
"id": "1",
|
||||
"links": Object {
|
||||
"self": "/api/v2/authorizations/030444b11fb10000",
|
||||
"user": "/api/v2/users/030444b10a710000",
|
||||
},
|
||||
"orgID": "030444b10a713000",
|
||||
"permissions": Array [
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "orgs",
|
||||
},
|
||||
},
|
||||
Object {
|
||||
"action": "write",
|
||||
"resource": Object {
|
||||
"type": "buckets",
|
||||
},
|
||||
},
|
||||
],
|
||||
"status": "active",
|
||||
"token": "ohEmfY80A9UsW_cicNXgOMIPIsUvU6K9YcpTfCPQE3NV8Y6nTsCwVghczATBPyQh96CoZkOW5DIKldya6Y84KA==",
|
||||
"user": "watts",
|
||||
"userID": "030444b10a710000",
|
||||
}
|
||||
}
|
||||
key="1"
|
||||
onClickDescription={[Function]}
|
||||
>
|
||||
<IndexListRow
|
||||
disabled={false}
|
||||
>
|
||||
<tr
|
||||
className="index-list--row"
|
||||
>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<a
|
||||
data-test="token-description-1"
|
||||
href="#"
|
||||
onClick={[Function]}
|
||||
>
|
||||
im a token
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
active
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="right"
|
||||
revealOnHover={true}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--show-hover index-list--align-right"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<ComponentSpacer
|
||||
align="right"
|
||||
>
|
||||
<div
|
||||
className="component-spacer component-spacer--right component-spacer--horizontal"
|
||||
>
|
||||
<Button
|
||||
active={false}
|
||||
color="danger"
|
||||
shape="none"
|
||||
size="xs"
|
||||
status="default"
|
||||
text="Delete"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="button button-xs button-danger"
|
||||
disabled={false}
|
||||
tabIndex={0}
|
||||
title="Delete"
|
||||
type="button"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
</ComponentSpacer>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
</tr>
|
||||
</IndexListRow>
|
||||
</TokenRow>
|
||||
</tbody>
|
||||
</IndexListBody>
|
||||
</table>
|
||||
</IndexList>
|
||||
<OverlayTechnology
|
||||
visible={false}
|
||||
}
|
||||
}
|
||||
key="1"
|
||||
onClickDescription={[Function]}
|
||||
>
|
||||
<div
|
||||
className="overlay-tech"
|
||||
<IndexListRow
|
||||
disabled={false}
|
||||
>
|
||||
<div
|
||||
className="overlay--dialog"
|
||||
data-test="overlay-children"
|
||||
/>
|
||||
<div
|
||||
className="overlay--mask"
|
||||
/>
|
||||
</div>
|
||||
</OverlayTechnology>
|
||||
</TokenList>
|
||||
</FilterList>
|
||||
</Spinner>
|
||||
</ResourceFetcher>
|
||||
</div>
|
||||
</PanelBody>
|
||||
</div>
|
||||
</Panel>
|
||||
<tr
|
||||
className="index-list--row"
|
||||
>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<a
|
||||
data-test="token-description-1"
|
||||
href="#"
|
||||
onClick={[Function]}
|
||||
>
|
||||
im a token
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="left"
|
||||
revealOnHover={false}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--align-left"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
active
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
<IndexListRowCell
|
||||
alignment="right"
|
||||
revealOnHover={true}
|
||||
>
|
||||
<td
|
||||
className="index-list--row-cell index-list--show-hover index-list--align-right"
|
||||
>
|
||||
<div
|
||||
className="index-list--cell"
|
||||
>
|
||||
<ComponentSpacer
|
||||
align="right"
|
||||
>
|
||||
<div
|
||||
className="component-spacer component-spacer--right component-spacer--horizontal"
|
||||
>
|
||||
<Button
|
||||
active={false}
|
||||
color="danger"
|
||||
shape="none"
|
||||
size="xs"
|
||||
status="default"
|
||||
text="Delete"
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="button button-xs button-danger"
|
||||
disabled={false}
|
||||
tabIndex={0}
|
||||
title="Delete"
|
||||
type="button"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
</ComponentSpacer>
|
||||
</div>
|
||||
</td>
|
||||
</IndexListRowCell>
|
||||
</tr>
|
||||
</IndexListRow>
|
||||
</TokenRow>
|
||||
</tbody>
|
||||
</IndexListBody>
|
||||
</table>
|
||||
</IndexList>
|
||||
<OverlayTechnology
|
||||
visible={false}
|
||||
>
|
||||
<div
|
||||
className="overlay-tech"
|
||||
>
|
||||
<div
|
||||
className="overlay--dialog"
|
||||
data-test="overlay-children"
|
||||
/>
|
||||
<div
|
||||
className="overlay--mask"
|
||||
/>
|
||||
</div>
|
||||
</OverlayTechnology>
|
||||
</TokenList>
|
||||
</FilterList>
|
||||
</Spinner>
|
||||
</ResourceFetcher>
|
||||
</Tokens>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -60,25 +60,24 @@ export default class BucketOverlayForm extends PureComponent<Props> {
|
|||
/>
|
||||
</Form.Element>
|
||||
</Grid.Column>
|
||||
<Grid.Column>
|
||||
<Retention
|
||||
type={ruleType}
|
||||
retentionSeconds={retentionSeconds}
|
||||
onChangeRuleType={onChangeRuleType}
|
||||
onChangeRetentionRule={onChangeRetentionRule}
|
||||
/>
|
||||
</Grid.Column>
|
||||
<Retention
|
||||
type={ruleType}
|
||||
retentionSeconds={retentionSeconds}
|
||||
onChangeRuleType={onChangeRuleType}
|
||||
onChangeRetentionRule={onChangeRetentionRule}
|
||||
/>
|
||||
</Grid.Row>
|
||||
<Grid.Row>
|
||||
<Grid.Column>
|
||||
<Form.Footer>
|
||||
<Button
|
||||
text="Cancel"
|
||||
color={ComponentColor.Danger}
|
||||
onClick={onCloseModal}
|
||||
type={ButtonType.Button}
|
||||
/>
|
||||
<Button
|
||||
text={buttonText}
|
||||
color={ComponentColor.Primary}
|
||||
color={this.submitButtonColor}
|
||||
type={ButtonType.Submit}
|
||||
/>
|
||||
</Form.Footer>
|
||||
|
|
@ -88,4 +87,14 @@ export default class BucketOverlayForm extends PureComponent<Props> {
|
|||
</Form>
|
||||
)
|
||||
}
|
||||
|
||||
private get submitButtonColor(): ComponentColor {
|
||||
const {buttonText} = this.props
|
||||
|
||||
if (buttonText === 'Save Changes') {
|
||||
return ComponentColor.Success
|
||||
}
|
||||
|
||||
return ComponentColor.Primary
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ export default class BucketOverlay extends PureComponent<Props, State> {
|
|||
const {bucket, nameInputStatus, errorMessage, ruleType} = this.state
|
||||
|
||||
return (
|
||||
<OverlayContainer>
|
||||
<OverlayContainer maxWidth={500}>
|
||||
<OverlayHeading
|
||||
title="Create Bucket"
|
||||
onDismiss={this.props.onCloseModal}
|
||||
|
|
|
|||
|
|
@ -213,15 +213,26 @@ class Labels extends PureComponent<Props, State> {
|
|||
private get emptyState(): JSX.Element {
|
||||
const {searchTerm} = this.state
|
||||
|
||||
let emptyText = 'No Labels were found'
|
||||
|
||||
if (searchTerm) {
|
||||
emptyText = 'No Labels match your search term'
|
||||
return (
|
||||
<EmptyState size={ComponentSize.Medium}>
|
||||
<EmptyState.Text text="No Labels match your search term" />
|
||||
</EmptyState>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<EmptyState size={ComponentSize.Medium}>
|
||||
<EmptyState.Text text={emptyText} />
|
||||
<EmptyState.Text
|
||||
text="Looks like you haven't created any Labels , why not create one?"
|
||||
highlightWords={['Labels']}
|
||||
/>
|
||||
<Button
|
||||
text="Create Label"
|
||||
color={ComponentColor.Primary}
|
||||
icon={IconFont.Plus}
|
||||
onClick={this.handleShowOverlay}
|
||||
/>
|
||||
</EmptyState>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
import React, {PureComponent, ChangeEvent} from 'react'
|
||||
|
||||
// Components
|
||||
import {Form, Radio} from 'src/clockface'
|
||||
import {Grid, Form, Radio, ButtonShape} from 'src/clockface'
|
||||
import RetentionDuration from 'src/organizations/components/RetentionDuration'
|
||||
|
||||
// Utils
|
||||
|
|
@ -27,24 +27,26 @@ export default class Retention extends PureComponent<Props> {
|
|||
|
||||
return (
|
||||
<>
|
||||
<Form.Element label="How often to clear data?">
|
||||
<Radio>
|
||||
<Radio.Button
|
||||
active={type === BucketRetentionRules.TypeEnum.Expire}
|
||||
onClick={this.handleRadioClick}
|
||||
value={BucketRetentionRules.TypeEnum.Expire}
|
||||
>
|
||||
Periodically
|
||||
</Radio.Button>
|
||||
<Radio.Button
|
||||
active={type === null}
|
||||
onClick={this.handleRadioClick}
|
||||
value={null}
|
||||
>
|
||||
Never
|
||||
</Radio.Button>
|
||||
</Radio>
|
||||
</Form.Element>
|
||||
<Grid.Column>
|
||||
<Form.Element label="How often to clear data?">
|
||||
<Radio shape={ButtonShape.StretchToFit}>
|
||||
<Radio.Button
|
||||
active={type === BucketRetentionRules.TypeEnum.Expire}
|
||||
onClick={this.handleRadioClick}
|
||||
value={BucketRetentionRules.TypeEnum.Expire}
|
||||
>
|
||||
Periodically
|
||||
</Radio.Button>
|
||||
<Radio.Button
|
||||
active={type === null}
|
||||
onClick={this.handleRadioClick}
|
||||
value={null}
|
||||
>
|
||||
Never
|
||||
</Radio.Button>
|
||||
</Radio>
|
||||
</Form.Element>
|
||||
</Grid.Column>
|
||||
<RetentionDuration
|
||||
type={type}
|
||||
retentionSeconds={retentionSeconds}
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ export default class RetentionDuration extends PureComponent<Props> {
|
|||
|
||||
return (
|
||||
<>
|
||||
<Grid.Column widthXS={Columns.Two}>
|
||||
<Grid.Column widthSM={Columns.Three}>
|
||||
<Form.Element label="Days">
|
||||
<Input
|
||||
name={DurationKey.Days}
|
||||
|
|
@ -41,7 +41,7 @@ export default class RetentionDuration extends PureComponent<Props> {
|
|||
/>
|
||||
</Form.Element>
|
||||
</Grid.Column>
|
||||
<Grid.Column widthXS={Columns.Two}>
|
||||
<Grid.Column widthSM={Columns.Three}>
|
||||
<Form.Element label="Hours">
|
||||
<Input
|
||||
name={DurationKey.Hours}
|
||||
|
|
@ -52,7 +52,7 @@ export default class RetentionDuration extends PureComponent<Props> {
|
|||
/>
|
||||
</Form.Element>
|
||||
</Grid.Column>
|
||||
<Grid.Column widthXS={Columns.Two}>
|
||||
<Grid.Column widthSM={Columns.Three}>
|
||||
<Form.Element label="Minutes">
|
||||
<Input
|
||||
name={DurationKey.Minutes}
|
||||
|
|
@ -63,7 +63,7 @@ export default class RetentionDuration extends PureComponent<Props> {
|
|||
/>
|
||||
</Form.Element>
|
||||
</Grid.Column>
|
||||
<Grid.Column widthXS={Columns.Two}>
|
||||
<Grid.Column widthSM={Columns.Three}>
|
||||
<Form.Element label="Seconds">
|
||||
<Input
|
||||
name={DurationKey.Seconds}
|
||||
|
|
|
|||
|
|
@ -44,15 +44,15 @@ export default class BucketOverlay extends PureComponent<Props, State> {
|
|||
const {bucket, nameInputStatus, errorMessage, ruleType} = this.state
|
||||
|
||||
return (
|
||||
<OverlayContainer>
|
||||
<OverlayContainer maxWidth={500}>
|
||||
<OverlayHeading
|
||||
title="Update Bucket"
|
||||
title="Edit Bucket"
|
||||
onDismiss={this.props.onCloseModal}
|
||||
/>
|
||||
<OverlayBody>
|
||||
<BucketOverlayForm
|
||||
name={bucket.name}
|
||||
buttonText="Update"
|
||||
buttonText="Save Changes"
|
||||
ruleType={ruleType}
|
||||
onCloseModal={onCloseModal}
|
||||
errorMessage={errorMessage}
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@ export class TaskRow extends PureComponent<Props & WithRouterProps> {
|
|||
}
|
||||
|
||||
return (
|
||||
<Label.Container limitChildCount={4}>
|
||||
<Label.Container limitChildCount={4} resourceName="this Task">
|
||||
{task.labels.map(label => (
|
||||
<Label
|
||||
key={label.resourceID}
|
||||
|
|
|
|||
Loading…
Reference in New Issue