let improvements and breaking continue

ui/js/actions/content.js

@@ -22,9 +22,6 @@ import {
 import {
   doOpenModal,
 } from 'actions/app'
-import {
-  doFetchCostInfoForUri,
-} from 'actions/cost_info'
 
 export function doResolveUri(uri) {
   return function(dispatch, getState) {
@@ -47,6 +44,15 @@ export function doResolveUri(uri) {
           certificate,
         }
       })
+    }).catch(() => {
+      dispatch({
+        type: types.RESOLVE_URI_COMPLETED,
+        data: {
+          uri,
+          claim: null,
+          certificate: null,
+        }
+      })
     })
   }
 }
@@ -114,6 +120,8 @@ export function doFetchPublishedContent() {
 
 export function doFetchFeaturedUris() {
   return function(dispatch, getState) {
+    return
+
     const state = getState()
 
     dispatch({
@@ -198,13 +206,6 @@ export function doUpdateLoadStatus(uri, outpoint) {
   }
 }
 
-export function doPlayVideo(uri) {
-  return {
-    type: types.PLAY_VIDEO_STARTED,
-    data: { uri }
-  }
-}
-
 export function doDownloadFile(uri, streamInfo) {
   return function(dispatch, getState) {
     const state = getState()
@@ -300,3 +301,34 @@ export function doWatchVideo() {
     return Promise.resolve()
   }
 }
+
+export function doFetchChannelClaims(uri) {
+  return function(dispatch, getState) {
+    dispatch({
+      type: types.FETCH_CHANNEL_CLAIMS_STARTED,
+      data: { uri }
+    })
+
+    lbry.resolve({ uri }).then((resolutionInfo) => {
+      const {
+        claims_in_channel,
+      } = resolutionInfo ? resolutionInfo : { claims_in_channel: [] }
+
+      dispatch({
+        type: types.FETCH_CHANNEL_CLAIMS_STARTED,
+        data: {
+          uri,
+          claims: claims_in_channel
+        }
+      })
+    }).catch(() => {
+      dispatch({
+        type: types.FETCH_CHANNEL_CLAIMS_COMPLETED,
+        data: {
+          uri,
+          claims: []
+        }
+      })
+    })
+  }
+}

ui/js/component/filePrice/view.jsx

@@ -4,7 +4,7 @@ import {
 } from 'component/common'
 
 class FilePrice extends React.Component{
-  componentWillMount() {
+  componentDidMount() {
     this.fetchCost(this.props)
   }
 

ui/js/constants/action_types.js

@@ -35,6 +35,8 @@ export const FETCH_FEATURED_CONTENT_STARTED = 'FETCH_FEATURED_CONTENT_STARTED'
 export const FETCH_FEATURED_CONTENT_COMPLETED = 'FETCH_FEATURED_CONTENT_COMPLETED'
 export const RESOLVE_URI_STARTED = 'RESOLVE_URI_STARTED'
 export const RESOLVE_URI_COMPLETED = 'RESOLVE_URI_COMPLETED'
+export const FETCH_CHANNEL_CLAIMS_STARTED = 'FETCH_CHANNEL_CLAIMS_STARTED'
+export const FETCH_CHANNEL_CLAIMS_COMPLETED = 'FETCH_CHANNEL_CLAIMS_COMPLETED'
 export const FETCH_DOWNLOADED_CONTENT_STARTED = 'FETCH_DOWNLOADED_CONTENT_STARTED'
 export const FETCH_DOWNLOADED_CONTENT_COMPLETED = 'FETCH_DOWNLOADED_CONTENT_COMPLETED'
 export const FETCH_PUBLISHED_CONTENT_STARTED = 'FETCH_PUBLISHED_CONTENT_STARTED'

ui/js/lbry.js

@@ -640,8 +640,9 @@ lbry.claim_list_mine = function(params={}) {
 }
 
 const claimCacheKey = 'resolve_claim_cache';
-lbry._claimCache = getLocal(claimCacheKey, {});
+lbry._claimCache = getSession(claimCacheKey, {});
 lbry.resolve = function(params={}) {
+  console.log('resolve: ' + params.uri);
   return new Promise((resolve, reject) => {
     if (!params.uri) {
       throw "Resolve has hacked cache on top of it that requires a URI"
@@ -650,8 +651,10 @@ lbry.resolve = function(params={}) {
       resolve(lbry._claimCache[params.uri]);
     } else {
       lbry.call('resolve', params, function(data) {
-        lbry._claimCache[params.uri] = data;
-        setLocal(claimCacheKey, lbry._claimCache)
+        if (data !== undefined) {
+          lbry._claimCache[params.uri] = data;
+        }
+        setSession(claimCacheKey, lbry._claimCache)
         resolve(data)
       }, reject)
     }

ui/js/page/channel/index.js

@@ -3,15 +3,25 @@ import {
   connect
 } from 'react-redux'
 import {
-  selectCurrentUriTitle,
+  doFetchChannelClaims
+} from 'actions/content'
+import {
+  selectCurrentUri,
 } from 'selectors/app'
+import {
+  selectCurrentUriClaim,
+  selectCurrentUriClaims,
+} from 'selectors/claims'
 import ChannelPage from './view'
 
 const select = (state) => ({
-  title: selectCurrentUriTitle(state)
+  uri: selectCurrentUri(state),
+  claim: selectCurrentUriClaim(state),
+  claims: selectCurrentUriClaims(state)
 })
 
 const perform = (dispatch) => ({
+  fetchClaims: (uri) => dispatch(doFetchChannelClaims(uri))
 })
 
 export default connect(select, perform)(ChannelPage)

ui/js/page/channel/view.jsx

@@ -1,22 +1,46 @@
 import React from 'react';
 
-const ChannelPage = (props) => {
-  const {
-    title
-  } = props
+class ChannelPage extends React.Component{
+  componentDidMount() {
+    this.fetchClaims(this.props)
+  }
 
-  return <main className="main--single-column">
-    <section className="card">
-      <div className="card__inner">
-        <div className="card__title-identity"><h1>{title}</h1></div>
-      </div>
-      <div className="card__content">
-        <p>
-          This channel page is a stub.
-        </p>
-      </div>
-    </section>
-  </main>
+  componentWillReceiveProps(nextProps) {
+    this.fetchClaims(nextProps)
+  }
+
+  fetchClaims(props) {
+    if (props.claims === undefined) {
+      props.fetchClaims(props.uri)
+    }
+  }
+
+  render() {
+    const {
+      claims,
+      claim,
+      uri
+    } = this.props
+
+    console.log(claims);
+    return <main className="main--single-column">
+      <section className="card">
+        <div className="card__inner">
+          <div className="card__title-identity"><h1>{uri}</h1></div>
+        </div>
+        <div className="card__content">
+          <p>
+            This channel page is a stub.
+          </p>
+        </div>
+      </section>
+      <section className="card">
+        <div className="card__content">
+          {claims}
+        </div>
+      </section>
+    </main>
+  }
 }
 
 export default ChannelPage;

ui/js/page/filePage/view.jsx

@@ -47,7 +47,7 @@ const FormatItem = (props) => {
 
 class FilePage extends React.Component{
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchFileInfo(this.props)
   }
 
@@ -56,7 +56,7 @@ class FilePage extends React.Component{
   }
 
   fetchFileInfo(props) {
-    if (!props.fileInfo) {
+    if (props.fileInfo === undefined) {
       props.fetchFileInfo()
     }
   }
@@ -104,14 +104,12 @@ class FilePage extends React.Component{
     const channelUri = signatureIsValid && hasSignature && channelUriObj.isChannel ? lbryuri.build(channelUriObj, false) : null;
     const uriIndicator = <UriIndicator uri={uri} />
 
-    //            <p>This location is not yet in use. { ' ' }<Link onClick={() => navigate('/publish')} label="Put something here" />.</p>
-
     return (
       <main className="main--single-column">
         <section className="show-page-media">
           { contentType && contentType.startsWith('video/') ?
             <Video className="video-embedded" uri={uri} metadata={metadata} outpoint={outpoint} /> :
-            (Object.keys(metadata).length > 0 ? <Thumbnail src={metadata.thumbnail} /> : <Thumbnail />) }
+            (metadata && metadata.thumbnail ? <Thumbnail src={metadata.thumbnail} /> : <Thumbnail />) }
         </section>
         <section className="card">
           <div className="card__inner">
@@ -128,7 +126,7 @@ class FilePage extends React.Component{
                 <FileActions uri={uri} /></div>
             </div>
             <div className="card__content card__subtext card__subtext card__subtext--allow-newlines">
-              {metadata.description}
+              {metadata && metadata.description}
             </div>
           </div>
           { metadata ?

ui/js/page/showPage/index.js

@@ -10,6 +10,7 @@ import {
 } from 'selectors/app'
 import {
   selectCurrentUriClaim,
+  selectCurrentUriChannelClaim,
 } from 'selectors/claims'
 import {
   selectCurrentUriIsResolving,
@@ -17,6 +18,7 @@ import {
 import ShowPage from './view'
 
 const select = (state, props) => ({
+  channelClaim: selectCurrentUriChannelClaim(state),
   claim: selectCurrentUriClaim(state),
   uri: selectCurrentUri(state),
   isResolvingUri: selectCurrentUriIsResolving(state)

ui/js/page/showPage/view.jsx

@@ -28,6 +28,7 @@ class ShowPage extends React.Component{
 
   render() {
     const {
+      channelClaim,
       claim,
       uri,
       isResolvingUri,
@@ -46,9 +47,8 @@ class ShowPage extends React.Component{
         </div>
       </section>
     }
-    else if (claim && claim.whatever) {
-      innerContent = "channel"
-      // innerContent = <ChannelPage title={uri} />
+    else if (channelClaim && claim && channelClaim.txid && channelClaim.txid === claim.txid) {
+      innerContent = <ChannelPage claim={claim} />
     }
     else if (claim) {
       innerContent = <FilePage />

ui/js/reducers/certificates.js

@@ -1,27 +0,0 @@
-import * as types from 'constants/action_types'
-
-const reducers = {}
-const defaultState = {
-}
-
-reducers[types.RESOLVE_URI_COMPLETED] = function(state, action) {
-  const {
-    uri,
-    certificate,
-  } = action.data
-  if (!certificate) return state
-
-  const newByUri = Object.assign({}, state.byUri)
-
-  newByUri[uri] = certificate
-  return Object.assign({}, state, {
-    byUri: newByUri,
-  })
-}
-
-
-export default function reducer(state = defaultState, action) {
-  const handler = reducers[action.type];
-  if (handler) return handler(state, action);
-  return state;
-}

ui/js/reducers/claims.js

@@ -8,13 +8,45 @@ const defaultState = {
 reducers[types.RESOLVE_URI_COMPLETED] = function(state, action) {
   const {
     uri,
+    certificate,
     claim,
   } = action.data
-  const newByUri = Object.assign({}, state.byUri)
 
-  newByUri[uri] = claim
+  const newClaims = Object.assign({}, state.claimsByUri)
+  const newChannelClaims = Object.assign({}, state.channelClaimsByUri)
+
+  if (claim !== undefined) {
+    newClaims[uri] = claim
+  }
+
+  //This needs a sanity boost...
+  if (certificate !== undefined) {
+    newChannelClaims[uri] = certificate
+    if (claim === undefined) {
+      newClaims[uri] = certificate
+    }
+  }
+
   return Object.assign({}, state, {
-    byUri: newByUri,
+    claimsByUri: newClaims,
+    channelClaimsByUri: newChannelClaims
+  })
+}
+
+reducers[types.FETCH_CHANNEL_CLAIMS_COMPLETED] = function(state, action) {
+  const {
+    uri,
+    claims
+  } = action.data
+
+  const newClaims = Object.assign({}, state.claimsByChannel)
+
+  if (claims !== undefined) {
+    newClaims[uri] = claims
+  }
+
+  return Object.assign({}, state, {
+    claimsByChannel: newClaims
   })
 }
 

ui/js/selectors/app.js

@@ -43,11 +43,6 @@ export const selectCurrentUri = createSelector(
   }
 )
 
-export const selectCurrentUriTitle = createSelector(
-  _selectState,
-  (state) => "fix me"
-)
-
 export const selectPageTitle = createSelector(
   selectCurrentPage,
   selectCurrentUri,

ui/js/selectors/claims.js

@@ -10,7 +10,7 @@ export const _selectState = state => state.claims || {}
 
 export const selectClaimsByUri = createSelector(
   _selectState,
-  (state) => state.byUri || {}
+  (state) => state.claimsByUri || {}
 )
 
 export const selectCurrentUriClaim = createSelector(
@@ -19,6 +19,17 @@ export const selectCurrentUriClaim = createSelector(
   (uri, byUri) => byUri[uri]
 )
 
+export const selectChannelClaimsByUri = createSelector(
+  _selectState,
+  (state) => state.channelClaimsByUri || {}
+)
+
+export const selectCurrentUriChannelClaim = createSelector(
+  selectCurrentUri,
+  selectChannelClaimsByUri,
+  (uri, byUri) => byUri[uri]
+)
+
 export const selectCurrentUriClaimOutpoint = createSelector(
   selectCurrentUriClaim,
   (claim) => {
@@ -26,6 +37,17 @@ export const selectCurrentUriClaimOutpoint = createSelector(
   }
 )
 
+export const selectClaimsByChannel = createSelector(
+  _selectState,
+  (state) => state.claimsByChannel || {}
+)
+
+export const selectCurrentUriClaims = createSelector(
+  selectCurrentUri,
+  selectClaimsByChannel,
+  (uri, byChannel) => byChannel[uri]
+)
+
 const selectClaimForUri = (state, props) => {
   const uri = lbryuri.normalize(props.uri)
   return selectClaimsByUri(state)[uri]

ui/js/store.js

@@ -7,7 +7,6 @@ import {
 } from 'redux-logger'
 import appReducer from 'reducers/app';
 import availabilityReducer from 'reducers/availability'
-import certificatesReducer from 'reducers/certificates'
 import claimsReducer from 'reducers/claims'
 import contentReducer from 'reducers/content';
 import costInfoReducer from 'reducers/cost_info'
@@ -49,7 +48,6 @@ function enableBatching(reducer) {
 const reducers = redux.combineReducers({
   app: appReducer,
   availability: availabilityReducer,
-  certificates: certificatesReducer,
   claims: claimsReducer,
   fileInfo: fileInfoReducer,
   content: contentReducer,