Skip to content

Commit

Permalink
Merge pull request #129 from toyamarinyon/add-instruction-property
Browse files Browse the repository at this point in the history 
feat: Restructure Playground node architecture for article creation workflow
  • Loading branch information
@toyamarinyon
toyamarinyon authored Nov 29, 2024
2 parents 1608194 + 2d50bcd commit b5f032c
Show file tree
Hide file tree
Showing 30 changed files with 4,375 additions and 46 deletions.
1 change: 1 addition & 0 deletions .env.example
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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"
FREE_PLAN_FLAG="true"

# @vercel/blob https://vercel.com/docs/storage/vercel-blob/using-blob-sdk
Expand Down
20 changes: 20 additions & 0 deletions app/(playground)/p/[agentId]/beta-proto/components/icons/circle-plus.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import type { FC, SVGProps } from "react";

export const CirclePlusIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
<svg
width="20"
height="20"
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<title>Circle Plus Icon</title>
<circle cx="10" cy="10" r="10" />
<path
fillRule="evenodd"
clipRule="evenodd"
d="M9.5001 13.9284C9.5001 14.2046 9.72396 14.4284 10.0001 14.4284C10.2762 14.4284 10.5001 14.2046 10.5001 13.9284V10.4999H13.9287C14.2048 10.4999 14.4287 10.276 14.4287 9.99986C14.4287 9.72372 14.2048 9.49986 13.9287 9.49986L10.5001 9.49986V6.07129C10.5001 5.79515 10.2762 5.57129 10.0001 5.57129C9.72396 5.57129 9.5001 5.79515 9.5001 6.07129V9.49986L6.07153 9.49986C5.79539 9.49986 5.57153 9.72372 5.57153 9.99986C5.57153 10.276 5.79539 10.4999 6.07153 10.4999H9.5001V13.9284Z"
/>
</svg>
);
14 changes: 14 additions & 0 deletions app/(playground)/p/[agentId]/beta-proto/components/icons/panel-open.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import type { FC, SVGProps } from "react";

export const PanelOpenIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
<svg
width="18"
height="18"
viewBox="0 0 18 18"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<title>Panel Open Icon</title>
<path d="M0.204546 0H17.1818C17.6318 0 18 0.368182 18 0.818182V17.1818C18 17.6318 17.6318 18 17.1818 18H0.204546C-0.245455 18 -0.613636 17.6318 -0.613636 17.1818V0.818182C-0.613636 0.368182 -0.245455 0 0.204546 0ZM16.3636 9.81818H9.20455L11.6509 12.2645C11.97 12.5836 11.97 13.0991 11.6509 13.4182C11.3318 13.7373 10.8164 13.7373 10.4973 13.4182L6.66 9.58091C6.66 9.58091 6.64364 9.55636 6.63545 9.54818C6.61091 9.51545 6.58636 9.48273 6.56182 9.45C6.53727 9.41727 6.51273 9.38455 6.49636 9.34364C6.49636 9.33545 6.48 9.31909 6.48 9.31091C6.47182 9.28636 6.47182 9.26182 6.46364 9.23727C6.44727 9.19636 6.43909 9.15545 6.43091 9.11455C6.43091 9.07364 6.43091 9.03273 6.43091 9C6.43091 8.95909 6.43091 8.91818 6.43091 8.88545C6.43091 8.84455 6.44727 8.80364 6.46364 8.76273C6.46364 8.73818 6.47182 8.71364 6.48 8.68909C6.48 8.68091 6.49636 8.66455 6.49636 8.65636C6.51273 8.61545 6.53727 8.58273 6.56182 8.55C6.58636 8.51727 6.60273 8.48455 6.63545 8.45182C6.64364 8.44364 6.65182 8.42727 6.66 8.41909L10.4973 4.58182C10.8164 4.26273 11.3318 4.26273 11.6509 4.58182C11.97 4.90091 11.97 5.41636 11.6509 5.73545L9.20455 8.18182H16.3636V1.63636H5.13818V16.3636H16.3636V9.81818ZM3.50182 16.3636V1.63636H1.45636V16.3636H3.50182Z" />
</svg>
);
116 changes: 71 additions & 45 deletions app/(playground)/p/[agentId]/beta-proto/editor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,17 +16,21 @@ import {
MousePositionProvider,
useMousePosition,
} from "./contexts/mouse-position";
import { useFeatureFlags } from "./feature-flags/context";
import {
giselleNodeArchetypes,
promptBlueprint,
textGeneratorBlueprint,
textGeneratorParameterNames,
} from "./giselle-node/blueprints";
import {
GiselleNode,
GiselleNodeInformationPanel,
} from "./giselle-node/components";
import { buildGiselleNode } from "./giselle-node/utils";
import { addNodesAndConnect } from "./graph/actions";
import { useGraph } from "./graph/context";
import { addNode } from "./graph/v2/composition/add-node";
import { Header } from "./header";
import { LeftMenu } from "./left-menu/left-menu";
import { edgeTypes, nodeTypes } from "./react-flow-adapter/giselle-node";
Expand All @@ -50,6 +54,7 @@ function EditorInner() {
const { handleConnect } = useConnectionHandler();
const { handleNodesChange } = useReactFlowNodeEventHandler();
const { handleEdgesChange } = useReacrFlowEdgeEventHandler();
const { playgroundV2Flag } = useFeatureFlags();
return (
<div className="w-full h-screen">
<ReactFlow<ReactFlowNode, ReactFlowEdge>
Expand All @@ -71,53 +76,74 @@ function EditorInner() {
x: event.clientX,
y: event.clientY,
});
if (
toolState.activeTool.giselleNodeBlueprint.archetype ===
giselleNodeArchetypes.textGenerator
) {
graphDispatch(
addNodesAndConnect({
sourceNode: {
node: promptBlueprint,
position: {
x: position.x - 300,
y: position.y + 100,
if (playgroundV2Flag) {
switch (toolState.activeTool.giselleNodeBlueprint.archetype) {
case giselleNodeArchetypes.textGenerator:
graphDispatch(
addNode({
input: {
node: buildGiselleNode({
node: textGeneratorBlueprint,
name: `Untitled node - ${graphState.graph.nodes.length + 1}`,
position: {
x: position.x - 300,
y: position.y + 100,
},
}),
},
}),
);
break;
}
} else {
if (
toolState.activeTool.giselleNodeBlueprint.archetype ===
giselleNodeArchetypes.textGenerator
) {
graphDispatch(
addNodesAndConnect({
sourceNode: {
node: promptBlueprint,
position: {
x: position.x - 300,
y: position.y + 100,
},
},
},
targetNode: {
node: toolState.activeTool.giselleNodeBlueprint,
position,
},
connector: {
targetParameterName:
textGeneratorParameterNames.instruction,
},
}),
);
}
if (
toolState.activeTool.giselleNodeBlueprint.archetype ===
giselleNodeArchetypes.webSearch
) {
graphDispatch(
addNodesAndConnect({
sourceNode: {
node: promptBlueprint,
position: {
x: position.x - 300,
y: position.y + 100,
targetNode: {
node: toolState.activeTool.giselleNodeBlueprint,
position,
},
connector: {
targetParameterName:
textGeneratorParameterNames.instruction,
},
}),
);
}
if (
toolState.activeTool.giselleNodeBlueprint.archetype ===
giselleNodeArchetypes.webSearch
) {
graphDispatch(
addNodesAndConnect({
sourceNode: {
node: promptBlueprint,
position: {
x: position.x - 300,
y: position.y + 100,
},
},
targetNode: {
node: toolState.activeTool.giselleNodeBlueprint,
position,
},
connector: {
targetParameterName:
textGeneratorParameterNames.instruction,
},
},
targetNode: {
node: toolState.activeTool.giselleNodeBlueprint,
position,
},
connector: {
targetParameterName:
textGeneratorParameterNames.instruction,
},
}),
);
}),
);
}
}
toolDispatch(setSelectTool);
}
Expand Down
1 change: 1 addition & 0 deletions app/(playground)/p/[agentId]/beta-proto/feature-flags/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,5 @@ export interface FeatureFlags {
debugFlag: boolean;
viewFlag: boolean;
gitHubIntegrationFlag: boolean;
playgroundV2Flag: boolean;
}
Loading

0 comments on commit b5f032c

Please sign in to comment.