odysee

Naomi

comment websockets

increase slow mode time to 5 seconds

fix to prevent duplicate comments

update livestream details

fix channel

pin electron boom

fix rebase

prune unused icons

updating meme

updating meme

update livestream for naomi

fix rebase

DigitalCashNetwork

remove electroboom pin

Slavguns

Joel

So he can edit his claims

add streamTypes param to claimTilesDiscover so following section can search for all types of content

fix typo

flow-typed/homepage.js

@@ -4,12 +4,12 @@ declare type HomepageObject = {
   options: any,
   route: string,
   title: string,
-}
+};
 
 declare type HomepageData = {
   [string]: HomepageObject,
   default: any => any,
-}
+};
 
 declare type RowDataItem = {
   title: any,
@@ -19,6 +19,7 @@ declare type RowDataItem = {
   extra?: any,
   options?: {
     channelIds?: Array<string>,
+    limitClaimsPerChannel?: number,
     pageSize: number,
   },
   route?: string,

static/app-strings.json

@@ -858,7 +858,6 @@
   "Tag selection": "Tag selection",
   "Select some tags to help us show you interesting things.": "Select some tags to help us show you interesting things.",
   "You are currently following %followingCount% tags": "You are currently following %followingCount% tags",
-  "You are currently following %followingCount% tag": "You are currently following %followingCount% tag",
   "Back": "Back",
   "Experimental Transcoding": "Experimental Transcoding",
   "A Folder containing FFmpeg": "A Folder containing FFmpeg",
@@ -1414,6 +1413,7 @@
   "Never fear though, there are tons of ways to earn %lbc%. You can earn or purchase %lbc%, or you can have your friends send you some.": "Never fear though, there are tons of ways to earn %lbc%. You can earn or purchase %lbc%, or you can have your friends send you some.",
   "gaming, comedy, educational": "gaming, comedy, educational",
   "A channel is required to comment on %SITE_NAME%": "A channel is required to comment on %SITE_NAME%",
+  "A channel is required to comment on lbry.tv": "A channel is required to comment on lbry.tv",
   "A welcome bonus and thank you for your contribution to content freedom.": "A welcome bonus and thank you for your contribution to content freedom.",
   "You earned %lbc% new user reward.": "You earned %lbc% LBC new user reward.",
   "Just press play on something. Anything at all. Yep, even that one. Everybody's doing it.": "Just press play on something. Anything at all. Yep, even that one. Everybody's doing it.",

ui/analytics.js

@@ -26,10 +26,10 @@ if (isProduction) {
 // @endif
 
 type Analytics = {
-  error: string => Promise<any>,
+  error: (string) => Promise<any>,
   sentryError: ({} | string, {}) => Promise<any>,
   pageView: (string, ?string) => void,
-  setUser: Object => void,
+  setUser: (Object) => void,
   toggleInternal: (boolean, ?boolean) => void,
   apiLogView: (string, string, string, ?number, ?() => void) => Promise<any>,
   apiLogPublish: (ChannelClaim | StreamClaim) => void,
@@ -39,6 +39,9 @@ type Analytics = {
   playerStartedEvent: (?boolean) => void,
   videoFetchDuration: (string, number) => void,
   videoStartEvent: (string, number) => void,
+  adsFetchedEvent: () => void,
+  adsReceivedEvent: (any) => void,
+  adsErrorEvent: (any) => void,
   videoBufferEvent: (
     StreamClaim,
     {
@@ -55,9 +58,9 @@ type Analytics = {
   emailVerifiedEvent: () => void,
   rewardEligibleEvent: () => void,
   startupEvent: () => void,
-  purchaseEvent: number => void,
+  purchaseEvent: (number) => void,
-  readyEvent: number => void,
+  readyEvent: (number) => void,
-  openUrlEvent: string => void,
+  openUrlEvent: (string) => void,
 };
 
 type LogPublishParams = {
@@ -75,8 +78,8 @@ if (window.localStorage.getItem(SHARE_INTERNAL) === 'true') internalAnalyticsEna
 // @endif
 
 const analytics: Analytics = {
-  error: message => {
+  error: (message) => {
-    return new Promise(resolve => {
+    return new Promise((resolve) => {
       if (internalAnalyticsEnabled && isProduction) {
         return Lbryio.call('event', 'desktop_error', { error_message: message }).then(() => {
           resolve(true);
@@ -87,9 +90,9 @@ const analytics: Analytics = {
     });
   },
   sentryError: (error, errorInfo) => {
-    return new Promise(resolve => {
+    return new Promise((resolve) => {
       if (internalAnalyticsEnabled && isProduction) {
-        Sentry.withScope(scope => {
+        Sentry.withScope((scope) => {
           scope.setExtras(errorInfo);
           const eventId = Sentry.captureException(error);
           resolve(eventId);
@@ -114,7 +117,7 @@ const analytics: Analytics = {
       MatomoInstance.trackPageView(params);
     }
   },
-  setUser: userId => {
+  setUser: (userId) => {
     if (internalAnalyticsEnabled && userId) {
       window._paq.push(['setUserId', String(userId)]);
       // @if TARGET='app'
@@ -188,7 +191,7 @@ const analytics: Analytics = {
     }
   },
 
-  apiSyncTags: params => {
+  apiSyncTags: (params) => {
     if (internalAnalyticsEnabled && isProduction) {
       Lbryio.call('content_tags', 'sync', params);
     }
@@ -238,12 +241,21 @@ const analytics: Analytics = {
       });
     }
   },
-  playerLoadedEvent: embedded => {
+  playerLoadedEvent: (embedded) => {
     sendMatomoEvent('Player', 'Loaded', embedded ? 'embedded' : 'onsite');
   },
-  playerStartedEvent: embedded => {
+  playerStartedEvent: (embedded) => {
     sendMatomoEvent('Player', 'Started', embedded ? 'embedded' : 'onsite');
   },
+  adsFetchedEvent: () => {
+    sendMatomoEvent('Media', 'AdsFetched');
+  },
+  adsReceivedEvent: (response) => {
+    sendMatomoEvent('Media', 'AdsReceived', JSON.stringify(response));
+  },
+  adsErrorEvent: (response) => {
+    sendMatomoEvent('Media', 'AdsError', JSON.stringify(response));
+  },
   tagFollowEvent: (tag, following) => {
     sendMatomoEvent('Tag', following ? 'Tag-Follow' : 'Tag-Unfollow', tag);
   },
@@ -316,7 +328,7 @@ analytics.pageView(
 
 // Listen for url changes and report
 // This will include search queries
-history.listen(location => {
+history.listen((location) => {
   const { pathname, search } = location;
 
   const page = `${pathname}${search}`;

ui/component/app/view.jsx

@@ -399,12 +399,12 @@ function App(props: Props) {
 
           {/* @if TARGET='web' */}
           <YoutubeWelcome />
-          {!shouldHideNag && <OpenInAppLink uri={uri} />}
+          {false && !shouldHideNag && <OpenInAppLink uri={uri} />}
           {!shouldHideNag && <NagContinueFirstRun />}
           {(lbryTvApiStatus === STATUS_DEGRADED || lbryTvApiStatus === STATUS_FAILING) && !shouldHideNag && (
             <NagDegradedPerformance onClose={() => setLbryTvApiStatus(STATUS_OK)} />
           )}
-          {lbryTvApiStatus === STATUS_OK && showAnalyticsNag && !shouldHideNag && (
+          {false && lbryTvApiStatus === STATUS_OK && showAnalyticsNag && !shouldHideNag && (
             <NagDataCollection onClose={handleAnalyticsDismiss} />
           )}
           {/* @endif */}

ui/component/channelContent/view.jsx

@@ -1,5 +1,6 @@
 // @flow
 import { SHOW_ADS } from 'config';
+import { LIVE_STREAM_CHANNEL_CLAIM_ID } from 'constants/livestream';
 import * as CS from 'constants/claim_search';
 import * as ICONS from 'constants/icons';
 import React, { Fragment } from 'react';
@@ -13,6 +14,7 @@ import LivestreamLink from 'component/livestreamLink';
 import { Form, FormField } from 'component/common/form';
 import { DEBOUNCE_WAIT_DURATION_MS } from 'constants/search';
 import { lighthouse } from 'redux/actions/search';
+import LivestreamLink from 'component/livestreamLink';
 
 type Props = {
   uri: string,
@@ -103,6 +105,8 @@ function ChannelContent(props: Props) {
 
   return (
     <Fragment>
+      {claimId === LIVE_STREAM_CHANNEL_CLAIM_ID && <LivestreamLink />}
+
       {!fetching && Boolean(claimsInChannel) && !channelIsBlocked && !channelIsBlackListed && (
         <HiddenNsfwClaims uri={uri} />
       )}
@@ -132,10 +136,12 @@ function ChannelContent(props: Props) {
 
       {claim && claimsInChannel > 0 ? (
         <ClaimListDiscover
+          hideLivestreamClaims
           showHiddenByUser={viewHiddenChannels}
           forceShowReposts
           tileLayout={tileLayout}
           uris={searchResults}
+          streamType={CS.CONTENT_ALL}
           channelIds={[claim.claim_id]}
           feeAmount={CS.FEE_AMOUNT_ANY}
           defaultOrderBy={CS.ORDER_BY_NEW}

ui/component/channelThumbnail/view.jsx

@@ -2,7 +2,7 @@
 import React from 'react';
 import { parseURI } from 'lbry-redux';
 import classnames from 'classnames';
-import Gerbil from './gerbil.png';
+import Spaceman from './spaceman.png';
 import FreezeframeWrapper from 'component/fileThumbnail/FreezeframeWrapper';
 import ChannelStakedIndicator from 'component/channelStakedIndicator';
 
@@ -79,7 +79,7 @@ function ChannelThumbnail(props: Props) {
         <img
           alt={__('Channel profile picture')}
           className="channel-thumbnail__default"
-          src={!thumbError && thumbnailPreview ? thumbnailPreview : Gerbil}
+          src={!thumbError && thumbnailPreview ? thumbnailPreview : Spaceman}
           onError={() => setThumbError(true)} // if thumb fails (including due to https replace, show gerbil.
         />
       )}
@@ -91,7 +91,7 @@ function ChannelThumbnail(props: Props) {
             <img
               alt={__('Channel profile picture')}
               className="channel-thumbnail__custom"
-              src={!thumbError ? thumbnailPreview || thumbnail : Gerbil}
+              src={!thumbError ? thumbnailPreview || thumbnail : Spaceman}
               onError={() => setThumbError(true)} // if thumb fails (including due to https replace, show gerbil.
             />
           )}

ui/component/claimList/view.jsx

@@ -38,6 +38,7 @@ type Props = {
   renderActions?: (Claim) => ?Node,
   searchInLanguage: boolean,
   hideMenu?: boolean,
+  hideLivestreamClaims?: boolean,
 };
 
 export default function ClaimList(props: Props) {
@@ -63,6 +64,7 @@ export default function ClaimList(props: Props) {
     renderActions,
     searchInLanguage,
     hideMenu,
+    hideLivestreamClaims,
   } = props;
 
   const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
@@ -101,7 +103,14 @@ export default function ClaimList(props: Props) {
   return tileLayout && !header ? (
     <section className="claim-grid">
       {urisLength > 0 &&
-        uris.map((uri) => <ClaimPreviewTile key={uri} uri={uri} showHiddenByUser={showHiddenByUser} />)}
+        uris.map((uri) => (
+          <ClaimPreviewTile
+            key={uri}
+            uri={uri}
+            showHiddenByUser={showHiddenByUser}
+            hideLivestreamClaims={hideLivestreamClaims}
+          />
+        ))}
       {!timedOut && urisLength === 0 && !loading && <div className="empty main--empty">{empty || noResultMsg}</div>}
       {timedOut && timedOutMessage && <div className="empty main--empty">{timedOutMessage}</div>}
     </section>
@@ -157,6 +166,7 @@ export default function ClaimList(props: Props) {
                 renderActions={renderActions}
                 showUserBlocked={showHiddenByUser}
                 showHiddenByUser={showHiddenByUser}
+                hideLivestreamClaims={hideLivestreamClaims}
                 customShouldHide={(claim: StreamClaim) => {
                   // Hack to hide spee.ch thumbnail publishes
                   // If it meets these requirements, it was probably uploaded here:

ui/component/claimListDiscover/view.jsx

@@ -23,7 +23,7 @@ type Props = {
   personalView: boolean,
   doToggleTagFollowDesktop: (string) => void,
   meta?: Node,
-  showNsfw: boolean,
+  //   showNsfw: boolean,
   hideReposts: boolean,
   history: { action: string, push: (string) => void, replace: (string) => void },
   location: { search: string, pathname: string },
@@ -66,6 +66,9 @@ type Props = {
   searchInLanguage: boolean,
   scrollAnchor?: string,
   showHiddenByUser?: boolean,
+  limitClaimsPerChannel?: number,
+  releaseTime?: string,
+  hideLivestreamClaims?: boolean,
 };
 
 function ClaimListDiscover(props: Props) {
@@ -78,7 +81,7 @@ function ClaimListDiscover(props: Props) {
     loading,
     meta,
     channelIds,
-    showNsfw,
+    // showNsfw,
     hideReposts,
     history,
     location,
@@ -93,8 +96,8 @@ function ClaimListDiscover(props: Props) {
     claimType,
     pageSize,
     defaultClaimType,
-    streamType,
+    streamType = CS.FILE_VIDEO,
-    defaultStreamType,
+    defaultStreamType = CS.FILE_VIDEO,
     freshness,
     defaultFreshness = CS.FRESH_WEEK,
     renderProperties,
@@ -113,8 +116,11 @@ function ClaimListDiscover(props: Props) {
     forceShowReposts = false,
     languageSetting,
     searchInLanguage,
+    limitClaimsPerChannel,
+    releaseTime,
     scrollAnchor,
     showHiddenByUser = false,
+    hideLivestreamClaims,
   } = props;
   const didNavigateForward = history.action === 'PUSH';
   const { search } = location;
@@ -153,12 +159,12 @@ function ClaimListDiscover(props: Props) {
   const durationParam = urlParams.get(CS.DURATION_KEY) || null;
   const channelIdsInUrl = urlParams.get(CS.CHANNEL_IDS_KEY);
   const channelIdsParam = channelIdsInUrl ? channelIdsInUrl.split(',') : channelIds;
-  const feeAmountParam = urlParams.get('fee_amount') || feeAmount;
+  const feeAmountParam = urlParams.get('fee_amount') || feeAmount || CS.FEE_AMOUNT_ONLY_FREE;
   const originalPageSize = pageSize || CS.PAGE_SIZE;
   const dynamicPageSize = isLargeScreen ? Math.ceil(originalPageSize * (3 / 2)) : originalPageSize;
   const historyAction = history.action;
 
-  let orderParam = orderBy || urlParams.get(CS.ORDER_BY_KEY) || defaultOrderBy;
+  let orderParam = orderBy || urlParams.get(CS.ORDER_BY_KEY) || defaultOrderBy || orderParamEntry;
 
   if (!orderParam) {
     if (historyAction === 'POP') {
@@ -202,6 +208,7 @@ function ClaimListDiscover(props: Props) {
     fee_amount?: string,
     has_source?: boolean,
     has_no_source?: boolean,
+    limit_claims_per_channel?: number,
   } = {
     page_size: dynamicPageSize,
     page,
@@ -213,7 +220,7 @@ function ClaimListDiscover(props: Props) {
     not_channel_ids:
       // If channelIdsParam were passed in, we don't need not_channel_ids
       !channelIdsParam ? mutedAndBlockedChannelIds : [],
-    not_tags: !showNsfw ? MATURE_TAGS : [],
+    not_tags: MATURE_TAGS,
     order_by:
       orderParam === CS.ORDER_BY_TRENDING
         ? CS.ORDER_BY_TRENDING_VALUE
@@ -226,6 +233,10 @@ function ClaimListDiscover(props: Props) {
     options.has_source = true;
   }
 
+  if (limitClaimsPerChannel) {
+    options.limit_claims_per_channel = limitClaimsPerChannel;
+  }
+
   if (feeAmountParam && claimType !== CS.CLAIM_CHANNEL) {
     options.fee_amount = feeAmountParam;
   }
@@ -255,7 +266,9 @@ function ClaimListDiscover(props: Props) {
     options.reposted_claim_id = repostedClaimId;
   }
 
-  if (claimType !== CS.CLAIM_CHANNEL) {
+  if (releaseTime) {
+    options.release_time = releaseTime;
+  } else if (claimType !== CS.CLAIM_CHANNEL) {
     if (orderParam === CS.ORDER_BY_TOP && freshnessParam !== CS.FRESH_ALL) {
       options.release_time = `>${Math.floor(moment().subtract(1, freshnessParam).startOf('hour').unix())}`;
     } else if (orderParam === CS.ORDER_BY_NEW || orderParam === CS.ORDER_BY_TRENDING) {
@@ -333,9 +346,25 @@ function ClaimListDiscover(props: Props) {
 
   const hasMatureTags = tagsParam && tagsParam.split(',').some((t) => MATURE_TAGS.includes(t));
   const claimSearchCacheQuery = createNormalizedClaimSearchKey(options);
-  const claimSearchResult = claimSearchByQuery[claimSearchCacheQuery];
+  let claimSearchResult = claimSearchByQuery[claimSearchCacheQuery];
   const claimSearchResultLastPageReached = claimSearchByQueryLastPageReached[claimSearchCacheQuery];
 
+  // uncomment to fix an item on a page
+  //   const fixUri = 'lbry://@corbettreport#0/lbryodysee#5';
+  //   if (
+  //     orderParam === CS.ORDER_BY_NEW &&
+  //     claimSearchResult &&
+  //     claimSearchResult.length > 2 &&
+  //     window.location.pathname === '/$/rabbithole'
+  //   ) {
+  //     if (claimSearchResult.indexOf(fixUri) !== -1) {
+  //       claimSearchResult.splice(claimSearchResult.indexOf(fixUri), 1);
+  //     } else {
+  //       claimSearchResult.pop();
+  //     }
+  //     claimSearchResult.splice(2, 0, fixUri);
+  //   }
+
   const [prevOptions, setPrevOptions] = React.useState(null);
 
   if (!isJustScrollingToNewPage(prevOptions, options)) {
@@ -455,7 +484,7 @@ function ClaimListDiscover(props: Props) {
       claimType={claimType}
       streamType={streamType}
       defaultStreamType={defaultStreamType}
-      feeAmount={feeAmount}
+      //   feeAmount={feeAmount}
       orderBy={orderBy}
       defaultOrderBy={defaultOrderBy}
       hideAdvancedFilter={hideAdvancedFilter}
@@ -492,6 +521,7 @@ function ClaimListDiscover(props: Props) {
             includeSupportAction={includeSupportAction}
             injectedItem={injectedItem}
             showHiddenByUser={showHiddenByUser}
+            hideLivestreamClaims={hideLivestreamClaims}
           />
           {loading && (
             <div className="claim-grid">
@@ -520,6 +550,7 @@ function ClaimListDiscover(props: Props) {
             includeSupportAction={includeSupportAction}
             injectedItem={injectedItem}
             showHiddenByUser={showHiddenByUser}
+            hideLivestreamClaims={hideLivestreamClaims}
           />
           {loading && new Array(dynamicPageSize).fill(1).map((x, i) => <ClaimPreview key={i} placeholder="loading" />)}
         </div>

ui/component/claimPreview/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import { LIVE_STREAM_TAG, LIVE_STREAM_CHANNEL_CLAIM_ID } from 'constants/livestream';
 import type { Node } from 'react';
 import React, { useEffect, forwardRef } from 'react';
 import { NavLink, withRouter } from 'react-router-dom';
@@ -68,6 +69,8 @@ type Props = {
   hideRepostLabel?: boolean,
   repostUrl?: string,
   hideMenu?: boolean,
+  livestream?: boolean,
+  hideLivestreamClaims?: boolean,
 };
 
 const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
@@ -117,6 +120,8 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
     renderActions,
     hideMenu = false,
     // repostUrl,
+    livestream,
+    hideLivestreamClaims,
   } = props;
   const WrapperElement = wrapperElement || 'li';
   const shouldFetch =
@@ -124,6 +129,13 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
   const abandoned = !isResolvingUri && !claim;
   const shouldHideActions = hideActions || type === 'small' || type === 'tooltip';
   const canonicalUrl = claim && claim.canonical_url;
+  const isLivestream =
+    claim &&
+    claim.signing_channel &&
+    claim.signing_channel.claim_id === LIVE_STREAM_CHANNEL_CLAIM_ID &&
+    claim.value.tags &&
+    claim.value.tags.includes(LIVE_STREAM_TAG);
+
   let isValid = false;
   if (uri) {
     try {
@@ -190,6 +202,10 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
       onClick(e);
     }
 
+    if (livestream) {
+      return;
+    }
+
     if (claim && !pending) {
       history.push(navigateUrl);
     }
@@ -201,7 +217,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
     }
   }, [isValid, uri, isResolvingUri, shouldFetch, resolveUri]);
 
-  if (shouldHide && !showNullPlaceholder) {
+  if ((shouldHide && !showNullPlaceholder) || (isLivestream && hideLivestreamClaims)) {
     return null;
   }
 
@@ -274,7 +290,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
                     </div>
                   )}
                   {/* @endif */}
-                  {!isRepost && !isChannelUri && (
+                  {!isRepost && !isChannelUri && !livestream && (
                     <div className="claim-preview__file-property-overlay">
                       <FileProperties uri={contentUri} small />
                     </div>

ui/component/claimPreviewTile/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import { LIVE_STREAM_TAG, LIVE_STREAM_CHANNEL_CLAIM_ID } from 'constants/livestream';
 import React from 'react';
 import classnames from 'classnames';
 import { NavLink, withRouter } from 'react-router-dom';
@@ -40,6 +41,7 @@ type Props = {
   isMature: boolean,
   showMature: boolean,
   showHiddenByUser?: boolean,
+  hideLivestreamClaims?: boolean,
 };
 
 function ClaimPreviewTile(props: Props) {
@@ -60,12 +62,19 @@ function ClaimPreviewTile(props: Props) {
     isMature,
     showMature,
     showHiddenByUser,
+    hideLivestreamClaims,
   } = props;
   const isRepost = claim && claim.repost_channel_url;
   const shouldFetch = claim === undefined;
   const thumbnailUrl = useGetThumbnail(uri, claim, streamingUrl, getFile, placeholder) || thumbnail;
   const canonicalUrl = claim && claim.canonical_url;
   const navigateUrl = formatLbryUrlForWeb(canonicalUrl || uri || '/');
+  const isLivestream =
+    claim &&
+    claim.signing_channel &&
+    claim.signing_channel.claim_id === LIVE_STREAM_CHANNEL_CLAIM_ID &&
+    claim.value.tags &&
+    claim.value.tags.includes(LIVE_STREAM_TAG);
 
   const navLinkProps = {
     to: navigateUrl,
@@ -137,7 +146,7 @@ function ClaimPreviewTile(props: Props) {
     shouldHide = blockedChannelUris.some((blockedUri) => blockedUri === claim.permanent_url);
   }
 
-  if (shouldHide) {
+  if (shouldHide || (isLivestream && hideLivestreamClaims)) {
     return null;
   }
 

ui/component/claimTilesDiscover/view.jsx

@@ -1,12 +1,12 @@
 // @flow
 import { ENABLE_NO_SOURCE_CLAIMS } from 'config';
+import * as CS from 'constants/claim_search';
 import React from 'react';
 import { createNormalizedClaimSearchKey, MATURE_TAGS } from 'lbry-redux';
 import ClaimPreviewTile from 'component/claimPreviewTile';
 import { useHistory } from 'react-router';
 
 type Props = {
-  prefixUris?: Array<string>,
   uris: Array<string>,
   doClaimSearch: ({}) => void,
   showNsfw: boolean,
@@ -32,6 +32,7 @@ type Props = {
   timestamp?: string,
   feeAmount?: string,
   limitClaimsPerChannel?: number,
+  streamTypes?: Array<string>,
 };
 
 function ClaimTilesDiscover(props: Props) {
@@ -49,16 +50,18 @@ function ClaimTilesDiscover(props: Props) {
     releaseTime,
     languages,
     claimType,
-    prefixUris,
     timestamp,
     feeAmount,
     limitClaimsPerChannel,
     fetchingClaimSearchByQuery,
+    streamTypes,
+    // pin,
   } = props;
   const { location } = useHistory();
   const urlParams = new URLSearchParams(location.search);
   const feeAmountInUrl = urlParams.get('fee_amount');
-  const feeAmountParam = feeAmountInUrl || feeAmount;
+  const feeAmountParam = feeAmountInUrl || feeAmount || CS.FEE_AMOUNT_ONLY_FREE;
+
   const options: {
     page_size: number,
     no_totals: boolean,
@@ -89,6 +92,7 @@ function ClaimTilesDiscover(props: Props) {
     channel_ids: channelIds || [],
     not_channel_ids: [],
     order_by: orderBy || ['trending_group', 'trending_mixed'],
+    stream_types: streamTypes || [CS.FILE_VIDEO],
   };
 
   if (!ENABLE_NO_SOURCE_CLAIMS) {
@@ -129,12 +133,23 @@ function ClaimTilesDiscover(props: Props) {
   }
 
   const claimSearchCacheQuery = createNormalizedClaimSearchKey(options);
-  const uris = (prefixUris || []).concat(claimSearchByQuery[claimSearchCacheQuery] || []);
+  const uris = claimSearchByQuery[claimSearchCacheQuery] || [];
+
   // Don't use the query from createNormalizedClaimSearchKey for the effect since that doesn't include page & release_time
   const optionsStringForEffect = JSON.stringify(options);
   const isLoading = fetchingClaimSearchByQuery[claimSearchCacheQuery];
   const shouldPerformSearch = !isLoading && uris.length === 0;
 
+  //   const fixUri = 'lbry://@ElectroBOOM#9/remove-your-mustache#9';
+  //   if (pin && uris && uris.length > 2 && window.location.pathname === '/') {
+  //     if (uris.indexOf(fixUri) !== -1) {
+  //       uris.splice(uris.indexOf(fixUri), 1);
+  //     } else {
+  //       uris.pop();
+  //     }
+  //     uris.splice(2, 0, fixUri);
+  //   }
+
   React.useEffect(() => {
     if (shouldPerformSearch) {
       const searchOptions = JSON.parse(optionsStringForEffect);

ui/component/commentCreate/view.jsx

@@ -7,7 +7,7 @@ import { FormField, Form } from 'component/common/form';
 import Button from 'component/button';
 import SelectChannel from 'component/selectChannel';
 import usePersistedState from 'effects/use-persisted-state';
-import { FF_MAX_CHARS_IN_COMMENT } from 'constants/form-field';
+import { FF_MAX_CHARS_IN_COMMENT, FF_MAX_CHARS_IN_LIVESTREAM_COMMENT } from 'constants/form-field';
 import { useHistory } from 'react-router';
 import type { ElementRef } from 'react';
 import emoji from 'emoji-dictionary';
@@ -33,9 +33,12 @@ type Props = {
   parentId: string,
   isReply: boolean,
   isPostingComment: boolean,
-  activeChannel: string,
   activeChannelClaim: ?ChannelClaim,
-  livestream?: boolean,
+  bottom: boolean,
+  onSubmit: (string, string) => void,
+  livestream: boolean,
+  authenticated: boolean,
+  embed?: boolean,
   toast: (string) => void,
   claimIsMine: boolean,
 };
@@ -53,12 +56,19 @@ export function CommentCreate(props: Props) {
     parentId,
     isPostingComment,
     activeChannelClaim,
+    onSubmit,
+    bottom,
     livestream,
+    authenticated,
+    embed,
     toast,
     claimIsMine,
   } = props;
   const buttonref: ElementRef<any> = React.useRef();
-  const { push } = useHistory();
+  const {
+    push,
+    location: { pathname },
+  } = useHistory();
   const { claim_id: claimId } = claim;
   const [commentValue, setCommentValue] = React.useState('');
   const [lastCommentTime, setLastCommentTime] = React.useState();
@@ -80,7 +90,7 @@ export function CommentCreate(props: Props) {
 
   function altEnterListener(e: SyntheticKeyboardEvent<*>) {
     const KEYCODE_ENTER = 13;
-    if ((e.ctrlKey || e.metaKey) && e.keyCode === KEYCODE_ENTER) {
+    if ((livestream || e.ctrlKey || e.metaKey) && e.keyCode === KEYCODE_ENTER) {
       e.preventDefault();
       buttonref.current.click();
     }
@@ -112,6 +122,10 @@ export function CommentCreate(props: Props) {
           setCommentValue('');
           setLastCommentTime(Date.now());
 
+          if (onSubmit) {
+            onSubmit(commentValue, activeChannelClaim.name);
+          }
+
           if (onDoneReplying) {
             onDoneReplying();
           }
@@ -126,9 +140,18 @@ export function CommentCreate(props: Props) {
 
   useEffect(() => setCharCount(commentValue.length), [commentValue]);
 
-  if (!hasChannels) {
+  if (!authenticated || !hasChannels) {
     return (
-      <div role="button" onClick={() => push(`/$/${PAGES.CHANNEL_NEW}`)}>
+      <div
+        role="button"
+        onClick={() =>
+          embed
+            ? window.open(`https://odysee.com/$/${PAGES.AUTH}?redirect=/$/${PAGES.LIVESTREAM}`)
+            : authenticated
+            ? push(`/$/${PAGES.CHANNEL_NEW}?redirect=${pathname}`)
+            : push(`/$/${PAGES.AUTH}?redirect=${pathname}`)
+        }
+      >
         <FormField
           type="textarea"
           name={'comment_signup_prompt'}
@@ -136,7 +159,7 @@ export function CommentCreate(props: Props) {
           label={isFetchingChannels ? __('Comment') : undefined}
         />
         <div className="section__actions">
-          <Button disabled button="primary" label={__('Post --[button to submit something]--')} requiresAuth={IS_WEB} />
+          <Button disabled button="primary" label={__('Post --[button to submit something]--')} />
         </div>
       </div>
     );
@@ -148,6 +171,7 @@ export function CommentCreate(props: Props) {
       className={classnames('comment__create', {
         'comment__create--reply': isReply,
         'comment__create--nested-reply': isNested,
+        'comment__create--bottom': bottom,
       })}
     >
       <FormField
@@ -171,7 +195,7 @@ export function CommentCreate(props: Props) {
         charCount={charCount}
         onChange={handleCommentChange}
         autoFocus={isReply}
-        textAreaMaxLength={FF_MAX_CHARS_IN_COMMENT}
+        textAreaMaxLength={livestream ? FF_MAX_CHARS_IN_LIVESTREAM_COMMENT : FF_MAX_CHARS_IN_COMMENT}
       />
       {livestream && hasChannels && (
         <div className="livestream__emoji-actions">
@@ -190,7 +214,11 @@ export function CommentCreate(props: Props) {
           ))}
         </div>
       )}
-      <div className="section__actions section__actions--no-margin">
+      <div
+        className={classnames('section__actions', {
+          'section__actions--no-margin': !livestream,
+        })}
+      >
         <Button
           ref={buttonref}
           button="primary"

ui/component/commentReactions/view.jsx

@@ -77,7 +77,7 @@ export default function CommentReactions(props: Props) {
       <Button
         requiresAuth={IS_WEB}
         title={__('Upvote')}
-        icon={ICONS.UPVOTE}
+        icon={myReacts.includes(REACTION_TYPES.LIKE) ? ICONS.FIRE_ACTIVE : ICONS.FIRE}
         className={classnames('comment__action', {
           'comment__action--active': myReacts && myReacts.includes(REACTION_TYPES.LIKE),
         })}
@@ -87,7 +87,7 @@ export default function CommentReactions(props: Props) {
       <Button
         requiresAuth={IS_WEB}
         title={__('Downvote')}
-        icon={ICONS.DOWNVOTE}
+        icon={myReacts.includes(REACTION_TYPES.DISLIKE) ? ICONS.SLIME_ACTIVE : ICONS.SLIME}
         className={classnames('comment__action', {
           'comment__action--active': myReacts && myReacts.includes(REACTION_TYPES.DISLIKE),
         })}

ui/component/common/card.jsx

@@ -20,6 +20,7 @@ type Props = {
   defaultExpand?: boolean,
   nag?: Node,
   smallTitle?: boolean,
+  onClick?: () => void,
 };
 
 export default function Card(props: Props) {
@@ -37,12 +38,20 @@ export default function Card(props: Props) {
     smallTitle = false,
     defaultExpand,
     nag,
+    onClick,
   } = props;
   const [expanded, setExpanded] = useState(defaultExpand);
   const expandable = defaultExpand !== undefined;
 
   return (
-    <section className={classnames(className, 'card')}>
+    <section
+      className={classnames(className, 'card')}
+      onClick={() => {
+        if (onClick) {
+          onClick();
+        }
+      }}
+    >
       {(title || subtitle) && (
         <div
           className={classnames('card__header--between', {

ui/component/fileActions/view.jsx

@@ -25,6 +25,8 @@ type Props = {
   myChannels: ?Array<ChannelClaim>,
   doToast: ({ message: string }) => void,
   clearPlayingUri: () => void,
+  hideRepost?: boolean,
+  livestream?: boolean,
 };
 
 function FileActions(props: Props) {
@@ -40,6 +42,8 @@ function FileActions(props: Props) {
     myChannels,
     clearPlayingUri,
     doToast,
+    hideRepost,
+    livestream,
   } = props;
   const {
     push,
@@ -80,23 +84,25 @@ function FileActions(props: Props) {
 
   const lhsSection = (
     <>
-      {ENABLE_FILE_REACTIONS && <FileReactions uri={uri} />}
+      {ENABLE_FILE_REACTIONS && <FileReactions uri={uri} livestream={livestream} />}
       <ClaimSupportButton uri={uri} fileAction />
-      <Button
+      {!hideRepost && (
-        button="alt"
+        <Button
-        className="button--file-action"
+          button="alt"
-        icon={ICONS.REPOST}
+          className="button--file-action"
-        label={
+          icon={ICONS.REPOST}
-          claim.meta.reposted > 1 ? __(`%repost_total% Reposts`, { repost_total: claim.meta.reposted }) : __('Repost')
+          label={
-        }
+            claim.meta.reposted > 1 ? __(`%repost_total% Reposts`, { repost_total: claim.meta.reposted }) : __('Repost')
-        description={__('Repost')}
+          }
-        requiresAuth={IS_WEB}
+          description={__('Repost')}
-        onClick={handleRepostClick}
+          requiresAuth={IS_WEB}
-      />
+          onClick={handleRepostClick}
+        />
+      )}
       <Button
         className="button--file-action"
         icon={ICONS.SHARE}
-        label={__('Share')}
+        label={isMobile ? undefined : __('Share')}
         title={__('Share')}
         onClick={() => openModal(MODALS.SOCIAL_SHARE, { uri, webShareable })}
       />

ui/component/fileDescription/view.jsx

@@ -50,7 +50,7 @@ function FileDescription(props: Props) {
         <FileDetails uri={uri} />
       </div>
 
-      <div className="section__actions--between">
+      <div className="card__bottom-actions">
         {expanded ? (
           <Button button="link" label={__('Less')} onClick={() => setExpanded(!expanded)} />
         ) : (

ui/component/fileReactions/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import * as REACTION_TYPES from 'constants/reactions';
 import * as ICONS from 'constants/icons';
 import React from 'react';
 import classnames from 'classnames';
@@ -8,25 +9,51 @@ import NudgeFloating from 'component/nudgeFloating';
 
 type Props = {
   claim: StreamClaim,
-  doFetchReactions: string => void,
+  doFetchReactions: (string) => void,
-  doReactionLike: string => void,
+  doReactionLike: (string) => void,
-  doReactionDislike: string => void,
+  doReactionDislike: (string) => void,
   uri: string,
   likeCount: number,
   dislikeCount: number,
   myReaction: ?string,
+  livestream?: boolean,
 };
 
 function FileReactions(props: Props) {
-  const { claim, uri, doFetchReactions, doReactionLike, doReactionDislike, likeCount, dislikeCount } = props;
+  const {
+    claim,
+    uri,
+    doFetchReactions,
+    doReactionLike,
+    doReactionDislike,
+    myReaction,
+    likeCount,
+    dislikeCount,
+    livestream,
+  } = props;
   const claimId = claim && claim.claim_id;
   const channel = claim && claim.signing_channel && claim.signing_channel.name;
 
   React.useEffect(() => {
-    if (claimId) {
+    function fetchReactions() {
       doFetchReactions(claimId);
     }
-  }, [claimId, doFetchReactions]);
+
+    let fetchInterval;
+    if (claimId) {
+      fetchReactions();
+
+      if (livestream) {
+        fetchInterval = setInterval(fetchReactions, 10000);
+      }
+    }
+
+    return () => {
+      if (fetchInterval) {
+        clearInterval(fetchInterval);
+      }
+    };
+  }, [claimId, doFetchReactions, livestream]);
 
   return (
     <>
@@ -41,20 +68,46 @@ function FileReactions(props: Props) {
         title={__('I like this')}
         requiresAuth={IS_WEB}
         authSrc="filereaction_like"
-        className={classnames('button--file-action')}
+        className={classnames('button--file-action', { 'button--fire': myReaction === REACTION_TYPES.LIKE })}
-        label={formatNumberWithCommas(likeCount, 0)}
+        label={
+          <>
+            {myReaction === REACTION_TYPES.LIKE && (
+              <>
+                <div className="button__fire-glow" />
+                <div className="button__fire-particle1" />
+                <div className="button__fire-particle2" />
+                <div className="button__fire-particle3" />
+                <div className="button__fire-particle4" />
+                <div className="button__fire-particle5" />
+                <div className="button__fire-particle6" />
+              </>
+            )}
+            {formatNumberWithCommas(likeCount, 0)}
+          </>
+        }
         iconSize={18}
-        icon={ICONS.UPVOTE}
+        icon={myReaction === REACTION_TYPES.LIKE ? ICONS.FIRE_ACTIVE : ICONS.FIRE}
         onClick={() => doReactionLike(uri)}
       />
       <Button
         requiresAuth={IS_WEB}
         authSrc={'filereaction_dislike'}
         title={__('I dislike this')}
-        className={classnames('button--file-action')}
+        className={classnames('button--file-action', { 'button--slime': myReaction === REACTION_TYPES.DISLIKE })}
-        label={formatNumberWithCommas(dislikeCount, 0)}
+        label={
+          <>
+            {myReaction === REACTION_TYPES.DISLIKE && (
+              <>
+                <div className="button__slime-stain" />
+                <div className="button__slime-drop1" />
+                <div className="button__slime-drop2" />
+              </>
+            )}
+            {formatNumberWithCommas(dislikeCount, 0)}
+          </>
+        }
         iconSize={18}
-        icon={ICONS.DOWNVOTE}
+        icon={myReaction === REACTION_TYPES.DISLIKE ? ICONS.SLIME_ACTIVE : ICONS.SLIME}
         onClick={() => doReactionDislike(uri)}
       />
     </>

ui/component/fileSubtitle/view.jsx

@@ -23,8 +23,8 @@ function FileSubtitle(props: Props) {
           <FileViewCount uri={uri} />
         )}
       </div>
-
+      { /* did I need these params? */ }
-      <FileActions uri={uri} />
+      <FileActions uri={uri} hideRepost={livestream} livestream={livestream} />
     </div>
   );
 }

ui/component/fileViewCount/view.jsx

@@ -1,10 +1,11 @@
 // @flow
+import { SIMPLE_SITE } from 'config';
 import React, { useEffect } from 'react';
 import HelpLink from 'component/common/help-link';
 
 type Props = {
   claim: ?StreamClaim,
-  fetchViewCount: string => void,
+  fetchViewCount: (string) => void,
   uri: string,
   viewCount: string,
 };
@@ -12,7 +13,6 @@ type Props = {
 function FileViewCount(props: Props) {
   const { claim, uri, fetchViewCount, viewCount } = props;
   const claimId = claim && claim.claim_id;
-
   useEffect(() => {
     if (claimId) {
       fetchViewCount(claimId);
@@ -24,7 +24,7 @@ function FileViewCount(props: Props) {
   return (
     <span className="media__subtitle--centered">
       {viewCount !== 1 ? __('%view_count% views', { view_count: formattedViewCount }) : __('1 view')}
-      <HelpLink href="https://lbry.com/faq/views" />
+      {!SIMPLE_SITE && <HelpLink href="https://lbry.com/faq/views" />}
     </span>
   );
 }

ui/component/fileViewerEmbeddedTitle/view.jsx

@@ -5,7 +5,8 @@ import FilePrice from 'component/filePrice';
 import { formatLbryUrlForWeb } from 'util/url';
 import { withRouter } from 'react-router';
 import { URL } from 'config';
-import * as ICONS from 'constants/icons';
+import OdyseeLogo from 'component/header/odysee_logo.png';
+import OdyseeLogoWithText from 'component/header/odysee_white.png';
 
 type Props = {
   uri: string,
@@ -36,7 +37,10 @@ function FileViewerEmbeddedTitle(props: Props) {
         {...contentLinkProps}
       />
       <div className="file-viewer__embedded-info">
-        <Button className="file-viewer__overlay-logo" icon={ICONS.LBRY} aria-label={__('Home')} {...lbryLinkProps} />
+        <Button className="file-viewer__overlay-logo" aria-label={__('Home')} {...lbryLinkProps}>
+          <img src={OdyseeLogo} className=" mobile-only" />
+          <img src={OdyseeLogoWithText} className=" mobile-hidden" />
+        </Button>
         {isInApp && <FilePrice uri={uri} />}
       </div>
     </div>

ui/component/header/view.jsx

@@ -19,6 +19,8 @@ import ChannelThumbnail from 'component/channelThumbnail';
 import { remote } from 'electron';
 import { IS_MAC } from 'component/app/view';
 // @endif
+import OdyseeLogoWithWhiteText from './odysee_white.png';
+import OdyseeLogoWithText from './odysee.png';
 
 type Props = {
   user: ?User,
@@ -86,8 +88,8 @@ const Header = (props: Props) => {
     sidebarOpen,
     setSidebarOpen,
     isAbsoluteSideNavHidden,
-    user,
     hideCancel,
+    user,
     activeChannelClaim,
   } = props;
   const isMobile = useIsMobile();
@@ -98,7 +100,7 @@ const Header = (props: Props) => {
   const isPwdResetPage = history.location.pathname.includes(PAGES.AUTH_PASSWORD_RESET);
   const hasBackout = Boolean(backout);
   const { backLabel, backNavDefault, title: backTitle, simpleTitle: simpleBackTitle } = backout || {};
-  const notificationsEnabled = (user && user.experimental_ui) || false;
+  //   const notificationsEnabled = (user && user.experimental_ui) || false; // fix this
   const livestreamEnabled = (ENABLE_NO_SOURCE_CLAIMS && user && user.experimental_ui) || false;
   const activeChannelUrl = activeChannelClaim && activeChannelClaim.permanent_url;
 
@@ -233,19 +235,12 @@ const Header = (props: Props) => {
                     icon={ICONS.MENU}
                     onClick={() => setSidebarOpen(!sidebarOpen)}
                   >
-                    {isAbsoluteSideNavHidden && isMobile && notificationsEnabled && <NotificationBubble />}
+                    {isAbsoluteSideNavHidden && isMobile && <NotificationBubble />}
                   </Button>
                 </span>
               )}
               <Button
-                className="header__navigation-item header__navigation-item--lbry"
+                className="header__navigation-item header__navigation-item--lbry header__navigation-item--button-mobile"
-                // @if TARGET='app'
-                label={'LBRY'}
-                // @endif
-                // @if TARGET='web'
-                label={LOGO_TITLE} // eslint-disable-line
-                // @endif
-                icon={ICONS.LBRY}
                 onClick={() => {
                   if (history.location.pathname === '/') window.location.reload();
                 }}
@@ -255,7 +250,12 @@ const Header = (props: Props) => {
                 }}
                 // @endif
                 {...homeButtonNavigationProps}
-              />
+              >
+                <img
+                  src={currentTheme === 'light' ? OdyseeLogoWithText : OdyseeLogoWithWhiteText}
+                  className="header__odysee"
+                />
+              </Button>
 
               {!authHeader && (
                 <div className="header__center">
@@ -272,7 +272,7 @@ const Header = (props: Props) => {
 
                   <HeaderMenuButtons
                     authenticated={authenticated}
-                    notificationsEnabled={notificationsEnabled}
+                    notificationsEnabled
                     history={history}
                     handleThemeToggle={handleThemeToggle}
                     currentTheme={currentTheme}
@@ -425,6 +425,10 @@ function HeaderMenuButtons(props: HeaderMenuButtonProps) {
               <Icon aria-hidden icon={ICONS.CHANNEL} />
               {__('New Channel')}
             </MenuItem>
+            <MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.YOUTUBE_SYNC}`)}>
+              <Icon aria-hidden icon={ICONS.YOUTUBE} />
+              {__('Sync YouTube Channel')}
+            </MenuItem>
 
             {livestreamEnabled && (
               <MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.LIVESTREAM}`)}>

ui/component/livestreamFeed/index.js

@@ -0,0 +1,9 @@
+import { connect } from 'react-redux';
+import { makeSelectClaimForUri } from 'lbry-redux';
+import LivestreamFeed from './view';
+
+const select = (state, props) => ({
+  claim: makeSelectClaimForUri(props.uri)(state),
+});
+
+export default connect(select)(LivestreamFeed);

ui/component/livestreamFeed/view.jsx

@@ -0,0 +1,38 @@
+// @flow
+import { BITWAVE_USERNAME, BITWAVE_EMBED_URL } from 'constants/livestream';
+import React from 'react';
+import FileTitleSection from 'component/fileTitleSection';
+import LivestreamComments from 'component/livestreamComments';
+
+type Props = {
+  uri: string,
+  claim: ?StreamClaim,
+  activeViewers: number,
+};
+
+export default function LivestreamFeed(props: Props) {
+  const { claim, uri, activeViewers } = props;
+
+  if (!claim) {
+    return null;
+  }
+
+  return (
+    <>
+      <div className="section card-stack">
+        <div className="file-render file-render--video livestream">
+          <div className="file-viewer">
+            <iframe
+              src={`${BITWAVE_EMBED_URL}/${BITWAVE_USERNAME}?skin=odysee&autoplay=1`}
+              scrolling="no"
+              allowFullScreen
+            />
+          </div>
+        </div>
+
+        <FileTitleSection uri={uri} livestream activeViewers={activeViewers} />
+      </div>
+      <LivestreamComments uri={uri} />
+    </>
+  );
+}

ui/component/notificationBubble/view.jsx

@@ -5,14 +5,12 @@ import classnames from 'classnames';
 type Props = {
   unseenCount: number,
   inline: boolean,
-  user: ?User,
 };
 
 export default function NotificationHeaderButton(props: Props) {
-  const { unseenCount, inline = false, user } = props;
+  const { unseenCount, inline = false } = props;
-  const notificationsEnabled = user && user.experimental_ui;
 
-  if (unseenCount === 0 || !notificationsEnabled) {
+  if (unseenCount === 0) {
     return null;
   }
 

ui/component/notificationHeaderButton/view.jsx

@@ -19,9 +19,8 @@ export default function NotificationHeaderButton(props: Props) {
     // notifications,
     // fetching,
     doSeeAllNotifications,
-    user,
+    // user,
   } = props;
-  const notificationsEnabled = user && user.experimental_ui;
   const { push } = useHistory();
 
   function handleMenuClick() {
@@ -32,10 +31,6 @@ export default function NotificationHeaderButton(props: Props) {
     push(`/$/${PAGES.NOTIFICATIONS}`);
   }
 
-  if (!notificationsEnabled) {
-    return null;
-  }
-
   return (
     <Button
       onClick={handleMenuClick}

ui/component/page/view.jsx

@@ -1,5 +1,6 @@
 // @flow
 import type { Node } from 'react';
+import * as PAGES from 'constants/pages';
 import React, { Fragment } from 'react';
 import classnames from 'classnames';
 import SideNavigation from 'component/sideNavigation';
@@ -21,7 +22,6 @@ type Props = {
   isUpgradeAvailable: boolean,
   authPage: boolean,
   filePage: boolean,
-  homePage: boolean,
   noHeader: boolean,
   noFooter: boolean,
   noSideNavigation: boolean,
@@ -56,16 +56,20 @@ function Page(props: Props) {
   const {
     location: { pathname },
   } = useHistory();
-  const [sidebarOpen, setSidebarOpen] = usePersistedState('sidebar', true);
+  const [sidebarOpen, setSidebarOpen] = usePersistedState('sidebar', false);
   const isMediumScreen = useIsMediumScreen();
   const isMobile = useIsMobile();
 
   let isOnFilePage = false;
   try {
-    const url = pathname.slice(1).replace(/:/g, '#');
+    if (pathname.includes(`/$/${PAGES.LIVESTREAM}`)) {
-    const { isChannel } = parseURI(url);
-    if (!isChannel) {
       isOnFilePage = true;
+    } else {
+      const url = pathname.slice(1).replace(/:/g, '#');
+      const { isChannel } = parseURI(url);
+      if (!isChannel) {
+        isOnFilePage = true;
+      }
     }
   } catch (e) {}
 

ui/component/publishAdditionalOptions/view.jsx

@@ -8,6 +8,7 @@ import LicenseType from './license-type';
 import Card from 'component/common/card';
 import SUPPORTED_LANGUAGES from 'constants/supported_languages';
 
+import PublishName from 'component/publishName';
 // @if TARGET='app'
 // import ErrorText from 'component/common/error-text';
 // import { LbryFirst } from 'lbry-redux';
@@ -115,6 +116,7 @@ function PublishAdditionalOptions(props: Props) {
         <React.Fragment>
           {!hideSection && (
             <div className={classnames({ 'card--disabled': !name })}>
+              <PublishName />
               {/* @if TARGET='app' */}
               {/* {showLbryFirstCheckbox && (
                 <div className="section">
@@ -156,7 +158,7 @@ function PublishAdditionalOptions(props: Props) {
                   type="select"
                   name="content_language"
                   value={language}
-                  onChange={event => updatePublishForm({ language: event.target.value })}
+                  onChange={(event) => updatePublishForm({ language: event.target.value })}
                 >
                   {Object.entries(SUPPORTED_LANGUAGES).map(([langkey, langName]) => (
                     // $FlowFixMe
@@ -176,12 +178,12 @@ function PublishAdditionalOptions(props: Props) {
                       licenseUrl: newLicenseUrl,
                     })
                   }
-                  handleLicenseDescriptionChange={event =>
+                  handleLicenseDescriptionChange={(event) =>
                     updatePublishForm({
                       otherLicenseDescription: event.target.value,
                     })
                   }
-                  handleLicenseUrlChange={event => updatePublishForm({ licenseUrl: event.target.value })}
+                  handleLicenseUrlChange={(event) => updatePublishForm({ licenseUrl: event.target.value })}
                 />
               </div>
             </div>

ui/component/publishFile/view.jsx

@@ -334,7 +334,7 @@ function PublishFile(props: Props) {
       className={disabled || balance === 0 ? 'card--disabled' : ''}
       title={
         <div>
-          {header}
+          {__('Upload') || header}
           {publishing && <Spinner type={'small'} />}
           {inProgress && (
             <div>
@@ -346,7 +346,8 @@ function PublishFile(props: Props) {
       subtitle={isStillEditing && __('You are currently editing your upload.')}
       actions={
         <React.Fragment>
-          <PublishName />
+          <PublishName uri={uri} />
+
           <FormField
             type="text"
             name="content_title"
@@ -358,12 +359,16 @@ function PublishFile(props: Props) {
           />
           {isPublishFile && (
             <FileSelector
-              label={__('File')}
+              label={__('Video file')}
               disabled={disabled}
               currentPath={currentFile}
               onFileChosen={handleFileChange}
+              // https://stackoverflow.com/questions/19107685/safari-input-type-file-accept-video-ignores-mp4-files
+              accept="video/mp4,video/x-m4v,video/*"
+              placeholder={__('Select video file to upload')}
             />
           )}
+          {isPublishFile && getMessage()}
 
           {isPublishPost && (
             <PostEditor
@@ -375,7 +380,7 @@ function PublishFile(props: Props) {
               setCurrentFileType={setCurrentFileType}
             />
           )}
-          {isPublishFile && getMessage()}
+
           {/* @if TARGET='app' */}
           {isPublishFile && (
             <FormField

ui/component/publishForm/index.js

@@ -12,6 +12,7 @@ import {
   doPrepareEdit,
   doCheckPublishNameAvailability,
   SETTINGS,
+  selectMyChannelClaims,
 } from 'lbry-redux';
 import { doPublishDesktop } from 'redux/actions/publish';
 import { selectUnclaimedRewardValue } from 'redux/selectors/rewards';
@@ -20,7 +21,7 @@ import { makeSelectClientSetting } from 'redux/selectors/settings';
 import PublishPage from './view';
 import { selectUser } from '../../redux/selectors/user';
 
-const select = state => ({
+const select = (state) => ({
   ...selectPublishFormValues(state),
   user: selectUser(state),
   // The winning claim for a short lbry uri
@@ -35,17 +36,18 @@ const select = state => ({
   modal: selectModal(state),
   enablePublishPreview: makeSelectClientSetting(SETTINGS.ENABLE_PUBLISH_PREVIEW)(state),
   activeChannelClaim: selectActiveChannelClaim(state),
+  myChannels: selectMyChannelClaims(state),
   incognito: selectIncognito(state),
 });
 
-const perform = dispatch => ({
+const perform = (dispatch) => ({
-  updatePublishForm: value => dispatch(doUpdatePublishForm(value)),
+  updatePublishForm: (value) => dispatch(doUpdatePublishForm(value)),
   clearPublish: () => dispatch(doClearPublish()),
-  resolveUri: uri => dispatch(doResolveUri(uri)),
+  resolveUri: (uri) => dispatch(doResolveUri(uri)),
   publish: (filePath, preview) => dispatch(doPublishDesktop(filePath, preview)),
   prepareEdit: (claim, uri) => dispatch(doPrepareEdit(claim, uri)),
   resetThumbnailStatus: () => dispatch(doResetThumbnailStatus()),
-  checkAvailability: name => dispatch(doCheckPublishNameAvailability(name)),
+  checkAvailability: (name) => dispatch(doCheckPublishNameAvailability(name)),
 });
 
 export default connect(select, perform)(PublishPage);

ui/component/publishName/name-help-text.jsx

@@ -13,7 +13,6 @@ type Props = {
 
 function NameHelpText(props: Props) {
   const { uri, myClaimForUri, onEditMyClaim, isStillEditing } = props;
-
   let nameHelpText;
 
   if (isStillEditing) {

ui/component/recommendedContent/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import { SEARCH_OPTIONS } from 'constants/search';
 import { SHOW_ADS, SIMPLE_SITE } from 'config';
 import React from 'react';
 import ClaimList from 'component/claimList';
@@ -32,7 +33,13 @@ export default function RecommendedContent(props: Props) {
     if (stringifiedClaim) {
       const jsonClaim = JSON.parse(stringifiedClaim);
       if (jsonClaim && jsonClaim.value && jsonClaim.claim_id) {
-        const options: Options = { size: 20, related_to: jsonClaim.claim_id, isBackgroundSearch: true };
+        const options: Options = {
+          size: 20,
+          related_to: jsonClaim.claim_id,
+          isBackgroundSearch: true,
+          [SEARCH_OPTIONS.CLAIM_TYPE]: SEARCH_OPTIONS.INCLUDE_FILES,
+          [SEARCH_OPTIONS.MEDIA_VIDEO]: true,
+        };
         if (jsonClaim && !mature) {
           options['nsfw'] = false;
         }

ui/component/repostCreate/view.jsx

@@ -20,20 +20,20 @@ import Spinner from 'component/spinner';
 type Props = {
   doToast: ({ message: string }) => void,
   doClearRepostError: () => void,
-  doRepost: StreamRepostOptions => Promise<*>,
+  doRepost: (StreamRepostOptions) => Promise<*>,
   title: string,
   claim?: StreamClaim,
   enteredContentClaim?: StreamClaim,
   balance: number,
   channels: ?Array<ChannelClaim>,
-  doCheckPublishNameAvailability: string => Promise<*>,
+  doCheckPublishNameAvailability: (string) => Promise<*>,
   error: ?string,
   reposting: boolean,
   uri: string,
   name: string,
   contentUri: string,
-  setRepostUri: string => void,
+  setRepostUri: (string) => void,
-  setContentUri: string => void,
+  setContentUri: (string) => void,
   doCheckPendingClaims: () => void,
   redirectUri?: string,
   passedRepostAmount: number,
@@ -88,7 +88,7 @@ function RepostCreate(props: Props) {
   const repostUrlName = `lbry://${!activeChannelClaim ? '' : `${activeChannelClaim.name}/`}`;
 
   const contentFirstRender = React.useRef(true);
-  const setAutoRepostBid = amount => {
+  const setAutoRepostBid = (amount) => {
     if (balance && balance > 0.02) {
       if (uri) {
         setRepostBid(0.01);
@@ -113,7 +113,7 @@ function RepostCreate(props: Props) {
     const isLbryUrl = value.startsWith('lbry://') && value !== 'lbry://';
     const error = '';
 
-    const addLbryIfNot = term => {
+    const addLbryIfNot = (term) => {
       return term.startsWith('lbry://') ? term : `lbry://${term}`;
     };
     if (wasCopiedFromWeb) {
@@ -178,7 +178,7 @@ function RepostCreate(props: Props) {
 
   React.useEffect(() => {
     if (enteredRepostName && isNameValid(enteredRepostName, false)) {
-      doCheckPublishNameAvailability(enteredRepostName).then(r => setAvailable(r));
+      doCheckPublishNameAvailability(enteredRepostName).then((r) => setAvailable(r));
     }
   }, [enteredRepostName, doCheckPublishNameAvailability]);
 
@@ -316,7 +316,7 @@ function RepostCreate(props: Props) {
           <div>
             {uri && (
               <fieldset-section>
-                <ClaimPreview key={uri} uri={uri} actions={''} type={'inline'} showNullPlaceholder />
+                <ClaimPreview key={uri} uri={uri} actions={''} showNullPlaceholder />
               </fieldset-section>
             )}
             {!uri && name && (
@@ -327,7 +327,7 @@ function RepostCreate(props: Props) {
                   name="content_url"
                   value={enteredContent}
                   error={contentError}
-                  onChange={event => setEnteredContentUri(event.target.value)}
+                  onChange={(event) => setEnteredContentUri(event.target.value)}
                   placeholder={__('Enter a name or %domain% URL', { domain: SITE_URL })}
                 />
               </>
@@ -359,7 +359,7 @@ function RepostCreate(props: Props) {
                     type="text"
                     name="repost_name"
                     value={enteredRepostName}
-                    onChange={event => setEnteredRepostName(event.target.value)}
+                    onChange={(event) => setEnteredRepostName(event.target.value)}
                     placeholder={__('MyFunName')}
                   />
                 </fieldset-group>
@@ -384,8 +384,8 @@ function RepostCreate(props: Props) {
                   </>
                 }
                 disabled={!enteredRepostName || resolvingRepost}
-                onChange={event => setRepostBid(event.target.value)}
+                onChange={(event) => setRepostBid(event.target.value)}
-                onWheel={e => e.stopPropagation()}
+                onWheel={(e) => e.stopPropagation()}
               />
             </React.Fragment>
 

ui/component/router/view.jsx

@@ -49,6 +49,7 @@ import BuyPage from 'page/buy';
 import NotificationsPage from 'page/notifications';
 import SignInWalletPasswordPage from 'page/signInWalletPassword';
 import YoutubeSyncPage from 'page/youtubeSync';
+import LiveStreamPage from 'page/livestream';
 
 import { LINKED_COMMENT_QUERY_PARAM } from 'constants/comment';
 import { parseURI, isURIValid } from 'lbry-redux';
@@ -216,6 +217,7 @@ function AppRouter(props: Props) {
 
       <Route path={`/`} exact component={HomePage} />
       <Route path={`/$/${PAGES.DISCOVER}`} exact component={DiscoverPage} />
+      <Route path={`/$/${PAGES.WILD_WEST}`} exact component={DiscoverPage} />
       {/* $FlowFixMe */}
       {dynamicRoutes.map((dynamicRouteProps: RowDataItem) => (
         <Route
@@ -283,6 +285,9 @@ function AppRouter(props: Props) {
 
       <Route path={`/$/${PAGES.EMBED}/:claimName`} exact component={EmbedWrapperPage} />
       <Route path={`/$/${PAGES.EMBED}/:claimName/:claimId`} exact component={EmbedWrapperPage} />
+
+      <Route path={`/$/${PAGES.LIVESTREAM}`} component={LiveStreamPage} />
+
       {/* Below need to go at the end to make sure we don't match any of our pages first */}
       <Route path="/:claimName" exact component={ShowPage} />
       <Route path="/:claimName/:streamName" exact component={ShowPage} />

ui/component/searchOptions/view.jsx

@@ -33,33 +33,34 @@ const SearchOptions = (props: Props) => {
       />
       {expanded && (
         <Form className="search__options">
-          <fieldset>
+          {false && (
-            <legend className="search__legend">{__('Search For')}</legend>
+            <fieldset>
-            {[
+              {[
-              {
+                {
-                option: SEARCH_OPTIONS.INCLUDE_FILES,
+                  option: SEARCH_OPTIONS.INCLUDE_FILES,
-                label: __('Files'),
+                  label: __('Files'),
-              },
+                },
-              {
+                {
-                option: SEARCH_OPTIONS.INCLUDE_CHANNELS,
+                  option: SEARCH_OPTIONS.INCLUDE_CHANNELS,
-                label: __('Channels'),
+                  label: __('Channels'),
-              },
+                },
-              {
+                {
-                option: SEARCH_OPTIONS.INCLUDE_FILES_AND_CHANNELS,
+                  option: SEARCH_OPTIONS.INCLUDE_FILES_AND_CHANNELS,
-                label: __('Everything'),
+                  label: __('Everything'),
-              },
+                },
-            ].map(({ option, label }) => (
+              ].map(({ option, label }) => (
-              <FormField
+                <FormField
-                key={option}
+                  key={option}
-                name={option}
+                  name={option}
-                type="radio"
+                  type="radio"
-                blockWrap={false}
+                  blockWrap={false}
-                label={label}
+                  label={label}
-                checked={options[SEARCH_OPTIONS.CLAIM_TYPE] === option}
+                  checked={options[SEARCH_OPTIONS.CLAIM_TYPE] === option}
-                onChange={() => setSearchOption(SEARCH_OPTIONS.CLAIM_TYPE, option)}
+                  onChange={() => setSearchOption(SEARCH_OPTIONS.CLAIM_TYPE, option)}
-              />
+                />
-            ))}
+              ))}
-          </fieldset>
+            </fieldset>
+          )}
 
           <fieldset disabled={isFilteringByChannel}>
             <legend className="search__legend">{__('Type')}</legend>
@@ -70,7 +71,7 @@ const SearchOptions = (props: Props) => {
               },
               {
                 option: SEARCH_OPTIONS.MEDIA_AUDIO,
-                label: __('Audio'),
+                label: __('Music'),
               },
               {
                 option: SEARCH_OPTIONS.MEDIA_IMAGE,
@@ -98,22 +99,24 @@ const SearchOptions = (props: Props) => {
             ))}
           </fieldset>
 
-          <fieldset>
+          {false && (
-            <legend className="search__legend">{__('Other Options')}</legend>
+            <fieldset>
-            <FormField
+              <legend className="search__legend">{__('Other Options')}</legend>
-              type="select"
+              <FormField
-              name="result-count"
+                type="select"
-              value={resultCount}
+                name="result-count"
-              onChange={(e) => setSearchOption(SEARCH_OPTIONS.RESULT_COUNT, e.target.value)}
+                value={resultCount}
-              blockWrap={false}
+                onChange={(e) => setSearchOption(SEARCH_OPTIONS.RESULT_COUNT, e.target.value)}
-              label={__('Returned Results')}
+                blockWrap={false}
-            >
+                label={__('Returned Results')}
-              <option value={10}>10</option>
+              >
-              <option value={30}>30</option>
+                <option value={10}>10</option>
-              <option value={50}>50</option>
+                <option value={30}>30</option>
-              <option value={100}>100</option>
+                <option value={50}>50</option>
-            </FormField>
+                <option value={100}>100</option>
-          </fieldset>
+              </FormField>
+            </fieldset>
+          )}
         </Form>
       )}
     </div>

ui/component/selectThumbnail/view.jsx

@@ -99,7 +99,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
                 style={{ display: 'none' }}
                 src={thumbnailSrc}
                 alt={__('Thumbnail Preview')}
-                onError={e => {
+                onError={(e) => {
                   this.setState({
                     thumbnailError: true,
                   });
@@ -131,9 +131,9 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
               <FileSelector
                 currentPath={thumbnailPath}
                 label={__('Thumbnail')}
-                placeholder={__('Choose a thumbnail')}
+                placeholder={__('Thumbnails that entice a viewer to watch a video work best')}
                 accept={accept}
-                onFileChosen={file => openModal(MODALS.CONFIRM_THUMBNAIL_UPLOAD, { file })}
+                onFileChosen={(file) => openModal(MODALS.CONFIRM_THUMBNAIL_UPLOAD, { file })}
               />
             )}
             {status === THUMBNAIL_STATUSES.COMPLETE && thumbnail && (

ui/component/sideNavigation/view.jsx

@@ -51,6 +51,7 @@ type Props = {
 type SideNavLink = {
   title: string,
   link?: string,
+  route?: string,
   onClick?: () => any,
   icon: string,
   extra?: Node,
@@ -60,7 +61,6 @@ type SideNavLink = {
 function SideNavigation(props: Props) {
   const {
     subscriptions,
-    followedTags,
     doSignOut,
     email,
     purchaseSuccess,
@@ -72,6 +72,7 @@ function SideNavigation(props: Props) {
     unseenCount,
     homepageData,
     user,
+    followedTags,
   } = props;
 
   const { EXTRA_SIDEBAR_LINKS } = homepageData;
@@ -211,7 +212,7 @@ function SideNavigation(props: Props) {
     });
   }
 
-  const notificationsEnabled = user && user.experimental_ui;
+  const notificationsEnabled = SIMPLE_SITE || (user && user.experimental_ui);
   const isAuthenticated = Boolean(email);
   // SIDE LINKS: FOLLOWING, HOME, [FULL,] [EXTRA]
   let SIDE_LINKS: Array<SideNavLink> = [];
@@ -291,8 +292,13 @@ function SideNavigation(props: Props) {
       <li className="navigation-link">
         <Button label={__('FAQ')} href="https://odysee.com/@OdyseeHelp:b" />
       </li>
+
       <li className="navigation-link">
-        <Button label={__('Support')} href="https://lbry.com/support" />
+        <Button label={__('Community Guidelines')} href="https://odysee.com/@OdyseeHelp:b/Community-Guidelines:c" />
+      </li>
+
+      <li className="navigation-link">
+        <Button label={__('Support --[used in footer; general help/support]--')} href="https://lbry.com/support" />
       </li>
       <li className="navigation-link">
         <Button label={__('Terms')} href="https://lbry.com/termsofservice" />
@@ -325,7 +331,7 @@ function SideNavigation(props: Props) {
                 //   $FlowFixMe
                 const { hideForUnauth, ...passedProps } = linkProps;
                 return !email && linkProps.hideForUnauth && IS_WEB ? null : (
-                  <li key={linkProps.link}>
+                  <li key={linkProps.route || linkProps.link}>
                     <Button
                       {...passedProps}
                       label={__(linkProps.title)}

ui/component/subscribeButton/index.js

@@ -7,7 +7,6 @@ import {
 } from 'redux/selectors/subscriptions';
 import { makeSelectPermanentUrlForUri } from 'lbry-redux';
 import { doToast } from 'redux/actions/notifications';
-import { selectUser } from 'redux/selectors/user';
 import SubscribeButton from './view';
 
 const select = (state, props) => ({
@@ -15,7 +14,6 @@ const select = (state, props) => ({
   firstRunCompleted: selectFirstRunCompleted(state),
   permanentUrl: makeSelectPermanentUrlForUri(props.uri)(state),
   notificationsDisabled: makeSelectNotificationsDisabled(props.uri)(state),
-  user: selectUser(state),
 });
 
 export default connect(select, {

ui/component/subscribeButton/view.jsx

@@ -15,13 +15,12 @@ type SubscriptionArgs = {
 type Props = {
   permanentUrl: ?string,
   isSubscribed: boolean,
-  doChannelSubscribe: SubscriptionArgs => void,
+  doChannelSubscribe: (SubscriptionArgs) => void,
-  doChannelUnsubscribe: SubscriptionArgs => void,
+  doChannelUnsubscribe: (SubscriptionArgs) => void,
   showSnackBarOnSubscribe: boolean,
   doToast: ({ message: string }) => void,
   shrinkOnMobile: boolean,
   notificationsDisabled: boolean,
-  user: ?User,
 };
 
 export default function SubscribeButton(props: Props) {
@@ -34,14 +33,12 @@ export default function SubscribeButton(props: Props) {
     doToast,
     shrinkOnMobile = false,
     notificationsDisabled,
-    user,
   } = props;
 
   const buttonRef = useRef();
   const isMobile = useIsMobile();
   let isHovering = useHover(buttonRef);
   isHovering = isMobile ? true : isHovering;
-  const uiNotificationsEnabled = user && user.experimental_ui;
 
   const { channelName } = parseURI(permanentUrl);
   const claimName = '@' + channelName;
@@ -66,7 +63,7 @@ export default function SubscribeButton(props: Props) {
         requiresAuth={IS_WEB}
         label={label}
         title={titlePrefix}
-        onClick={e => {
+        onClick={(e) => {
           e.stopPropagation();
 
           subscriptionHandler({
@@ -80,7 +77,7 @@ export default function SubscribeButton(props: Props) {
           }
         }}
       />
-      {isSubscribed && uiNotificationsEnabled && (
+      {isSubscribed && (
         <Button
           button="alt"
           icon={notificationsDisabled ? ICONS.BELL : ICONS.BELL_ON}

ui/component/syncPassword/view.jsx

@@ -53,7 +53,7 @@ function SyncPassword(props: Props) {
               error={passwordError && __('Wrong password for %email%', { email })}
               label={__('Password for %email%', { email })}
               value={password}
-              onChange={e => setPassword(e.target.value)}
+              onChange={(e) => setPassword(e.target.value)}
             />
             <FormField
               name="remember-password"
@@ -75,7 +75,7 @@ function SyncPassword(props: Props) {
               <I18nMessage
                 tokens={{
                   help: <Button button="link" label={__('help guide')} href="https://lbry.com/faq/account-sync" />,
-                  email: <Button button="link" label={'help@lbry.com'} href="mailto:help@lbry.com" />,
+                  email: <Button button="link" label={'help@odysee.com'} href="mailto:help@odysee.com" />,
                 }}
               >
                 If you are having issues, checkout our %help% or email us at %email%.

ui/component/userChannelFollowIntro/view.jsx

@@ -11,24 +11,23 @@ import { AUTO_FOLLOW_CHANNELS, SIMPLE_SITE } from 'config';
 type Props = {
   subscribedChannels: Array<Subscription>,
   onContinue: () => void,
-  onBack: () => void,
   channelSubscribe: (sub: Subscription) => void,
   homepageData: any,
 };
 
 const channelsToSubscribe = AUTO_FOLLOW_CHANNELS.trim()
   .split(' ')
-  .filter(x => x !== '');
+  .filter((x) => x !== '');
 
 function UserChannelFollowIntro(props: Props) {
-  const { subscribedChannels, channelSubscribe, onContinue, onBack, homepageData } = props;
+  const { subscribedChannels, channelSubscribe, onContinue, homepageData } = props;
   const { PRIMARY_CONTENT_CHANNEL_IDS } = homepageData;
   const followingCount = (subscribedChannels && subscribedChannels.length) || 0;
 
   // subscribe to lbry
   useEffect(() => {
     if (channelsToSubscribe && channelsToSubscribe.length) {
-      channelsToSubscribe.forEach(c =>
+      channelsToSubscribe.forEach((c) =>
         channelSubscribe({
           channelName: parseURI(c).claimName,
           uri: c,
@@ -41,25 +40,25 @@ function UserChannelFollowIntro(props: Props) {
     <Card
       title={__('Find channels to follow')}
       subtitle={__(
-        'LBRY works better if you find and follow a couple creators you like. You can also block channels you never want to see.'
+        'Odysee works better if you find and follow a couple creators you like. You can also block channels you never want to see.'
       )}
       actions={
         <React.Fragment>
-          <div className="section__actions--between">
-            <Button button="secondary" onClick={onBack} label={__('Back')} />
-            <Button
-              button={subscribedChannels.length < 1 ? 'alt' : 'primary'}
-              onClick={onContinue}
-              label={subscribedChannels.length < 1 ? __('Skip') : __('Continue')}
-            />
-          </div>
           <div className="section__body">
             <ClaimListDiscover
-              defaultOrderBy={CS.ORDER_BY_TOP}
+              hideFilters
+              meta={
+                <Button
+                  button={subscribedChannels.length < 1 ? 'alt' : 'primary'}
+                  onClick={onContinue}
+                  label={subscribedChannels.length < 1 ? __('Skip') : __('Continue')}
+                />
+              }
+              defaultOrderBy={CS.ORDER_BY_TRENDING}
               defaultFreshness={CS.FRESH_ALL}
-              claimType="channel"
+              claimIds={SIMPLE_SITE ? PRIMARY_CONTENT_CHANNEL_IDS : undefined}
-              claimIds={SIMPLE_SITE ? undefined : PRIMARY_CONTENT_CHANNEL_IDS}
+              claimType={CS.CLAIM_CHANNEL}
-              defaultTags={followingCount > 3 ? CS.TAGS_FOLLOWED : undefined}
+              maxPages={3}
             />
             {followingCount > 0 && (
               <Nag

ui/component/userEmailNew/view.jsx

@@ -100,7 +100,7 @@ function UserEmailNew(props: Props) {
       <Card
         title={__('Join %SITE_NAME%', { SITE_NAME })}
         // @if TARGET='app'
-        subtitle={__('An account with lbry.tv allows you to earn rewards and backup your data.')}
+        subtitle={__('An account with %domain% allows you to earn rewards and backup your data.', { domain: DOMAIN })}
         // @endif
         actions={
           <div className={classnames({ 'card--disabled': DOMAIN === 'lbry.tv' })}>

ui/component/userEmailVerify/view.jsx

@@ -8,10 +8,10 @@ const THIRTY_SECONDS_IN_MS = 30000;
 type Props = {
   email: string,
   isReturningUser: boolean,
-  resendVerificationEmail: string => void,
+  resendVerificationEmail: (string) => void,
   resendingEmail: boolean,
   checkEmailVerified: () => void,
-  toast: string => void,
+  toast: (string) => void,
   user: {
     has_verified_email: boolean,
   },
@@ -102,7 +102,7 @@ class UserEmailVerify extends React.PureComponent<Props, State> {
               <p className="help--card-actions">
                 <I18nMessage
                   tokens={{
-                    help_link: <Button button="link" href="mailto:help@lbry.com" label="help@lbry.com" />,
+                    help_link: <Button button="link" href="mailto:help@odysee.com" label="help@odysee.com" />,
                     chat_link: <Button button="link" href="https://chat.lbry.com" label={__('chat')} />,
                   }}
                 >

ui/component/userPhoneVerify/view.jsx

@@ -6,7 +6,7 @@ import I18nMessage from 'component/i18nMessage';
 import Card from 'component/common/card';
 
 type Props = {
-  verifyUserPhone: string => void,
+  verifyUserPhone: (string) => void,
   resetPhone: () => void,
   phoneErrorMessage: string,
   phone: string,
@@ -61,7 +61,7 @@ class UserPhoneVerify extends React.PureComponent<Props, State> {
                 name="code"
                 placeholder="1234"
                 value={this.state.code}
-                onChange={event => {
+                onChange={(event) => {
                   this.handleCodeChanged(event);
                 }}
                 label={__('Verification Code')}
@@ -72,7 +72,7 @@ class UserPhoneVerify extends React.PureComponent<Props, State> {
             <p className="help">
               <I18nMessage
                 tokens={{
-                  help_link: <Button button="link" href="mailto:help@lbry.com" label="help@lbry.com" />,
+                  help_link: <Button button="link" href="mailto:help@odysee.com" label="help@odysee.com" />,
                   chat_link: <Button button="link" href="https://chat.lbry.com" label={__('chat')} />,
                 }}
               >

ui/component/userSignUp/view.jsx

@@ -1,5 +1,4 @@
 // @flow
-import * as PAGES from 'constants/pages';
 import React from 'react';
 import classnames from 'classnames';
 import { useHistory } from 'react-router';
@@ -7,7 +6,6 @@ import UserEmailNew from 'component/userEmailNew';
 import UserEmailVerify from 'component/userEmailVerify';
 import UserFirstChannel from 'component/userFirstChannel';
 import UserChannelFollowIntro from 'component/userChannelFollowIntro';
-import UserTagFollowIntro from 'component/userTagFollowIntro';
 import YoutubeSync from 'page/youtubeSync';
 import { DEFAULT_BID_FOR_FIRST_CHANNEL } from 'component/userFirstChannel/view';
 import { YOUTUBE_STATUSES } from 'lbryinc';
@@ -42,7 +40,6 @@ type Props = {
   creatingChannel: boolean,
   setClientSetting: (string, boolean, ?boolean) => void,
   followingAcknowledged: boolean,
-  tagsAcknowledged: boolean,
   rewardsAcknowledged: boolean,
   interestedInYoutubeSync: boolean,
   doToggleInterestedInYoutubeSync: () => void,
@@ -67,7 +64,6 @@ function UserSignUp(props: Props) {
     fetchingChannels,
     creatingChannel,
     followingAcknowledged,
-    tagsAcknowledged,
     rewardsAcknowledged,
     setClientSetting,
     interestedInYoutubeSync,
@@ -118,8 +114,7 @@ function UserSignUp(props: Props) {
       interestedInYoutubeSync);
   const showYoutubeTransfer = hasVerifiedEmail && hasYoutubeChannels && !isYoutubeTransferComplete;
   const showFollowIntro = step === 'channels' || (hasVerifiedEmail && !followingAcknowledged);
-  const showTagsIntro = step === 'tags' || (hasVerifiedEmail && !tagsAcknowledged);
+  const canHijackSignInFlowWithSpinner = hasVerifiedEmail && !showFollowIntro && !rewardsAcknowledged;
-  const canHijackSignInFlowWithSpinner = hasVerifiedEmail && !showFollowIntro && !showTagsIntro && !rewardsAcknowledged;
   const isCurrentlyFetchingSomething = fetchingChannels || claimingReward || syncingWallet || creatingChannel;
   const isWaitingForSomethingToFinish =
     // If the user has claimed the email award, we need to wait until the balance updates sometime in the future
@@ -206,22 +201,6 @@ function UserSignUp(props: Props) {
         }}
       />
     ),
-    showTagsIntro && (
-      <UserTagFollowIntro
-        onContinue={() => {
-          let url = `/$/${PAGES.AUTH}?reset_scroll=1&${STEP_PARAM}=channels`;
-          if (redirect) {
-            url += `&${REDIRECT_PARAM}=${redirect}`;
-          }
-          if (shouldRedirectImmediately) {
-            url += `&${REDIRECT_IMMEDIATELY_PARAM}=true`;
-          }
-
-          replace(url);
-          setSettingAndSync(SETTINGS.TAGS_ACKNOWLEDGED, true);
-        }}
-      />
-    ),
     showYoutubeTransfer && (
       <div>
         <YoutubeTransferStatus /> <Confetti recycle={false} style={{ position: 'fixed' }} />

ui/component/userVerify/view.jsx

@@ -12,7 +12,7 @@ import LbcSymbol from 'component/common/lbc-symbol';
 type Props = {
   errorMessage: ?string,
   isPending: boolean,
-  verifyUserIdentity: string => void,
+  verifyUserIdentity: (string) => void,
   verifyPhone: () => void,
   fetchUser: () => void,
   skipLink?: string,
@@ -60,7 +60,7 @@ class UserVerify extends React.PureComponent<Props> {
                 SITE_NAME,
               }}
             >
-              Verified accounts are eligible to earn LBRY Credits for views, watching and reposting content, sharing
+              Verified accounts are eligible to earn LBRY Credits for views, watching and reposting videos, sharing
               invite links etc. Verifying also helps us keep the %SITE_NAME% community safe too! %Refresh% or %Skip%.
             </I18nMessage>
           </p>
@@ -73,9 +73,7 @@ class UserVerify extends React.PureComponent<Props> {
           <Card
             icon={ICONS.PHONE}
             title={__('Verify phone number')}
-            subtitle={__(
+            subtitle={__('You will receive an SMS text message confirming your phone number is valid.')}
-              'You will receive an SMS text message confirming your phone number is valid. Does not work for Canada and possibly other regions.'
-            )}
             actions={
               <Fragment>
                 <Button

ui/component/viewers/videoViewer/internal/videojs.jsx

@@ -51,14 +51,14 @@ type Props = {
   toggleVideoTheaterMode: () => void,
 };
 
-type VideoJSOptions = {
+// type VideoJSOptions = {
-  controls: boolean,
+//   controls: boolean,
-  preload: string,
+//   preload: string,
-  playbackRates: Array<number>,
+//   playbackRates: Array<number>,
-  responsive: boolean,
+//   responsive: boolean,
-  poster?: string,
+//   poster: ?string,
-  muted?: boolean,
+//   muted: ?boolean,
-};
+// };
 
 const videoPlaybackRates = [0.25, 0.5, 0.75, 1, 1.1, 1.25, 1.5, 1.75, 2];
 
@@ -67,7 +67,7 @@ const IS_IOS =
     (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)) &&
   !window.MSStream;
 
-const VIDEO_JS_OPTIONS: VideoJSOptions = {
+const VIDEO_JS_OPTIONS = {
   preload: 'auto',
   playbackRates: videoPlaybackRates,
   responsive: true,
@@ -172,9 +172,7 @@ properties for this component should be kept to ONLY those that if changed shoul
  */
 export default React.memo<Props>(function VideoJs(props: Props) {
   const { autoplay, startMuted, source, sourceType, poster, isAudio, onPlayerReady, toggleVideoTheaterMode } = props;
-
   const [reload, setReload] = useState('initial');
-
   const playerRef = useRef();
   const containerRef = useRef();
   const videoJsOptions = {

ui/component/viewers/videoViewer/view.jsx

@@ -73,6 +73,8 @@ function VideoViewer(props: Props) {
   const claimId = claim && claim.claim_id;
   const isAudio = contentType.includes('audio');
   const forcePlayer = FORCE_CONTENT_TYPE_PLAYER.includes(contentType);
+  const previousUri = usePrevious(uri);
+  const embedded = useContext(EmbedContext);
   const [isPlaying, setIsPlaying] = useState(false);
   const [showAutoplayCountdown, setShowAutoplayCountdown] = useState(false);
   const [isEndededEmbed, setIsEndededEmbed] = useState(false);
@@ -82,9 +84,6 @@ function VideoViewer(props: Props) {
   breaks because some browsers (e.g. Firefox) block autoplay but leave the player.play Promise pending */
   const [isLoading, setIsLoading] = useState(false);
 
-  const previousUri = usePrevious(uri);
-  const embedded = useContext(EmbedContext);
-
   // force everything to recent when URI changes, can cause weird corner cases otherwise (e.g. navigate while autoplay is true)
   useEffect(() => {
     if (uri && previousUri && uri !== previousUri) {

ui/component/webUploadList/view.jsx

@@ -21,7 +21,9 @@ export default function WebUploadList(props: Props) {
     !!uploadCount && (
       <Card
         title={__('Currently uploading')}
-        subtitle={uploadCount > 1 ? __('You files are currently uploading.') : __('Your file is currently uploading.')}
+        subtitle={
+          uploadCount > 1 ? __('You videos are currently uploading.') : __('Your video is currently uploading.')
+        }
         body={
           <section>
             {/* $FlowFixMe */}

ui/component/youtubeTransferStatus/view.jsx

@@ -119,7 +119,7 @@ export default function YoutubeTransferStatus(props: Props) {
               <I18nMessage
                 tokens={{ here: <Button button="link" href="https://lbry.com/faq/youtube" label={__('here')} /> }}
               >
-                Email help@lbry.com if you think there has been a mistake. Make sure your channel qualifies %here%.
+                Email help@odysee.com if you think there has been a mistake. Make sure your channel qualifies %here%.
               </I18nMessage>
             )}
           </span>

ui/constants/comment.js

@@ -3,3 +3,22 @@ export const LINKED_COMMENT_QUERY_PARAM = 'lc';
 export const SORT_COMMENTS_NEW = 'new';
 export const SORT_COMMENTS_BEST = 'best';
 export const SORT_COMMENTS_CONTROVERSIAL = 'controversial';
+
+export const BANNED_LIVESTREAM_WORDS = [
+  'n1gga',
+  'f4ggot',
+  'faggot',
+  'nigga',
+  'nigger',
+  'F4G',
+  'fag',
+  'n1gger',
+  'faget',
+  'niggah',
+  'n1ggah',
+  'jew',
+  'j3w',
+  'goy',
+  'goyim',
+  'fagot',
+];

ui/constants/form-field.js

@@ -1,3 +1,4 @@
 export const FF_MAX_CHARS_DEFAULT = 2000;
 export const FF_MAX_CHARS_IN_COMMENT = 2000;
+export const FF_MAX_CHARS_IN_LIVESTREAM_COMMENT = 300;
 export const FF_MAX_CHARS_IN_DESCRIPTION = 5000;

ui/constants/pages.js

@@ -61,3 +61,4 @@ exports.CHANNEL_NEW = 'channel/new';
 exports.NOTIFICATIONS = 'notifications';
 exports.YOUTUBE_SYNC = 'youtube';
 exports.LIVESTREAM = 'livestream';
+exports.GENERAL = 'general';

ui/modal/modalPublish/view.jsx

@@ -40,7 +40,7 @@ class ModalPublishSuccess extends React.PureComponent<Props> {
         'Your livestream is now pending. You will be able to start shortly at the streaming dashboard.'
       );
     } else {
-      publishMessage = __('Your file is now pending on LBRY. It will take a few minutes to appear for other users.');
+      publishMessage = __('Your video will appear on Odysee shortly.');
     }
 
     function handleClose() {
@@ -51,7 +51,7 @@ class ModalPublishSuccess extends React.PureComponent<Props> {
     return (
       <Modal isOpen type="card" contentLabel={__(contentLabel)} onAborted={handleClose}>
         <Card
-          title={__('Success')}
+          title={livestream ? __('Livestream Created') : __('Upload Complete')}
           subtitle={publishMessage}
           body={
             <React.Fragment>

ui/modal/modalRemoveFile/view.jsx

@@ -52,10 +52,8 @@ function ModalRemoveFile(props: Props) {
                 <FormField
                   name="claim_abandon"
                   label={
-                    <I18nMessage
+                    <I18nMessage tokens={{ lbc: <LbcSymbol postfix={claim.amount} /> }}>
-                      tokens={{ lbc: <LbcSymbol prefix={__('reclaim %amount%', { amount: claim.amount })} /> }}
+                      Abandon on blockchain (reclaim %lbc%)
-                    >
-                      Abandon on blockchain (%lbc%)
                     </I18nMessage>
                   }
                   type="checkbox"

ui/modal/modalTransactionFailed/view.jsx

@@ -12,7 +12,7 @@ class ModalTransactionFailed extends React.PureComponent<Props> {
 
     return (
       <Modal isOpen contentLabel={__('Transaction failed')} title={__('Transaction failed')} onConfirmed={closeModal}>
-        <p>{__('Sorry about that. Contact help@lbry.com if you continue to have issues.')}</p>
+        <p>{__('Sorry about that. Contact help@odysee.com if you continue to have issues.')}</p>
       </Modal>
     );
   }

ui/modal/modalYoutubeWelcome/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import { SIMPLE_SITE } from 'config';
 import * as PAGES from 'constants/pages';
 import React from 'react';
 import { Modal } from 'modal/modal';
@@ -15,18 +16,27 @@ const YoutubeWelcome = (props: Props) => {
     <Modal isOpen type="card" onAborted={doHideModal}>
       <Confetti recycle={false} style={{ position: 'fixed' }} numberOfPieces={100} />
       <Card
-        title={__("You're free!")}
+        title={!SIMPLE_SITE ? __("You're free!") : __('Welcome to Odysee')}
         subtitle={
-          <React.Fragment>
+          !SIMPLE_SITE ? (
-            <p>
+            <React.Fragment>
-              {__("You've escaped the land of spying, censorship, and exploitation.")}
+              <p>
-              <span className="emoji"> 💩</span>
+                {__("You've escaped the land of spying, censorship, and exploitation.")}
-            </p>
+                <span className="emoji"> 💩</span>
-            <p>
+              </p>
-              {__('Welcome to the land of content freedom.')}
+              <p>
-              <span className="emoji"> 🌈</span>
+                {__('Welcome to the land of content freedom.')}
-            </p>
+                <span className="emoji"> 🌈</span>
-          </React.Fragment>
+              </p>
+            </React.Fragment>
+          ) : (
+            <React.Fragment>
+              <p>
+                {__('You make the party extra special!')}
+                <span className="emoji"> 💖</span>
+              </p>
+            </React.Fragment>
+          )
         }
         actions={
           <div className="card__actions">

ui/page/adsTest/index.js

@@ -0,0 +1,12 @@
+import { connect } from 'react-redux';
+import { makeSelectClaimForUri, doResolveUri } from 'lbry-redux';
+import AdsTestPage from './view';
+
+export default connect(
+  (state) => ({
+    claim: makeSelectClaimForUri('lbry://fullscreenrelease#7')(state),
+  }),
+  {
+    doResolveUri,
+  }
+)(AdsTestPage);

ui/page/adsTest/view.jsx

@@ -0,0 +1,20 @@
+// @flow
+// import React from 'react';
+// import FilePage from 'page/file';
+
+type Props = {
+  doResolveUri: (string) => void,
+  claim: ?StreamClaim,
+};
+
+export default function AdsTestPage(props: Props) {
+  return null;
+  //   const { doResolveUri, claim } = props;
+  //   const hasClaim = claim !== undefined;
+  //   React.useEffect(() => {
+  //     if (!hasClaim) {
+  //       doResolveUri('lbry://fullscreenrelease#7');
+  //     }
+  //   }, [hasClaim, doResolveUri]);
+  //   return <div>{hasClaim && <FilePage uri="lbry://fullscreenrelease#7" />}</div>;
+}

ui/page/buy/view.jsx

@@ -18,7 +18,7 @@ const MOONPAY_KEY = process.env.MOONPAY_SECRET_KEY;
 const COUNTRIES = Array.from(
   new Set(
     countryData.all
-      .map(country => country.name)
+      .map((country) => country.name)
       .sort((a, b) => {
         if (a > b) {
           return 1;
@@ -39,7 +39,7 @@ type Props = {
   email: string,
   user: ?User,
   doGetNewAddress: () => void,
-  doUserSetCountry: string => void,
+  doUserSetCountry: (string) => void,
 };
 
 export default function BuyPage(props: Props) {
@@ -65,7 +65,7 @@ export default function BuyPage(props: Props) {
 
   React.useEffect(() => {
     if (MOONPAY_KEY && !url && receiveAddress) {
-      let url = `https://buy.moonpay.io?apiKey=pk_live_xNFffrN5NWKy6fu0ggbV8VQIwRieRzy&colorCode=%23257761&currencyCode=lbc&showWalletAddressForm=true&walletAddress=${receiveAddress}`;
+      let url = `https://buy.moonpay.io?apiKey=pk_live_xNFffrN5NWKy6fu0ggbV8VQIwRieRzy&colorCode=%23fa6165&currencyCode=lbc&showWalletAddressForm=true&walletAddress=${receiveAddress}`;
       if (email) {
         url += `&email=${encodeURIComponent(email)}`;
       }
@@ -148,7 +148,7 @@ export default function BuyPage(props: Props) {
                         'Only some countries are eligible at this time. We are working to make this available to everyone.'
                       )}
                       value={country}
-                      onChange={e => setCountry(e.target.value)}
+                      onChange={(e) => setCountry(e.target.value)}
                     >
                       <option value="" disabled defaultValue>
                         {__('Select your country')}

ui/page/channels/view.jsx

@@ -109,7 +109,7 @@ export default function ChannelsPage(props: Props) {
                 subtitle={__("You haven't created a channel yet. All of your beautiful channels will be listed here!")}
                 actions={
                   <div className="section__actions">
-                    <Button button="primary" label={__('New Channel')} navigate={`/$/${PAGES.CHANNEL_NEW}`} />
+                    <Button button="primary" label={__('Create Channel')} navigate={`/$/${PAGES.CHANNEL_NEW}`} />
                   </div>
                 }
               />

ui/page/channelsFollowing/view.jsx

@@ -23,6 +23,7 @@ function ChannelsFollowingPage(props: Props) {
   ) : (
     <Page noFooter fullWidthPage={tileLayout}>
       <ClaimListDiscover
+        hideAdvancedFilter
         tileLayout={tileLayout}
         headerLabel={
           <span>
@@ -31,7 +32,7 @@ function ChannelsFollowingPage(props: Props) {
           </span>
         }
         defaultOrderBy={ORDER_BY_NEW}
-        channelIds={subscribedChannels.map(sub => sub.uri.split('#')[1])}
+        channelIds={subscribedChannels.map((sub) => sub.uri.split('#')[1])}
         meta={
           <Button
             icon={ICONS.SEARCH}

ui/page/channelsFollowingDiscover/view.jsx

@@ -1,13 +1,12 @@
 // @flow
-import * as ICONS from 'constants/icons';
+// import * as ICONS from 'constants/icons';
-import * as PAGES from 'constants/pages';
+// import * as PAGES from 'constants/pages';
+import * as CS from 'constants/claim_search';
 import React from 'react';
 import Page from 'component/page';
-import Button from 'component/button';
+// import Button from 'component/button';
-import ClaimTilesDiscover from 'component/claimTilesDiscover';
 import ClaimListDiscover from 'component/claimListDiscover';
-import * as CS from 'constants/claim_search';
+// import { toCapitalCase } from 'util/string';
-import { toCapitalCase } from 'util/string';
 import { SIMPLE_SITE } from 'config';
 
 const MORE_CHANNELS_ANCHOR = 'MoreChannels';
@@ -19,89 +18,87 @@ type Props = {
   homepageData: any,
 };
 
-type ChannelsFollowingItem = {
-  title: string,
-  link?: string,
-  help?: any,
-  options?: {},
-};
-
 function ChannelsFollowingDiscover(props: Props) {
-  const { followedTags, subscribedChannels, blockedChannels, homepageData } = props;
+  const {
+    //   followedTags,
+    // subscribedChannels,
+    // blockedChannels,
+    homepageData,
+  } = props;
   const { PRIMARY_CONTENT_CHANNEL_IDS } = homepageData;
-  let rowData: Array<ChannelsFollowingItem> = [];
+  //   let rowData: Array<ChannelsFollowingItem> = [];
-  const notChannels = subscribedChannels
+  //   const notChannels = subscribedChannels
-    .map(({ uri }) => uri)
+  //     .map(({ uri }) => uri)
-    .concat(blockedChannels)
+  //     .concat(blockedChannels)
-    .map(uri => uri.split('#')[1]);
+  //     .map(uri => uri.split('#')[1]);
 
-  rowData.push({
+  //   rowData.push({
-    title: 'Top Channels Of All Time',
+  //     title: 'Top Channels Of All Time',
-    link: `/$/${PAGES.DISCOVER}?claim_type=channel&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${CS.FRESH_ALL}`,
+  //     link: `/$/${PAGES.DISCOVER}?claim_type=channel&${CS.ORDER_BY_KEY}=${CS.ORDER_BY_TOP}&${CS.FRESH_KEY}=${CS.FRESH_ALL}`,
-    options: {
+  //     options: {
-      pageSize: 12,
+  //       pageSize: 12,
-      claimType: 'channel',
+  //       claimType: 'channel',
-      orderBy: ['effective_amount'],
+  //       orderBy: ['effective_amount'],
-    },
+  //     },
-  });
+  //   });
 
-  rowData.push({
+  //   rowData.push({
-    title: 'Latest From @lbrycast',
+  //     title: 'Latest From @lbrycast',
-    link: `/@lbrycast:4`,
+  //     link: `/@lbrycast:4`,
-    options: {
+  //     options: {
-      orderBy: ['release_time'],
+  //       orderBy: ['release_time'],
-      pageSize: 8,
+  //       pageSize: 8,
-      channelIds: ['4c29f8b013adea4d5cca1861fb2161d5089613ea'],
+  //       channelIds: ['4c29f8b013adea4d5cca1861fb2161d5089613ea'],
-    },
+  //     },
-  });
+  //   });
 
-  rowData.push({
+  //   rowData.push({
-    title: 'Trending Channels',
+  //     title: 'Trending Channels',
-    link: `/$/${PAGES.DISCOVER}?claim_type=channel`,
+  //     link: `/$/${PAGES.DISCOVER}?claim_type=channel`,
-    options: {
+  //     options: {
-      pageSize: 8,
+  //       pageSize: 8,
-      claimType: 'channel',
+  //       claimType: 'channel',
-      orderBy: ['trending_group', 'trending_mixed'],
+  //       orderBy: ['trending_group', 'trending_mixed'],
-    },
+  //     },
-  });
+  //   });
 
-  if (followedTags.length > 0 && followedTags.length < 5) {
+  //   if (followedTags.length > 0 && followedTags.length < 5) {
-    const followedRows = followedTags.map((tag: Tag) => ({
+  //     const followedRows = followedTags.map((tag: Tag) => ({
-      title: `Trending Channels for #${toCapitalCase(tag.name)}`,
+  //       title: `Trending Channels for #${toCapitalCase(tag.name)}`,
-      link: `/$/${PAGES.DISCOVER}?t=${tag.name}&claim_type=channel`,
+  //       link: `/$/${PAGES.DISCOVER}?t=${tag.name}&claim_type=channel`,
-      options: {
+  //       options: {
-        claimType: 'channel',
+  //         claimType: 'channel',
-        pageSize: 4,
+  //         pageSize: 4,
-        tags: [tag.name],
+  //         tags: [tag.name],
-      },
+  //       },
-    }));
+  //     }));
-    rowData.push(...followedRows);
+  //     rowData.push(...followedRows);
-  }
+  //   }
 
-  if (followedTags.length > 4) {
+  //   if (followedTags.length > 4) {
-    rowData.push({
+  //     rowData.push({
-      title: 'Trending For Your Tags',
+  //       title: 'Trending For Your Tags',
-      link: `/$/${PAGES.TAGS_FOLLOWING}?claim_type=channel`,
+  //       link: `/$/${PAGES.TAGS_FOLLOWING}?claim_type=channel`,
-      options: {
+  //       options: {
-        claimType: 'channel',
+  //         claimType: 'channel',
-        tags: followedTags.map(tag => tag.name),
+  //         tags: followedTags.map(tag => tag.name),
-      },
+  //       },
-    });
+  //     });
-  }
+  //   }
 
-  const rowDataWithGenericOptions = rowData.map(row => {
+  //   const rowDataWithGenericOptions = rowData.map(row => {
-    return {
+  //     return {
-      ...row,
+  //       ...row,
-      options: {
+  //       options: {
-        ...row.options,
+  //         ...row.options,
-        notChannels,
+  //         notChannels,
-      },
+  //       },
-    };
+  //     };
-  });
+  //   });
 
   return (
     <Page>
-      {rowDataWithGenericOptions.map(({ title, link, help, options = {} }) => (
+      {/* {rowDataWithGenericOptions.map(({ title, link, help, options = {} }) => (
         <div key={title} className="claim-grid__wrapper">
           <h1 className="section__actions">
             {link ? (
@@ -120,17 +117,17 @@ function ChannelsFollowingDiscover(props: Props) {
 
           <ClaimTilesDiscover {...options} />
         </div>
-      ))}
+      ))} */}
-      <h1 id={MORE_CHANNELS_ANCHOR} className="claim-grid__title">
+
-        {__('More Channels')}
-      </h1>
-      {/* odysee: claimIds = PRIMARY_CONTENT_CHANNEL_IDS if simplesite CLD */}
       <ClaimListDiscover
         defaultOrderBy={CS.ORDER_BY_TRENDING}
         defaultFreshness={CS.FRESH_ALL}
         claimType={CS.CLAIM_CHANNEL}
         claimIds={SIMPLE_SITE ? PRIMARY_CONTENT_CHANNEL_IDS : undefined}
         scrollAnchor={MORE_CHANNELS_ANCHOR}
+        maxPages={3}
+        hideFilters
+        header={<h1 className="section__title">{__('Moon cheese is an acquired taste')}</h1>}
       />
     </Page>
   );

ui/page/discover/view.jsx

@@ -1,6 +1,7 @@
 // @flow
 import { SHOW_ADS, DOMAIN, SIMPLE_SITE } from 'config';
 import * as ICONS from 'constants/icons';
+import * as CS from 'constants/claim_search';
 import React, { useRef } from 'react';
 import Page from 'component/page';
 import ClaimListDiscover from 'component/claimListDiscover';
@@ -10,18 +11,18 @@ import { useIsMobile } from 'effects/use-screensize';
 import analytics from 'analytics';
 import HiddenNsfw from 'component/common/hidden-nsfw';
 import Icon from 'component/common/icon';
-import * as CS from 'constants/claim_search';
 import Ads from 'web/component/ads';
 import LbcSymbol from 'component/common/lbc-symbol';
 import I18nMessage from 'component/i18nMessage';
+import moment from 'moment';
 
 type Props = {
   location: { search: string },
   followedTags: Array<Tag>,
   repostedUri: string,
   repostedClaim: ?GenericClaim,
-  doToggleTagFollowDesktop: string => void,
+  doToggleTagFollowDesktop: (string) => void,
-  doResolveUri: string => void,
+  doResolveUri: (string) => void,
   isAuthenticated: boolean,
   dynamicRouteProps: RowDataItem,
   tileLayout: boolean,
@@ -87,8 +88,8 @@ function DiscoverPage(props: Props) {
   } else {
     headerLabel = (
       <span>
-        <Icon icon={(dynamicRouteProps && dynamicRouteProps.icon) || ICONS.DISCOVER} size={10} />
+        <Icon icon={(dynamicRouteProps && dynamicRouteProps.icon) || ICONS.WILD_WEST} size={10} />
-        {(dynamicRouteProps && dynamicRouteProps.title) || __('All Content')}
+        {(dynamicRouteProps && dynamicRouteProps.title) || __('Wild West')}
       </span>
     );
   }
@@ -96,9 +97,11 @@ function DiscoverPage(props: Props) {
   return (
     <Page noFooter fullWidthPage={tileLayout}>
       <ClaimListDiscover
-        limitClaimsPerChannel={3}
+        hideAdvancedFilter
+        hideFilters={!dynamicRouteProps}
         header={repostedUri ? <span /> : undefined}
         tileLayout={repostedUri ? false : tileLayout}
+        defaultOrderBy={dynamicRouteProps ? undefined : CS.ORDER_BY_TRENDING}
         claimType={claimType ? [claimType] : undefined}
         headerLabel={headerLabel}
         tags={tags}
@@ -107,9 +110,18 @@ function DiscoverPage(props: Props) {
         injectedItem={
           SHOW_ADS && IS_WEB ? (SIMPLE_SITE ? false : !isAuthenticated && <Ads small type={'video'} />) : false
         }
+        // Assume wild west page if no dynamicRouteProps
+        // Not a very good solution, but just doing it for now
+        // until we are sure this page will stay around
+        releaseTime={!dynamicRouteProps && `>${Math.floor(moment().subtract(1, 'day').startOf('week').unix())}`}
+        feeAmount={!dynamicRouteProps && CS.FEE_AMOUNT_ANY}
         channelIds={
           (dynamicRouteProps && dynamicRouteProps.options && dynamicRouteProps.options.channelIds) || undefined
         }
+        limitClaimsPerChannel={
+          (dynamicRouteProps && dynamicRouteProps.options && dynamicRouteProps.options.limitClaimsPerChannel) ||
+          undefined
+        }
         meta={
           !dynamicRouteProps ? (
             <a

ui/page/file/index.js

@@ -8,6 +8,8 @@ import {
   makeSelectClaimIsNsfw,
   SETTINGS,
   makeSelectTagInClaimOrChannelForUri,
+  makeSelectClaimIsMine,
+  makeSelectClaimForUri,
 } from 'lbry-redux';
 import { makeSelectCostInfoForUri, doFetchCostInfoForUri } from 'lbryinc';
 import { selectShowMatureContent, makeSelectClientSetting } from 'redux/selectors/settings';
@@ -32,14 +34,16 @@ const select = (state, props) => {
     renderMode: makeSelectFileRenderModeForUri(props.uri)(state),
     videoTheaterMode: makeSelectClientSetting(SETTINGS.VIDEO_THEATER_MODE)(state),
     commentsDisabled: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_COMMENTS_TAG)(state),
+    claim: makeSelectClaimForUri(props.uri)(state),
+    claimIsMine: makeSelectClaimIsMine(props.uri)(state),
   };
 };
 
-const perform = dispatch => ({
+const perform = (dispatch) => ({
-  fetchFileInfo: uri => dispatch(doFetchFileInfo(uri)),
+  fetchFileInfo: (uri) => dispatch(doFetchFileInfo(uri)),
-  fetchCostInfo: uri => dispatch(doFetchCostInfoForUri(uri)),
+  fetchCostInfo: (uri) => dispatch(doFetchCostInfoForUri(uri)),
-  setViewed: uri => dispatch(doSetContentHistoryItem(uri)),
+  setViewed: (uri) => dispatch(doSetContentHistoryItem(uri)),
-  setPrimaryUri: uri => dispatch(doSetPrimaryUri(uri)),
+  setPrimaryUri: (uri) => dispatch(doSetPrimaryUri(uri)),
 });
 
 export default withRouter(connect(select, perform)(FilePage));

ui/page/file/view.jsx

@@ -1,4 +1,6 @@
 // @flow
+import { LIVE_STREAM_CHANNEL_CLAIM_ID, LIVE_STREAM_TAG } from 'constants/livestream';
+import * as PAGES from 'constants/pages';
 import * as React from 'react';
 import classnames from 'classnames';
 import Page from 'component/page';
@@ -10,6 +12,9 @@ import FileRenderDownload from 'component/fileRenderDownload';
 import RecommendedContent from 'component/recommendedContent';
 import CommentsList from 'component/commentsList';
 import PostViewer from 'component/postViewer';
+import { Redirect } from 'react-router';
+import Button from 'component/button';
+import I18nMessage from 'component/i18nMessage';
 import Empty from 'component/common/empty';
 
 export const PRIMARY_PLAYER_WRAPPER_CLASS = 'file-page__video-container';
@@ -27,6 +32,8 @@ type Props = {
   linkedComment: any,
   setPrimaryUri: (?string) => void,
   videoTheaterMode: boolean,
+  claim: ?Claim,
+  claimIsMine: boolean,
   commentsDisabled: boolean,
 };
 
@@ -44,11 +51,19 @@ function FilePage(props: Props) {
     linkedComment,
     setPrimaryUri,
     videoTheaterMode,
+    claim,
+    claimIsMine,
     commentsDisabled,
   } = props;
   const cost = costInfo ? costInfo.cost : null;
   const hasFileInfo = fileInfo !== undefined;
   const isMarkdown = renderMode === RENDER_MODES.MARKDOWN;
+  const isLivestream =
+    claim &&
+    claim.signing_channel &&
+    claim.signing_channel.claim_id === LIVE_STREAM_CHANNEL_CLAIM_ID &&
+    claim.value.tags &&
+    claim.value.tags.includes(LIVE_STREAM_TAG);
 
   React.useEffect(() => {
     // always refresh file info when entering file page to see if we have the file
@@ -113,6 +128,10 @@ function FilePage(props: Props) {
     );
   }
 
+  if (!claimIsMine && isLivestream) {
+    return <Redirect to={`/$/${PAGES.LIVESTREAM}`} />;
+  }
+
   if (obscureNsfw && isMature) {
     return (
       <Page>
@@ -129,6 +148,18 @@ function FilePage(props: Props) {
         {!isMarkdown && (
           <div className="file-page__secondary-content">
             <div>
+              {claimIsMine && isLivestream && (
+                <div className="livestream__creator-message">
+                  <h4>{__('Only visible to you')}</h4>
+                  <I18nMessage>
+                    People who view this link will be redirected to your livestream. Make sure to use this for sharing
+                    so your title and thumbnail are displayed properly.
+                  </I18nMessage>
+                  <div className="section__actions">
+                    <Button button="primary" navigate={`/$/${PAGES.LIVESTREAM}`} label={__('View livestream')} />
+                  </div>
+                </div>
+              )}
               {RENDER_MODES.FLOATING_MODES.includes(renderMode) && <FileTitleSection uri={uri} />}
               {commentsDisabled && <Empty text={__('The creator of this content has disabled comments.')} />}
               {!commentsDisabled && <CommentsList uri={uri} linkedComment={linkedComment} />}

ui/page/help/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import { SITE_NAME } from 'config';
 import * as ICONS from 'constants/icons';
 import * as PAGES from 'constants/pages';
 import * as React from 'react';
@@ -129,19 +130,13 @@ class HelpPage extends React.PureComponent<Props, State> {
     return (
       <Page className="card-stack">
         <Card
-          title={__('Read the FAQ')}
+          title={__('Visit the %SITE_NAME% Help Hub', { SITE_NAME })}
-          subtitle={__('Our FAQ answers many common questions.')}
+          subtitle={__('Our support posts answer many common questions.')}
           actions={
             <div className="section__actions">
               <Button
-                href="https://lbry.com/faq/lbry-basics"
+                href="https://odysee.com/@OdyseeHelp:b"
-                label={__('Read the App Basics FAQ')}
+                label={__('View %SITE_NAME% Help Hub', { SITE_NAME })}
-                icon={ICONS.HELP}
-                button="secondary"
-              />
-              <Button
-                href="https://lbry.com/faq"
-                label={__('View all LBRY FAQs')}
                 icon={ICONS.HELP}
                 button="secondary"
               />
@@ -160,7 +155,7 @@ class HelpPage extends React.PureComponent<Props, State> {
           actions={
             <div className="section__actions">
               <Button button="secondary" label={__('Join Our Chat')} icon={ICONS.CHAT} href="https://chat.lbry.com" />
-              <Button button="secondary" label={__('Email Us')} icon={ICONS.WEB} href="mailto:help@lbry.com" />
+              <Button button="secondary" label={__('Email Us')} icon={ICONS.WEB} href="mailto:help@odysee.com" />
             </div>
           }
         />
@@ -210,7 +205,6 @@ class HelpPage extends React.PureComponent<Props, State> {
         />
 
         <WalletBackup />
-        {/* @endif */}
 
         <Card
           title={__('About --[About section in Help Page]--')}
@@ -295,6 +289,7 @@ class HelpPage extends React.PureComponent<Props, State> {
             </div>
           }
         />
+        {/* @endif */}
       </Page>
     );
   }

ui/page/home/view.jsx

@@ -79,9 +79,12 @@ function HomePage(props: Props) {
           </p>
         </div>
       )}
+
+      <h1 className="home__meme">{__("Obviously, You're Not A Golfer.")}</h1>
+
       {rowData.map(({ title, route, link, icon, help, options = {} }, index) => (
         <div key={title} className="claim-grid__wrapper">
-          {title && (
+          {index !== 0 && title && typeof title === 'string' && (
             <h1 className="claim-grid__header">
               <Button navigate={route || link} button="link">
                 {icon && <Icon className="claim-grid__header-icon" sectionIcon icon={icon} size={20} />}
@@ -91,8 +94,8 @@ function HomePage(props: Props) {
             </h1>
           )}
 
-          <ClaimTilesDiscover {...options} />
+          <ClaimTilesDiscover {...options} pin={route === `/$/${PAGES.GENERAL}`} />
-          {link && (
+          {(route || link) && (
             <Button
               className="claim-grid__title--secondary"
               button="link"

ui/page/rewards/view.jsx

@@ -78,8 +78,8 @@ class RewardsPage extends PureComponent<Props> {
                     rewards_faq: <Button button="link" label={__('Rewards FAQ')} href="https://lbry.com/faq/support" />,
                   }}
                 >
-                  Please review the %rewards_faq% for eligibility, and send us an email to help@lbry.com if you continue
+                  Please review the %rewards_faq% for eligibility, and send us an email to help@odysee.com if you
-                  to see this message. You can continue to use LBRY without this feature.
+                  continue to see this message. You can continue to use LBRY without this feature.
                 </I18nMessage>
                 {`${__('Enjoy all the awesome free content in the meantime!')}`}
               </p>
@@ -156,7 +156,7 @@ class RewardsPage extends PureComponent<Props> {
           'card--disabled': isNotEligible,
         })}
       >
-        {rewards.map(reward => (
+        {rewards.map((reward) => (
           <RewardTile key={reward.claim_code} reward={reward} />
         ))}
         {this.renderCustomRewardCode()}

ui/page/search/index.js

@@ -14,17 +14,12 @@ import analytics from 'analytics';
 import SearchPage from './view';
 
 const select = (state, props) => {
-  const showMature = makeSelectClientSetting(SETTINGS.SHOW_MATURE)(state);
   const urlParams = new URLSearchParams(props.location.search);
   let urlQuery = urlParams.get('q') || null;
   if (urlQuery) {
     urlQuery = urlQuery.replace(/^lbry:\/\//i, '').replace(/\//, ' ');
   }
-
+  const query = makeSelectQueryWithOptions(urlQuery, { nsfw: false, isBackgroundSearch: false })(state);
-  const query = makeSelectQueryWithOptions(
-    urlQuery,
-    showMature === false ? { nsfw: false, isBackgroundSearch: false } : { isBackgroundSearch: false }
-  )(state);
   const uris = makeSelectSearchUris(query)(state);
 
   return {
@@ -36,9 +31,9 @@ const select = (state, props) => {
   };
 };
 
-const perform = dispatch => ({
+const perform = (dispatch) => ({
   search: (query, options) => dispatch(doSearch(query, options)),
-  onFeedbackPositive: query => {
+  onFeedbackPositive: (query) => {
     analytics.apiSearchFeedback(query, 1);
     dispatch(
       doToast({
@@ -46,7 +41,7 @@ const perform = dispatch => ({
       })
     );
   },
-  onFeedbackNegative: query => {
+  onFeedbackNegative: (query) => {
     analytics.apiSearchFeedback(query, 0);
     dispatch(
       doToast({

ui/page/search/view.jsx

@@ -24,8 +24,8 @@ type Props = {
   isSearching: boolean,
   location: UrlLocation,
   uris: Array<string>,
-  onFeedbackNegative: string => void,
+  onFeedbackNegative: (string) => void,
-  onFeedbackPositive: string => void,
+  onFeedbackPositive: (string) => void,
   showNsfw: boolean,
   isAuthenticated: boolean,
 };
@@ -38,7 +38,7 @@ export default function SearchPage(props: Props) {
     onFeedbackNegative,
     location,
     isSearching,
-    showNsfw,
+    //  showNsfw,
     isAuthenticated,
     searchOptions,
   } = props;
@@ -47,12 +47,9 @@ export default function SearchPage(props: Props) {
   const urlQuery = urlParams.get('q') || '';
   const additionalOptions: AdditionalOptions = { isBackgroundSearch: false };
 
-  additionalOptions['nsfw'] = showNsfw;
+  additionalOptions['nsfw'] = false;
 
-  const modifiedUrlQuery = urlQuery
+  const modifiedUrlQuery = urlQuery.trim().replace(/\s+/g, '').replace(/:/g, '#');
-    .trim()
-    .replace(/\s+/g, '')
-    .replace(/:/g, '#');
   const uriFromQuery = `lbry://${modifiedUrlQuery}`;
 
   let streamName;
@@ -72,7 +69,7 @@ export default function SearchPage(props: Props) {
     try {
       const dummyUrlForClaimId = `x#${urlQuery}`;
       ({ claimId } = parseURI(dummyUrlForClaimId));
-      Lbry.claim_search({ claim_id: claimId }).then(res => {
+      Lbry.claim_search({ claim_id: claimId }).then((res) => {
         if (res.items && res.items.length) {
           const claim = res.items[0];
           const url = formatLbryUrlForWeb(claim.canonical_url);
@@ -105,21 +102,23 @@ export default function SearchPage(props: Props) {
                 SHOW_ADS && IS_WEB ? (SIMPLE_SITE ? false : !isAuthenticated && <Ads small type={'video'} />) : false
               }
               headerAltControls={
-                <>
+                !SIMPLE_SITE && (
-                  <span>{__('Find what you were looking for?')}</span>
+                  <>
-                  <Button
+                    <span>{__('Find what you were looking for?')}</span>
-                    button="alt"
+                    <Button
-                    description={__('Yes')}
+                      button="alt"
-                    onClick={() => onFeedbackPositive(urlQuery)}
+                      description={__('Yes')}
-                    icon={ICONS.YES}
+                      onClick={() => onFeedbackPositive(urlQuery)}
-                  />
+                      icon={ICONS.YES}
-                  <Button
+                    />
-                    button="alt"
+                    <Button
-                    description={__('No')}
+                      button="alt"
-                    onClick={() => onFeedbackNegative(urlQuery)}
+                      description={__('No')}
-                    icon={ICONS.NO}
+                      onClick={() => onFeedbackNegative(urlQuery)}
-                  />
+                      icon={ICONS.NO}
-                </>
+                    />
+                  </>
+                )
               }
             />
             {isSearching && new Array(5).fill(1).map((x, i) => <ClaimPreview key={i} placeholder="loading" />)}

ui/page/settings/view.jsx

@@ -1,6 +1,6 @@
 // @flow
 import * as PAGES from 'constants/pages';
-import * as MODALS from 'constants/modal_types';
+// import * as MODALS from 'constants/modal_types';
 import * as ICONS from 'constants/icons';
 import * as React from 'react';
 import { SETTINGS } from 'lbry-redux';
@@ -17,7 +17,7 @@ import classnames from 'classnames';
 import { getPasswordFromCookie } from 'util/saved-passwords';
 // $FlowFixMe
 import homepages from 'homepages';
-import { Lbryio } from 'lbryinc';
+// import { Lbryio } from 'lbryinc';
 import Yrbl from 'component/yrbl';
 
 type Price = {
@@ -27,10 +27,10 @@ type Price = {
 
 type SetDaemonSettingArg = boolean | string | number;
 
-type DarkModeTimes = {
+// type DarkModeTimes = {
-  from: { hour: string, min: string, formattedTime: string },
+//   from: { hour: string, min: string, formattedTime: string },
-  to: { hour: string, min: string, formattedTime: string },
+//   to: { hour: string, min: string, formattedTime: string },
-};
+// };
 
 type OptionTimes = {
   fromTo: string,
@@ -64,7 +64,7 @@ type Props = {
   floatingPlayer: boolean,
   hideReposts: ?boolean,
   clearPlayingUri: () => void,
-  darkModeTimes: DarkModeTimes,
+  //   darkModeTimes: DarkModeTimes,
   setDarkTime: (string, {}) => void,
   openModal: (string) => void,
   language?: string,
@@ -160,11 +160,11 @@ class SettingsPage extends React.PureComponent<Props, State> {
     const {
       daemonSettings,
       allowAnalytics,
-      showNsfw,
+      //   showNsfw,
       isAuthenticated,
       currentTheme,
       themes,
-      automaticDarkModeEnabled,
+      //   automaticDarkModeEnabled,
       autoplay,
       walletEncrypted,
       // autoDownload,
@@ -172,16 +172,16 @@ class SettingsPage extends React.PureComponent<Props, State> {
       setClientSetting,
       toggle3PAnalytics,
       floatingPlayer,
-      hideReposts,
+      //   hideReposts,
       clearPlayingUri,
-      darkModeTimes,
+      //   darkModeTimes,
       clearCache,
-      openModal,
+      //   openModal,
     } = this.props;
     const { storedPassword } = this.state;
     const noDaemonSettings = !daemonSettings || Object.keys(daemonSettings).length === 0;
-    const startHours = ['18', '19', '20', '21'];
+    // const startHours = ['18', '19', '20', '21'];
-    const endHours = ['5', '6', '7', '8'];
+    // const endHours = ['5', '6', '7', '8'];
 
     return (
       <Page
@@ -258,7 +258,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                       label={__('Theme')}
                       onChange={this.onThemeChange}
                       value={currentTheme}
-                      disabled={automaticDarkModeEnabled}
+                      //   disabled={automaticDarkModeEnabled}
                     >
                       {themes.map((theme) => (
                         <option key={theme} value={theme}>
@@ -267,7 +267,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                       ))}
                     </FormField>
                   </fieldset-section>
-                  <fieldset-section>
+                  {/* <fieldset-section>
                     <FormField
                       type="checkbox"
                       name="automatic_dark_mode"
@@ -305,7 +305,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                         </FormField>
                       </fieldset-group>
                     )}
-                  </fieldset-section>
+                  </fieldset-section> */}
                 </React.Fragment>
               }
             />
@@ -337,7 +337,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                     )}
                   />
 
-                  <FormField
+                  {/* <FormField
                     type="checkbox"
                     name="hide_reposts"
                     onChange={(e) => {
@@ -351,7 +351,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                     checked={hideReposts}
                     label={__('Hide reposts')}
                     helper={__('You will not see reposts by people you follow or receive email notifying about them.')}
-                  />
+                  /> */}
 
                   {/* <FormField
                     type="checkbox"
@@ -362,7 +362,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                     helper={__('Anonymous content is published without a channel.')}
                   /> */}
 
-                  <FormField
+                  {/* <FormField
                     type="checkbox"
                     name="show_nsfw"
                     onChange={() =>
@@ -375,7 +375,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
                     helper={__(
                       'Mature content may include nudity, intense sexuality, profanity, or other adult content. By displaying mature content, you are affirming you are of legal age to view mature content in your country or jurisdiction.  '
                     )}
-                  />
+                  /> */}
                 </React.Fragment>
               }
             />

ui/page/show/index.js

@@ -1,3 +1,4 @@
+import * as PAGES from 'constants/pages';
 import { DOMAIN } from 'config';
 import { connect } from 'react-redux';
 import { PAGE_SIZE } from 'constants/claim';
@@ -11,7 +12,10 @@ import {
   makeSelectClaimIsMine,
   makeSelectClaimIsPending,
   makeSelectClaimHasSource,
+  doClearPublish,
+  doPrepareEdit,
 } from 'lbry-redux';
+import { push } from 'connected-react-router';
 import { makeSelectChannelInSubscriptions } from 'redux/selectors/subscriptions';
 import { selectBlackListedOutpoints } from 'lbryinc';
 import ShowPage from './view';
@@ -67,6 +71,11 @@ const select = (state, props) => {
 
 const perform = (dispatch) => ({
   resolveUri: (uri) => dispatch(doResolveUri(uri)),
+  beginPublish: (name) => {
+    dispatch(doClearPublish());
+    dispatch(doPrepareEdit({ name }));
+    dispatch(push(`/$/${PAGES.PUBLISH}`));
+  },
 });
 
 export default connect(select, perform)(ShowPage);

ui/page/show/view.jsx

@@ -10,7 +10,9 @@ import Page from 'component/page';
 import Button from 'component/button';
 import Card from 'component/common/card';
 import AbandonedChannelPreview from 'component/abandonedChannelPreview';
+import Yrbl from 'component/yrbl';
 import { formatLbryUrlForWeb } from 'util/url';
+import { parseURI } from 'lbry-redux';
 
 type Props = {
   isResolvingUri: boolean,
@@ -27,6 +29,8 @@ type Props = {
   claimIsMine: boolean,
   claimIsPending: boolean,
   isLivestream: boolean,
+  claimIsMine: Boolean,
+  beginPublish: (string) => void,
 };
 
 function ShowPage(props: Props) {
@@ -41,6 +45,7 @@ function ShowPage(props: Props) {
     isSubscribed,
     claimIsPending,
     isLivestream,
+    beginPublish,
   } = props;
 
   const signingChannel = claim && claim.signing_channel;
@@ -48,6 +53,7 @@ function ShowPage(props: Props) {
   const claimExists = claim !== null && claim !== undefined;
   const haventFetchedYet = claim === undefined;
   const isMine = claim && claim.is_my_output;
+  const { contentName } = parseURI(uri);
 
   useEffect(() => {
     // @if TARGET='web'
@@ -84,11 +90,20 @@ function ShowPage(props: Props) {
       <Page>
         {(claim === undefined || isResolvingUri) && (
           <div className="main--empty">
-            <Spinner />
+            <Spinner delayed />
           </div>
         )}
         {!isResolvingUri && !isSubscribed && (
-          <span className="empty">{__("There's nothing available at this location.")}</span>
+          <div className="main--empty">
+            <Yrbl
+              title={__('No Content Found')}
+              subtitle={
+                <div className="section__actions">
+                  <Button button="primary" label={__('Publish Something')} onClick={() => beginPublish(contentName)} />
+                </div>
+              }
+            />
+          </div>
         )}
         {!isResolvingUri && isSubscribed && claim === null && <AbandonedChannelPreview uri={uri} type={'large'} />}
       </Page>

ui/page/top/view.jsx

@@ -5,14 +5,14 @@ import Page from 'component/page';
 import ClaimListDiscover from 'component/claimListDiscover';
 import ClaimEffectiveAmount from 'component/claimEffectiveAmount';
 import SearchTopClaim from 'component/searchTopClaim';
-import { ORDER_BY_TOP, FRESH_ALL } from 'constants/claim_search';
+import * as CS from 'constants/claim_search';
 import Button from 'component/button';
 import I18nMessage from 'component/i18nMessage';
 import * as PAGES from 'constants/pages';
 
 type Props = {
   name: string,
-  beginPublish: string => void,
+  beginPublish: (string) => void,
 };
 
 function TopPage(props: Props) {
@@ -25,8 +25,9 @@ function TopPage(props: Props) {
       <SearchTopClaim query={name} hideLink setChannelActive={setChannelActive} />
       <ClaimListDiscover
         name={channelActive ? `@${queryName}` : queryName}
-        defaultFreshness={FRESH_ALL}
+        defaultFreshness={CS.FRESH_ALL}
-        defaultOrderBy={ORDER_BY_TOP}
+        defaultOrderBy={CS.ORDER_BY_TOP}
+        streamType={CS.CONTENT_ALL}
         meta={
           <div className="search__top-links">
             <I18nMessage
@@ -46,7 +47,7 @@ function TopPage(props: Props) {
           </div>
         }
         includeSupportAction
-        renderProperties={claim => (
+        renderProperties={(claim) => (
           <span className="claim-preview__custom-properties">
             {claim.meta.is_controlling && <span className="help--inline">{__('Currently winning')}</span>}
             <ClaimEffectiveAmount uri={claim.repost_url || claim.canonical_url} />

ui/redux/actions/comments.js

@@ -2,6 +2,7 @@
 import * as ACTIONS from 'constants/action_types';
 import * as REACTION_TYPES from 'constants/reactions';
 import { Lbry, parseURI, buildURI, selectClaimsByUri, selectMyChannelClaims } from 'lbry-redux';
+// import { BANNED_LIVESTREAM_WORDS } from 'constants/comment';
 import { doToast, doSeeNotifications } from 'redux/actions/notifications';
 import {
   makeSelectCommentIdsForUri,
@@ -216,6 +217,27 @@ export function doCommentCreate(
       type: ACTIONS.COMMENT_CREATE_STARTED,
     });
 
+    // if (livestream) {
+    //   const strippedCommentText = comment.trim().toLowerCase().replace(/\s/g, '');
+    //   for (var i = 0; i < BANNED_LIVESTREAM_WORDS.length; i++) {
+    //     const bannedWord = BANNED_LIVESTREAM_WORDS[i];
+    //     if (strippedCommentText.includes(bannedWord)) {
+    //       dispatch({
+    //         type: ACTIONS.COMMENT_CREATE_FAILED,
+    //       });
+    //
+    //       dispatch(
+    //         doToast({
+    //           message: 'Unable to create comment.',
+    //           isError: true,
+    //         })
+    //       );
+    //
+    //       return;
+    //     }
+    //   }
+    // }
+
     if (parent_id) {
       const notification = makeSelectNotificationForCommentId(parent_id)(state);
       if (notification && !notification.is_seen) {

ui/redux/reducers/search.js

@@ -6,13 +6,13 @@ import { SEARCH_OPTIONS } from 'constants/search';
 const defaultState: SearchState = {
   // $FlowFixMe
   options: {
-    [SEARCH_OPTIONS.RESULT_COUNT]: 30,
+    [SEARCH_OPTIONS.RESULT_COUNT]: 50,
-    [SEARCH_OPTIONS.CLAIM_TYPE]: SEARCH_OPTIONS.INCLUDE_FILES_AND_CHANNELS,
+    [SEARCH_OPTIONS.CLAIM_TYPE]: 'file,channel',
-    [SEARCH_OPTIONS.MEDIA_AUDIO]: true,
+    [SEARCH_OPTIONS.MEDIA_AUDIO]: false,
     [SEARCH_OPTIONS.MEDIA_VIDEO]: true,
-    [SEARCH_OPTIONS.MEDIA_TEXT]: true,
+    [SEARCH_OPTIONS.MEDIA_TEXT]: false,
-    [SEARCH_OPTIONS.MEDIA_IMAGE]: true,
+    [SEARCH_OPTIONS.MEDIA_IMAGE]: false,
-    [SEARCH_OPTIONS.MEDIA_APPLICATION]: true,
+    [SEARCH_OPTIONS.MEDIA_APPLICATION]: false,
   },
   urisByQuery: {},
   searching: false,

ui/redux/reducers/settings.js

@@ -8,7 +8,7 @@ import { UNSYNCED_SETTINGS } from 'config';
 const { CLIENT_SYNC_KEYS } = SHARED_PREFERENCES;
 const settingsToIgnore = (UNSYNCED_SETTINGS && UNSYNCED_SETTINGS.trim().split(' ')) || [];
 const clientSyncKeys = settingsToIgnore.length
-  ? CLIENT_SYNC_KEYS.filter(k => !settingsToIgnore.includes(k))
+  ? CLIENT_SYNC_KEYS.filter((k) => !settingsToIgnore.includes(k))
   : CLIENT_SYNC_KEYS;
 
 const reducers = {};
@@ -69,7 +69,7 @@ const defaultState = {
     [SETTINGS.AUTOPLAY_NEXT]: true,
     [SETTINGS.FLOATING_PLAYER]: true,
     [SETTINGS.AUTO_DOWNLOAD]: true,
-    [SETTINGS.HIDE_REPOSTS]: false,
+    [SETTINGS.HIDE_REPOSTS]: true,
 
     // OS
     [SETTINGS.AUTO_LAUNCH]: true,
@@ -88,12 +88,12 @@ reducers[ACTIONS.REHYDRATE] = (state, action) => {
   return Object.assign({}, state, { clientSettings });
 };
 
-reducers[ACTIONS.FINDING_FFMPEG_STARTED] = state =>
+reducers[ACTIONS.FINDING_FFMPEG_STARTED] = (state) =>
   Object.assign({}, state, {
     findingFFmpeg: true,
   });
 
-reducers[ACTIONS.FINDING_FFMPEG_COMPLETED] = state =>
+reducers[ACTIONS.FINDING_FFMPEG_COMPLETED] = (state) =>
   Object.assign({}, state, {
     findingFFmpeg: false,
   });
@@ -119,7 +119,7 @@ reducers[ACTIONS.CLIENT_SETTING_CHANGED] = (state, action) => {
   });
 };
 
-reducers[ACTIONS.UPDATE_IS_NIGHT] = state => {
+reducers[ACTIONS.UPDATE_IS_NIGHT] = (state) => {
   const { from, to } = state.clientSettings[SETTINGS.DARK_MODE_TIMES];
   const momentNow = moment();
   const startNightMoment = moment(from.formattedTime, 'HH:mm');
@@ -154,7 +154,7 @@ reducers[LBRY_REDUX_ACTIONS.SHARED_PREFERENCE_SET] = (state, action) => {
   });
 };
 
-reducers[ACTIONS.SYNC_CLIENT_SETTINGS] = state => {
+reducers[ACTIONS.SYNC_CLIENT_SETTINGS] = (state) => {
   const { clientSettings } = state;
   const sharedPreferences = Object.assign({}, state.sharedPreferences);
   const selectedClientSettings = getSubsetFromKeysArray(clientSettings, clientSyncKeys);

ui/scss/component/_ads.scss

@@ -83,3 +83,51 @@
 .ads__claim-text--small {
   font-size: var(--font-small);
 }
+
+.ads__video-nudge,
+.ads__video-notify {
+  position: absolute;
+  z-index: 3;
+}
+
+.ads__video-nudge {
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background-color: var(--color-primary);
+  color: var(--color-white);
+  font-weight: bold;
+  padding: var(--spacing-xs);
+}
+
+.ads__video-notify {
+  display: flex;
+  align-items: center;
+  right: 0;
+  top: 0;
+  background-color: black;
+  border-bottom-left-radius: var(--border-radius);
+  color: var(--color-white);
+  font-size: var(--font-small);
+  padding: var(--spacing-xs);
+}
+
+.ads__video-link.button--secondary {
+  font-size: var(--font-small);
+  padding: var(--spacing-xs);
+  height: 1.5rem;
+}
+
+.ads__video-close {
+  margin-left: var(--spacing-s);
+  border-radius: var(--border-radius);
+
+  .icon {
+    stroke: var(--color-white);
+
+    &:hover {
+      stroke: var(--color-black);
+      background-color: var(--color-white);
+    }
+  }
+}

ui/scss/component/_button.scss

@@ -34,7 +34,14 @@
 
 .button--primary {
   background-color: var(--color-button-primary-bg);
-  color: var(--color-button-primary-text);
+
+  .button__label {
+    color: var(--color-button-primary-text);
+  }
+
+  .icon {
+    stroke: var(--color-button-primary-text);
+  }
 
   &:hover {
     color: var(--color-button-primary-hover-text);
@@ -54,7 +61,14 @@
 .button--secondary {
   background-color: var(--color-button-secondary-bg);
   border: 1px solid var(--color-button-secondary-border);
-  color: var(--color-button-secondary-text);
+
+  .button__label {
+    color: var(--color-button-secondary-text);
+  }
+
+  .icon {
+    stroke: var(--color-button-secondary-text);
+  }
 
   &:hover {
     background-color: var(--color-button-secondary-bg-hover);
@@ -223,6 +237,238 @@
   }
 }
 
+.button--fire {
+  color: var(--color-fire);
+  position: relative;
+
+  path {
+    stroke: var(--color-fire-outside);
+  }
+}
+
+.button__fire-particle {
+  position: absolute;
+  top: 60%;
+  left: 20%;
+  width: 2px;
+  height: 2px;
+  background-color: #ef5a00;
+  border-radius: 50%;
+  filter: drop-shadow(0 0 10px #d43322);
+  animation-iteration-count: 2;
+  animation-fill-mode: both;
+}
+
+.button__fire-glow {
+  width: 1px;
+  height: 1px;
+  left: var(--spacing-s);
+  bottom: var(--spacing-m);
+  position: absolute;
+  box-shadow: 4px 0px 10px 10px var(--color-glow);
+  animation: glowDecay 2.5s ease-out;
+  opacity: 0;
+}
+
+.button__fire-particle1 {
+  @extend .button__fire-particle;
+  right: 10%;
+  top: 40%;
+  animation: particleUp 1.5s ease-out 0;
+  animation-iteration-count: 2;
+  animation-fill-mode: both;
+}
+.button__fire-particle2 {
+  @extend .button__fire-particle;
+  animation: particleUp2 2s ease-out 0;
+  animation-iteration-count: 2;
+  animation-fill-mode: both;
+}
+.button__fire-particle3 {
+  @extend .button__fire-particle;
+  animation: particleUp3 2.2s ease-out 0;
+  animation-iteration-count: 2;
+  animation-fill-mode: both;
+}
+.button__fire-particle4 {
+  @extend .button__fire-particle1;
+  animation-delay: 0.5s;
+}
+.button__fire-particle5 {
+  @extend .button__fire-particle2;
+  animation-delay: 0.75s;
+}
+.button__fire-particle6 {
+  @extend .button__fire-particle3;
+  animation-delay: 0.25s;
+}
+
+@keyframes glowDecay {
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+}
+
+@keyframes particleUp {
+  0% {
+    opacity: 0;
+    left: 0;
+  }
+  20% {
+    opacity: 1;
+    right: 10%;
+  }
+
+  50% {
+    right: 20%;
+  }
+
+  50% {
+    left: 10%;
+  }
+  80% {
+    opacity: 1;
+    right: 40%;
+  }
+  100% {
+    opacity: 0;
+    top: -50%;
+    transform: scale(0.5);
+  }
+}
+
+@keyframes particleUp2 {
+  0% {
+    opacity: 0;
+    right: 0;
+  }
+  20% {
+    opacity: 1;
+    left: 10%;
+  }
+
+  50% {
+    left: 20%;
+  }
+
+  50% {
+    right: 10%;
+  }
+  80% {
+    opacity: 1;
+    left: 40%;
+  }
+  100% {
+    opacity: 0;
+    top: -50%;
+    transform: scale(0.5);
+  }
+}
+
+@keyframes particleUp3 {
+  0% {
+    opacity: 0;
+    left: 30%;
+  }
+  20% {
+    opacity: 1;
+    left: 60%;
+  }
+
+  40% {
+    left: 50%;
+  }
+
+  80% {
+    opacity: 1;
+    right: 80%;
+  }
+  100% {
+    opacity: 0;
+    top: -50%;
+    transform: scale(0.5);
+  }
+}
+
+.button--slime {
+  color: var(--color-slime);
+}
+
+.button__slime-drop {
+  position: absolute;
+  top: 60%;
+  left: 15%;
+  width: 5px;
+  height: 5px;
+  background-color: #81c554;
+  border-radius: 50%;
+  filter: drop-shadow(0 0 10px #d43322);
+  animation-iteration-count: 2;
+  animation-fill-mode: both;
+}
+
+.button__slime-drop1 {
+  @extend .button__slime-drop;
+  top: 40%;
+  animation: dropDown 1.5s ease-out 0;
+  animation-iteration-count: 1;
+  animation-fill-mode: both;
+}
+
+.button__slime-drop2 {
+  @extend .button__slime-drop;
+  left: 35%;
+  top: 40%;
+  animation: dropDown2 1.5s ease-out 0;
+  animation-iteration-count: 1;
+  animation-fill-mode: both;
+}
+
+.button__slime-stain {
+  width: 1px;
+  height: 1px;
+  left: var(--spacing-s);
+  bottom: var(--spacing-m);
+  position: absolute;
+  box-shadow: 4px 0px 10px 10px var(--color-slime);
+  animation: glowDecay 2.5s ease-out;
+  opacity: 0;
+}
+
+@keyframes dropDown {
+  0% {
+    opacity: 1;
+    top: 50%;
+  }
+  70% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+    top: 80%;
+    transform: scale(0.5, 4);
+  }
+}
+
+@keyframes dropDown2 {
+  0% {
+    opacity: 1;
+    top: 50%;
+  }
+  60% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+    top: 80%;
+    transform: scale(0.5, 6);
+  }
+}
+
 .button--disabled {
   opacity: 0.5;
 }
@@ -303,8 +549,8 @@ svg + .button__label {
 }
 
 .button-toggle--active {
-  color: var(--color-primary);
+  color: var(--color-button-toggle-text);
-  background-color: var(--color-primary-alt);
+  background-color: var(--color-button-toggle-bg);
 
   svg {
     opacity: 1;
@@ -313,7 +559,7 @@ svg + .button__label {
   &:hover {
     cursor: default;
     text-decoration: none;
-    background-color: var(--color-primary-alt);
+    background-color: var(--color-button-toggle-bg-hover);
   }
 }
 
@@ -348,6 +594,12 @@ svg + .button__label {
     border-top-left-radius: 0;
     border-bottom-left-radius: 0;
   }
+
+  .button--file-action {
+    &:first-child {
+      margin-right: var(--spacing-s);
+    }
+  }
 }
 
 .button-toggle-group-action {

ui/scss/component/_card.scss

@@ -17,7 +17,7 @@
 
 .card--section {
   position: relative;
-  padding: var(--spacing-l);
+  padding: var(--spacing-m);
 }
 
 .card--reward-total {
@@ -82,7 +82,7 @@
 
 .card__title-section {
   @extend .section__flex;
-  padding: var(--spacing-m) var(--spacing-l);
+  padding: var(--spacing-s) var(--spacing-m);
 
   @media (max-width: $breakpoint-small) {
     padding: 0;
@@ -90,7 +90,7 @@
 }
 
 .card__title-section--body-list {
-  padding: var(--spacing-m);
+  padding: var(--spacing-s);
 
   @media (max-width: $breakpoint-small) {
     padding: 0;
@@ -98,7 +98,11 @@
 }
 
 .card__title-section--small {
-  padding: var(--spacing-s) var(--spacing-m);
+  padding: 0;
+
+  @media (min-width: $breakpoint-small) {
+    padding: var(--spacing-s) var(--spacing-m);
+  }
 }
 
 .card__actions--inline {
@@ -175,7 +179,7 @@
 .card__title {
   display: block;
   align-items: center;
-  font-size: var(--font-title);
+  font-size: var(--font-large);
   font-weight: var(--font-weight-light);
 
   & > *:not(:last-child) {
@@ -200,8 +204,7 @@
 
 .card__title-actions {
   align-self: flex-start;
-  padding: var(--spacing-m);
+  padding: var(--spacing-s);
-  padding-right: var(--spacing-l);
 
   @media (max-width: $breakpoint-small) {
     padding: 0;
@@ -258,7 +261,7 @@
 }
 
 .card__body {
-  padding: var(--spacing-l);
+  padding: var(--spacing-m);
 
   &:not(.card__body--no-title) {
     padding-top: 0;
@@ -275,9 +278,9 @@
 }
 
 .card__main-actions {
-  padding: var(--spacing-l);
+  padding: var(--spacing-m);
   padding-bottom: 0;
-  margin-bottom: var(--spacing-l);
+  margin-bottom: var(--spacing-m);
   border-top: 1px solid var(--color-border);
 
   &:only-child {
@@ -286,7 +289,7 @@
 }
 
 .card__body-actions {
-  padding: var(--spacing-l);
+  padding: var(--spacing-m);
 
   @media (max-width: $breakpoint-small) {
     padding: var(--spacing-s);
@@ -339,3 +342,9 @@
     margin-right: var(--spacing-m);
   }
 }
+
+.card__bottom-actions {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}

ui/scss/component/_channel.scss

@@ -103,6 +103,7 @@ $metadata-z-index: 1;
 .channel-thumbnail__custom {
   width: 100%;
   object-fit: cover;
+  font-size: 1px; // To hide the alt text on firefox;
 }
 
 .channel-thumbnail__default {
@@ -274,7 +275,8 @@ $metadata-z-index: 1;
 
     &[data-selected] {
       background: transparent;
-      .channel__list-item {
+      .channel__list-item,
+      .channel-staked__wrapper {
         background-color: var(--color-card-background-highlighted);
       }
     }
@@ -308,6 +310,7 @@ $metadata-z-index: 1;
   background-color: var(--color-card-background);
   padding: var(--spacing-s);
   border-bottom: 1px solid var(--color-border);
+  overflow: hidden;
 
   .channel-thumbnail {
     height: 2rem;
@@ -356,16 +359,12 @@ $metadata-z-index: 1;
 .channel-staked__tooltip {
   display: flex;
   align-items: center;
+  line-height: 1rem;
 }
 
 .channel-staked__tooltip-text {
   margin-left: var(--spacing-xs);
   font-size: var(--font-xsmall);
-
-  .icon--LBC {
-    opacity: 0.7;
-    margin-top: -2px;
-  }
 }
 
 .channel-staked__wrapper {

ui/scss/component/_claim-list.scss

@@ -30,9 +30,11 @@
   transform: translateY(-130%);
   font-size: var(--font-xsmall);
   color: var(--color-text-subtitle);
+  overflow: visible;
 
   .icon {
     margin-right: var(--spacing-xs);
+    stroke: var(--color-text-subtitle);
   }
 
   @media (max-width: $breakpoint-small) {
@@ -179,6 +181,20 @@
       @include handleChannelGif(5rem);
     }
   }
+
+  .claim-preview__text {
+    height: 7.5rem;
+  }
+
+  @media (max-width: $breakpoint-small) {
+    .channel-thumbnail {
+      @include handleChannelGif(6rem);
+    }
+
+    .claim-preview__text {
+      height: 3.5rem;
+    }
+  }
 }
 
 .claim-preview--small {
@@ -202,12 +218,15 @@
 
 .claim-preview--inline {
   .channel-thumbnail {
-    @include handleChannelGif(var(--channel-thumbnail-width--small));
+    @include handleChannelGif(3rem);
+
+    @media (min-width: $breakpoint-small) {
+      @include handleChannelGif(var(--channel-thumbnail-width--small));
+    }
   }
 
   .claim-preview__actions {
     align-self: flex-end;
-    margin-top: 0;
     margin-bottom: auto;
     justify-content: flex-end;
     width: auto;
@@ -218,11 +237,16 @@
     flex-direction: row;
     justify-content: space-between;
     flex-wrap: wrap;
+    align-items: center;
   }
 
   @media (max-width: $breakpoint-xsmall) {
     .claim-preview__actions {
-      align-self: flex-start;
+      .claim-preview__primary-actions {
+        .button {
+          margin-top: 0;
+        }
+      }
     }
   }
 }
@@ -255,10 +279,6 @@
   display: flex;
   flex-direction: column;
   flex: 1;
-
-  @media (max-width: $breakpoint-small) {
-    margin-bottom: var(--spacing-s);
-  }
 }
 
 .claim-preview-info {
@@ -276,7 +296,6 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
-  margin-top: auto;
   width: 100%;
 
   @media (min-width: $breakpoint-small) {
@@ -286,7 +305,14 @@
 
 .claim-preview__primary-actions {
   @extend .section__actions;
-  margin-top: 0;
+  margin-right: 0;
+  margin-top: var(--spacing-s);
+
+  &:first-child {
+    .button {
+      margin-top: var(--spacing-s);
+    }
+  }
 }
 
 .claim-preview__actions--header {
@@ -386,6 +412,16 @@
   font-size: var(--font-large);
 }
 
+.claim-grid__title--first {
+  text-align: center;
+  width: 100%;
+  margin-bottom: var(--spacing-l);
+
+  .no-evil {
+    font-size: var(--font-heading);
+  }
+}
+
 .claim-grid__title--secondary {
   margin-left: auto;
 }

ui/scss/component/_comments.scss

@@ -33,6 +33,10 @@ $thumbnailWidthSmall: 1rem;
   position: relative;
 }
 
+.comment__create--bottom {
+  padding-bottom: 0;
+}
+
 .comment {
   display: flex;
   flex-direction: column;
@@ -60,6 +64,12 @@ $thumbnailWidthSmall: 1rem;
         margin-left: 0;
       }
     }
+
+    .channel-staked__indicator {
+      @media (max-width: $breakpoint-small) {
+        margin-left: 0.1rem;
+      }
+    }
   }
 }
 
@@ -281,6 +291,10 @@ $thumbnailWidthSmall: 1rem;
   padding-bottom: var(--spacing-xs);
   font-size: var(--font-small);
   border-bottom: 1px solid var(--color-border);
+
+  &:not(:last-child) {
+    margin-bottom: var(--spacing-xs);
+  }
 }
 
 .comment__menu-help {

ui/scss/component/_file-properties.scss

@@ -25,6 +25,7 @@
   font-size: var(--font-xsmall);
   line-height: 1.2;
   margin-left: 0;
+  margin-top: auto;
   position: relative;
 
   .tag {

ui/scss/component/_file-render.scss

@@ -5,11 +5,11 @@
   .card + .file-render,
   .card + .file-page__video-container,
   .card + .content__cover {
-    margin-top: var(--spacing-l);
+    margin-top: var(--spacing-m);
   }
 
   .card + .file-render {
-    margin-top: var(--spacing-l);
+    margin-top: var(--spacing-m);
   }
 
   .file-page__md {
@@ -203,13 +203,28 @@
 }
 
 .file-viewer__overlay-logo {
-  color: var(--color-white);
+  height: 3.5rem;
-  font-weight: bold;
+  width: 12rem;
+  display: flex;
+  align-items: center;
 
-  .icon {
+  &:hover {
-    height: 30px;
+    filter: drop-shadow(1px 2px 10px var(--color-gray-3));
-    stroke-width: 5px;
   }
+
+  @media (max-width: $breakpoint-small) {
+    margin-right: var(--spacing-m);
+    width: 2.5rem;
+
+    .button__label {
+      display: none;
+    }
+  }
+}
+
+.file-viewer__overlay-logo--videoend {
+  height: 3.5rem;
+  width: 12rem;
 }
 
 .file-viewer--is-playing:not(:hover) .file-viewer__embedded-header {
@@ -219,11 +234,15 @@
 .file-viewer__embedded-header {
   position: absolute;
   display: flex;
+  align-items: center;
   justify-content: space-between;
   width: 100%;
   top: 0;
   opacity: 1;
   z-index: 2;
+  height: 4rem;
+  padding-left: var(--spacing-m);
+  padding-right: var(--spacing-s);
   font-size: var(--font-large);
   overflow-x: hidden;
   overflow-y: hidden;
@@ -233,7 +252,6 @@
   border-top-right-radius: var(--border-radius);
 
   .button {
-    padding: var(--spacing-s);
     color: var(--color-white);
     z-index: 2;
 

ui/scss/component/_footer.scss

@@ -1,7 +1,8 @@
 .footer {
   display: flex;
+  flex-direction: column;
   justify-content: center;
-  max-width: 80%;
+  align-items: center;
   margin: auto;
   padding: var(--spacing-xl);
   font-size: var(--font-small);
@@ -9,10 +10,39 @@
   @media (max-width: $breakpoint-small) {
     max-width: 100%;
     padding: var(--spacing-m);
-    flex-direction: column;
+    align-items: flex-start;
   }
 }
 
+.footer__links {
+  display: flex;
+  flex-direction: column;
+
+  .navigation-link {
+    font-size: var(--font-small);
+  }
+
+  .button__label {
+    color: var(--color-text-help);
+  }
+
+  .footer__link {
+    margin-left: 0;
+  }
+
+  @media (min-width: $breakpoint-small) {
+    flex-direction: row;
+
+    .footer__link {
+      margin-left: var(--spacing-m);
+    }
+  }
+}
+
+.footer__link {
+  margin-bottom: var(--spacing-s);
+}
+
 .footer__section {
   margin-left: var(--spacing-xl);
 
@@ -23,7 +53,6 @@
 
 .footer__section-title {
   @extend .help;
-  font-weight: 300;
   margin-bottom: var(--spacing-m);
 }
 

ui/scss/component/_form-field.scss

@@ -214,6 +214,7 @@ input-submit {
     border-left: 2px solid;
     border-bottom: 2px solid;
     border-color: var(--color-input-toggle);
+    border-left-color: var(--color-input-toggle);
     transform: rotate(-45deg);
     left: 6px;
     top: 6px;
@@ -240,7 +241,7 @@ input-submit {
     height: 12px;
     width: 12px;
     border-radius: 50%;
-    background-color: var(--color-secondary);
+    background-color: var(--color-primary);
     left: 6px;
     top: 5px;
   }
@@ -356,7 +357,6 @@ fieldset-group {
         text-overflow: ellipsis;
         overflow: hidden;
         padding: 0.5rem;
-        padding-right: var(--spacing-s);
         height: var(--height-input);
         border: 1px solid;
         border-top-left-radius: var(--border-radius);

ui/scss/component/_header.scss

@@ -16,7 +16,7 @@
 
 .header--minimal {
   box-shadow: none;
-  background-color: transparent;
+  background-color: var(--color-background);
   border-bottom: none;
 }
 
@@ -58,7 +58,6 @@
   justify-content: center;
   align-items: center;
   border-radius: var(--border-radius);
-  color: var(--color-text);
   position: relative;
   font-weight: var(--font-weight-bold);
 
@@ -135,11 +134,25 @@
 }
 
 .header__navigation-item--lbry {
-  padding: var(--spacing-s);
+  height: 4rem;
+  display: flex;
+  align-items: center;
+  margin-left: var(--spacing-m);
+  margin-right: var(--spacing-m);
 
-  .lbry-icon {
+  @media (max-width: $breakpoint-small) {
-    height: var(--height-button);
+    margin-right: var(--spacing-m);
-    width: var(--height-button);
+    height: 5rem;
+
+    .button__label {
+      display: none;
+    }
+  }
+}
+
+.header--minimal {
+  .header__navigation-item--lbry {
+    height: 3rem;
   }
 }
 

ui/scss/component/_icon.scss

@@ -66,3 +66,17 @@
 .icon__lbc--title {
   margin-bottom: 4px;
 }
+
+.icon--Fire {
+  position: relative;
+
+  &:after {
+    content: '';
+    height: 20px;
+    width: 20px;
+    background-color: red;
+    top: 0;
+    right: 0;
+    position: absolute;
+  }
+}

ui/scss/component/_main.scss

@@ -113,6 +113,7 @@
 
     @media (max-width: $breakpoint-small) {
       margin-left: 0;
+      margin-top: var(--spacing-s);
     }
 
     @media (max-width: $breakpoint-medium) {
@@ -139,6 +140,7 @@
   padding-right: 0;
   margin-left: 0;
   margin-right: 0;
+  margin-top: 0;
   width: 100vw;
   max-width: none;
 

ui/scss/component/_markdown-preview.scss

@@ -258,7 +258,7 @@
   }
 
   .file-viewer__embedded-header {
-    padding: 0;
+    padding: var(--spacing-xxs);
   }
 }
 

ui/scss/component/_media.scss

@@ -39,12 +39,6 @@
   align-self: flex-start;
   color: var(--color-text-subtitle);
   font-size: var(--font-small);
-
-  .channel-thumbnail {
-    display: inline-block;
-    @include handleChannelGif(1rem);
-    margin-right: var(--spacing-xs);
-  }
 }
 
 .media__subtitle--centered {
@@ -115,7 +109,6 @@
   position: relative;
   display: flex;
   flex-wrap: wrap;
-  justify-content: space-between;
   margin-top: 0;
 
   > *:not(:last-child) {
@@ -123,7 +116,6 @@
   }
 
   @media (max-width: $breakpoint-small) {
-    justify-content: flex-start;
     padding-top: var(--spacing-s);
 
     > * {
@@ -138,4 +130,9 @@
   font-size: var(--font-xxsmall);
   display: flex;
   flex-direction: column;
+  margin-bottom: var(--spacing-s);
+
+  &:not(:last-child) {
+    margin-bottom: var(--spacing-s);
+  }
 }

ui/scss/component/_navigation.scss

@@ -26,7 +26,10 @@
   height: calc(100vh - var(--header-height));
   border-right: 1px solid var(--color-border);
   padding-top: var(--spacing-l);
-  padding-bottom: var(--spacing-xl);
+  padding-bottom: var(--spacing-l);
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
 
   @media (min-width: $breakpoint-small) {
     overflow-y: hidden;
@@ -35,6 +38,10 @@
       overflow-y: auto;
     }
   }
+
+  @media (min-width: $breakpoint-small) {
+    justify-content: space-between;
+  }
 }
 
 .navigation--mac {
@@ -222,7 +229,16 @@
   @extend .navigation-links;
   margin-right: 0;
   padding-right: 0;
-  font-size: var(--font-small);
+  margin-top: var(--spacing-xl);
+  margin-bottom: 0;
+
+  .navigation-link {
+    font-size: var(--font-small);
+  }
+
+  .button__label {
+    color: var(--color-text-help);
+  }
 
   .button__content {
     align-items: flex-start;

ui/scss/component/_nudge.scss

@@ -1,7 +1,7 @@
 .nudge {
   z-index: 3;
   position: absolute;
-  left: 0;
+  //   left: 5rem;
   top: 4rem;
   white-space: normal;
   overflow: visible;
@@ -10,6 +10,7 @@
   box-shadow: var(--card-box-shadow);
   background-color: var(--color-secondary);
   color: var(--color-white);
+  font-weight: bold;
 
   .button--close {
     .icon {

ui/scss/component/_purchase.scss

@@ -55,6 +55,7 @@
 
   .credit-amount {
     margin: 0 var(--spacing-m);
+    margin-bottom: -0.5rem;
   }
 
   &::before {

ui/scss/component/_search.scss

@@ -15,6 +15,7 @@
     color: var(--color-secondary);
     margin-bottom: var(--spacing-s);
     padding: var(--spacing-xxs);
+    border-radius: var(--border-radius);
   }
 
   fieldset:not(:first-child) {
@@ -34,6 +35,7 @@
 .search__top-link {
   margin-top: var(--spacing-s);
   font-weight: var(--font-weight-body);
+  margin-top: var(--spacing-xs);
 }
 
 .search__top-links {