diff --git a/packages/strapi-plugin-content-manager/public/app/containers/List/actions.js b/packages/strapi-plugin-content-manager/public/app/containers/List/actions.js index 03d2744f32..d9d5545a39 100644 --- a/packages/strapi-plugin-content-manager/public/app/containers/List/actions.js +++ b/packages/strapi-plugin-content-manager/public/app/containers/List/actions.js @@ -5,11 +5,20 @@ */ import { - DEFAULT_ACTION, + LOAD_RECORDS, + LOADED_RECORDS } from './constants'; -export function defaultAction() { +export function loadRecords(model) { return { - type: DEFAULT_ACTION, + type: LOAD_RECORDS, + model + }; +} + +export function loadedRecord(records) { + return { + type: LOADED_RECORDS, + records }; } diff --git a/packages/strapi-plugin-content-manager/public/app/containers/List/constants.js b/packages/strapi-plugin-content-manager/public/app/containers/List/constants.js index 07d0c2a093..fbdecd35ae 100644 --- a/packages/strapi-plugin-content-manager/public/app/containers/List/constants.js +++ b/packages/strapi-plugin-content-manager/public/app/containers/List/constants.js @@ -4,4 +4,5 @@ * */ -export const DEFAULT_ACTION = 'app/List/DEFAULT_ACTION'; +export const LOAD_RECORDS = 'app/List/LOAD_RECORDS'; +export const LOADED_RECORDS = 'app/List/LOADED_RECORDS'; diff --git a/packages/strapi-plugin-content-manager/public/app/containers/List/index.js b/packages/strapi-plugin-content-manager/public/app/containers/List/index.js index 097b45c1af..4d939f0f5c 100644 --- a/packages/strapi-plugin-content-manager/public/app/containers/List/index.js +++ b/packages/strapi-plugin-content-manager/public/app/containers/List/index.js @@ -8,27 +8,81 @@ import React from 'react'; import { connect } from 'react-redux'; import { createStructuredSelector } from 'reselect'; import { injectIntl } from 'react-intl'; +import Container from 'components/Container'; import styles from './styles.scss'; +import { loadRecords } from './actions'; + +import { + makeSelectModelRecords, + makeSelectLoading +} from './selectors'; + export class List extends React.Component { // eslint-disable-line react/prefer-stateless-function + + componentWillMount() { + this.props.loadRecords(this.props.routeParams.slug.toLowerCase()); + } + render() { + if (this.props.loading) { + return ( +
+

Loading...

+
+ ); + } + + const Plugin = this.props.plugin; + const ListItems = this.props.records.map((record, key) => { + return ( +
  • +

    {record.title}

    +

    {record.message}

    +
  • + ); + }); + return (
    -
    - List View for {this.props.routeParams.slug} +
    + ${this.props.routeParams.slug}` + }} description={{ + id: 'plugin-content-manager-description', + defaultMessage: `Manage your ${this.props.routeParams.slug}` + }} noActions={false}> + + +

    +
      + {ListItems} +
    +
    ); } } +List.propTypes = { + records: React.PropTypes.array, + loadRecords: React.PropTypes.func, + loading: React.PropTypes.bool +}; + function mapDispatchToProps(dispatch) { return { + loadRecords: (model) => dispatch(loadRecords(model)), dispatch, }; } -const mapStateToProps = createStructuredSelector({}); +const mapStateToProps = createStructuredSelector({ + records: makeSelectModelRecords(), + loading: makeSelectLoading() +}); export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(List)); diff --git a/packages/strapi-plugin-content-manager/public/app/containers/List/reducer.js b/packages/strapi-plugin-content-manager/public/app/containers/List/reducer.js index 7631ea76bd..79605bf59d 100644 --- a/packages/strapi-plugin-content-manager/public/app/containers/List/reducer.js +++ b/packages/strapi-plugin-content-manager/public/app/containers/List/reducer.js @@ -6,15 +6,26 @@ import { fromJS } from 'immutable'; import { - DEFAULT_ACTION, + LOAD_RECORDS, + LOADED_RECORDS } from './constants'; -const initialState = fromJS({}); +const initialState = fromJS({ + loading: true, + currentModel: null, + models: {} +}); function listReducer(state = initialState, action) { switch (action.type) { - case DEFAULT_ACTION: - return state; + case LOAD_RECORDS: + return state + .set('loading', true) + .set('currentModel', action.model); + case LOADED_RECORDS: + return state + .set('loading', false) + .setIn(['models', state.get('currentModel')], action.records); default: return state; } diff --git a/packages/strapi-plugin-content-manager/public/app/containers/List/sagas.js b/packages/strapi-plugin-content-manager/public/app/containers/List/sagas.js index ebb8772f7d..b8da94ca8c 100644 --- a/packages/strapi-plugin-content-manager/public/app/containers/List/sagas.js +++ b/packages/strapi-plugin-content-manager/public/app/containers/List/sagas.js @@ -1,8 +1,33 @@ -// import { take, call, put, select } from 'redux-saga/effects'; +import { takeLatest } from 'redux-saga'; +import { put } from 'redux-saga/effects'; + +import { + loadedRecord, +} from './actions'; + +import { + LOAD_RECORDS, +} from './constants'; + +export function* getRecords() { + const fakeData = [{ + title: 'Roger Federer has won the first set.', + message: 'Try to do better than that man and you will be a winner.' + }, { + title: 'Lewis Hamilton is on fire.', + message: 'Did you ever seen someone like that guy?' + }, { + title: 'Elon Musk is awesome!', + message: 'Space X, Paypal, Tesla, & cie.' + }]; + + yield put(loadedRecord(fakeData)); +} + // Individual exports for testing export function* defaultSaga() { - return yield new Promise(resolve => resolve()); + yield takeLatest(LOAD_RECORDS, getRecords); } // All sagas to be loaded diff --git a/packages/strapi-plugin-content-manager/public/app/containers/List/selectors.js b/packages/strapi-plugin-content-manager/public/app/containers/List/selectors.js index f717588ee7..3df31e82d0 100644 --- a/packages/strapi-plugin-content-manager/public/app/containers/List/selectors.js +++ b/packages/strapi-plugin-content-manager/public/app/containers/List/selectors.js @@ -14,12 +14,21 @@ const selectListDomain = () => state => state.get('list'); * Default selector used by List */ -const selectList = () => createSelector( +const makeSelectModelRecords = () => createSelector( selectListDomain(), - (substate) => substate.toJS() + (substate) => { + const model = substate.get('currentModel'); + return substate.getIn(['models', model]); + } +); + +const makeSelectLoading = () => createSelector( + selectListDomain(), + (substate) => substate.get('loading') ); -export default selectList; export { selectListDomain, + makeSelectLoading, + makeSelectModelRecords };