diff --git a/src/website/packages/fakeyou.com/src/v2/view/pages/live_portrait/LivePortrait.tsx b/src/website/packages/fakeyou.com/src/v2/view/pages/live_portrait/LivePortrait.tsx
index 5873d02bb6..43081424c5 100644
--- a/src/website/packages/fakeyou.com/src/v2/view/pages/live_portrait/LivePortrait.tsx
+++ b/src/website/packages/fakeyou.com/src/v2/view/pages/live_portrait/LivePortrait.tsx
@@ -12,6 +12,7 @@ import {
Container,
Label,
Panel,
+ SessionFetchingSpinner,
} from "components/common";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
@@ -49,6 +50,7 @@ import { useDocumentTitle } from "@storyteller/components/src/hooks/UseDocumentT
import SourceEntityInput from "./SourceEntityInput";
import MotionEntityInput from "./MotionEntityInput";
import OutputThumbnailImage from "./OutputThumbnailImage";
+import LoginBlock from "components/common/LoginBlock";
interface LivePortraitProps {
sessionSubscriptionsWrapper: SessionSubscriptionsWrapper;
@@ -73,7 +75,7 @@ export default function LivePortrait({
}: LivePortraitProps) {
useDocumentTitle("Live Portrait AI. Free Video Animation");
const { enqueueInferenceJob } = useInferenceJobs();
- const { loggedIn, loggedInOrModal } = useSession();
+ const { loggedIn, loggedInOrModal, sessionFetched } = useSession();
const { open, close } = useModal();
const [isEnqueuing, setIsEnqueuing] = useState(false);
const [selectedSourceIndex, setSelectedSourceIndex] = useState(0);
@@ -698,6 +700,19 @@ export default function LivePortrait({
}
};
+ if (!sessionFetched) {
+ return ;
+ }
+
+ if (!loggedIn) {
+ return (
+
+ );
+ }
+
return (
<>