diff --git a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js index b4cb76d1b0..dfc04b076f 100755 --- a/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/components/TableRow/index.js @@ -33,6 +33,7 @@ class TableRow extends React.Component { case 'string': case 'text': case 'email': + case 'enumeration': return (value && !isEmpty(value.toString())) || name === 'id' ? value.toString() : '-'; case 'float': case 'integer': diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js index 7b41062870..c8080f8c65 100644 --- a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js @@ -9,17 +9,20 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import { bindActionCreators, compose } from 'redux'; import { createStructuredSelector } from 'reselect'; -import { capitalize, get, toInteger } from 'lodash'; +import { capitalize, get, map, toInteger } from 'lodash'; import cn from 'classnames'; // App selectors -import { makeSelectModels } from 'containers/App/selectors'; +import { makeSelectModels, makeSelectSchema } from 'containers/App/selectors'; // You can find these components in either // ./node_modules/strapi-helper-plugin/lib/src // or strapi/packages/strapi-helper-plugin/lib/src import PluginHeader from 'components/PluginHeader'; +// Components from the plugin itself +import Table from 'components/Table'; + // Utils located in `strapi/packages/strapi-helper-plugin/lib/src/utils`; import getQueryParameters from 'utils/getQueryParameters'; import injectReducer from 'utils/injectReducer'; @@ -52,10 +55,50 @@ export class ListPage extends React.Component { this.getData(this.props); } + /** + * Helper to retrieve the current model data + * @return {Object} the current model + */ + getCurrentModel = () => get(this.props.models, ['models', this.getCurrentModelName()]) || get(this.props.models, ['plugins', this.getSource(), 'models', this.getCurrentModelName()]); + + + /** + * Helper to retrieve the current model name + * @return {String} the current model's name + */ + getCurrentModelName = () => this.props.match.params.slug; + + /** + * Function to fetch data + * @param {Object} props + */ getData = (props) => { this.props.getData(props.match.params.slug); } + /** + * Helper to retrieve the model's source + * @return {String} the model's source + */ + getSource = () => getQueryParameters(this.props.location.search, 'source') || 'content-manager'; + + /** + * Function to generate the Table's headers + * @return {Array} + */ + generateTableHeaders = () => { + const currentSchema = get(this.props.schema, [this.getCurrentModelName()]) || get(this.props.schema, ['plugins', this.getSource(), this.getCurrentModelName()]); + const tableHeaders = map(currentSchema.list, (value) => ({ + name: value, + label: currentSchema.fields[value].label, + type: currentSchema.fields[value].type, + })); + + tableHeaders.splice(0, 0, { name: this.getCurrentModel().primaryKey || 'id', label: 'Id', type: 'string' }); + + return tableHeaders; + } + /** * [findPageSort description] * @param {Object} props [description] @@ -63,7 +106,7 @@ export class ListPage extends React.Component { */ findPageSort = (props) => { const { match: { params: { slug } } } = props; - const source = getQueryParameters(props.location.search, 'source'); + const source = this.getSource(); const modelPrimaryKey = get( this.props.models, ['models', slug.toLowerCase(), 'primaryKey'], @@ -86,14 +129,14 @@ export class ListPage extends React.Component { kind: 'primaryAddShape', onClick: () => this.props.history.push({ pathname: `${this.props.location.pathname}/create`, - search: `?source=${this.props.listPage.source}`, + search: `?source=${this.props.listPage.params.source}`, }), }, ]; render() { - const { listPage } = this.props; - console.log(this.props); + const { listPage, listPage: { params } } = this.props; + return (
@@ -109,6 +152,22 @@ export class ListPage extends React.Component { id: listPage.currentModel || 'Content Manager', }} /> +
+
+ {}} + sort={listPage.params.sort} + history={this.props.history} + primaryKey={this.getCurrentModel().primaryKey || 'id'} + handleDelete={() => {}} + redirectUrl={`?redirectUrl=/plugins/content-manager/${this.getCurrentModelName().toLowerCase()}?page=${params.page}&limit=${params.limit}&sort=${params.sort}&source=${this.getSource()}`} + /> + + ); @@ -126,6 +185,7 @@ ListPage.propTypes = { location: PropTypes.object.isRequired, match: PropTypes.object.isRequired, models: PropTypes.object.isRequired, + schema: PropTypes.object.isRequired, setParams: PropTypes.func.isRequired, }; @@ -143,6 +203,7 @@ function mapDispatchToProps(dispatch) { const mapStateToProps = createStructuredSelector({ listPage: makeSelectListPage(), models: makeSelectModels(), + schema: makeSelectSchema(), }); const withConnect = connect(mapStateToProps, mapDispatchToProps); diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/styles.scss b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/styles.scss index 7d3b5e8364..13ce38ebf6 100644 --- a/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/styles.scss +++ b/packages/strapi-plugin-content-manager/admin/src/containers/ListPage/styles.scss @@ -6,6 +6,6 @@ } } -// .row{ -// padding-bottom: 36px; -// } +.row{ + padding-bottom: 36px; +}