hide top-level pages without studio access

packages/fakeyou.com/src/v2/view/PageContainer.tsx

@@ -838,6 +838,7 @@ class PageContainer extends React.Component<
                       inferenceJobs: this.props.inferenceJobs,
                       inferenceJobsByCategory:
                         this.props.inferenceJobsByCategory,
+                      sessionWrapper: this.props.sessionWrapper,
                     }}
                   />
                 </Route>
@@ -847,6 +848,7 @@ class PageContainer extends React.Component<
                     sessionSubscriptionsWrapper={
                       this.props.sessionSubscriptionsWrapper
                     }
+                    sessionWrapper={this.props.sessionWrapper}
                     enqueueInferenceJob={this.props.enqueueInferenceJob}
                   />
                 </Route>
@@ -1313,7 +1315,9 @@ class PageContainer extends React.Component<
               </Route>
 
               <Route path="/engine-compositor">
-                <EngineCompositor />
+                <EngineCompositor 
+                  sessionWrapper={this.props.sessionWrapper}
+                  />
               </Route>
 
               <Route path="/voice-designer">

packages/fakeyou.com/src/v2/view/pages/EngineCompositor/EngineCompositor.tsx

@@ -6,12 +6,15 @@ import { EnqueueEngineCompositing } from "@storyteller/components/src/api/engine
 import { FrontendInferenceJobType } from "@storyteller/components/src/jobs/InferenceJob";
 import { v4 as uuidv4 } from "uuid";
 import "./EngineCompositor.scss"
+import { SessionWrapper } from "@storyteller/components/src/session/SessionWrapper";
+import { StudioNotAvailable } from "v2/view/_common/StudioNotAvailable";
 
 interface Props {
   value?: any;
+  sessionWrapper: SessionWrapper;
 }
 
-export default function EngineCompositor({ value }: Props) {
+export default function EngineCompositor({ value, sessionWrapper }: Props) {
   const [mediaToken,mediaTokenSet] = useState();
   const onChange = ({ target }: any) => mediaTokenSet(target.value);
   const inferenceJobs = useInferenceJobs(FrontendInferenceJobType.EngineComposition);
@@ -23,12 +26,10 @@ export default function EngineCompositor({ value }: Props) {
     })
     .then((res: any) => {
         if (res && res.success) {
-          console.log("🚛 success!",{ mediaToken, res });
           inferenceJobs.enqueue( // I need to pass this
             res.inference_job_token,
             FrontendInferenceJobType.EngineComposition
           );
-
         }
       });
   }
@@ -40,6 +41,10 @@ export default function EngineCompositor({ value }: Props) {
     }
   };
 
+  if (!sessionWrapper.canAccessStudio()) {
+    return <StudioNotAvailable />
+  }
+
   return <div {...{ className: "fy-engine-compositor"}}>
     <div {...{ className: "panel engine-compositor-container" }}>
       <header>

packages/fakeyou.com/src/v2/view/pages/storyteller_studio/vc_model_list/StorytellerStudioListPage.tsx

@@ -5,6 +5,7 @@ import { SessionSubscriptionsWrapper } from "@storyteller/components/src/session
 import PageHeaderWithImage from "components/layout/PageHeaderWithImage";
 import { Container, Panel } from "components/common";
 import { faCameraMovie } from "@fortawesome/pro-solid-svg-icons";
+import { StudioNotAvailable } from "v2/view/_common/StudioNotAvailable";
 
 interface Props {
   sessionWrapper: SessionWrapper;
@@ -12,6 +13,10 @@ interface Props {
 }
 
 function StorytellerStudioListPage(props: Props) {
+  if (!props.sessionWrapper.canAccessStudio()) {
+    return <StudioNotAvailable />
+  }
+
   return (
     <Container type="panel">
       <PageHeaderWithImage

packages/fakeyou.com/src/v2/view/pages/text_to_image/TextToImagePage.tsx

@@ -7,9 +7,12 @@ import { SessionSubscriptionsWrapper } from "@storyteller/components/src/session
 import { faMessageImage } from "@fortawesome/pro-solid-svg-icons";
 import TextToImageJobsList from "./components/TextToImageJobsList";
 import { useInferenceJobs } from "hooks";
+import { SessionWrapper } from "@storyteller/components/src/session/SessionWrapper";
+import { StudioNotAvailable } from "v2/view/_common/StudioNotAvailable";
 
 interface TextToImagePageProps {
   sessionSubscriptionsWrapper: SessionSubscriptionsWrapper;
+  sessionWrapper: SessionWrapper;
   enqueueInferenceJob: (
     jobToken: string,
     frontendInferenceJobType: FrontendInferenceJobType
@@ -17,6 +20,7 @@ interface TextToImagePageProps {
 }
 
 export default function TextToImagePage({
+  sessionWrapper,
   sessionSubscriptionsWrapper,
   enqueueInferenceJob,
 }: TextToImagePageProps) {
@@ -25,6 +29,10 @@ export default function TextToImagePage({
   );
   const hasImageGenJobs = inferenceJobs && inferenceJobs.length > 0;
 
+  if (!sessionWrapper.canAccessStudio()) {
+    return <StudioNotAvailable />
+  }
+
   return (
     <Container type="panel">
       <PageHeaderWithImage

packages/fakeyou.com/src/v2/view/pages/video_workflow/VideoWorkflow.tsx

@@ -8,6 +8,8 @@ import PageHeader from "components/layout/PageHeader";
 
 import { states, reducer } from "./videoWorkflowReducer";
 import SubRoutes from "./videoWorkflowRoutes";
+import { SessionWrapper } from '@storyteller/components/src/session/SessionWrapper';
+import { StudioNotAvailable } from 'v2/view/_common/StudioNotAvailable';
 
 export default function StorytellerFilter(props:{
   enqueueInferenceJob: (
@@ -16,8 +18,9 @@ export default function StorytellerFilter(props:{
   ) => void;
   inferenceJobs: Array<InferenceJob>;
   inferenceJobsByCategory: Map<FrontendInferenceJobType, Array<InferenceJob>>;
+  sessionWrapper: SessionWrapper;
 }){
-  const debug=true;
+  const debug = true;
   const {t} = useLocalize("VideoWorkflow");
   const { NO_FILE } = states;
   const [pageState, dispatchPageState] = useReducer(reducer, {
@@ -44,6 +47,10 @@ export default function StorytellerFilter(props:{
     }
   }, [pageState, enqueueInferenceJob]);
 
+  if (!props.sessionWrapper.canAccessStudio()) {
+    return <StudioNotAvailable />
+  }
+
   return(
     <Container type="panel" className="mb-5">
       <PageHeader