react/actions/show.js

@@ -77,7 +77,7 @@ export function clearShowAsset () {
 
 export function newChannelRequest (id, name, channelId) {
   return {
-    type: actions.NEW_CHANNEL_REQUEST,
+    type: actions.CHANNEL_REQUEST_NEW,
     data: {id, name, channelId},
   };
 };
@@ -91,12 +91,25 @@ export function addChannelRequest (id, error, name, longId, shortId) {
 
 // show a channel
 
-export function showNewChannel (name, longId, shortId) {
+export function showNewChannel (id, name, longId, channelData) {
-
+  return {
+    type: actions.SHOW_CHANNEL_NEW,
+    data: { id, name, longId, channelData},
+  };
 };
 
-export function updateShowChannel (name, longId, shortId) {
+// export function showExistingChannel (existingChannel) {
+//   return {
+//     type: actions.SHOW_CHANNEL_EXISTING,
+//     data: { existingChannel },
+//   };
+// };
 
+export function updateShowChannel (error, channelData, claimData) {
+  return {
+    type: actions.SHOW_CHANNEL_UPDATE,
+    data: { error, channelData, claimData },
+  }
 };
 
 export function clearShowChannel () {
@@ -105,6 +118,15 @@ export function clearShowChannel () {
   };
 };
 
+// add channels to channel list
+
+export function addNewChannelToChannelList (id, error, channelData, claimsData) {
+  return {
+    type: actions.CHANNEL_LIST_ADD,
+    data: { id, error, channelData, claimsData },
+  };
+};
+
 // display a file
 
 export function fileRequested (name, claimId) {

react/api/channelApi.js

@@ -5,10 +5,23 @@ export function getChannelData (name, id) {
   console.log('getting and storing channel data for channel:', name, id);
   if (!id) id = 'none';
   const url = `/api/channel/data/${name}/${id}`;
-  return request(url)
+  return request(url);
 };
 
-export function getChannelClaims (name, claimId) {
+export function getChannelClaims (name, longId, page) {
-
+  console.log('getting and storing channel claims for channel:', name, longId);
+  if (!page) page = 1;
+  const url = `/api/channel/claims/${name}/${longId}/${page}`;
   return Request(url);
+    // .then(({ success, message, data }) => {
+    //   console.log('api/channel-claims response:', data);
+    //   if (!success) {
+    //     return this.setState({error: message});
+    //   }
+    //   this.setState({error: null}); // move this error to redux state
+    //   this.props.onChannelClaimsDataUpdate(data.claims, data.currentPage, data.totalPages, data.totalResults);
+    // })
+    // .catch((error) => {
+    //   this.setState({error: error.message});
+    // });
 };

react/constants/show_action_types.js

@@ -2,12 +2,7 @@ export const REQUEST_CHANNEL_UPDATE = 'REQUEST_CHANNEL_UPDATE';
 export const REQUEST_CLAIM_UPDATE = 'REQUEST_CLAIM_UPDATE';
 export const REQUEST_ERROR_UPDATE = 'REQUEST_ERROR_UPDATE';
 
-export const SHOW_CHANNEL_ERROR = 'SHOW_CHANNEL_ERROR';
-export const CHANNEL_DATA_UPDATE = 'CHANNEL_DATA_UPDATE';
-export const CHANNEL_CLAIMS_DATA_UPDATE = 'CHANNEL_CLAIMS_DATA_UPDATE';
-
 export const SHOW_ASSET_UPDATE = 'SHOW_ASSET_UPDATE';
-export const ASSET_CLAIM_DATA_UPDATE = 'ASSET_CLAIM_DATA_UPDATE';
 
 export const FILE_REQUESTED = 'FILE_REQUESTED';
 export const FILE_AVAILABILITY_UPDATE = 'FILE_AVAILABILITY_UPDATE';
@@ -20,8 +15,11 @@ export const ASSET_REQUEST_ADD = 'ASSET_REQUEST_ADD';
 export const SHOW_ASSET_NEW = 'SHOW_ASSET_NEW';
 export const SHOW_ASSET_CLEAR = 'SHOW_ASSET_CLEAR';
 
-export const NEW_CHANNEL_REQUEST = 'NEW_CHANNEL_REQUEST';
+export const CHANNEL_REQUEST_NEW = 'CHANNEL_REQUEST_NEW';
 export const CHANNEL_REQUEST_ADD = 'CHANNEL_REQUEST_ADD';
 
-export const SHOW_NEW_CHANNEL = 'SHOW_NEW_CHANNEL';
+export const SHOW_CHANNEL_NEW = 'SHOW_CHANNEL_NEW';
+export const SHOW_CHANNEL_UPDATE = 'SHOW_CHANNEL_UPDATE';
 export const SHOW_CHANNEL_CLEAR = 'SHOW_CHANNEL_CLEAR';
+
+export const CHANNEL_LIST_ADD = 'CHANNEL_LIST_ADD';

react/containers/ChannelClaimsDisplay/view.jsx

@@ -22,19 +22,7 @@ class ChannelClaimsDisplay extends React.Component {
     }
   }
   updateClaimsData (name, longId, page) {
-    const url = `/api/channel/claims/${name}/${longId}/${page}`;
+    console.log('this function has been moved into the redux sagas');
-    return request(url)
-      .then(({ success, message, data }) => {
-        console.log('api/channel-claims response:', data);
-        if (!success) {
-          return this.setState({error: message});
-        }
-        this.setState({error: null}); // move this error to redux state
-        this.props.onChannelClaimsDataUpdate(data.claims, data.currentPage, data.totalPages, data.totalResults);
-      })
-      .catch((error) => {
-        this.setState({error: error.message});
-      });
   }
   componentWillUnmount () {
     this.props.onChannelClaimsDataClear();

react/containers/ShowChannel/index.js

@@ -1,5 +1,5 @@
 import { connect } from 'react-redux';
-import {newChannelRequest, updateRequestError, clearShowChannel} from 'actions/show';
+import {newChannelRequest, updateRequestError, showNewChannel, clearShowChannel} from 'actions/show';
 import View from './view';
 
 const mapStateToProps = ({ show }) => {
@@ -10,7 +10,7 @@ const mapStateToProps = ({ show }) => {
     requestChannelName: show.request.data.name,
     requestChannelId  : show.request.data.id,
     requestList       : show.channelRequests,
-    channelList       : show.channels,
+    channelList       : show.channelList,
     // show channel
     error             : show.showChannel.error,
     name              : show.showChannel.channelData.name,
@@ -26,17 +26,16 @@ const mapDispatchToProps = dispatch => {
     },
     onRequestError: (error) => {
       dispatch(updateRequestError(error, null, null));
+    },
+    onShowNewChannel: (id, name, longId) => {
+      dispatch(showNewChannel(id, name, longId));
+    },
+    onShowExistingChannel: () => {
+      
     },
     onShowChannelClear: () => {
       dispatch(clearShowChannel());
     },
-    // onShowChannelError: (error) => {
-    //   dispatch(updateShowChannelError(error));
-    // },
-    // onChannelDataUpdate: (name, longId, shortId) => {
-    //   dispatch(updateChannelData(name, longId, shortId));
-    //   dispatch(updateShowChannelError(null));  // clear any errors
-    // },
   };
 };
 

react/containers/ShowChannel/view.jsx

@@ -38,24 +38,25 @@ class ShowChannel extends React.Component {
     console.log('new request');
     this.props.onNewChannelRequest(requestId, requestName, requestChannelId);
   }
-  onRepeatChannelRequest ({ id, error, channelData: { channelName, longChannelClaimId} }, channelList) {
+  onRepeatChannelRequest ({ error, channelData }, channelList) {
     // if error, return and update state with error
     if (error) {
       return this.props.onRequestError(error);
     }
     // check if the channel data is present or not
-    const existingChannel = channelList[id];
+    const channelRecordId = `c#${channelData.name}#${channelData.longId}`;
+    const existingChannel = channelList[channelRecordId];
     if (existingChannel) {
-      showExistingChannel();
+      this.showExistingChannel(channelRecordId, existingChannel);
     } else {
-      showNewChannel();
+      this.showNewChannel(channelRecordId, channelData.name, channelData.longId, channelData);
     }
   }
-  showNewChannel () {
+  showNewChannel (channelRecordId, name, longId) {
-
+    this.props.onShowNewChannel(channelRecordId, name, longId);
   };
-  showExistingChannel () {
+  showExistingChannel (existingChannel) {
-
+    this.props.onShowExistingChannel(existingChannel);
   };
   componentWillUnmount () {
     this.props.onShowChannelClear();

react/reducers/show.js

@@ -35,7 +35,7 @@ const initialState = {
     status: LOCAL_CHECK,
   },
   channelRequests: {},
-  channels       : {},  // same schema as showChannel
+  channelList    : {},
   assetRequests  : {},
   assets         : {},  // same schema as showAsset
 };
@@ -134,8 +134,14 @@ export default function (state = initialState, action) {
         }),
       });
     // show a channel
-    // case actions.SHOW_CHANNEL_NEW:
+    case actions.SHOW_CHANNEL_UPDATE:
-    // case actions.SHOW_CHANNEL_UPDATE:
+      return Object.assign({}, state, {
+        showChannel: {
+          error      : action.error,
+          channelData: action.channelData,
+          claimData  : action.claimData,
+        },
+      });
     case actions.SHOW_CHANNEL_CLEAR:
       return Object.assign({}, state, {
         showChannel: {
@@ -153,6 +159,17 @@ export default function (state = initialState, action) {
           },
         },
       });
+    // add channel to channel list
+    case actions.CHANNEL_LIST_ADD:
+      return Object.assign({}, state, {
+        channelList: Object.assign({}, state.channelList, {
+          [action.data.id]: {
+            error      : action.data.error,
+            channelData: action.data.channelData,
+            claimsData : action.data.claimsData,
+          },
+        }),
+      });
     // display an asset
     case actions.FILE_AVAILABILITY_UPDATE:
       return Object.assign({}, state, {

react/sagas/index.js

@@ -1,11 +1,12 @@
 import { all } from 'redux-saga/effects';
-import { watchNewAssetRequest, watchShowNewAsset, watchNewChannelRequest, watchFileIsRequested } from './show';
+import { watchNewAssetRequest, watchShowNewAsset, watchNewChannelRequest, watchShowNewChannel, watchFileIsRequested } from './show';
 
 export default function* rootSaga () {
   yield all([
     watchNewAssetRequest(),
     watchShowNewAsset(),
     watchNewChannelRequest(),
+    watchShowNewChannel(),
     watchFileIsRequested(),
   ]);
 }

react/sagas/show.js

@@ -1,6 +1,6 @@
 import { call, put, takeLatest } from 'redux-saga/effects';
 import * as actions from 'constants/show_action_types';
-import { addAssetRequest, updateShowAsset, showNewAsset, addChannelRequest, updateShowChannel, updateFileAvailability, updateDisplayAssetError } from 'actions/show';
+import { addAssetRequest, updateShowAsset, showNewAsset, addChannelRequest, showNewChannel, updateShowChannel, addNewChannelToChannelList, updateFileAvailability, updateDisplayAssetError } from 'actions/show';
 import { UNAVAILABLE, AVAILABLE } from 'constants/asset_display_states';
 import { checkFileAvailability, triggerClaimGet } from 'api/fileApi';
 import { getLongClaimId, getShortId, getClaimData } from 'api/assetApi';
@@ -47,6 +47,7 @@ function* getAssetDataAndShowAsset (action) {
   }
   // if both are successfull, add to asset list and select for showing
   yield put(updateShowAsset(id, null, name, claimId, shortId, claimData));
+  // yield put(addAssetToAssetList(arg1, arg2));
 }
 
 function* retrieveFile (action) {
@@ -87,23 +88,40 @@ function* newChannelRequest (action) {
   try {
     ({success, message, data} = yield call(getChannelData, name, channelId));
   } catch (error) {
-    yield put(addChannelRequest(id, error.message, null, null, null));
+    return yield put(addChannelRequest(id, error.message, null, null, null));
   }
-  if (success) {
+  if (!success) {
-    const { channelName, longChannelClaimId, shortChannelClaimId } = data;
+    return yield put(addChannelRequest(id, message, null, null, null));
-    return yield put(addChannelRequest(id, null, channelName, longChannelClaimId, shortChannelClaimId));
   }
-  yield put(addChannelRequest(id, message, null, null, null));
+  const { channelName, longChannelClaimId, shortChannelClaimId } = data;
+  yield put(addChannelRequest(id, null, channelName, longChannelClaimId, shortChannelClaimId));
+  const channelRecordId = `c#${channelName}#${longChannelClaimId}`;  // move to the action
+  yield put(showNewChannel(channelRecordId, channelName, longChannelClaimId ));
 }
 
-
+function* getNewChannelDataAndShowChannel (action) {
+  const { id, name, longId, channelData } = action;
+  let success, message, claimsData;
+  try {
+    ({ success, message, data: claimsData } = yield call(getChannelClaims, name, longId, 1));
+  } catch (error) {
+    return yield put(updateShowChannel(error.message, channelData, null));
+    // yield put(addNewChannelToChannelList(id, error.message, null, null));
+  }
+  if (!success) {
+    return yield put(updateShowChannel(message, channelData, null));
+    // yield put(addNewChannelToChannelList(id, message, null, null));
+  }
+  yield put(updateShowChannel(null, channelData, claimsData));
+  yield put(addNewChannelToChannelList(id, null, channelData, claimsData));
+}
 
 export function* watchNewAssetRequest () {
   yield takeLatest(actions.ASSET_REQUEST_NEW, newAssetRequest);
 };
 
 export function* watchNewChannelRequest () {
-  yield takeLatest(actions.NEW_CHANNEL_REQUEST, newChannelRequest);
+  yield takeLatest(actions.CHANNEL_REQUEST_NEW, newChannelRequest);
 };
 
 export function* watchShowNewAsset () {
@@ -111,7 +129,7 @@ export function* watchShowNewAsset () {
 };
 
 export function* watchShowNewChannel () {
-  yield takeLatest(actions.SHOW_ASSET_NEW, getAssetDataAndShowAsset);
+  yield takeLatest(actions.SHOW_CHANNEL_NEW, getNewChannelDataAndShowChannel);
 };
 
 export function* watchFileIsRequested () {