Merge branch 'notify-hot-right-now'
This commit is contained in:
commit
cd7e780465
17 changed files with 134 additions and 12 deletions
|
@ -133,6 +133,34 @@ export function doFetchFeaturedUris() {
|
|||
};
|
||||
}
|
||||
|
||||
export function doFetchRewardedContent() {
|
||||
return function(dispatch, getState) {
|
||||
const state = getState();
|
||||
|
||||
const success = nameToClaimId => {
|
||||
dispatch({
|
||||
type: types.FETCH_REWARD_CONTENT_COMPLETED,
|
||||
data: {
|
||||
claimIds: Object.values(nameToClaimId),
|
||||
success: true,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const failure = () => {
|
||||
dispatch({
|
||||
type: types.FETCH_REWARD_CONTENT_COMPLETED,
|
||||
data: {
|
||||
claimIds: [],
|
||||
success: false,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
lbryio.call("reward", "list_featured").then(success, failure);
|
||||
};
|
||||
}
|
||||
|
||||
export function doUpdateLoadStatus(uri, outpoint) {
|
||||
return function(dispatch, getState) {
|
||||
const state = getState();
|
||||
|
|
|
@ -7,6 +7,8 @@ import {
|
|||
doAlertError,
|
||||
doRecordScroll,
|
||||
} from "actions/app";
|
||||
import { doFetchRewardedContent } from "actions/content";
|
||||
|
||||
import { doUpdateBalance } from "actions/wallet";
|
||||
import { selectWelcomeModalAcknowledged } from "selectors/app";
|
||||
import { selectUser } from "selectors/user";
|
||||
|
@ -24,6 +26,7 @@ const perform = dispatch => ({
|
|||
checkUpgradeAvailable: () => dispatch(doCheckUpgradeAvailable()),
|
||||
openWelcomeModal: () => dispatch(doOpenModal(modals.WELCOME)),
|
||||
updateBalance: balance => dispatch(doUpdateBalance(balance)),
|
||||
fetchRewardedContent: () => dispatch(doFetchRewardedContent()),
|
||||
recordScroll: scrollPosition => dispatch(doRecordScroll(scrollPosition)),
|
||||
});
|
||||
|
||||
|
|
|
@ -12,7 +12,12 @@ import * as modals from "constants/modal_types";
|
|||
|
||||
class App extends React.PureComponent {
|
||||
componentWillMount() {
|
||||
const { alertError, checkUpgradeAvailable, updateBalance } = this.props;
|
||||
const {
|
||||
alertError,
|
||||
checkUpgradeAvailable,
|
||||
updateBalance,
|
||||
fetchRewardedContent,
|
||||
} = this.props;
|
||||
|
||||
document.addEventListener("unhandledError", event => {
|
||||
alertError(event.detail);
|
||||
|
@ -26,6 +31,8 @@ class App extends React.PureComponent {
|
|||
updateBalance(balance);
|
||||
});
|
||||
|
||||
fetchRewardedContent();
|
||||
|
||||
this.showWelcome(this.props);
|
||||
|
||||
this.scrollListener = () => this.props.recordScroll(window.scrollY);
|
||||
|
|
|
@ -8,7 +8,10 @@ import {
|
|||
makeSelectMetadataForUri,
|
||||
} from "selectors/claims";
|
||||
import { makeSelectFileInfoForUri } from "selectors/file_info";
|
||||
import { makeSelectIsResolvingForUri } from "selectors/content";
|
||||
import {
|
||||
makeSelectIsResolvingForUri,
|
||||
selectRewardContentClaimIds,
|
||||
} from "selectors/content";
|
||||
import FileCard from "./view";
|
||||
|
||||
const makeSelect = () => {
|
||||
|
@ -22,6 +25,7 @@ const makeSelect = () => {
|
|||
fileInfo: selectFileInfoForUri(state, props),
|
||||
obscureNsfw: !selectShowNsfw(state),
|
||||
metadata: selectMetadataForUri(state, props),
|
||||
rewardedContentClaimIds: selectRewardContentClaimIds(state, props),
|
||||
isResolvingUri: selectResolvingUri(state, props),
|
||||
});
|
||||
|
||||
|
|
|
@ -2,7 +2,8 @@ import React from "react";
|
|||
import lbryuri from "lbryuri.js";
|
||||
import CardMedia from "component/cardMedia";
|
||||
import Link from "component/link";
|
||||
import { Thumbnail, TruncatedText, Icon } from "component/common";
|
||||
import { TruncatedText, Icon } from "component/common";
|
||||
import IconFeatured from "component/iconFeatured";
|
||||
import FilePrice from "component/filePrice";
|
||||
import UriIndicator from "component/uriIndicator";
|
||||
import NsfwOverlay from "component/nsfwOverlay";
|
||||
|
@ -46,7 +47,14 @@ class FileCard extends React.PureComponent {
|
|||
}
|
||||
|
||||
render() {
|
||||
const { claim, fileInfo, metadata, isResolvingUri, navigate } = this.props;
|
||||
const {
|
||||
claim,
|
||||
fileInfo,
|
||||
metadata,
|
||||
isResolvingUri,
|
||||
navigate,
|
||||
rewardedContentClaimIds,
|
||||
} = this.props;
|
||||
|
||||
const uri = lbryuri.normalize(this.props.uri);
|
||||
const title = metadata && metadata.title ? metadata.title : uri;
|
||||
|
@ -54,6 +62,7 @@ class FileCard extends React.PureComponent {
|
|||
? metadata.thumbnail
|
||||
: null;
|
||||
const obscureNsfw = this.props.obscureNsfw && metadata && metadata.nsfw;
|
||||
const isRewardContent = claim && rewardedContentClaimIds.includes(claim.claim_id);
|
||||
|
||||
let description = "";
|
||||
if (isResolvingUri && !claim) {
|
||||
|
@ -86,9 +95,8 @@ class FileCard extends React.PureComponent {
|
|||
<div className="card__subtitle">
|
||||
<span style={{ float: "right" }}>
|
||||
<FilePrice uri={uri} />
|
||||
{fileInfo
|
||||
? <span>{" "}<Icon fixed icon="icon-folder" /></span>
|
||||
: ""}
|
||||
{isRewardContent && <span>{" "}<IconFeatured /></span> }
|
||||
{fileInfo && <span>{" "}<Icon fixed icon="icon-folder" /></span> }
|
||||
</span>
|
||||
<UriIndicator uri={uri} />
|
||||
</div>
|
||||
|
|
|
@ -8,7 +8,10 @@ import {
|
|||
} from "selectors/claims";
|
||||
import { makeSelectFileInfoForUri } from "selectors/file_info";
|
||||
import { selectShowNsfw } from "selectors/settings";
|
||||
import { makeSelectIsResolvingForUri } from "selectors/content";
|
||||
import {
|
||||
makeSelectIsResolvingForUri,
|
||||
selectRewardContentClaimIds,
|
||||
} from "selectors/content";
|
||||
import FileTile from "./view";
|
||||
|
||||
const makeSelect = () => {
|
||||
|
@ -23,6 +26,7 @@ const makeSelect = () => {
|
|||
obscureNsfw: !selectShowNsfw(state),
|
||||
metadata: selectMetadataForUri(state, props),
|
||||
isResolvingUri: selectResolvingUri(state, props),
|
||||
rewardedContentClaimIds: selectRewardContentClaimIds(state, props),
|
||||
});
|
||||
|
||||
return select;
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
import React from "react";
|
||||
import lbry from "lbry.js";
|
||||
import lbryuri from "lbryuri.js";
|
||||
import CardMedia from "component/cardMedia";
|
||||
import Link from "component/link";
|
||||
import { TruncatedText } from "component/common.js";
|
||||
import FilePrice from "component/filePrice";
|
||||
import NsfwOverlay from "component/nsfwOverlay";
|
||||
import IconFeatured from "component/iconFeatured";
|
||||
|
||||
class FileTile extends React.PureComponent {
|
||||
static SHOW_EMPTY_PUBLISH = "publish";
|
||||
|
@ -58,6 +58,7 @@ class FileTile extends React.PureComponent {
|
|||
showEmpty,
|
||||
navigate,
|
||||
hidePrice,
|
||||
rewardedContentClaimIds,
|
||||
} = this.props;
|
||||
|
||||
const uri = lbryuri.normalize(this.props.uri);
|
||||
|
@ -70,6 +71,8 @@ class FileTile extends React.PureComponent {
|
|||
? metadata.thumbnail
|
||||
: null;
|
||||
const obscureNsfw = this.props.obscureNsfw && metadata && metadata.nsfw;
|
||||
const isRewardContent = claim && rewardedContentClaimIds.includes(claim.claim_id);
|
||||
|
||||
let onClick = () => navigate("/show", { uri });
|
||||
|
||||
let description = "";
|
||||
|
@ -106,8 +109,11 @@ class FileTile extends React.PureComponent {
|
|||
<div className="file-tile__content">
|
||||
<div className="card__title-primary">
|
||||
{!hidePrice ? <FilePrice uri={this.props.uri} /> : null}
|
||||
{isRewardContent && <IconFeatured /> }
|
||||
<div className="meta">{uri}</div>
|
||||
<h3><TruncatedText lines={1}>{title}</TruncatedText></h3>
|
||||
<h3>
|
||||
<TruncatedText lines={1}>{title}</TruncatedText>
|
||||
</h3>
|
||||
</div>
|
||||
<div className="card__content card__subtext">
|
||||
<TruncatedText lines={3}>
|
||||
|
|
5
ui/js/component/iconFeatured/index.js
Normal file
5
ui/js/component/iconFeatured/index.js
Normal file
|
@ -0,0 +1,5 @@
|
|||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import IconFeatured from "./view";
|
||||
|
||||
export default connect(null, null)(IconFeatured);
|
14
ui/js/component/iconFeatured/view.jsx
Normal file
14
ui/js/component/iconFeatured/view.jsx
Normal file
|
@ -0,0 +1,14 @@
|
|||
import React from "react";
|
||||
import { Icon } from "component/common.js";
|
||||
|
||||
const IconFeatured = props => {
|
||||
return (
|
||||
<span className="icon-featured" title={ __("Watch content with this icon to earn weekly rewards.")}>
|
||||
<Icon icon="icon-star"
|
||||
fixed
|
||||
className="card__icon-featured-content" />
|
||||
</span>
|
||||
);
|
||||
};
|
||||
|
||||
export default IconFeatured;
|
|
@ -112,3 +112,5 @@ export const CLAIM_REWARD_STARTED = "CLAIM_REWARD_STARTED";
|
|||
export const CLAIM_REWARD_SUCCESS = "CLAIM_REWARD_SUCCESS";
|
||||
export const CLAIM_REWARD_FAILURE = "CLAIM_REWARD_FAILURE";
|
||||
export const CLAIM_REWARD_CLEAR_ERROR = "CLAIM_REWARD_CLEAR_ERROR";
|
||||
export const FETCH_REWARD_CONTENT_COMPLETED =
|
||||
"FETCH_REWARD_CONTENT_COMPLETED";
|
||||
|
|
|
@ -3,6 +3,7 @@ import { connect } from "react-redux";
|
|||
import { doNavigate } from "actions/app";
|
||||
import { doFetchFileInfo } from "actions/file_info";
|
||||
import { makeSelectFileInfoForUri } from "selectors/file_info";
|
||||
import { selectRewardContentClaimIds } from "selectors/content";
|
||||
import { doFetchCostInfoForUri } from "actions/cost_info";
|
||||
import {
|
||||
makeSelectClaimForUri,
|
||||
|
@ -27,6 +28,7 @@ const makeSelect = () => {
|
|||
metadata: selectMetadata(state, props),
|
||||
obscureNsfw: !selectShowNsfw(state),
|
||||
fileInfo: selectFileInfo(state, props),
|
||||
rewardedContentClaimIds: selectRewardContentClaimIds(state, props),
|
||||
});
|
||||
|
||||
return select;
|
||||
|
|
|
@ -8,6 +8,7 @@ import FilePrice from "component/filePrice";
|
|||
import FileActions from "component/fileActions";
|
||||
import Link from "component/link";
|
||||
import UriIndicator from "component/uriIndicator";
|
||||
import IconFeatured from "component/iconFeatured";
|
||||
|
||||
const FormatItem = props => {
|
||||
const { contentType, metadata: { language, license } } = props;
|
||||
|
@ -54,7 +55,14 @@ class FilePage extends React.PureComponent {
|
|||
}
|
||||
|
||||
render() {
|
||||
const { claim, fileInfo, metadata, contentType, uri } = this.props;
|
||||
const {
|
||||
claim,
|
||||
fileInfo,
|
||||
metadata,
|
||||
contentType,
|
||||
uri,
|
||||
rewardedContentClaimIds,
|
||||
} = this.props;
|
||||
|
||||
if (!claim || !metadata) {
|
||||
return (
|
||||
|
@ -80,6 +88,7 @@ class FilePage extends React.PureComponent {
|
|||
? lbryuri.build({ channelName, claimId: channelClaimId }, false)
|
||||
: null;
|
||||
const uriIndicator = <UriIndicator uri={uri} />;
|
||||
const isRewardContent = rewardedContentClaimIds.includes(claim.claim_id);
|
||||
const mediaType = lbry.getMediaType(contentType);
|
||||
const player = require("render-media");
|
||||
const obscureNsfw = this.props.obscureNsfw && metadata && metadata.nsfw;
|
||||
|
@ -102,6 +111,7 @@ class FilePage extends React.PureComponent {
|
|||
{!fileInfo || fileInfo.written_bytes <= 0
|
||||
? <span style={{ float: "right" }}>
|
||||
<FilePrice uri={lbryuri.normalize(uri)} />
|
||||
{isRewardContent && <span>{" "}<IconFeatured /></span> }
|
||||
</span>
|
||||
: null}
|
||||
<h1>{title}</h1>
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
import * as types from "constants/action_types";
|
||||
|
||||
const reducers = {};
|
||||
const defaultState = {};
|
||||
const defaultState = {
|
||||
rewardedContentClaimIds: [],
|
||||
};
|
||||
|
||||
reducers[types.FETCH_FEATURED_CONTENT_STARTED] = function(state, action) {
|
||||
return Object.assign({}, state, {
|
||||
|
@ -19,6 +21,17 @@ reducers[types.FETCH_FEATURED_CONTENT_COMPLETED] = function(state, action) {
|
|||
});
|
||||
};
|
||||
|
||||
reducers[types.FETCH_REWARD_CONTENT_COMPLETED] = function(
|
||||
state,
|
||||
action
|
||||
) {
|
||||
const { claimIds, success } = action.data;
|
||||
|
||||
return Object.assign({}, state, {
|
||||
rewardedContentClaimIds: claimIds,
|
||||
});
|
||||
};
|
||||
|
||||
reducers[types.RESOLVE_URI_STARTED] = function(state, action) {
|
||||
const { uri } = action.data;
|
||||
|
||||
|
|
|
@ -37,3 +37,8 @@ const selectTotalPagesForChannel = (state, props) => {
|
|||
export const makeSelectTotalPagesForChannel = () => {
|
||||
return createSelector(selectTotalPagesForChannel, totalPages => totalPages);
|
||||
};
|
||||
|
||||
export const selectRewardContentClaimIds = createSelector(
|
||||
_selectState,
|
||||
state => state.rewardedContentClaimIds
|
||||
);
|
||||
|
|
|
@ -134,10 +134,14 @@ p
|
|||
}
|
||||
}
|
||||
|
||||
/*should this be here or work this way? had to hack additional rule below*/
|
||||
.icon:only-child {
|
||||
position: relative;
|
||||
top: 0.16em;
|
||||
}
|
||||
.icon-featured > .icon {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.help {
|
||||
font-size: .85em;
|
||||
|
|
|
@ -256,3 +256,7 @@ $padding-right-card-hover-hack: 30px;
|
|||
.card-row__nav--right {
|
||||
right: -1 * $padding-right-card-hover-hack;
|
||||
}
|
||||
|
||||
.card__icon-featured-content {
|
||||
color: orangered;
|
||||
}
|
|
@ -7,6 +7,9 @@ $height-file-tile: $spacing-vertical * 6;
|
|||
.credit-amount {
|
||||
float: right;
|
||||
}
|
||||
.icon-featured {
|
||||
float: right;
|
||||
}
|
||||
//also a hack
|
||||
.card__media {
|
||||
height: $height-file-tile;
|
||||
|
|
Loading…
Add table
Reference in a new issue