Added api sub logging, sub modal, and immediate download initiation

This commit is contained in:
liamcardenas 2018-03-16 11:22:19 -07:00
parent e75a5581be
commit 74bab48749
9 changed files with 80 additions and 9 deletions

View file

@ -2,6 +2,8 @@
import mixpanel from 'mixpanel-browser';
import Lbryio from 'lbryio';
import isDev from 'electron-is-dev';
import type { Subscription } from 'redux/reducers/subscriptions';
if (isDev) {
mixpanel.init('691723e855cabb9d27a7a79002216967');
@ -13,7 +15,9 @@ type Analytics = {
track: (string, ?Object) => void,
setUser: Object => void,
toggle: (boolean, ?boolean) => void,
apiLog: (string, string, string) => void,
apiLogView: (string, string, string) => void,
apiLogSubscribe: (Subscription) => void,
apiLogUnsubscribe: (Subscription) => void,
};
let analyticsEnabled: boolean = false;
@ -44,7 +48,7 @@ const analytics: Analytics = {
}
analyticsEnabled = enabled;
},
apiLog: (uri: string, outpoint: string, claimId: string): void => {
apiLogView: (uri: string, outpoint: string, claimId: string): void => {
if (analyticsEnabled) {
Lbryio.call('file', 'view', {
uri,
@ -53,6 +57,20 @@ const analytics: Analytics = {
}).catch(() => {});
}
},
apiLogSubscribe: (subscription: Subscription): void => {
if (analyticsEnabled) {
Lbryio.call('subscription', 'new', {
subscription
}).catch(() => {});
}
},
apiLogUnsubscribe: (subscription: Subscription): void => {
if (analyticsEnabled) {
Lbryio.call('subscription', 'delete', {
subscription
}).catch(() => {});
}
},
};
export default analytics;

View file

@ -1,5 +1,6 @@
import { connect } from 'react-redux';
import { doChannelSubscribe, doChannelUnsubscribe } from 'redux/actions/subscriptions';
import { doOpenModal } from 'redux/actions/app';
import { selectSubscriptions } from 'redux/selectors/subscriptions';
import SubscribeButton from './view';
@ -11,4 +12,5 @@ const select = (state, props) => ({
export default connect(select, {
doChannelSubscribe,
doChannelUnsubscribe,
doOpenModal,
})(SubscribeButton);

View file

@ -1,7 +1,8 @@
import React from 'react';
import Link from 'component/link';
import * as modals from 'constants/modal_types';
export default ({ channelName, uri, subscriptions, doChannelSubscribe, doChannelUnsubscribe }) => {
export default ({ channelName, uri, subscriptions, doChannelSubscribe, doChannelUnsubscribe, doOpenModal }) => {
const isSubscribed =
subscriptions.map(subscription => subscription.channelName).indexOf(channelName) !== -1;
@ -15,12 +16,16 @@ export default ({ channelName, uri, subscriptions, doChannelSubscribe, doChannel
iconRight={isSubscribed ? '' : 'at'}
button={isSubscribed ? 'alt' : 'primary'}
label={subscriptionLabel}
onClick={() =>
onClick={() => {
if(!subscriptions.length) {
doOpenModal(modals.FIRST_SUBSCRIPTION);
}
subscriptionHandler({
channelName,
uri,
})
}
}
/>
</div>
) : null;

View file

@ -16,3 +16,4 @@ export const TRANSACTION_FAILED = 'transaction_failed';
export const REWARD_APPROVAL_REQUIRED = 'reward_approval_required';
export const AFFIRM_PURCHASE = 'affirm_purchase';
export const CONFIRM_CLAIM_REVOKE = 'confirmClaimRevoke';
export const FIRST_SUBSCRIPTION = 'firstSubscription';

View file

@ -0,0 +1,10 @@
import React from 'react';
import { connect } from 'react-redux';
import { doCloseModal } from 'redux/actions/app';
import ModalFirstSubscription from './view';
const perform = dispatch => () => ({
closeModal: () => dispatch(doCloseModal()),
});
export default connect(null, perform)(ModalFirstSubscription);

View file

@ -0,0 +1,23 @@
import React from 'react';
import { Modal } from 'modal/modal';
import Link from 'component/link/index';
const ModalFirstSubscription = props => {
const { closeModal } = props;
return (
<Modal type="custom" isOpen contentLabel="Your first subscription!">
<section>
<h3 className="modal__header">{__('Your first subscription!')}</h3>
<p>
{__('When you subscribe to a channel, you will automatically download, and be notified of, all of its new content.')}
</p>
<div className="modal__buttons">
<Link button="primary" onClick={closeModal} label={__("Got it")} />
</div>
</section>
</Modal>
);
};
export default ModalFirstSubscription;

View file

@ -14,8 +14,9 @@ import ModalTransactionFailed from 'modal/modalTransactionFailed';
import ModalFileTimeout from 'modal/modalFileTimeout';
import ModalAffirmPurchase from 'modal/modalAffirmPurchase';
import ModalRevokeClaim from 'modal/modalRevokeClaim';
import ModalEmailCollection from '../modalEmailCollection';
import ModalPhoneCollection from '../modalPhoneCollection';
import ModalEmailCollection from 'modal/modalEmailCollection';
import ModalPhoneCollection from 'modal/modalPhoneCollection';
import ModalFirstSubscription from 'modal/modalFirstSubscription';
import * as modals from 'constants/modal_types';
class ModalRouter extends React.PureComponent {
@ -135,6 +136,8 @@ class ModalRouter extends React.PureComponent {
return <ModalPhoneCollection {...modalProps} />;
case modals.EMAIL_COLLECTION:
return <ModalEmailCollection {...modalProps} />;
case modals.FIRST_SUBSCRIPTION:
return <ModalFirstSubscription {...modalProps} />;
default:
return null;
}

View file

@ -228,7 +228,7 @@ export function doDownloadFile(uri, streamInfo) {
return dispatch => {
dispatch(doStartDownload(uri, streamInfo.outpoint));
analytics.apiLog(uri, streamInfo.output, streamInfo.claim_id);
analytics.apiLogView(uri, streamInfo.output, streamInfo.claim_id);
dispatch(doClaimEligiblePurchaseRewards());
};

View file

@ -6,21 +6,30 @@ import Lbry from 'lbry';
import { doPurchaseUri } from 'redux/actions/content';
import { doNavigate } from 'redux/actions/navigation';
import { buildURI } from 'lbryURI';
import analytics from 'analytics';
const CHECK_SUBSCRIPTIONS_INTERVAL = 60 * 60 * 1000;
export const doChannelSubscribe = (subscription: Subscription) => (dispatch: Dispatch) =>
export const doChannelSubscribe = (subscription: Subscription) => (dispatch: Dispatch) => {
dispatch({
type: ACTIONS.CHANNEL_SUBSCRIBE,
data: subscription,
});
export const doChannelUnsubscribe = (subscription: Subscription) => (dispatch: Dispatch) =>
analytics.apiLogSubscribe(subscription);
dispatch(doCheckSubscription(subscription, true));
}
export const doChannelUnsubscribe = (subscription: Subscription) => (dispatch: Dispatch) => {
dispatch({
type: ACTIONS.CHANNEL_UNSUBSCRIBE,
data: subscription,
});
analytics.apiLogUnsubscribe(subscription);
}
export const doCheckSubscriptions = () => (
dispatch: Dispatch,
getState: () => SubscriptionState