Permalink
Browse files

Update PilotDetails to be connected

Connected PilotDetails directly to the store
Marked inputs as disabled until editing is added
  • Loading branch information...
markerikson committed Jan 2, 2017
1 parent 192b754 commit 7663759cb37c8146f8413391847fdd080895b18c
Showing with 30 additions and 5 deletions.
  1. +28 −1 src/features/pilots/PilotDetails/PilotDetails.jsx
  2. +2 −4 src/features/pilots/Pilots/Pilots.jsx
@@ -1,6 +1,12 @@
import React from "react";
import {connect} from "react-redux";
import {Form, Dropdown} from "semantic-ui-react";
import schema from "app/schema";
import {selectCurrentPilot} from "../pilotsSelectors";
const RANKS = [
{value: "Private", text : "Private"},
{value: "Corporal", text : "Corporal"},
@@ -15,6 +21,21 @@ const MECHS = [
{value : "WHM-6R", text : "Warhammer WHM-6R"}
];
const mapState = (state) => {
let pilot;
const currentPilot = selectCurrentPilot(state);
const session = schema.from(state.entities);
const {Pilot} = session;
if(Pilot.hasId(currentPilot)) {
pilot = Pilot.withId(currentPilot).ref;
}
return {pilot}
}
const PilotDetails = ({pilot={}}) =>{
const {
name = "",
@@ -32,6 +53,7 @@ const PilotDetails = ({pilot={}}) =>{
<input
placeholder="Name"
value={name}
disabled={true}
/>
</Form.Field>
<Form.Field name="rank" width={16}>
@@ -41,25 +63,29 @@ const PilotDetails = ({pilot={}}) =>{
selection
options={RANKS}
value={rank}
disabled={true}
/>
</Form.Field>
<Form.Field name="age" width={6}>
<label>Age</label>
<input
placeholder="Age"
value={age}
disabled={true}
/>
</Form.Field>
<Form.Field name="gunnery" width={6}>
<label>Gunnery</label>
<input
value={gunnery}
disabled={true}
/>
</Form.Field>
<Form.Field name="piloting" width={6}>
<label>Piloting</label>
<input
value={piloting}
disabled={true}
/>
</Form.Field>
<Form.Field name="mech" width={16}>
@@ -69,10 +95,11 @@ const PilotDetails = ({pilot={}}) =>{
selection
options={MECHS}
value={mechType}
disabled={true}
/>
</Form.Field>
</Form>
);
}
export default PilotDetails;
export default connect(mapState)(PilotDetails);
@@ -70,12 +70,10 @@ const actions = {
selectPilot,
};
export class Pilots extends Component {
export class Pilots extends Component {
render() {
const {pilots = [], selectPilot, currentPilot} = this.props;
const currentPilotEntry = pilots.find(pilot => pilot.id === currentPilot) || {}
return (
<Segment>
<Grid>
@@ -90,7 +88,7 @@ export class Pilots extends Component {
<Grid.Column width={6}>
<Header as="h3">Pilot Details</Header>
<Segment >
<PilotDetails pilot={currentPilotEntry} />
<PilotDetails />
</Segment>
</Grid.Column>
</Grid>

0 comments on commit 7663759

Please sign in to comment.