From f53431196cdba2e84cfd9bf75c9a2efa22f6154a Mon Sep 17 00:00:00 2001 From: satoshi toyama Date: Tue, 19 Nov 2024 16:52:11 +0900 Subject: [PATCH 01/85] feat(flags): Add feature flag for Playground V2 Add new environment variable and flag configuration to control the rollout of Playground V2 functionality. The flag defaults to false and can be enabled via PLAYGROUND_V2_FLAG environment variable. This change: - Adds PLAYGROUND_V2_FLAG to .env.example - Creates new feature flag configuration in flags.ts - Maintains consistency with existing flag patterns --- .env.example | 1 + flags.ts | 13 +++++++++++++ 2 files changed, 14 insertions(+) diff --git a/.env.example b/.env.example index f8b5e0a6..0b027a63 100644 --- a/.env.example +++ b/.env.example @@ -5,6 +5,7 @@ NEXT_PUBLIC_SERVICE_SITE_URL="https://example.com/" DEBUG_FLAG="true" VIEW_FLAG="true" GITHUB_INTEGRATION_FLAG="true" +PLAYGROUND_V2_FLAG="true" # @vercel/blob https://vercel.com/docs/storage/vercel-blob/using-blob-sdk # @see https://vercel.com/docs/storage/vercel-blob/client-upload#prepare-your-local-project diff --git a/flags.ts b/flags.ts index 1dec3bb0..50fd3e17 100644 --- a/flags.ts +++ b/flags.ts @@ -51,3 +51,16 @@ export const githubIntegrationFlag = flag({ { value: true, label: "Enable" }, ], }); + +export const playgroundV2Flag = flag({ + key: "playground-v2", + async decide() { + return takeLocalEnv("PLAYGROUND_V2_FLAG"); + }, + description: "Enable Playground V2", + defaultValue: false, + options: [ + { value: false, label: "disable" }, + { value: true, label: "Enable" }, + ], +}); From 6698d370f5de7064428d72371d38df23fcd23fd0 Mon Sep 17 00:00:00 2001 From: satoshi toyama Date: Tue, 19 Nov 2024 16:54:14 +0900 Subject: [PATCH 02/85] feat(playground): Add Playground V2 flag to agent page Integrate Playground V2 feature flag into agent playground page and types. This prepares for the upcoming Playground V2 rollout by adding flag state to the page props and feature flags interface. Changes: - Add playgroundV2Flag to FeatureFlags interface - Import and fetch playgroundV2Flag state in agent page - Pass flag state through to page components --- app/(playground)/p/[agentId]/beta-proto/feature-flags/types.ts | 1 + app/(playground)/p/[agentId]/page.tsx | 3 +++ 2 files changed, 4 insertions(+) diff --git a/app/(playground)/p/[agentId]/beta-proto/feature-flags/types.ts b/app/(playground)/p/[agentId]/beta-proto/feature-flags/types.ts index a9fcd7b9..c9e85ba7 100644 --- a/app/(playground)/p/[agentId]/beta-proto/feature-flags/types.ts +++ b/app/(playground)/p/[agentId]/beta-proto/feature-flags/types.ts @@ -2,4 +2,5 @@ export interface FeatureFlags { debugFlag: boolean; viewFlag: boolean; gitHubIntegrationFlag: boolean; + playgroundV2Flag: boolean; } diff --git a/app/(playground)/p/[agentId]/page.tsx b/app/(playground)/p/[agentId]/page.tsx index 6970b64e..0435b397 100644 --- a/app/(playground)/p/[agentId]/page.tsx +++ b/app/(playground)/p/[agentId]/page.tsx @@ -4,6 +4,7 @@ import { agents, db } from "@/drizzle"; import { debugFlag as getDebugFlag, githubIntegrationFlag as getGitHubIntegrationFlag, + playgroundV2Flag as getPlaygroundV2Flag, viewFlag as getViewFlag, } from "@/flags"; import { getUser } from "@/lib/supabase"; @@ -131,6 +132,7 @@ export default async function AgentPlaygroundPage({ const debugFlag = await getDebugFlag(); const viewFlag = await getViewFlag(); const gitHubIntegrationFlag = await getGitHubIntegrationFlag(); + const playgroundV2Flag = await getPlaygroundV2Flag(); const agent = await getAgent(agentId); const gitHubIntegrationSetting = await getGitHubIntegrationSetting( @@ -147,6 +149,7 @@ export default async function AgentPlaygroundPage({ debugFlag, viewFlag, gitHubIntegrationFlag, + playgroundV2Flag, }} gitHubIntegration={{ repositories, From 0c2394bdf9292b2f53ca35bd21de003e196d1dcb Mon Sep 17 00:00:00 2001 From: satoshi toyama Date: Tue, 19 Nov 2024 18:16:46 +0900 Subject: [PATCH 03/85] feat(panel): Add prompt tab to text generator panel Implement new prompt-based interface for text generation with: - New prompt tab with instruction textarea - Requirements section (placeholder) - Sources section with add functionality - Feature flag control for v2 playground NOTE: Currently UI only - functionality to be implemented in follow-up PRs --- .../components/panel/text-generator.tsx | 173 +++++++++++++++++- .../beta-proto/giselle-node/types.ts | 1 + 2 files changed, 173 insertions(+), 1 deletion(-) diff --git a/app/(playground)/p/[agentId]/beta-proto/giselle-node/components/panel/text-generator.tsx b/app/(playground)/p/[agentId]/beta-proto/giselle-node/components/panel/text-generator.tsx index eeffafa4..5c428bb0 100644 --- a/app/(playground)/p/[agentId]/beta-proto/giselle-node/components/panel/text-generator.tsx +++ b/app/(playground)/p/[agentId]/beta-proto/giselle-node/components/panel/text-generator.tsx @@ -1,5 +1,5 @@ import clsx from "clsx"; -import { CopyIcon } from "lucide-react"; +import { CirclePlusIcon, CopyIcon } from "lucide-react"; import type { FC } from "react"; import type { GeneratedObject, @@ -57,6 +57,7 @@ export const TextGeneratorPropertyPanel: FC< TextGeneratorPropertyPanelProps > = ({ node }) => { const { dispatch } = useGraph(); + const { playgroundV2Flag } = useFeatureFlags(); return (
@@ -64,6 +65,7 @@ export const TextGeneratorPropertyPanel: FC<
+ {playgroundV2Flag && Ptompt} Property Result
@@ -89,6 +91,175 @@ export const TextGeneratorPropertyPanel: FC<
+ {node.ui.panelTab === panelTabs.prompt && ( +
+
+
+
+ +