display source errors in card

src/actions/index.js

@@ -118,7 +118,6 @@ export function updateDomain(domain) {
 
 export function fetchSelected(selected) {
   if (!selected || !selected.length || selected.length === 0) {
-    console.log('hitting base')
     return updateSelected([])
   }
   return dispatch => {
@@ -127,6 +126,7 @@ export function fetchSelected(selected) {
       dispatch(fetchSourceError('No source extension specified.'))
     } else {
       dispatch(toggleFetchingSources())
+      // TODO: fetching logic
     }
 
   }

src/components/Card.jsx

@@ -91,7 +91,10 @@ class Card extends React.Component {
       <CardSource
         isLoading={this.props.isLoading}
         language={this.props.language}
-        source={this.props.event.source}
+        source={{
+          ...this.props.source,
+          error: this.props.sourceError
+        }}
       />
     )
   }
@@ -137,11 +140,6 @@ class Card extends React.Component {
   }
 
   renderContent() {
-    // if (!this.state.isHighlighted) {
-    //   return (
-    //     <div className="card-bottomhalf folded"></div>
-    //   );
-    // } else {
     return (
       <div className="card-bottomhalf">
         {this.renderTags()}
@@ -149,7 +147,6 @@ class Card extends React.Component {
         {this.renderNarrative()}
       </div>
     );
-    // }
   }
 
   renderCaret() {

src/components/CardStack.jsx

@@ -20,6 +20,7 @@ class CardStack extends React.Component {
         return (
           <Card
             event={event}
+            sourceError={this.props.sourceError}
             language={this.props.language}
             isLoading={this.props.isLoading}
             getNarrativeLinks={this.props.getNarrativeLinks}
@@ -89,6 +90,7 @@ class CardStack extends React.Component {
 function mapStateToProps(state) {
   return {
     selected: state.app.selected,
+    sourceError: state.app.errors.source,
     language: state.app.language,
     isCardstack: state.app.flags.isCardstack,
     isLoading: state.app.flags.isFetchingSources

src/components/presentational/CardSource.js

@@ -3,20 +3,27 @@ import Spinner from './Spinner'
 
 import copy from '../../js/data/copy.json'
 
-const CardSource = ({ source, language, isLoading }) => {
+const CardSource = ({ source, language, isLoading, error }) => {
   const source_lang = copy[language].cardstack.source
-  if (!source) source = copy[language].cardstack.unknown_source
 
-  const content = isLoading ? (
-    <Spinner />
-  ) : (
-    <div><small>{source}</small></div>
-  )
+  if (isLoading) {
+    return <Spinner />
+  }
+
+  function renderSource() {
+    return (
+      <div><p>TODO: display source properly.</p></div>
+    )
+  }
 
   return (
     <div className="card-col card-cell source">
       <h4>{source_lang}: </h4>
-      {content}
+      {source.error ? (
+        <div><small>{source.error}</small></div>
+      ) : (
+        renderSource()
+      )}
     </div>
   )
 }

src/reducers/app.js

@@ -16,6 +16,7 @@ import {
   TOGGLE_INFOPOPUP,
   TOGGLE_NOTIFICATIONS,
   FETCH_ERROR,
+  FETCH_SOURCE_ERROR,
 } from '../actions';
 
 function updateHighlighted(appState, action) {
@@ -156,6 +157,16 @@ function toggleNotifications(appState, action) {
   });
 }
 
+function fetchSourceError(appState, action) {
+  return {
+    ...appState,
+    errors: {
+      ...appState.errors,
+      source: action.msg
+    }
+  }
+}
+
 
 
 function app(appState = initial.app, action) {
@@ -186,6 +197,8 @@ function app(appState = initial.app, action) {
       return toggleInfoPopup(appState, action);
     case TOGGLE_NOTIFICATIONS:
       return toggleNotifications(appState, action);
+    case FETCH_SOURCE_ERROR:
+      return fetchSourceError(appState, action);
     default:
       return appState;
   }

src/store/initial.js

@@ -25,7 +25,9 @@ const initial = {
   *   or by the characteristics of the client, browser, etc.
   */
   app: {
-    error: null,
+    errors: {
+      source: null,
+    },
     highlighted: null,
     selected: [],
     narrative: null,