add youtube verified message

This commit is contained in:
Sean Yesmunt 2020-02-12 14:10:35 -05:00
parent 92d1d19bfb
commit c9e759fc9f
5 changed files with 37 additions and 3 deletions

View file

@ -936,5 +936,10 @@
"community name": "community name",
"Change this to repost to a different %lbry_naming_link%.": "Change this to repost to a different %lbry_naming_link%.",
"Reposting": "Reposting",
"Woohoo! Sucessfully reposted this claim.": "Woohoo! Sucessfully reposted this claim."
"Woohoo! Sucessfully reposted this claim.": "Woohoo! Sucessfully reposted this claim.",
"Bid Amount": "Bid Amount",
"Effective Amount": "Effective Amount",
"Is Controlling": "Is Controlling",
"Claim ID": "Claim ID",
"Official YouTube Creator - Last updated %time_ago%": "Official YouTube Creator - Last updated %time_ago%"
}

View file

@ -407,4 +407,9 @@ export const icons = {
<circle cx="12" cy="19" r="1" />
</g>
),
[ICONS.VALIDATED]: buildIcon(
<g>
<polyline points="20 6 9 17 4 12" />
</g>
),
};

View file

@ -88,3 +88,4 @@ export const VIDEO = 'Video';
export const TEXT = 'FileText';
export const DOWNLOADABLE = 'Downloadable';
export const REPOST = 'Repeat';
export const VALIDATED = 'Check';

View file

@ -1,6 +1,9 @@
// @flow
import * as ICONS from 'constants/icons';
import * as MODALS from 'constants/modal_types';
import React, { useState, useEffect } from 'react';
import { parseURI } from 'lbry-redux';
import { Lbryio } from 'lbryinc';
import Page from 'component/page';
import SubscribeButton from 'component/subscribeButton';
import BlockButton from 'component/blockButton';
@ -15,14 +18,13 @@ import ChannelDiscussion from 'component/channelDiscussion';
import ChannelThumbnail from 'component/channelThumbnail';
import ChannelEdit from 'component/channelEdit';
import ClaimUri from 'component/claimUri';
import * as ICONS from 'constants/icons';
import classnames from 'classnames';
import * as MODALS from 'constants/modal_types';
import { Form, FormField } from 'component/common/form';
import Icon from 'component/common/icon';
import HelpLink from 'component/common/help-link';
import { DEBOUNCE_WAIT_DURATION_MS } from 'constants/search';
import ClaimList from 'component/claimList';
import relativeDate from 'tiny-relative-date';
const PAGE_VIEW_QUERY = `view`;
const ABOUT_PAGE = `about`;
@ -86,6 +88,7 @@ function ChannelPage(props: Props) {
const [coverPreview, setCoverPreview] = useState(cover);
const [searchQuery, setSearchQuery] = useState('');
const [searchResults, setSearchResults] = useState(undefined);
const [lastYtSyncDate, setLastYtSyncDate] = useState();
const claimId = claim.claim_id;
// If a user changes tabs, update the url so it stays on the same page if they refresh.
@ -138,6 +141,14 @@ function ChannelPage(props: Props) {
return () => clearTimeout(timer);
}, [claimId, searchQuery]);
useEffect(() => {
Lbryio.call('yt', 'get_youtuber', { channel_claim_id: claimId }).then(response => {
if (response.is_verified_youtuber) {
setLastYtSyncDate(response.last_synced);
}
});
}, [claimId]);
function handleInputChange(e) {
const { value } = e.target;
setSearchQuery(value);
@ -179,6 +190,12 @@ function ChannelPage(props: Props) {
<Page>
<ClaimUri uri={uri} />
{lastYtSyncDate && (
<div className="media__uri--right">
<Icon icon={ICONS.VALIDATED} size={12} />
{__('Official YouTube Creator - Last updated %time_ago%', { time_ago: relativeDate(lastYtSyncDate) })}
</div>
)}
<header className="channel-cover">
<div className="channel__quick-actions">
{!channelIsBlocked && !channelIsBlackListed && <ShareButton uri={uri} isChannel />}

View file

@ -44,6 +44,12 @@
position: static;
transform: none;
}
// This is terrible and should not be removed
.icon {
margin-right: var(--spacing-xsmall) / 2;
margin-bottom: -0.08rem;
}
}
.media__uri--inline {