diff --git a/src/components/Card.jsx b/src/components/Card.jsx index 7dce85b..a7ad401 100644 --- a/src/components/Card.jsx +++ b/src/components/Card.jsx @@ -25,10 +25,10 @@ class Card extends React.Component { this.setState({ isHighlighted: !this.state.isHighlighted }, () => { - if (this.state.isHighlighted) { + if (!this.state.isHighlighted) { this.props.highlight(this.props.event); } else { - this.props.highlight(); + this.props.highlight(null); } }); } diff --git a/src/components/CardStack.jsx b/src/components/CardStack.jsx index 7326bd4..f5e20b9 100644 --- a/src/components/CardStack.jsx +++ b/src/components/CardStack.jsx @@ -14,16 +14,12 @@ class CardStack extends React.Component { renderCards() { if (this.props.selected.length > 0) { return this.props.selected.map((event) => { - // if event has property 'name', update with event details - const shouldCardUpdate = (event.name); - return ( -
this.props.toggle('TOGGLE_CARDSTACK')} - > - -

{copy[this.props.language].loading}

-
-
- -
+
this.props.toggle('TOGGLE_CARDSTACK')} + > + +

+ {(this.props.isLoading) + ? copy[this.props.language].loading + : `${this.props.selected.length} ${header_lang}`} +

+ {(this.props.isLoading) ? '' : this.renderLocation()}
) } - render() { - const header_lang = copy[this.props.language].cardstack.header; + renderCardStackContent() { + return ( +
+ +
+ ); + } - if (this.props.isFetchingEvents) { - return this.renderIsLoading(); - - } else if (this.props.selected.length > 0) { + render() { + if (this.props.selected.length > 0) { return (
-
this.props.toggle('TOGGLE_CARDSTACK')} - > - -

{`${this.props.selected.length} ${header_lang}`}

- {this.renderLocation()} -
-
-
    - {this.renderCards()} -
-
+ {this.renderCardStackHeader()} + {this.renderCardStackContent()}
); } diff --git a/src/components/Dashboard.jsx b/src/components/Dashboard.jsx index 420e37f..cb617a3 100644 --- a/src/components/Dashboard.jsx +++ b/src/components/Dashboard.jsx @@ -37,17 +37,24 @@ class Dashboard extends React.Component { handleSelect(selected) { if (selected) { + let eventsToSelect = selected.map(eventId => this.props.domain.events[eventId]); const parser = this.props.ui.tools.parser; - const enhanceEvent = (ev) => { - return Object.assign({}, ev, this.props.domain.events[ev.id]); + eventsToSelect = eventsToSelect.sort((a, b) => { + return parser(a.timestamp) - parser(b.timestamp); + }); + + if (eventsToSelect.every(event => (event))) { + this.props.actions.updateSelected(eventsToSelect); } // Now fetch detail data for each event // Add transmitter and receiver data for coevents this.props.actions.fetchEvents(selected) .then((events) => { - let eventsSelected = events.map(enhanceEvent); + let eventsSelected = events.map(ev => { + return Object.assign({}, ev, this.props.domain.events[ev.id]); + }); eventsSelected = eventsSelected.sort((a, b) => { return parser(a.timestamp) - parser(b.timestamp); @@ -108,7 +115,6 @@ class Dashboard extends React.Component { } render() { - console.log(this.props) return (