Influxdata
/
influxdb
mirror of https://github.com/influxdata/influxdb.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Update providers page to fit into admin tabs UI

pull/10616/head
Alex P 2017-11-14 10:19:36 -08:00 committed by Jared Scheib
parent d39c71d9cb
commit d40f086f4a
3 changed files with 51 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
ui/src/admin/components/chronograf/AdminTabs.js
View File

@ -9,9 +9,11 @@ import {
import {Tab, Tabs, TabPanel, TabPanels, TabList} from 'shared/components/Tabs'
import OrganizationsPage from 'src/admin/containers/chronograf/OrganizationsPage'
import UsersPage from 'src/admin/containers/chronograf/UsersPage'
import ProvidersPage from 'src/admin/containers/ProvidersPage'
const ORGANIZATIONS_TAB_NAME = 'Organizations'
const USERS_TAB_NAME = 'Users'
const PROVIDERS_TAB_NAME = 'Providers'
const AdminTabs = ({
me: {currentOrganization: meCurrentOrganization, role: meRole, id: meID},
@ -31,6 +33,11 @@ const AdminTabs = ({
<UsersPage meID={meID} meCurrentOrganization={meCurrentOrganization} />
),
},
{
requiredRole: SUPERADMIN_ROLE,
type: PROVIDERS_TAB_NAME,
component: <ProvidersPage />,
},
].filter(t => isUserAuthorized(meRole, t.requiredRole))
return (

74
ui/src/admin/components/chronograf/ProvidersTable.js
View File

@ -32,52 +32,44 @@ class ProvidersTable extends Component {
providerMaps.length === 1 ? '1 Map' : `${providerMaps.length} Maps`
return (
<div className="container-fluid">
<div className="row">
<div className="col-xs-12">
<div className="panel panel-minimal">
<div className="panel-heading u-flex u-ai-center u-jc-space-between">
<h2 className="panel-title">
{tableTitle}
</h2>
<button
className="btn btn-sm btn-primary"
onClick={this.handleClickCreateMap}
disabled={isCreatingMap}
>
<span className="icon plus" /> Create Map
</button>
</div>
<div className="panel-body">
<div className="providers-labels">
<div className="providers-labels--id">ID</div>
<div className="providers-labels--scheme">Scheme</div>
<div className="providers-labels--provider">Provider</div>
<div className="providers-labels--providerorg">
Provider Org
</div>
<div className="providers-labels--arrow" />
<div className="providers-labels--redirect">Organization</div>
<div className="providers-labels--delete" />
</div>
{/* {isCreatingMap
<div className="panel panel-default">
<div className="panel-heading u-flex u-ai-center u-jc-space-between">
<h2 className="panel-title">
{tableTitle}
</h2>
<button
className="btn btn-sm btn-primary"
onClick={this.handleClickCreateMap}
disabled={isCreatingMap}
>
<span className="icon plus" /> Create Map
</button>
</div>
<div className="panel-body">
<div className="providers-labels">
<div className="providers-labels--id">ID</div>
<div className="providers-labels--scheme">Scheme</div>
<div className="providers-labels--provider">Provider</div>
<div className="providers-labels--providerorg">Provider Org</div>
<div className="providers-labels--arrow" />
<div className="providers-labels--redirect">Organization</div>
<div className="providers-labels--delete" />
</div>
{/* {isCreatingMap
? <NewProviderMap
onCreateMap={this.handleCreateMap}
onDismissCreateMap={this.handleDismissCreateMap}
/>
: null} */}
{providerMaps.map(providerMap =>
<ProviderMap
key={providerMap.id}
providerMap={providerMap}
organizations={organizations}
onDelete={onDeleteMap}
onUpdate={onUpdateMap}
/>
)}
</div>
</div>
</div>
{providerMaps.map(providerMap =>
<ProviderMap
key={providerMap.id}
providerMap={providerMap}
organizations={organizations}
onDelete={onDeleteMap}
onUpdate={onUpdateMap}
/>
)}
</div>
</div>
)

36
ui/src/admin/containers/ProvidersPage.js
View File

@ -6,7 +6,6 @@ import * as adminChronografActionCreators from 'src/admin/actions/chronograf'
import {publishAutoDismissingNotification} from 'shared/dispatchers'
import ProvidersTable from 'src/admin/components/chronograf/ProvidersTable'
import FancyScrollbar from 'shared/components/FancyScrollbar'
import {PROVIDER_MAPS} from 'src/admin/constants/dummyProviderMaps'
@ -23,8 +22,8 @@ class ProvidersPage extends Component {
handleCreateMap = () => {}
handleUpdateMap = updatedMap => {
console.log(updatedMap)
handleUpdateMap = _updatedMap => {
// console.log(_updatedMap)
}
handleDeleteMap = () => {}
@ -32,28 +31,15 @@ class ProvidersPage extends Component {
render() {
const {organizations, providerMaps} = this.props
return (
<div className="page">
<div className="page-header">
<div className="page-header__container">
<div className="page-header__left">
<h1 className="page-header__title">Manage Providers</h1>
</div>
</div>
</div>
<FancyScrollbar className="page-contents">
{organizations
? <ProvidersTable
providerMaps={PROVIDER_MAPS} // TODO: replace with providerMaps prop
organizations={organizations}
onCreateMap={this.handleCreateMap}
onUpdateMap={this.handleUpdateMap}
onDeleteMap={this.handleDeleteMap}
/>
: <div className="page-spinner" />}
</FancyScrollbar>
</div>
)
return organizations
? <ProvidersTable
providerMaps={PROVIDER_MAPS} // TODO: replace with providerMaps prop
organizations={organizations}
onCreateMap={this.handleCreateMap}
onUpdateMap={this.handleUpdateMap}
onDeleteMap={this.handleDeleteMap}
/>
: <div className="page-spinner" />
}
}