diff --git a/packages/components/src/api/session/GetSessionInfo.ts b/packages/components/src/api/session/GetSessionInfo.ts
index f9bade4f3c..ecabec16ee 100644
--- a/packages/components/src/api/session/GetSessionInfo.ts
+++ b/packages/components/src/api/session/GetSessionInfo.ts
@@ -20,6 +20,7 @@ export interface UserInfo {
// Rollout feature flags
can_access_studio: boolean,
+ maybe_feature_flags: string[],
// Usage
can_use_tts: boolean,
diff --git a/packages/components/src/session/SessionWrapper.ts b/packages/components/src/session/SessionWrapper.ts
index 4df52de6d4..f8726475e0 100644
--- a/packages/components/src/session/SessionWrapper.ts
+++ b/packages/components/src/session/SessionWrapper.ts
@@ -56,10 +56,17 @@ export class SessionWrapper {
public canAccessStudio(): boolean {
const hostnameAllowed = StudioRolloutHostnameAllowed();
const userAllowed =
- this.sessionStateResponse?.user?.can_access_studio || false;
+ this.sessionStateResponse?.user?.can_access_studio ||
+ this.sessionStateResponse?.user?.maybe_feature_flags.includes("studio") ||
+ false;
return hostnameAllowed && userAllowed;
}
+ // Feature flag rollout for Video Style Transfer
+ public canAccessVideoStyleTransfer(): boolean {
+ return this.sessionStateResponse?.user?.maybe_feature_flags.includes("video_style_transfer") || false;
+ }
+
// Username is all lowercase
public getUsername(): string | undefined {
return this.sessionStateResponse?.user?.username;
diff --git a/packages/fakeyou.com/src/v2/view/_common/VideoStyleTransferNotAvailable.tsx b/packages/fakeyou.com/src/v2/view/_common/VideoStyleTransferNotAvailable.tsx
new file mode 100644
index 0000000000..1f37135d2f
--- /dev/null
+++ b/packages/fakeyou.com/src/v2/view/_common/VideoStyleTransferNotAvailable.tsx
@@ -0,0 +1,19 @@
+import { DiscordLink2 } from "@storyteller/components/src/elements/DiscordLink2";
+import { Container } from "components/common";
+import PageHeader from "components/layout/PageHeader";
+import React from "react";
+
+export function VideoStyleTransferNotAvailable() {
+ const subText = (
+ <> Please visit our to join the wait list. >
+ );
+
+ return (
+
+
+
+ );
+}
diff --git a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/VideoStyleTransfer.tsx b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/VideoStyleTransfer.tsx
index 5425463984..2358fadeaf 100644
--- a/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/VideoStyleTransfer.tsx
+++ b/packages/fakeyou.com/src/v2/view/pages/video_styletransfer/VideoStyleTransfer.tsx
@@ -1,7 +1,6 @@
import React, { useReducer, useEffect } from "react";
import { SessionWrapper } from "@storyteller/components/src/session/SessionWrapper";
-import { StudioNotAvailable } from "v2/view/_common/StudioNotAvailable";
import { useInferenceJobs, useLocalize } from "hooks";
import {
FrontendInferenceJobType,
@@ -13,6 +12,7 @@ import { states, reducer } from "./reducer";
import SubRoutes from "./routes";
import PageHeaderWithImage from "components/layout/PageHeaderWithImage";
import { faFilms } from "@fortawesome/pro-solid-svg-icons";
+import { VideoStyleTransferNotAvailable } from "v2/view/_common/VideoStyleTransferNotAvailable";
export default function VideoStyleTransfer(props: {
enqueueInferenceJob: (
@@ -48,8 +48,8 @@ export default function VideoStyleTransfer(props: {
}
}, [pageState, enqueueInferenceJob]);
- if (!props.sessionWrapper.canAccessStudio()) {
- return ;
+ if (!props.sessionWrapper.canAccessVideoStyleTransfer()) {
+ return ;
}
return (
diff --git a/packages/fakeyou.com/src/v2/view/pages/video_workflow/VideoWorkflow.tsx b/packages/fakeyou.com/src/v2/view/pages/video_workflow/VideoWorkflow.tsx
index ee42efe013..d9b042b7c3 100644
--- a/packages/fakeyou.com/src/v2/view/pages/video_workflow/VideoWorkflow.tsx
+++ b/packages/fakeyou.com/src/v2/view/pages/video_workflow/VideoWorkflow.tsx
@@ -48,6 +48,7 @@ export default function VideoWorkflow(props:{
}, [pageState, enqueueInferenceJob]);
if (!props.sessionWrapper.canAccessStudio()) {
+ //return
return
}