converted channel display to use id
This commit is contained in:
parent
c96c4d1fbd
commit
75b5981e01
8 changed files with 43 additions and 68 deletions
|
@ -109,10 +109,10 @@ export function showNewChannel (channelData) {
|
|||
};
|
||||
};
|
||||
|
||||
export function updateShowChannel (error, name, shortId, longId, claimsData) {
|
||||
export function updateShowChannel (error, id) {
|
||||
return {
|
||||
type: actions.SHOW_CHANNEL_UPDATE,
|
||||
data: { error, name, shortId, longId, claimsData },
|
||||
data: { error, id },
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -2,15 +2,9 @@ import { connect } from 'react-redux';
|
|||
import { } from 'actions/show';
|
||||
import View from './view';
|
||||
|
||||
const mapStateToProps = ({ show : { showChannel: { error, channelData, claimsData } } }) => {
|
||||
const mapStateToProps = ({ show }) => {
|
||||
return {
|
||||
error : error,
|
||||
name : channelData.name,
|
||||
longId : channelData.longId,
|
||||
claims : claimsData.claims,
|
||||
currentPage: claimsData.currentPage,
|
||||
totalPages : claimsData.totalPages,
|
||||
totalClaims: claimsData.totalClaims,
|
||||
channel: show.channelList[show.showChannel.id],
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -20,7 +20,7 @@ class ChannelClaimsDisplay extends React.Component {
|
|||
this.showNewPage(nextPage);
|
||||
}
|
||||
render () {
|
||||
const { error, claims, currentPage, totalPages } = this.props;
|
||||
const { channel: { error, claimsData: { claims, currentPage, totalPages } } } = this.props;
|
||||
return (
|
||||
<div>
|
||||
{error ? (
|
||||
|
|
|
@ -13,25 +13,26 @@ const mapStateToProps = ({ show }) => {
|
|||
channelList : show.channelList,
|
||||
// show channel
|
||||
error : show.showChannel.error,
|
||||
name : show.showChannel.channelData.name,
|
||||
shortId : show.showChannel.channelData.shortId,
|
||||
longId : show.showChannel.channelData.longId,
|
||||
id : show.showChannel.id,
|
||||
channel : show.channelList[show.showChannel.id],
|
||||
};
|
||||
};
|
||||
|
||||
const mapDispatchToProps = dispatch => {
|
||||
return {
|
||||
// request
|
||||
onNewChannelRequest (id, name, channelId) {
|
||||
dispatch(newChannelRequest(id, name, channelId));
|
||||
},
|
||||
onRequestError: (error) => {
|
||||
dispatch(updateRequestError(error, null, null));
|
||||
},
|
||||
// show channel
|
||||
onShowNewChannel: (channelData) => {
|
||||
dispatch(showNewChannel(channelData));
|
||||
},
|
||||
onShowExistingChannel: (error, name, shortId, longId, claimsData) => {
|
||||
dispatch(updateShowChannel(error, name, shortId, longId, claimsData));
|
||||
onShowExistingChannel: (id) => {
|
||||
dispatch(updateShowChannel(null, id));
|
||||
},
|
||||
onShowChannelClear: () => {
|
||||
dispatch(clearShowChannel());
|
||||
|
|
|
@ -49,7 +49,7 @@ class ShowChannel extends React.Component {
|
|||
const channelRecordId = `c#${channelData.name}#${channelData.longId}`;
|
||||
const existingChannel = channelList[channelRecordId];
|
||||
if (existingChannel) {
|
||||
this.showExistingChannel(existingChannel);
|
||||
this.showExistingChannel(channelRecordId);
|
||||
} else {
|
||||
this.showNewChannel(channelData);
|
||||
}
|
||||
|
@ -57,34 +57,39 @@ class ShowChannel extends React.Component {
|
|||
showNewChannel (channelData) {
|
||||
this.props.onShowNewChannel(channelData);
|
||||
};
|
||||
showExistingChannel (existingChannel) {
|
||||
const { error, channelData: {name, shortId, longId}, claimsData } = existingChannel;
|
||||
this.props.onShowExistingChannel(error, name, shortId, longId, claimsData);
|
||||
showExistingChannel (channelRecordId) {
|
||||
this.props.onShowExistingChannel(channelRecordId);
|
||||
};
|
||||
componentWillUnmount () {
|
||||
this.props.onShowChannelClear();
|
||||
}
|
||||
render () {
|
||||
const { error, name, longId, shortId } = this.props;
|
||||
const { error, channel } = this.props;
|
||||
if (error) {
|
||||
return (
|
||||
<ErrorPage error={error}/>
|
||||
);
|
||||
};
|
||||
return (
|
||||
<div>
|
||||
<NavBar/>
|
||||
<div className="row row--tall row--padded">
|
||||
<div className="column column--10">
|
||||
<h2>channel name: {name ? name : 'loading...'}</h2>
|
||||
<p className={'fine-print'}>full channel id: {longId ? longId : 'loading...'}</p>
|
||||
<p className={'fine-print'}>short channel id: {shortId ? shortId : 'loading...'}</p>
|
||||
</div>
|
||||
<div className="column column--10">
|
||||
{(name && longId) && <ChannelClaimsDisplay />}
|
||||
if (channel) {
|
||||
const { channelData: { name, longId, shortId } } = channel;
|
||||
return (
|
||||
<div>
|
||||
<NavBar/>
|
||||
<div className="row row--tall row--padded">
|
||||
<div className="column column--10">
|
||||
<h2>channel name: {name ? name : 'loading...'}</h2>
|
||||
<p className={'fine-print'}>full channel id: {longId ? longId : 'loading...'}</p>
|
||||
<p className={'fine-print'}>short channel id: {shortId ? shortId : 'loading...'}</p>
|
||||
</div>
|
||||
<div className="column column--10">
|
||||
{(name && longId) && <ChannelClaimsDisplay />}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
return (
|
||||
<ErrorPage error={'loading channel data...'}/>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
|
|
@ -10,18 +10,8 @@ const initialState = {
|
|||
requestId: null,
|
||||
},
|
||||
showChannel: {
|
||||
error : null,
|
||||
channelData: {
|
||||
name : null,
|
||||
shortId: null,
|
||||
longId : null,
|
||||
},
|
||||
claimsData: {
|
||||
claims : null,
|
||||
currentPage: null,
|
||||
totalPages : null,
|
||||
totalClaims: null,
|
||||
},
|
||||
error: null,
|
||||
id : null,
|
||||
},
|
||||
showAsset: {
|
||||
error: null,
|
||||
|
@ -132,30 +122,15 @@ export default function (state = initialState, action) {
|
|||
case actions.SHOW_CHANNEL_UPDATE:
|
||||
return Object.assign({}, state, {
|
||||
showChannel: {
|
||||
error : action.data.error,
|
||||
channelData: {
|
||||
name : action.data.name,
|
||||
shortId: action.data.shortId,
|
||||
longId : action.data.longId,
|
||||
},
|
||||
claimsData: action.data.claimsData,
|
||||
error: action.data.error,
|
||||
id : action.data.id,
|
||||
},
|
||||
});
|
||||
case actions.SHOW_CHANNEL_CLEAR:
|
||||
return Object.assign({}, state, {
|
||||
showChannel: {
|
||||
error : null,
|
||||
channelData: {
|
||||
name : null,
|
||||
shortId: null,
|
||||
longId : null,
|
||||
},
|
||||
claimsData: {
|
||||
claims : null,
|
||||
currentPage: null,
|
||||
totalPages : null,
|
||||
totalClaims: null,
|
||||
},
|
||||
error: null,
|
||||
id : null,
|
||||
},
|
||||
});
|
||||
// add channel to channel list
|
||||
|
|
|
@ -26,8 +26,8 @@ function* getAssetDataAndShowAsset (action) {
|
|||
if (!success) {
|
||||
return yield put(updateShowAsset(message, null));
|
||||
}
|
||||
yield put(updateShowAsset(null, id));
|
||||
yield put(upsertAssetToAssetList(id, null, name, claimId, shortId, claimData));
|
||||
yield put(updateShowAsset(null, id));
|
||||
}
|
||||
|
||||
export function* watchShowNewAsset () {
|
||||
|
|
|
@ -9,14 +9,14 @@ function* getNewChannelDataAndShowChannel (action) {
|
|||
try {
|
||||
({ success, message, data: claimsData } = yield call(getChannelClaims, name, longId, 1));
|
||||
} catch (error) {
|
||||
return yield put(updateShowChannel(error.message, name, shortId, longId));
|
||||
return yield put(updateShowChannel(error.message, null));
|
||||
}
|
||||
if (!success) {
|
||||
return yield put(updateShowChannel(message, name, shortId, longId));
|
||||
return yield put(updateShowChannel(message, null));
|
||||
}
|
||||
yield put(updateShowChannel(null, name, shortId, longId, claimsData));
|
||||
const channelData = {name, shortId, longId};
|
||||
yield put(addNewChannelToChannelList(id, null, channelData, claimsData));
|
||||
yield put(updateShowChannel(null, id));
|
||||
}
|
||||
|
||||
export function* watchShowNewChannel () {
|
||||
|
|
Loading…
Reference in a new issue