adds shareModal to channel page #2088

Merged
jessopb merged 3 commits from channelShare into master 2018-11-05 16:31:42 +01:00
2 changed files with 23 additions and 5 deletions
Showing only changes of commit 2c6cc7de0f - Show all commits

View file

@ -7,6 +7,7 @@ import {
makeSelectCurrentParam, makeSelectCurrentParam,
makeSelectClaimIsMine, makeSelectClaimIsMine,
selectCurrentParams, selectCurrentParams,
doNotify,
} from 'lbry-redux'; } from 'lbry-redux';
import { doNavigate } from 'redux/actions/navigation'; import { doNavigate } from 'redux/actions/navigation';
import { makeSelectTotalPagesForChannel } from 'redux/selectors/content'; import { makeSelectTotalPagesForChannel } from 'redux/selectors/content';
@ -26,6 +27,7 @@ const perform = dispatch => ({
fetchClaims: (uri, page) => dispatch(doFetchClaimsByChannel(uri, page)), fetchClaims: (uri, page) => dispatch(doFetchClaimsByChannel(uri, page)),
fetchClaimCount: uri => dispatch(doFetchClaimCountByChannel(uri)), fetchClaimCount: uri => dispatch(doFetchClaimCountByChannel(uri)),
navigate: (path, params) => dispatch(doNavigate(path, params)), navigate: (path, params) => dispatch(doNavigate(path, params)),
openModal: (modal, props) => dispatch(doNotify(modal, props)),
}); });
export default connect( export default connect(

View file

@ -4,11 +4,13 @@ import BusyIndicator from 'component/common/busy-indicator';
import { FormField, FormRow } from 'component/common/form'; import { FormField, FormRow } from 'component/common/form';
import ReactPaginate from 'react-paginate'; import ReactPaginate from 'react-paginate';
import SubscribeButton from 'component/subscribeButton'; import SubscribeButton from 'component/subscribeButton';
import ViewOnWebButton from 'component/viewOnWebButton';
import Page from 'component/page'; import Page from 'component/page';
import FileList from 'component/fileList'; import FileList from 'component/fileList';
import HiddenNsfwClaims from 'component/hiddenNsfwClaims'; import HiddenNsfwClaims from 'component/hiddenNsfwClaims';
import type { Claim } from 'types/claim'; import type { Claim } from 'types/claim';
import Button from 'component/button';
import { MODALS } from 'lbry-redux';
import * as icons from 'constants/icons';
type Props = { type Props = {
uri: string, uri: string,
@ -22,6 +24,7 @@ type Props = {
fetchClaims: (string, number) => void, fetchClaims: (string, number) => void,
fetchClaimCount: string => void, fetchClaimCount: string => void,
navigate: (string, {}) => void, navigate: (string, {}) => void,
openModal: ({ id: string }, { uri: string }) => void,
}; };
class ChannelPage extends React.PureComponent<Props> { class ChannelPage extends React.PureComponent<Props> {
@ -67,10 +70,18 @@ class ChannelPage extends React.PureComponent<Props> {
} }
render() { render() {
const { uri, fetching, claimsInChannel, claim, page, totalPages, channelIsMine } = this.props; const {
const { name, permanent_url: permanentUrl, claim_id: claimId } = claim; uri,
fetching,
claimsInChannel,
claim,
page,
totalPages,
channelIsMine,
openModal,
} = this.props;
const { name, permanent_url: permanentUrl } = claim;
const currentPage = parseInt((page || 1) - 1, 10); const currentPage = parseInt((page || 1) - 1, 10);
const contentList = const contentList =
claimsInChannel && claimsInChannel.length ? ( claimsInChannel && claimsInChannel.length ? (
<FileList sortByHeight hideFilter fileInfos={claimsInChannel} /> <FileList sortByHeight hideFilter fileInfos={claimsInChannel} />
@ -88,7 +99,12 @@ class ChannelPage extends React.PureComponent<Props> {
</section> </section>
<div className="card__actions"> <div className="card__actions">
<SubscribeButton uri={`lbry://${permanentUrl}`} channelName={name} /> <SubscribeButton uri={`lbry://${permanentUrl}`} channelName={name} />
<ViewOnWebButton claimId={claimId} claimName={name} /> <Button
button="alt"
icon={icons.GLOBE}
label={__('Share Channel')}
onClick={() => openModal({ id: MODALS.SOCIAL_SHARE }, { uri, speechShareable:'true' })}
/>
</div> </div>
<section className="card__content">{contentList}</section> <section className="card__content">{contentList}</section>
{(!fetching || (claimsInChannel && claimsInChannel.length)) && {(!fetching || (claimsInChannel && claimsInChannel.length)) &&