added page titles for beta products and added to creator tools page

src/website/packages/fakeyou.com/src/v2/view/pages/beta_products/BetaLipSyncForm.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import { Widget } from "@typeform/embed-react";
 import { useLocation } from "react-router-dom";
 import { useDomainConfig } from "context/DomainConfigContext";
+import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle";
 
 export const BetaLipSyncForm = () => {
   const location = useLocation();
@@ -17,6 +18,7 @@ export const BetaLipSyncForm = () => {
       : "typeform-source=storyteller.ai"
   }&email=${encodeURIComponent(email || "")}`;
 
+  usePrefixedDocumentTitle("Beta Lip Sync");
   return (
     <div
       style={{

src/website/packages/fakeyou.com/src/v2/view/pages/beta_products/BetaLipSyncPage.tsx

@@ -1,10 +1,12 @@
 import { faArrowRight } from "@fortawesome/pro-solid-svg-icons";
+import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle";
 import { Button, Container, Panel } from "components/common";
 import { AITools } from "components/marketing";
 import React from "react";
 // import { Widget } from "@typeform/embed-react";
 
 export const BetaLipSyncPage = () => {
+  usePrefixedDocumentTitle("Beta Lip Sync");
   return (
     <>
       <div className="d-flex flex-column align-items-center">

src/website/packages/fakeyou.com/src/v2/view/pages/beta_products/BetaVideoCompositorForm.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import { Widget } from "@typeform/embed-react";
 import { useLocation } from "react-router-dom";
 import { useDomainConfig } from "context/DomainConfigContext";
+import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle";
 
 export const BetaVideoCompositorForm = () => {
   const location = useLocation();
@@ -17,6 +18,8 @@ export const BetaVideoCompositorForm = () => {
       : "typeform-source=storyteller.ai"
   }&email=${encodeURIComponent(email || "")}`;
 
+  usePrefixedDocumentTitle("Beta Video Compositor");
+
   return (
     <div
       style={{

src/website/packages/fakeyou.com/src/v2/view/pages/beta_products/BetaVideoCompositorPage.tsx

@@ -1,10 +1,12 @@
 import { faArrowRight } from "@fortawesome/pro-solid-svg-icons";
+import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle";
 import { Button, Container, Panel } from "components/common";
 import { AITools } from "components/marketing";
 import React from "react";
 // import { Widget } from "@typeform/embed-react";
 
 export const BetaVideoCompositorPage = () => {
+  usePrefixedDocumentTitle("Beta Video Compositor");
   return (
     <>
       <div className="d-flex flex-column align-items-center">

src/website/packages/fakeyou.com/src/v2/view/pages/beta_products/BetaWebcamActingForm.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import { Widget } from "@typeform/embed-react";
 import { useLocation } from "react-router-dom";
 import { useDomainConfig } from "context/DomainConfigContext";
+import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle";
 
 export const BetaWebcamActingForm = () => {
   const location = useLocation();
@@ -17,6 +18,8 @@ export const BetaWebcamActingForm = () => {
       : "typeform-source=storyteller.ai"
   }&email=${encodeURIComponent(email || "")}`;
 
+  usePrefixedDocumentTitle("Beta Webcam Acting");
+
   return (
     <div
       style={{

src/website/packages/fakeyou.com/src/v2/view/pages/beta_products/BetaWebcamActingPage.tsx

@@ -1,10 +1,12 @@
 import { faArrowRight } from "@fortawesome/pro-solid-svg-icons";
+import { usePrefixedDocumentTitle } from "common/UsePrefixedDocumentTitle";
 import { Button, Container, Panel } from "components/common";
 import { AITools } from "components/marketing";
 import React from "react";
 // import { Widget } from "@typeform/embed-react";
 
 export const BetaWebcamActingPage = () => {
+  usePrefixedDocumentTitle("Beta Webcam Acting");
   return (
     <>
       <div className="d-flex flex-column align-items-center">

src/website/packages/fakeyou.com/src/v2/view/pages/creator_tools/CreatorToolsPage.tsx

@@ -27,7 +27,24 @@ export default function CreatorToolsPage(props: CreatorToolsPageProps) {
 
   usePrefixedDocumentTitle("Creator Tools");
 
-  const videoProducts = [
+  type Item = {
+    to?: string;
+    externalLink?: string;
+    title: string;
+    text: string;
+    imgSrc?: string;
+    imgAlt: string;
+    videoSrc?: string;
+    videoPosterSrc?: string;
+    badgeContent?: {
+      type: string;
+      icon: any;
+      label: string;
+    };
+    videoPosition?: "top" | "center";
+  };
+
+  const videoProducts: Item[] = [
     // {
     //   to: "/text-to-image",
     //   title: t("productImageGenTitle"),
@@ -67,7 +84,6 @@ export default function CreatorToolsPage(props: CreatorToolsPageProps) {
         label: "NEW",
       },
     },
-
     {
       to: "/face-animator",
       title: t("productLipsyncTitle"),
@@ -76,6 +92,31 @@ export default function CreatorToolsPage(props: CreatorToolsPageProps) {
       videoPosterSrc: "/images/ai-tools/ls_video_poster.jpg",
       imgAlt: "Lipsync",
     },
+    {
+      to: "/beta/video-compositor",
+      title: "2D Video Compositor",
+      text: "Compose videos and images with AI",
+      videoSrc: "/videos/ai-tools/vcomp_video.mp4",
+      videoPosterSrc: "/images/ai-tools/vcomp_video_poster.jpg",
+      imgAlt: "Video Compositor",
+    },
+    {
+      to: "/beta/video-compositor",
+      title: "3D Video Compositor",
+      text: "Compose videos and images with AI",
+      videoSrc: "/videos/ai-tools/vcomp_video_2.mp4",
+      videoPosterSrc: "/images/ai-tools/vcomp_video_poster_2.jpg",
+      imgAlt: "Video Compositor",
+      videoPosition: "top",
+    },
+    {
+      to: "/beta/webcam-acting",
+      title: "Webcam Acting",
+      text: "Act as your character through your camera",
+      videoSrc: "/videos/ai-tools/ca_video.mp4",
+      videoPosterSrc: "/images/ai-tools/ca_video_poster.jpg",
+      imgAlt: "Video Compositor",
+    },
   ];
 
   const voiceProducts = [