Merge pull request #3597 from lbryio/embedAnalytics

make embeds log views in analytics

ui/component/floatingViewer/view.jsx

@@ -88,7 +88,7 @@ export default function FileViewer(props: Props) {
       const timeToStart = Date.now() - playTime;
       triggerAnalyticsView(uri, timeToStart).then(() => {
         claimRewards();
-        setHasRecordedView(false);
+        setHasRecordedView(true);
         setPlayTime(null);
       });
     }

ui/page/embedWrapper/index.js

@@ -1,6 +1,7 @@
 import { connect } from 'react-redux';
 import EmbedWrapperPage from './view';
 import { doResolveUri, makeSelectClaimForUri, buildURI } from 'lbry-redux';
+import { doAnalyticsView } from 'redux/actions/app';
 
 const select = (state, props) => {
   const { match } = props;
@@ -13,9 +14,12 @@ const select = (state, props) => {
   };
 };
 
-const perform = dispatch => ({
-  resolveUri: uri => dispatch(doResolveUri(uri)),
-});
+const perform = dispatch => {
+  return {
+    resolveUri: uri => dispatch(doResolveUri(uri)),
+    triggerAnalyticsView: uri => dispatch(doAnalyticsView(uri)),
+  };
+};
 
 export default connect(
   select,

ui/page/embedWrapper/view.jsx

@@ -1,16 +1,27 @@
 // @flow
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import FileRender from 'component/fileRender';
 
 type Props = {
   uri: string,
   resolveUri: string => void,
   claim: Claim,
+  triggerAnalyticsView: string => Promise<any>,
 };
 // $FlowFixMe apparently flow thinks this is wrong.
 export const EmbedContext = React.createContext();
 const EmbedWrapperPage = (props: Props) => {
-  const { resolveUri, claim, uri } = props;
+  const { resolveUri, claim, uri, triggerAnalyticsView } = props;
+  const [hasRecordedView, setHasRecordedView] = useState(false);
+
+  useEffect(() => {
+    if (!hasRecordedView && uri && claim) {
+      triggerAnalyticsView(uri).then(() => {
+        setHasRecordedView(true);
+      });
+    }
+  }, [triggerAnalyticsView, setHasRecordedView, hasRecordedView, uri, claim]);
+
   useEffect(() => {
     if (resolveUri && uri) {
       resolveUri(uri);