From 068da847f009b1bf6568df068c591cf1229c7166 Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Tue, 6 Dec 2022 04:04:32 -0500
Subject: [PATCH] FakeYou premium membership ask

---
 .../fakeyou.com/src/v2/view/PageContainer.tsx |  1 +
 .../SessionTtsInferenceResultsListFc.tsx      | 25 ++++++++++++++-----
 .../tts/tts_model_list/TtsModelListPage.tsx   |  1 +
 .../tts/tts_model_view/TtsModelViewPage.tsx   |  3 +++
 4 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/packages/fakeyou.com/src/v2/view/PageContainer.tsx b/packages/fakeyou.com/src/v2/view/PageContainer.tsx
index a33cc65763..77f486c43f 100644
--- a/packages/fakeyou.com/src/v2/view/PageContainer.tsx
+++ b/packages/fakeyou.com/src/v2/view/PageContainer.tsx
@@ -251,6 +251,7 @@ class PageContainer extends React.Component<Props, State> {
             <Route path="/tts/:token">
               <TtsModelViewPage
                 sessionWrapper={this.props.sessionWrapper}
+                sessionSubscriptionsWrapper={this.props.sessionSubscriptionsWrapper}
                 enqueueTtsJob={this.props.enqueueTtsJob}
                 ttsInferenceJobs={this.props.ttsInferenceJobs}
                 textBuffer={this.props.textBuffer}
diff --git a/packages/fakeyou.com/src/v2/view/_common/SessionTtsInferenceResultsListFc.tsx b/packages/fakeyou.com/src/v2/view/_common/SessionTtsInferenceResultsListFc.tsx
index 012c61a6a5..5fa7078560 100644
--- a/packages/fakeyou.com/src/v2/view/_common/SessionTtsInferenceResultsListFc.tsx
+++ b/packages/fakeyou.com/src/v2/view/_common/SessionTtsInferenceResultsListFc.tsx
@@ -11,9 +11,11 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import { motion } from "framer-motion";
 import { container, item, sessionItem } from "../../../data/animation";
+import { SessionSubscriptionsWrapper } from "@storyteller/components/src/session/SessionSubscriptionsWrapper";
 
 interface Props {
   ttsInferenceJobs: Array<TtsInferenceJob>;
+  sessionSubscriptionsWrapper: SessionSubscriptionsWrapper;
 }
 
 function SessionTtsInferenceResultListFc(props: Props) {
@@ -122,6 +124,22 @@ function SessionTtsInferenceResultListFc(props: Props) {
     );
   }
 
+  let upgradeNotice = <></>;
+
+  // Ask non-premium users to upgrade
+  if (results.length !== 0 && !props.sessionSubscriptionsWrapper.hasPaidFeatures()) {
+    upgradeNotice = (
+      <div className="d-flex flex-column gap-4">
+        <motion.div className="alert alert-warning" variants={sessionItem}>
+          <h4>
+            Don't want to wait? 
+            Step to the front of the line with a <Link to="/pricing" className="alert-link">FakeYou membership</Link>.
+          </h4>
+        </motion.div>
+      </div>
+    )
+  }
+
   // Users have requested reverse chronological results
   results.reverse();
 
@@ -130,13 +148,8 @@ function SessionTtsInferenceResultListFc(props: Props) {
       <div className="container-panel mb-5">
         <div className="d-flex flex-column gap-4">
           {title}
+          {upgradeNotice}
 
-          {/*<div className="notification is-info is-light">
-        <strong>Working on speeding this up</strong> 
-        <p>
-          Sorry this is slow. I'm scaling the cluster and fixing the caching strategy.
-        </p>
-      </div>*/}
           <div className="d-flex flex-column gap-4">{results}</div>
         </div>
       </div>
diff --git a/packages/fakeyou.com/src/v2/view/tts/tts_model_list/TtsModelListPage.tsx b/packages/fakeyou.com/src/v2/view/tts/tts_model_list/TtsModelListPage.tsx
index baef2734e6..7e73dd7b65 100644
--- a/packages/fakeyou.com/src/v2/view/tts/tts_model_list/TtsModelListPage.tsx
+++ b/packages/fakeyou.com/src/v2/view/tts/tts_model_list/TtsModelListPage.tsx
@@ -405,6 +405,7 @@ function TtsModelListPage(props: Props) {
 
       <SessionTtsInferenceResultListFc
         ttsInferenceJobs={props.ttsInferenceJobs}
+        sessionSubscriptionsWrapper={props.sessionSubscriptionsWrapper}
       />
 
       <SessionW2lInferenceResultListFc
diff --git a/packages/fakeyou.com/src/v2/view/tts/tts_model_view/TtsModelViewPage.tsx b/packages/fakeyou.com/src/v2/view/tts/tts_model_view/TtsModelViewPage.tsx
index 4170ce616a..6b4692f333 100644
--- a/packages/fakeyou.com/src/v2/view/tts/tts_model_view/TtsModelViewPage.tsx
+++ b/packages/fakeyou.com/src/v2/view/tts/tts_model_view/TtsModelViewPage.tsx
@@ -48,9 +48,11 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import { motion } from "framer-motion";
 import { container, item, panel } from "../../../../data/animation";
+import { SessionSubscriptionsWrapper } from "@storyteller/components/src/session/SessionSubscriptionsWrapper";
 
 interface Props {
   sessionWrapper: SessionWrapper;
+  sessionSubscriptionsWrapper: SessionSubscriptionsWrapper;
   enqueueTtsJob: (jobToken: string) => void;
   ttsInferenceJobs: Array<TtsInferenceJob>;
   textBuffer: string;
@@ -681,6 +683,7 @@ function TtsModelViewPage(props: Props) {
 
       <SessionTtsInferenceResultListFc
         ttsInferenceJobs={props.ttsInferenceJobs}
+        sessionSubscriptionsWrapper={props.sessionSubscriptionsWrapper}
       />
     </motion.div>
   );