From dbd4d4d2bc53545fea1fbc76d1675c33bcca31e1 Mon Sep 17 00:00:00 2001 From: remo5000 Date: Wed, 20 Jun 2018 17:26:30 +0800 Subject: [PATCH 01/15] Change Missions component and prop names --- src/components/academy/Missions.tsx | 30 +++++++++---------- src/components/academy/__tests__/Missions.tsx | 14 ++++----- 2 files changed, 22 insertions(+), 22 deletions(-) diff --git a/src/components/academy/Missions.tsx b/src/components/academy/Missions.tsx index f7412603bb..1a61b1b4c2 100644 --- a/src/components/academy/Missions.tsx +++ b/src/components/academy/Missions.tsx @@ -9,30 +9,30 @@ import { OwnProps as AssessmentProps } from '../assessment' import { IAssessmentOverview } from '../assessment/assessmentShape' import ContentDisplay, { IContentDisplayProps } from '../commons/ContentDisplay' -export interface IMissionParams { - missionId?: string +export interface IAssessmentParams { + assessmentId?: string } -export interface IMissionsProps extends RouteComponentProps { +export interface IAssessmentViewerProps extends RouteComponentProps { assessmentOverviews?: IAssessmentOverview[] handleAssessmentOverviewFetch: () => void } -export type StateProps = Pick -export type DispatchProps = Pick +export type StateProps = Pick +export type DispatchProps = Pick -class Missions extends React.Component { +class AssessmentViewer extends React.Component { public render() { - // make missionIdParam a number - let missionIdParam: number | null = - this.props.match.params.missionId === undefined + // make assessmentId a number + let assessmentIdParam: number | null = + this.props.match.params.assessmentId === undefined ? NaN - : parseInt(this.props.match.params.missionId, 10) + : parseInt(this.props.match.params.assessmentId, 10) // set as null if the parsing failed - missionIdParam = Number.isInteger(missionIdParam) ? missionIdParam : null + assessmentIdParam = Number.isInteger(assessmentIdParam) ? assessmentIdParam : null - // if there is no mission specified, Render only information. - if (missionIdParam === null) { + // if there is no assessmentId specified, Render only information. + if (assessmentIdParam === null) { const props: IContentDisplayProps = { display: , loadContentDispatch: this.props.handleAssessmentOverviewFetch @@ -44,7 +44,7 @@ class Missions extends React.Component { ) } else { const props: AssessmentProps = { - missionId: missionIdParam + missionId: assessmentIdParam } return } @@ -102,4 +102,4 @@ export const AssessmentOverviewCard: React.SFC = p return <>{cards} } -export default Missions +export default AssessmentViewer diff --git a/src/components/academy/__tests__/Missions.tsx b/src/components/academy/__tests__/Missions.tsx index 7299eed477..e2d9f6b599 100644 --- a/src/components/academy/__tests__/Missions.tsx +++ b/src/components/academy/__tests__/Missions.tsx @@ -4,20 +4,20 @@ import { MemoryRouter } from 'react-router' import { mockAssessmentOverviews } from '../../../mocks/api' import { mockRouterProps } from '../../../mocks/components' -import Missions, { IMissionsProps } from '../Missions' +import AssessmentViewer, { IAssessmentViewerProps } from '../Missions' -const mockUndefinedMissions: IMissionsProps = { +const mockUndefinedMissions: IAssessmentViewerProps = { ...mockRouterProps('/academy/missions', {}), handleAssessmentOverviewFetch: () => {} } -const mockEmptyMissions: IMissionsProps = { +const mockEmptyMissions: IAssessmentViewerProps = { ...mockRouterProps('/academy/missions', {}), assessmentOverviews: [], handleAssessmentOverviewFetch: () => {} } -const mockPresentMissions: IMissionsProps = { +const mockPresentMissions: IAssessmentViewerProps = { ...mockRouterProps('/academy/missions', {}), assessmentOverviews: mockAssessmentOverviews, handleAssessmentOverviewFetch: () => {} @@ -26,7 +26,7 @@ const mockPresentMissions: IMissionsProps = { test('Missions page "loading" content renders correctly', () => { const app = ( - + ) const tree = mount(app) @@ -36,7 +36,7 @@ test('Missions page "loading" content renders correctly', () => { test('Missions page with 0 missions renders correctly', () => { const app = ( - + ) const tree = mount(app) @@ -46,7 +46,7 @@ test('Missions page with 0 missions renders correctly', () => { test('Missions page with multiple loaded missions renders correctly', () => { const app = ( - + ) const tree = mount(app) From b44bc2eed3acccbf255b55affede525484a23e95 Mon Sep 17 00:00:00 2001 From: remo5000 Date: Wed, 20 Jun 2018 17:28:55 +0800 Subject: [PATCH 02/15] Use proper component name in container --- src/containers/academy/MissionsContainer.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/containers/academy/MissionsContainer.ts b/src/containers/academy/MissionsContainer.ts index e764716872..6cae60b703 100644 --- a/src/containers/academy/MissionsContainer.ts +++ b/src/containers/academy/MissionsContainer.ts @@ -3,7 +3,7 @@ import { withRouter } from 'react-router' import { bindActionCreators, Dispatch } from 'redux' import { fetchAssessmentOverviews } from '../../actions/session' -import Missions, { DispatchProps, StateProps } from '../../components/academy/Missions' +import AssessmentListing, { DispatchProps, StateProps } from '../../components/academy/Missions' import { AssessmentCategories, IAssessmentOverview @@ -28,4 +28,4 @@ const mapDispatchToProps: MapDispatchToProps = (dispatch: Dis dispatch ) -export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Missions)) +export default withRouter(connect(mapStateToProps, mapDispatchToProps)(AssessmentListing)) From 4f3d6564169f29bae3133e70423b9159fc59efa2 Mon Sep 17 00:00:00 2001 From: remo5000 Date: Wed, 20 Jun 2018 17:30:28 +0800 Subject: [PATCH 03/15] Change name in component to listing --- src/components/academy/Missions.tsx | 10 +++++----- src/components/academy/__tests__/Missions.tsx | 14 +++++++------- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/src/components/academy/Missions.tsx b/src/components/academy/Missions.tsx index 1a61b1b4c2..96f18b8e88 100644 --- a/src/components/academy/Missions.tsx +++ b/src/components/academy/Missions.tsx @@ -13,15 +13,15 @@ export interface IAssessmentParams { assessmentId?: string } -export interface IAssessmentViewerProps extends RouteComponentProps { +export interface IAssessmentListingProps extends RouteComponentProps { assessmentOverviews?: IAssessmentOverview[] handleAssessmentOverviewFetch: () => void } -export type StateProps = Pick -export type DispatchProps = Pick +export type StateProps = Pick +export type DispatchProps = Pick -class AssessmentViewer extends React.Component { +class AssessmentListing extends React.Component { public render() { // make assessmentId a number let assessmentIdParam: number | null = @@ -102,4 +102,4 @@ export const AssessmentOverviewCard: React.SFC = p return <>{cards} } -export default AssessmentViewer +export default AssessmentListing diff --git a/src/components/academy/__tests__/Missions.tsx b/src/components/academy/__tests__/Missions.tsx index e2d9f6b599..52cb765516 100644 --- a/src/components/academy/__tests__/Missions.tsx +++ b/src/components/academy/__tests__/Missions.tsx @@ -4,20 +4,20 @@ import { MemoryRouter } from 'react-router' import { mockAssessmentOverviews } from '../../../mocks/api' import { mockRouterProps } from '../../../mocks/components' -import AssessmentViewer, { IAssessmentViewerProps } from '../Missions' +import AssessmentListing, { IAssessmentListingProps } from '../Missions' -const mockUndefinedMissions: IAssessmentViewerProps = { +const mockUndefinedMissions: IAssessmentListingProps = { ...mockRouterProps('/academy/missions', {}), handleAssessmentOverviewFetch: () => {} } -const mockEmptyMissions: IAssessmentViewerProps = { +const mockEmptyMissions: IAssessmentListingProps = { ...mockRouterProps('/academy/missions', {}), assessmentOverviews: [], handleAssessmentOverviewFetch: () => {} } -const mockPresentMissions: IAssessmentViewerProps = { +const mockPresentMissions: IAssessmentListingProps = { ...mockRouterProps('/academy/missions', {}), assessmentOverviews: mockAssessmentOverviews, handleAssessmentOverviewFetch: () => {} @@ -26,7 +26,7 @@ const mockPresentMissions: IAssessmentViewerProps = { test('Missions page "loading" content renders correctly', () => { const app = ( - + ) const tree = mount(app) @@ -36,7 +36,7 @@ test('Missions page "loading" content renders correctly', () => { test('Missions page with 0 missions renders correctly', () => { const app = ( - + ) const tree = mount(app) @@ -46,7 +46,7 @@ test('Missions page with 0 missions renders correctly', () => { test('Missions page with multiple loaded missions renders correctly', () => { const app = ( - + ) const tree = mount(app) From ab2982d5cdf3d267ce1dbc40e0f72a9f2b9bcb5d Mon Sep 17 00:00:00 2001 From: remo5000 Date: Wed, 20 Jun 2018 17:33:02 +0800 Subject: [PATCH 04/15] Use assessmentId for Assessment Params --- src/components/academy/Missions.tsx | 2 +- src/components/assessment/index.tsx | 6 +++--- src/containers/AssessmentContainer.ts | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/academy/Missions.tsx b/src/components/academy/Missions.tsx index 96f18b8e88..e4365ff7c6 100644 --- a/src/components/academy/Missions.tsx +++ b/src/components/academy/Missions.tsx @@ -44,7 +44,7 @@ class AssessmentListing extends React.Component { ) } else { const props: AssessmentProps = { - missionId: assessmentIdParam + assessmentId: assessmentIdParam } return } diff --git a/src/components/assessment/index.tsx b/src/components/assessment/index.tsx index c923086512..281602f141 100644 --- a/src/components/assessment/index.tsx +++ b/src/components/assessment/index.tsx @@ -13,17 +13,17 @@ export type StateProps = { assessment?: IAssessment } -export type OwnProps = { missionId: number } +export type OwnProps = { assessmentId: number } export type DispatchProps = { - handleAssessmentFetch: (missionId: number) => void + handleAssessmentFetch: (assessmentId: number) => void } class Assessment extends React.Component { public state = { showOverlay: true } public componentWillMount() { - this.props.handleAssessmentFetch(this.props.missionId) + this.props.handleAssessmentFetch(this.props.assessmentId) } public render() { diff --git a/src/containers/AssessmentContainer.ts b/src/containers/AssessmentContainer.ts index 0d7f419fcd..0a460baf48 100644 --- a/src/containers/AssessmentContainer.ts +++ b/src/containers/AssessmentContainer.ts @@ -7,7 +7,7 @@ import { IState } from '../reducers/states' const mapStateToProps: MapStateToProps = (state, props) => { return { - assessment: state.session.assessments.get(props.missionId) + assessment: state.session.assessments.get(props.assessmentId) } } From bba42575388ae4134f8d0a98e52ee0199f2ca46f Mon Sep 17 00:00:00 2001 From: remo5000 Date: Wed, 20 Jun 2018 17:34:55 +0800 Subject: [PATCH 05/15] Change OverviewCard prop name --- src/components/academy/Missions.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/academy/Missions.tsx b/src/components/academy/Missions.tsx index e4365ff7c6..92e6e961c4 100644 --- a/src/components/academy/Missions.tsx +++ b/src/components/academy/Missions.tsx @@ -61,19 +61,19 @@ export const AssessmentOverviewCard: React.SFC = p } else if (props.assessmentOverviews.length === 0) { return } - const cards = props.assessmentOverviews.map((mission, index) => ( + const cards = props.assessmentOverviews.map((overview, index) => (
PICTURE
-

{mission.title}

+

{overview.title}

Mission 0 : 123123 XP (hardcoded)
-

{mission.shortSummary}

+

{overview.shortSummary}

@@ -83,7 +83,7 @@ export const AssessmentOverviewCard: React.SFC = p
- +