diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/Table/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/Table/index.js
deleted file mode 100644
index 4f6f2f4749..0000000000
--- a/packages/strapi-plugin-content-type-builder/admin/src/components/Table/index.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/**
-*
-* Table
-*
-*/
-
-import React from 'react';
-import { FormattedMessage } from 'react-intl';
-import ButtonPrimaryHotline from 'components/Button';
-import styles from './styles.scss';
-
-class Table extends React.Component { // eslint-disable-line react/prefer-stateless-function
- render() {
- return (
-
-
-
-
-
- {this.props.availableNumber}
-
-
-
-
-
-
-
-
- );
- }
-}
-
-Table.propTypes = {
- availableNumber: React.PropTypes.number.isRequired,
- buttonLabel: React.PropTypes.string.isRequired,
- handleButtonClick: React.PropTypes.func,
- title: React.PropTypes.string.isRequired,
-};
-
-export default Table;
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/Table/styles.scss b/packages/strapi-plugin-content-type-builder/admin/src/components/Table/styles.scss
deleted file mode 100644
index 689c427666..0000000000
--- a/packages/strapi-plugin-content-type-builder/admin/src/components/Table/styles.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-.table { /* stylelint-disable */
- padding: 2rem 3.2rem 3.2rem 1.8rem;
- // background: red;
- background: #FFFFFF;
- font-family: Lato;
-}
-
-.headerContainer {
- display: flex;
- flex-direction: row;
- width: 100%;
- justify-content: space-between;
-
-}
-
-.titleContainer {
- color: #333740;
- font-size: 1.8rem;
- font-weight: bold;
- line-height: 2.2rem;
-}
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/index.js
new file mode 100644
index 0000000000..3c133f7b0c
--- /dev/null
+++ b/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/index.js
@@ -0,0 +1,103 @@
+/**
+*
+* TableList
+*
+*/
+
+import React from 'react';
+import { map, startCase } from 'lodash';
+import { FormattedMessage } from 'react-intl';
+import ButtonPrimaryHotline from 'components/Button';
+import styles from './styles.scss';
+
+/* eslint-disable jsx-a11y/no-static-element-interactions */
+class TableList extends React.Component { // eslint-disable-line react/prefer-stateless-function
+ delete = () => {
+ console.log('will delete');
+ }
+
+ edit = () => {
+ console.log('edit');
+ }
+
+ goTo = (e) => {
+ if (e.target.id !== 'edit' && e.target.id !== 'delete') {
+ console.log('will go to');
+ }
+ }
+
+
+
+ render() {
+ return (
+
+
+
+
+
+
+ {this.props.availableNumber}
+
+
+
+
+
+
+
+
+
+
+ -
+
+
+ {map(this.props.rowItems, (rowItem, key) => (
+ -
+
+
+
+
{startCase(rowItem.name)}
+
{rowItem.description}
+
{rowItem.fields}
+
+
+
+ ))}
+
+
+
+
+
+ );
+ }
+}
+
+TableList.propTypes = {
+ availableNumber: React.PropTypes.number.isRequired,
+ buttonLabel: React.PropTypes.string.isRequired,
+ handleButtonClick: React.PropTypes.func,
+ rowItems: React.PropTypes.array.isRequired,
+ title: React.PropTypes.string.isRequired,
+};
+
+export default TableList;
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/styles.scss b/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/styles.scss
new file mode 100644
index 0000000000..d3c2794bc8
--- /dev/null
+++ b/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/styles.scss
@@ -0,0 +1,122 @@
+.tableListContainer { /* stylelint-disable */
+ padding: 2rem 0 0rem 0;
+ background: #FFFFFF;
+ font-family: Lato;
+}
+
+.headerContainer {
+ width: 100%;
+ padding: 0 1.8rem 0 1.8rem;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+
+}
+
+.titleContainer {
+ color: #333740;
+ font-size: 1.8rem;
+ font-weight: bold;
+ line-height: 2.2rem;
+}
+
+.ulContainer {
+ margin-top: 1.6rem;
+ width: 100%;
+ > ul {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ > li:first-child {
+ margin-bottom: .5rem;
+ border-radius: 2px 2px 0 0;
+ background-color: #F3F3F4;
+ // background-color: rgba(16,22,34,0.04);
+ }
+ > li:not(:first-child) {
+ position: relative;
+ margin-bottom: .2rem;
+ cursor: pointer;
+ &:hover {
+ .hovered {
+ position: absolute;
+ width: 100%;
+ height: 5.4rem;
+ top: -.2rem;
+
+ background-color: #F7F8F8;
+ }
+ }
+ }
+ > li:nth-child(2) {
+ &:hover {
+ .hovered {
+ position: absolute;
+ width: 100%;
+ height: 5.6rem;
+ top: -.5rem;
+ background-color: #F7F8F8;
+ }
+ }
+ }
+ > li:last-child {
+ margin-bottom: 0;
+ .liInnerContainer {
+ border-bottom: none;
+ }
+ }
+ }
+}
+
+.liHeaderContainer {
+ height: 3rem;
+ margin: 0;
+ padding: 0 4.6rem 0 1.9rem;
+ font-size: 1.3rem;
+ line-height: 1.6rem;
+ font-weight: 600;
+ > div {
+ padding: 0;
+ align-self: center;
+ }
+ > div:last-child {
+ text-align: right;
+ }
+}
+
+.liInnerContainer {
+ height: 5.2rem;
+ margin: 0 3.2rem 0 1.9rem ;
+ padding: 0 1.4rem 0 0rem;
+ border-bottom: 1px solid rgba(14,22,34,0.04);
+ color: #333740;
+ font-size: 1.3rem;
+ > div {
+ padding: 0;
+ align-self: center;
+ }
+ > div:first-child{
+ padding-left: 1.4rem;
+ }
+ > div:last-child {
+ text-align: right;
+ }
+ > div:nth-child(2) {
+ font-weight: 600;
+ }
+}
+
+
+.icoContainer {
+ display: flex;
+ justify-content: flex-end;
+ > div {
+ color: #0E1622;
+ > i {
+ font-size: 1.1rem;
+ }
+ }
+ > div:last-child {
+ margin-left: 1.3rem;
+ }
+}
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/Table/tests/index.test.js b/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/tests/index.test.js
similarity index 73%
rename from packages/strapi-plugin-content-type-builder/admin/src/components/Table/tests/index.test.js
rename to packages/strapi-plugin-content-type-builder/admin/src/components/TableList/tests/index.test.js
index 648c1f7a37..5de9394e28 100644
--- a/packages/strapi-plugin-content-type-builder/admin/src/components/Table/tests/index.test.js
+++ b/packages/strapi-plugin-content-type-builder/admin/src/components/TableList/tests/index.test.js
@@ -1,10 +1,10 @@
-// import Table from '../index';
+// import TableList from '../index';
import expect from 'expect';
// import { shallow } from 'enzyme';
// import React from 'react';
-describe('', () => {
+describe('', () => {
it('Expect to have unit tests specified', () => {
expect(true).toEqual(false);
});
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/actions.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/actions.js
index 879db87465..90f63d8ceb 100755
--- a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/actions.js
+++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/actions.js
@@ -7,14 +7,12 @@
import { MODELS_FETCH, MODELS_FETCH_SUCCEEDED } from './constants';
export function modelsFetch() {
- console.log('fetching models');
return {
type: MODELS_FETCH,
};
}
export function modelsFetchSucceeded(models) {
- console.log('succeeded');
return {
type: MODELS_FETCH_SUCCEEDED,
models,
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/index.js
index 89ce90a6a6..2519df7593 100755
--- a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/index.js
+++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/index.js
@@ -24,7 +24,6 @@ define(map(messages, (message, id) => ({
class App extends React.Component {
componentDidMount() {
- console.log('did mount');
this.props.modelsFetch();
}
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/reducer.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/reducer.js
index ef545a6b7b..feab60af2b 100755
--- a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/reducer.js
+++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/reducer.js
@@ -18,7 +18,6 @@ function appReducer(state = initialState, action) {
case MODELS_FETCH:
return state.set('loading', true);
case MODELS_FETCH_SUCCEEDED:
- console.log('ok');
return state
.set('loading', false)
.set('models', List(action.models.models));
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/sagas.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/sagas.js
index 7417e64adb..632d60cd09 100755
--- a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/sagas.js
+++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/sagas.js
@@ -9,10 +9,10 @@ export function* fetchModels() {
const requestUrl = '/content-type-builder/models';
const data = yield call(request, requestUrl, { method: 'GET' });
- console.log('data', data);
yield put(modelsFetchSucceeded(data));
} catch(error) {
+ // TODO handle i18n
window.Strapi.notification.error('notification.error.message')
}
}
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/HomePage/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/HomePage/index.js
index 8432e39214..cec536cc0b 100644
--- a/packages/strapi-plugin-content-type-builder/admin/src/containers/HomePage/index.js
+++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/HomePage/index.js
@@ -15,7 +15,7 @@ import { makeSelectLoading, makeSelectModels } from 'containers/App/selectors';
// Design
import ContentHeader from 'components/ContentHeader';
import EmptyContentTypeView from 'components/EmptyContentTypeView';
-import Table from 'components/Table';
+import TableList from 'components/TableList';
import selectHomePage from './selectors';
import styles from './styles.scss';
@@ -26,16 +26,17 @@ export class HomePage extends React.Component { // eslint-disable-line react/pre
console.log('ici', this.props.homePage);
}
- renderTableComponent = () => {
+ renderTableListComponent = () => {
const availableNumber = size(this.props.models);
const title = availableNumber > 1 ? 'table.contentType.title.plural'
: 'table.contentType.title.singular';
return (
-
);
}
@@ -46,7 +47,7 @@ export class HomePage extends React.Component { // eslint-disable-line react/pre
const component = size(this.props.models) === 0 ?
- : this.renderTableComponent();
+ : this.renderTableListComponent();
return (
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json b/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json
index f592d6623f..fdbe341ad9 100755
--- a/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json
+++ b/packages/strapi-plugin-content-type-builder/admin/src/translations/en.json
@@ -1,6 +1,6 @@
{
"home.contentTypeBuilder.name": "Content Types",
- "home.contentTypeBuilder.description": "Create, update you own content types.",
+ "home.contentTypeBuilder.description": "Create, update your own content types.",
"home.emptyContentType.title": "There is no Content Type Available",
"home.emptyContentType.description": "Create your first Content Type to be able to retrieve data from your API.",
@@ -10,6 +10,9 @@
"notification.error.message": "An error occured",
"table.contentType.title.plural": "Content Types are available",
- "table.contentType.title.singular": "Content Type is available"
+ "table.contentType.title.singular": "Content Type is available",
+ "table.contentType.head.name": "Name",
+ "table.contentType.head.description": "Description",
+ "table.contentType.head.fields": "Fields"
}
diff --git a/packages/strapi-plugin-content-type-builder/admin/src/translations/fr.json b/packages/strapi-plugin-content-type-builder/admin/src/translations/fr.json
index 462c3aa526..5e5b236e89 100755
--- a/packages/strapi-plugin-content-type-builder/admin/src/translations/fr.json
+++ b/packages/strapi-plugin-content-type-builder/admin/src/translations/fr.json
@@ -10,6 +10,9 @@
"notification.error.message": "Une erreur est survenue",
"table.contentType.title.plural": "Modèles sont disponibles",
- "table.contentType.title.singular": "Modèle est disponible"
+ "table.contentType.title.singular": "Modèle est disponible",
+ "table.contentType.head.name": "Nom",
+ "table.contentType.head.description": "Description",
+ "table.contentType.head.fields": "Champs"
}