-
Notifications
You must be signed in to change notification settings - Fork 121
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
(cherry picked from commit ff9008a)
- Loading branch information
Showing
7 changed files
with
791 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
163 changes: 163 additions & 0 deletions
163
portals/admin/src/main/webapp/source/src/app/components/APISettings/ApisTableContent.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,163 @@ | ||
| /* | ||
| * Copyright (c) 2021, WSO2 Inc. (http://www.wso2.org) All Rights Reserved. | ||
| * | ||
| * WSO2 Inc. licenses this file to you under the Apache License, | ||
| * Version 2.0 (the "License"); you may not use this file except | ||
| * in compliance with the License. | ||
| * You may obtain a copy of the License at | ||
| * | ||
| * http://www.apache.org/licenses/LICENSE-2.0 | ||
| * | ||
| * Unless required by applicable law or agreed to in writing, | ||
| * software distributed under the License is distributed on an | ||
| * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY | ||
| * KIND, either express or implied. See the License for the | ||
| * specific language governing permissions and limitations | ||
| * under the License. | ||
| */ | ||
|
|
||
| import React, { Component } from 'react'; | ||
| import TableBody from '@material-ui/core/TableBody'; | ||
| import TableCell from '@material-ui/core/TableCell'; | ||
| import TableRow from '@material-ui/core/TableRow'; | ||
| import ResourceNotFound from 'AppComponents/Base/Errors/ResourceNotFound'; | ||
| import PropTypes from 'prop-types'; | ||
| import { withStyles } from '@material-ui/core/styles'; | ||
| import EditApi from 'AppComponents/APISettings/EditApi'; | ||
| /** | ||
| * @inheritdoc | ||
| * @param {*} theme theme object | ||
| */ | ||
| const styles = (theme) => ({ | ||
| fullHeight: { | ||
| height: '100%', | ||
| }, | ||
| tableRow: { | ||
| height: theme.spacing(5), | ||
| '& td': { | ||
| padding: theme.spacing(0.5), | ||
| }, | ||
| }, | ||
| appOwner: { | ||
| pointerEvents: 'none', | ||
| }, | ||
| appName: { | ||
| '& a': { | ||
| color: '#1b9ec7 !important', | ||
| }, | ||
| }, | ||
| appTablePaper: { | ||
| '& table tr td': { | ||
| paddingLeft: theme.spacing(1), | ||
| }, | ||
| '& table tr td:first-child, & table tr th:first-child': { | ||
| paddingLeft: theme.spacing(2), | ||
| }, | ||
| '& table tr td button.Mui-disabled span.material-icons': { | ||
| color: theme.palette.action.disabled, | ||
| }, | ||
| }, | ||
| tableCellWrapper: { | ||
| '& td': { | ||
| 'word-break': 'break-all', | ||
| 'white-space': 'normal', | ||
| }, | ||
| }, | ||
| }); | ||
| const StyledTableCell = withStyles((theme) => ({ | ||
| head: { | ||
| backgroundColor: theme.palette.common.black, | ||
| color: theme.palette.common.white, | ||
| }, | ||
| body: { | ||
| fontSize: 14, | ||
| }, | ||
| root: { | ||
| '&:first-child': { | ||
| paddingLeft: theme.spacing(2), | ||
| }, | ||
| }, | ||
| }))(TableCell); | ||
|
|
||
| const StyledTableRow = withStyles((theme) => ({ | ||
| root: { | ||
| '&:nth-of-type(odd)': { | ||
| backgroundColor: theme.palette.background.default, | ||
| }, | ||
| }, | ||
| }))(TableRow); | ||
|
|
||
| /** | ||
| * | ||
| * | ||
| * @class ApisTableContent | ||
| * @extends {Component} | ||
| */ | ||
| class ApisTableContent extends Component { | ||
| /** | ||
| * @inheritdoc | ||
| */ | ||
| constructor(props) { | ||
| super(props); | ||
| this.state = { | ||
| notFound: false, | ||
| }; | ||
| this.handleAppEdit = this.handleAppEdit.bind(this); | ||
| } | ||
|
|
||
| handleAppEdit = (app) => { | ||
| const { EditComponent, editComponentProps, apiCall } = this.props; | ||
| return ( | ||
| <> | ||
| {EditComponent && ( | ||
| <EditComponent | ||
| dataRow={app} | ||
| updateList={apiCall} | ||
| {...editComponentProps} | ||
| /> | ||
| )} | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| /** | ||
| * @inheritdoc | ||
| * @memberof ApisTableContent | ||
| */ | ||
| render() { | ||
| const { | ||
| apps, classes, editComponentProps, apiCall, | ||
| } = this.props; | ||
| const { notFound } = this.state; | ||
|
|
||
| if (notFound) { | ||
| return <ResourceNotFound />; | ||
| } | ||
| return ( | ||
| <TableBody className={classes.fullHeight}> | ||
| {apps && apps.map((app) => { | ||
| return ( | ||
| <StyledTableRow className={classes.tableRow} key={app.apiId}> | ||
| <StyledTableCell align='left'> | ||
| {app.name} | ||
| </StyledTableCell> | ||
| <StyledTableCell align='left'>{app.owner}</StyledTableCell> | ||
| <StyledTableCell align='left'> | ||
| <EditApi | ||
| dataRow={app} | ||
| updateList={apiCall} | ||
| {...editComponentProps} | ||
| /> | ||
| </StyledTableCell> | ||
| </StyledTableRow> | ||
| ); | ||
| })} | ||
| </TableBody> | ||
| ); | ||
| } | ||
| } | ||
| ApisTableContent.propTypes = { | ||
| toggleDeleteConfirmation: PropTypes.func.isRequired, | ||
| apps: PropTypes.instanceOf(Map).isRequired, | ||
| }; | ||
| export default withStyles(styles)(ApisTableContent); |
102 changes: 102 additions & 0 deletions
102
portals/admin/src/main/webapp/source/src/app/components/APISettings/ApisTableHead.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,102 @@ | ||
| /* | ||
| * Copyright (c) 2021, WSO2 Inc. (http://www.wso2.org) All Rights Reserved. | ||
| * | ||
| * WSO2 Inc. licenses this file to you under the Apache License, | ||
| * Version 2.0 (the "License"); you may not use this file except | ||
| * in compliance with the License. | ||
| * You may obtain a copy of the License at | ||
| * | ||
| * http://www.apache.org/licenses/LICENSE-2.0 | ||
| * | ||
| * Unless required by applicable law or agreed to in writing, | ||
| * software distributed under the License is distributed on an | ||
| * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY | ||
| * KIND, either express or implied. See the License for the | ||
| * specific language governing permissions and limitations | ||
| * under the License. | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import TableCell from '@material-ui/core/TableCell'; | ||
| import TableHead from '@material-ui/core/TableHead'; | ||
| import TableRow from '@material-ui/core/TableRow'; | ||
| import TableSortLabel from '@material-ui/core/TableSortLabel'; | ||
| import { FormattedMessage } from 'react-intl'; | ||
|
|
||
| /** | ||
| * @inheritdoc | ||
| * @class apiTableHead | ||
| * @extends {Component} | ||
| */ | ||
| const apisTableHead = (props) => { | ||
| const createSortHandler = (property) => (event) => { | ||
| props.onRequestSort(event, property); | ||
| }; | ||
| const columnData = [ | ||
| { | ||
| id: 'name', | ||
| numeric: false, | ||
| disablePadding: true, | ||
| label: (<FormattedMessage | ||
| id='Apis.Listing.apiTableHead.name' | ||
| defaultMessage='Name' | ||
| />), | ||
| sorting: true, | ||
| }, | ||
| { | ||
| id: 'owner', | ||
| numeric: false, | ||
| disablePadding: false, | ||
| label: (<FormattedMessage | ||
| id='Apis.Listing.apiTableHead.owner' | ||
| defaultMessage='Owner' | ||
| />), | ||
| sorting: true, | ||
| }, | ||
| { | ||
| id: 'actions', | ||
| numeric: false, | ||
| disablePadding: false, | ||
| label: (<FormattedMessage | ||
| id='Apis.Listing.apiTableHead.actions' | ||
| defaultMessage='Actions' | ||
| />), | ||
| sorting: false, | ||
| }, | ||
| ]; | ||
| const { order, orderBy } = props; | ||
| return ( | ||
| <TableHead> | ||
| <TableRow> | ||
| {columnData.map((column) => { | ||
| return ( | ||
| <TableCell | ||
| key={column.id} | ||
| align='left' | ||
| sortDirection={orderBy === column.id ? order : false} | ||
| > | ||
| {column.sorting ? ( | ||
| <TableSortLabel | ||
| active={orderBy === column.id} | ||
| direction={order} | ||
| onClick={createSortHandler(column.id)} | ||
| > | ||
| {column.label} | ||
| </TableSortLabel> | ||
| ) : ( | ||
| column.label | ||
| )} | ||
| </TableCell> | ||
| ); | ||
| })} | ||
| </TableRow> | ||
| </TableHead> | ||
| ); | ||
| }; | ||
| apisTableHead.propTypes = { | ||
| onRequestSort: PropTypes.func.isRequired, | ||
| order: PropTypes.string.isRequired, | ||
| orderBy: PropTypes.string.isRequired, | ||
| }; | ||
| export default apisTableHead; |
Oops, something went wrong.