From 9ec5a7c2988dfd4fb1bd5975f1e8a58d523c19eb Mon Sep 17 00:00:00 2001
From: infinite-persistence <inf.persistence@gmail.com>
Date: Tue, 21 Sep 2021 15:54:20 +0800
Subject: [PATCH] Embed: add replay button

Also, changed "Rewatch or Discuss" to "Discuss + external arrow" since there is a dedicated re-watch button.
---
 static/app-strings.json                        |  1 +
 ui/scss/component/_file-render.scss            |  4 ++++
 web/component/fileViewerEmbeddedEnded/view.jsx | 15 +++++++++++++--
 3 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/static/app-strings.json b/static/app-strings.json
index e1abc146d..b73b0aa35 100644
--- a/static/app-strings.json
+++ b/static/app-strings.json
@@ -2169,5 +2169,6 @@
   "Content Page": "Content Page",
   "Card Last 4": "Card Last 4",
   "Search blocked channel name": "Search blocked channel name",
+  "Discuss": "Discuss",
   "--end--": "--end--"
 }
diff --git a/ui/scss/component/_file-render.scss b/ui/scss/component/_file-render.scss
index 83b8995ca..2b65b0d7d 100644
--- a/ui/scss/component/_file-render.scss
+++ b/ui/scss/component/_file-render.scss
@@ -231,6 +231,10 @@
   .button + .button {
     margin-left: var(--spacing-m);
   }
+
+  .button--link {
+    vertical-align: middle;
+  }
 }
 
 .file-viewer__overlay-logo {
diff --git a/web/component/fileViewerEmbeddedEnded/view.jsx b/web/component/fileViewerEmbeddedEnded/view.jsx
index d56a77f27..695637716 100644
--- a/web/component/fileViewerEmbeddedEnded/view.jsx
+++ b/web/component/fileViewerEmbeddedEnded/view.jsx
@@ -1,6 +1,7 @@
 // @flow
 import React from 'react';
 import Button from 'component/button';
+import * as ICONS from 'constants/icons';
 import { formatLbryUrlForWeb } from 'util/url';
 import { withRouter } from 'react-router';
 import { URL, SITE_NAME } from 'config';
@@ -34,6 +35,7 @@ function FileViewerEmbeddedEnded(props: Props) {
   // $FlowFixMe
   const prompt = prompts[promptKey];
   const lbrytvLink = `${URL}${formatLbryUrlForWeb(uri)}?src=${promptKey}`;
+  const showReplay = Boolean(window.player);
 
   return (
     <div className="file-viewer__overlay">
@@ -46,9 +48,18 @@ function FileViewerEmbeddedEnded(props: Props) {
         <>
           <div className="file-viewer__overlay-title file-viewer_embed-ended-title">{prompt}</div>
           <div className="file-viewer__overlay-actions">
-            { /* add button to replay? */ }
             <>
-              <Button label={__('Rewatch or Discuss')} button="primary" href={lbrytvLink} />
+              {showReplay && (
+                <Button
+                  title={__('Replay')}
+                  button="link"
+                  iconRight={ICONS.REPLAY}
+                  onClick={() => {
+                    if (window.player) window.player.play();
+                  }}
+                />
+              )}
+              <Button label={__('Discuss')} iconRight={ICONS.EXTERNAL} button="primary" href={lbrytvLink} />
               {!isAuthenticated && (
                 <Button
                   label={__('Join %SITE_NAME%', { SITE_NAME })}