From 094d3dca8d7fe1d25e00e3c0032d7f3b1e42c8ec Mon Sep 17 00:00:00 2001 From: TotoRoToto Date: Tue, 24 Oct 2017 22:24:40 +0200 Subject: [PATCH] idx implementation (#67) * idx implementation * code clean up * minor fix * fix property checktype * clean proptypes checking --- .../specific/cards/AthleteDetailsCard.js | 43 ------------------- .../specific/cards/AthletePerformancesCard.js | 42 ++++++++++++++++++ .../main/athleteDetails/AthleteDetails.js | 25 ++++++----- app/routes/main/athleteDetails/selector.js | 10 ++++- app/store/services/activities.js | 7 +-- package.json | 1 + yarn.lock | 4 ++ 7 files changed, 74 insertions(+), 58 deletions(-) delete mode 100644 app/components/specific/cards/AthleteDetailsCard.js create mode 100644 app/components/specific/cards/AthletePerformancesCard.js diff --git a/app/components/specific/cards/AthleteDetailsCard.js b/app/components/specific/cards/AthleteDetailsCard.js deleted file mode 100644 index a40bbbdd..00000000 --- a/app/components/specific/cards/AthleteDetailsCard.js +++ /dev/null @@ -1,43 +0,0 @@ -import React, { Component } from "react"; -import PropTypes from "prop-types"; - -import CardList from "../../common/cardList/CardList"; -import { getIconName } from "../../../routes/main/clubFeed/helper"; -import theme from "../../../theme/theme"; - -export default class AthleteDetailsCard extends Component { - // ToDO fix shape - static propTypes = { - rendered: PropTypes.bool, - athlete: PropTypes.shape({ - firstname: PropTypes.string, - lastname: PropTypes.string, - profil: PropTypes.string - }).isRequired - }; - - static defaultProps = { - rendered: true - }; - - render() { - const { athlete } = this.props; - if (!this.props.rendered) return false; - - return ( - ({ - key: index, - image: { - name: getIconName(detail.name), - color: theme.PrimaryColor - }, - text: `${detail.value} ${detail.unit !== undefined - ? detail.unit - : ""}` - }))} - /> - ); - } -} diff --git a/app/components/specific/cards/AthletePerformancesCard.js b/app/components/specific/cards/AthletePerformancesCard.js new file mode 100644 index 00000000..63fe9087 --- /dev/null +++ b/app/components/specific/cards/AthletePerformancesCard.js @@ -0,0 +1,42 @@ +import React, { Component } from "react"; +import PropTypes from "prop-types"; + +import CardList from "../../common/cardList/CardList"; +import { getIconName } from "../../../routes/main/clubFeed/helper"; +import theme from "../../../theme/theme"; + +export default class AthletePerformancesCard extends Component { + static propTypes = { + rendered: PropTypes.bool, + performances: PropTypes.arrayOf( + PropTypes.shape({ + name: PropTypes.string, + percent: PropTypes.number, + value: PropTypes.number, + unit: PropTypes.string + }) + ).isRequired + }; + + static defaultProps = { + rendered: true + }; + + render() { + const { performances } = this.props; + if (!this.props.rendered) return false; + + const performancesList = performances.map((performance, index) => ({ + key: index, + image: { + name: getIconName(performance.name), + color: theme.PrimaryColor + }, + text: `${performance.value} ${performance.unit !== undefined + ? performance.unit + : ""}` + })); + + return ; + } +} diff --git a/app/routes/main/athleteDetails/AthleteDetails.js b/app/routes/main/athleteDetails/AthleteDetails.js index 68e413aa..0ed33a31 100644 --- a/app/routes/main/athleteDetails/AthleteDetails.js +++ b/app/routes/main/athleteDetails/AthleteDetails.js @@ -8,7 +8,7 @@ import enhanceWithValidEntities from "../../../hocs/enhanceWithValidEntities"; import selector from "./selector"; import styles from "./styles"; import AthleteCard from "../../../components/specific/cards/AthleteCard"; -import AthleteDetailsCard from "../../../components/specific/cards/AthleteDetailsCard"; +import AthletePerformancesCard from "../../../components/specific/cards/AthletePerformancesCard"; class AthleteDetails extends Component { static propTypes = { @@ -16,22 +16,25 @@ class AthleteDetails extends Component { firstname: PropTypes.string, lastname: PropTypes.string, profil: PropTypes.string - }).isRequired + }).isRequired, + performances: PropTypes.arrayOf( + PropTypes.shape({ + name: PropTypes.string, + percent: PropTypes.number, + value: PropTypes.number, + unit: PropTypes.string + }) + ).isRequired }; render() { - const { athlete } = this.props; - // TODO add idx https://github.com/facebookincubator/idx + const { athlete, performances } = this.props; return ( - 0 - } - athlete={athlete} + 0} + performances={performances} /> ); diff --git a/app/routes/main/athleteDetails/selector.js b/app/routes/main/athleteDetails/selector.js index 7c227574..4309884d 100644 --- a/app/routes/main/athleteDetails/selector.js +++ b/app/routes/main/athleteDetails/selector.js @@ -1,10 +1,18 @@ +import idx from "idx"; + import { getCurrentUserID } from "../../../store/state/appState/selectors"; import { getEntity } from "../../../store/state/entities/selectors"; +const getAthletePerformances = props => idx(props, _ => _.performance.details); + const athleteDetailsViewSelector = state => { const currentUserID = getCurrentUserID(state); + const athlete = getEntity(state, "athletes", currentUserID); + const performances = getAthletePerformances(athlete); + return { - athlete: getEntity(state, "athletes", currentUserID) + athlete, + performances }; }; diff --git a/app/store/services/activities.js b/app/store/services/activities.js index 8ddbaf12..d1e65ab4 100644 --- a/app/store/services/activities.js +++ b/app/store/services/activities.js @@ -3,7 +3,6 @@ import { pick } from "lodash"; import { API_ENDPOINT, RESOURCES, METHODS } from "../constants/rest"; import { callJSONApi } from "./helpers/api"; -import { msToTime } from "./helpers/moment"; import { references, referencesWeightings } from "../constants/references"; export const getGivenActivity = (token, activityID) => { @@ -177,7 +176,9 @@ export const computePerformance = (activities = {}) => { }); const paceMeterPerSecond = duration > 0 ? distance / duration : 0; - const paceKilometerPerHour = (paceMeterPerSecond * 3.6).toFixed(2); + const paceKilometerPerHour = parseFloat( + (paceMeterPerSecond * 3.6).toFixed(2) + ); const distanceHeuristic = distance / @@ -229,7 +230,7 @@ export const computePerformance = (activities = {}) => { performanceDetails.push({ name: "duration", percent: Math.trunc(timeHeuristic * 100 / performance), - value: msToTime(duration * 1000) + value: duration }); performanceDetails.push({ name: "pace", diff --git a/package.json b/package.json index 243aa75b..569e3604 100755 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "dependencies": { "firebase": "^4.2.0", "hoist-non-react-statics": "^2.2.2", + "idx": "^2.1.0", "lodash": "^4.17.4", "normalizr": "^3.2.3", "prop-types": "^15.5.10", diff --git a/yarn.lock b/yarn.lock index 877c0bf8..831f0d3c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2980,6 +2980,10 @@ iconv-lite@0.4.19, iconv-lite@^0.4.17, iconv-lite@~0.4.13: version "0.4.19" resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.19.tgz#f7468f60135f5e5dad3399c0a81be9a1603a082b" +idx@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/idx/-/idx-2.1.0.tgz#e0c96663ff1bb2778a362bea988531f13889ffba" + ignore@^3.3.3: version "3.3.5" resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.5.tgz#c4e715455f6073a8d7e5dae72d2fc9d71663dba6"