final fixes for challenge #30056080 PREFLIGHT CHECKLIST

maxceem · maxceem · commit 5295af287dd1 · 2017-01-09T21:37:40.000+08:00
diff --git a/src/components/BreadcrumbItem/BreadcrumbItem.jsx b/src/components/BreadcrumbItem/BreadcrumbItem.jsx
@@ -0,0 +1,15 @@
+import React, {PropTypes} from 'react';
+import CSSModules from 'react-css-modules';
+import styles from './BreadcrumbItem.scss';
+
+export const BreadcrumbItem = ({title}) => (
+  <span styleName="breadcrumb-item">
+    {title}
+  </span>
+);
+
+BreadcrumbItem.propTypes = {
+  title: PropTypes.string.isRequired,
+};
+
+export default CSSModules(BreadcrumbItem, styles);
diff --git a/src/components/BreadcrumbItem/BreadcrumbItem.scss b/src/components/BreadcrumbItem/BreadcrumbItem.scss
@@ -0,0 +1,7 @@
+.breadcrumb-item {
+  background-color: transparent;
+
+  :global {
+
+  }
+}
diff --git a/src/components/BreadcrumbItem/index.js b/src/components/BreadcrumbItem/index.js
@@ -0,0 +1,3 @@
+import BreadcrumbItem from './BreadcrumbItem';
+
+export default BreadcrumbItem;
diff --git a/src/routes/PilotChecklist/containers/BreadcrumbItemContainer.js b/src/routes/PilotChecklist/containers/BreadcrumbItemContainer.js
@@ -0,0 +1,11 @@
+import {connect} from 'react-redux';
+
+// we use global BreadcrumbItem component to display breadcrumb item,
+// just pass a title property here
+import BreadcrumbItem from 'components/BreadcrumbItem';
+
+const mapState = (state) => ({
+  title: state.pilotChecklist.missionName,
+});
+
+export default connect(mapState, {})(BreadcrumbItem);
diff --git a/src/routes/PilotChecklist/index.js b/src/routes/PilotChecklist/index.js
@@ -1,7 +1,9 @@
 import {injectReducer} from '../../store/reducers';
+import React from 'react';
+import BreadcrumbItem from './containers/BreadcrumbItemContainer';
 
 export default (store) => ({
-  name: 'Pilot Checklist',
+  name: 'Flight Checklist',
   path: 'pilot-checklist/:id',
   getComponent(nextState, cb) {
     require.ensure([], (require) => {
@@ -12,4 +14,5 @@ export default (store) => ({
       cb(null, PilotChecklist);
     }, 'PilotChecklist');
   },
+  prettifyParam: () => React.createElement(BreadcrumbItem), // eslint-disable-line react/display-name
 });
diff --git a/src/routes/PilotChecklist/modules/PilotChecklist.js b/src/routes/PilotChecklist/modules/PilotChecklist.js
@@ -16,7 +16,7 @@ export const load = (missionId) => async(dispatch) => {
   const response = await APIService.getPilotChecklist(missionId);
   const answers = response.pilotChecklist ? response.pilotChecklist.answers : [];
 
-  dispatch({type: LOADED, payload: {..._.pick(response, ['missionStatus', 'questions']), answers, missionId}});
+  dispatch({type: LOADED, payload: {..._.pick(response, ['missionStatus', 'missionName', 'questions']), answers, missionId}});
 };
 
 export const save = (values) => async (dispatch, getState) => {
@@ -69,6 +69,7 @@ export default handleActions({
 }, {
   missionId: '',
   missionStatus: '',
+  missionName: '',
   questions: [],
   answers: [],
 });

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+import BreadcrumbItem from './BreadcrumbItem';`
	`2`	`+`
	`3`	`+export default BreadcrumbItem;`