feat: v1 — persistent shell, model gateway, artifact improvements (#1462)
This commit is contained in:
dancer
GitHub
parent
3651670fb9
commit
f9652b452a
161 changed files with 5166 additions and 8009 deletions
|
|
@ -1,11 +1,11 @@
|
|||
import { toast } from "sonner";
|
||||
import { CodeEditor } from "@/components/code-editor";
|
||||
import { CodeEditor } from "@/components/chat/code-editor";
|
||||
import {
|
||||
Console,
|
||||
type ConsoleOutput,
|
||||
type ConsoleOutputContent,
|
||||
} from "@/components/console";
|
||||
import { Artifact } from "@/components/create-artifact";
|
||||
} from "@/components/chat/console";
|
||||
import { Artifact } from "@/components/chat/create-artifact";
|
||||
import {
|
||||
CopyIcon,
|
||||
LogsIcon,
|
||||
|
|
@ -13,7 +13,7 @@ import {
|
|||
PlayIcon,
|
||||
RedoIcon,
|
||||
UndoIcon,
|
||||
} from "@/components/icons";
|
||||
} from "@/components/chat/icons";
|
||||
import { generateUUID } from "@/lib/utils";
|
||||
|
||||
const OUTPUT_HANDLERS = {
|
||||
|
|
@ -93,7 +93,7 @@ export const codeArtifact = new Artifact<"code", Metadata>({
|
|||
content: ({ metadata, setMetadata, ...props }) => {
|
||||
return (
|
||||
<>
|
||||
<div className="px-1">
|
||||
<div className="relative min-h-[200px]">
|
||||
<CodeEditor {...props} />
|
||||
</div>
|
||||
|
||||
|
|
@ -193,14 +193,20 @@ export const codeArtifact = new Artifact<"code", Metadata>({
|
|||
},
|
||||
],
|
||||
}));
|
||||
} catch (error: any) {
|
||||
} catch (error: unknown) {
|
||||
setMetadata((metadata) => ({
|
||||
...metadata,
|
||||
outputs: [
|
||||
...metadata.outputs.filter((output) => output.id !== runId),
|
||||
{
|
||||
id: runId,
|
||||
contents: [{ type: "text", value: error.message }],
|
||||
contents: [
|
||||
{
|
||||
type: "text",
|
||||
value:
|
||||
error instanceof Error ? error.message : String(error),
|
||||
},
|
||||
],
|
||||
status: "failed",
|
||||
},
|
||||
],
|
||||
|
|
|
|||
|
|
@ -1,75 +1,59 @@
|
|||
import { streamObject } from "ai";
|
||||
import { z } from "zod";
|
||||
import { streamText } from "ai";
|
||||
import { codePrompt, updateDocumentPrompt } from "@/lib/ai/prompts";
|
||||
import { getArtifactModel } from "@/lib/ai/providers";
|
||||
import { getLanguageModel } from "@/lib/ai/providers";
|
||||
import { createDocumentHandler } from "@/lib/artifacts/server";
|
||||
|
||||
function stripFences(code: string): string {
|
||||
return code
|
||||
.replace(/^```[\w]*\n?/, "")
|
||||
.replace(/\n?```\s*$/, "")
|
||||
.trim();
|
||||
}
|
||||
|
||||
export const codeDocumentHandler = createDocumentHandler<"code">({
|
||||
kind: "code",
|
||||
onCreateDocument: async ({ title, dataStream }) => {
|
||||
onCreateDocument: async ({ title, dataStream, modelId }) => {
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamObject({
|
||||
model: getArtifactModel(),
|
||||
system: codePrompt,
|
||||
const { fullStream } = streamText({
|
||||
model: getLanguageModel(modelId),
|
||||
system: `${codePrompt}\n\nOutput ONLY the code. No explanations, no markdown fences, no wrapping.`,
|
||||
prompt: title,
|
||||
schema: z.object({
|
||||
code: z.string(),
|
||||
}),
|
||||
});
|
||||
|
||||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === "object") {
|
||||
const { object } = delta;
|
||||
const { code } = object;
|
||||
|
||||
if (code) {
|
||||
dataStream.write({
|
||||
type: "data-codeDelta",
|
||||
data: code ?? "",
|
||||
transient: true,
|
||||
});
|
||||
|
||||
draftContent = code;
|
||||
}
|
||||
if (delta.type === "text-delta") {
|
||||
draftContent += delta.text;
|
||||
dataStream.write({
|
||||
type: "data-codeDelta",
|
||||
data: stripFences(draftContent),
|
||||
transient: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return draftContent;
|
||||
return stripFences(draftContent);
|
||||
},
|
||||
onUpdateDocument: async ({ document, description, dataStream }) => {
|
||||
onUpdateDocument: async ({ document, description, dataStream, modelId }) => {
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamObject({
|
||||
model: getArtifactModel(),
|
||||
system: updateDocumentPrompt(document.content, "code"),
|
||||
const { fullStream } = streamText({
|
||||
model: getLanguageModel(modelId),
|
||||
system: `${updateDocumentPrompt(document.content, "code")}\n\nOutput ONLY the complete updated code. No explanations, no markdown fences, no wrapping.`,
|
||||
prompt: description,
|
||||
schema: z.object({
|
||||
code: z.string(),
|
||||
}),
|
||||
});
|
||||
|
||||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === "object") {
|
||||
const { object } = delta;
|
||||
const { code } = object;
|
||||
|
||||
if (code) {
|
||||
dataStream.write({
|
||||
type: "data-codeDelta",
|
||||
data: code ?? "",
|
||||
transient: true,
|
||||
});
|
||||
|
||||
draftContent = code;
|
||||
}
|
||||
if (delta.type === "text-delta") {
|
||||
draftContent += delta.text;
|
||||
dataStream.write({
|
||||
type: "data-codeDelta",
|
||||
data: stripFences(draftContent),
|
||||
transient: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return draftContent;
|
||||
return stripFences(draftContent);
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { toast } from "sonner";
|
||||
import { Artifact } from "@/components/create-artifact";
|
||||
import { CopyIcon, RedoIcon, UndoIcon } from "@/components/icons";
|
||||
import { ImageEditor } from "@/components/image-editor";
|
||||
import { Artifact } from "@/components/chat/create-artifact";
|
||||
import { CopyIcon, RedoIcon, UndoIcon } from "@/components/chat/icons";
|
||||
import { ImageEditor } from "@/components/chat/image-editor";
|
||||
|
||||
export const imageArtifact = new Artifact({
|
||||
kind: "image",
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
import { parse, unparse } from "papaparse";
|
||||
import { toast } from "sonner";
|
||||
import { Artifact } from "@/components/create-artifact";
|
||||
import { Artifact } from "@/components/chat/create-artifact";
|
||||
import {
|
||||
CopyIcon,
|
||||
LineChartIcon,
|
||||
RedoIcon,
|
||||
SparklesIcon,
|
||||
UndoIcon,
|
||||
} from "@/components/icons";
|
||||
import { SpreadsheetEditor } from "@/components/sheet-editor";
|
||||
} from "@/components/chat/icons";
|
||||
import { SpreadsheetEditor } from "@/components/chat/sheet-editor";
|
||||
|
||||
type Metadata = any;
|
||||
type Metadata = Record<string, never>;
|
||||
|
||||
export const sheetArtifact = new Artifact<"sheet", Metadata>({
|
||||
kind: "sheet",
|
||||
|
|
|
|||
|
|
@ -1,78 +1,49 @@
|
|||
import { streamObject } from "ai";
|
||||
import { z } from "zod";
|
||||
import { streamText } from "ai";
|
||||
import { sheetPrompt, updateDocumentPrompt } from "@/lib/ai/prompts";
|
||||
import { getArtifactModel } from "@/lib/ai/providers";
|
||||
import { getLanguageModel } from "@/lib/ai/providers";
|
||||
import { createDocumentHandler } from "@/lib/artifacts/server";
|
||||
|
||||
export const sheetDocumentHandler = createDocumentHandler<"sheet">({
|
||||
kind: "sheet",
|
||||
onCreateDocument: async ({ title, dataStream }) => {
|
||||
onCreateDocument: async ({ title, dataStream, modelId }) => {
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamObject({
|
||||
model: getArtifactModel(),
|
||||
system: sheetPrompt,
|
||||
const { fullStream } = streamText({
|
||||
model: getLanguageModel(modelId),
|
||||
system: `${sheetPrompt}\n\nOutput ONLY the raw CSV data. No explanations, no markdown fences.`,
|
||||
prompt: title,
|
||||
schema: z.object({
|
||||
csv: z.string().describe("CSV data"),
|
||||
}),
|
||||
});
|
||||
|
||||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === "object") {
|
||||
const { object } = delta;
|
||||
const { csv } = object;
|
||||
|
||||
if (csv) {
|
||||
dataStream.write({
|
||||
type: "data-sheetDelta",
|
||||
data: csv,
|
||||
transient: true,
|
||||
});
|
||||
|
||||
draftContent = csv;
|
||||
}
|
||||
if (delta.type === "text-delta") {
|
||||
draftContent += delta.text;
|
||||
dataStream.write({
|
||||
type: "data-sheetDelta",
|
||||
data: draftContent,
|
||||
transient: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
dataStream.write({
|
||||
type: "data-sheetDelta",
|
||||
data: draftContent,
|
||||
transient: true,
|
||||
});
|
||||
|
||||
return draftContent;
|
||||
},
|
||||
onUpdateDocument: async ({ document, description, dataStream }) => {
|
||||
onUpdateDocument: async ({ document, description, dataStream, modelId }) => {
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamObject({
|
||||
model: getArtifactModel(),
|
||||
system: updateDocumentPrompt(document.content, "sheet"),
|
||||
const { fullStream } = streamText({
|
||||
model: getLanguageModel(modelId),
|
||||
system: `${updateDocumentPrompt(document.content, "sheet")}\n\nOutput ONLY the raw CSV data. No explanations, no markdown fences.`,
|
||||
prompt: description,
|
||||
schema: z.object({
|
||||
csv: z.string(),
|
||||
}),
|
||||
});
|
||||
|
||||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === "object") {
|
||||
const { object } = delta;
|
||||
const { csv } = object;
|
||||
|
||||
if (csv) {
|
||||
dataStream.write({
|
||||
type: "data-sheetDelta",
|
||||
data: csv,
|
||||
transient: true,
|
||||
});
|
||||
|
||||
draftContent = csv;
|
||||
}
|
||||
if (delta.type === "text-delta") {
|
||||
draftContent += delta.text;
|
||||
dataStream.write({
|
||||
type: "data-sheetDelta",
|
||||
data: draftContent,
|
||||
transient: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { toast } from "sonner";
|
||||
import { Artifact } from "@/components/create-artifact";
|
||||
import { DiffView } from "@/components/diffview";
|
||||
import { DocumentSkeleton } from "@/components/document-skeleton";
|
||||
import { Artifact } from "@/components/chat/create-artifact";
|
||||
import { DiffView } from "@/components/chat/diffview";
|
||||
import { DocumentSkeleton } from "@/components/chat/document-skeleton";
|
||||
import {
|
||||
ClockRewind,
|
||||
CopyIcon,
|
||||
|
|
@ -9,8 +9,8 @@ import {
|
|||
PenIcon,
|
||||
RedoIcon,
|
||||
UndoIcon,
|
||||
} from "@/components/icons";
|
||||
import { Editor } from "@/components/text-editor";
|
||||
} from "@/components/chat/icons";
|
||||
import { Editor } from "@/components/chat/text-editor";
|
||||
import type { Suggestion } from "@/lib/db/schema";
|
||||
import { getSuggestions } from "../actions";
|
||||
|
||||
|
|
@ -69,21 +69,28 @@ export const textArtifact = new Artifact<"text", TextArtifactMetadata>({
|
|||
}
|
||||
|
||||
if (mode === "diff") {
|
||||
const oldContent = getDocumentContentById(currentVersionIndex - 1);
|
||||
const newContent = getDocumentContentById(currentVersionIndex);
|
||||
const selectedContent = getDocumentContentById(currentVersionIndex);
|
||||
const prevContent =
|
||||
currentVersionIndex > 0
|
||||
? getDocumentContentById(currentVersionIndex - 1)
|
||||
: selectedContent;
|
||||
|
||||
return <DiffView newContent={newContent} oldContent={oldContent} />;
|
||||
return (
|
||||
<div className="flex flex-row px-4 py-8 md:px-16 md:py-12 lg:px-20">
|
||||
<DiffView newContent={selectedContent} oldContent={prevContent} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex flex-row px-4 py-8 md:p-20">
|
||||
<div className="flex flex-row px-4 py-8 md:px-16 md:py-12 lg:px-20">
|
||||
<Editor
|
||||
content={content}
|
||||
currentVersionIndex={currentVersionIndex}
|
||||
isCurrentVersion={isCurrentVersion}
|
||||
onSaveContent={onSaveContent}
|
||||
status={status}
|
||||
suggestions={metadata ? metadata.suggestions : []}
|
||||
suggestions={isCurrentVersion && metadata ? metadata.suggestions : []}
|
||||
/>
|
||||
|
||||
{metadata?.suggestions && metadata.suggestions.length > 0 ? (
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
import { smoothStream, streamText } from "ai";
|
||||
import { updateDocumentPrompt } from "@/lib/ai/prompts";
|
||||
import { getArtifactModel } from "@/lib/ai/providers";
|
||||
import { getLanguageModel } from "@/lib/ai/providers";
|
||||
import { createDocumentHandler } from "@/lib/artifacts/server";
|
||||
|
||||
export const textDocumentHandler = createDocumentHandler<"text">({
|
||||
kind: "text",
|
||||
onCreateDocument: async ({ title, dataStream }) => {
|
||||
onCreateDocument: async ({ title, dataStream, modelId }) => {
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamText({
|
||||
model: getArtifactModel(),
|
||||
model: getLanguageModel(modelId),
|
||||
system:
|
||||
"Write about the given topic. Markdown is supported. Use headings wherever appropriate.",
|
||||
experimental_transform: smoothStream({ chunking: "word" }),
|
||||
|
|
@ -17,16 +17,11 @@ export const textDocumentHandler = createDocumentHandler<"text">({
|
|||
});
|
||||
|
||||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === "text-delta") {
|
||||
const { text } = delta;
|
||||
|
||||
draftContent += text;
|
||||
|
||||
if (delta.type === "text-delta") {
|
||||
draftContent += delta.text;
|
||||
dataStream.write({
|
||||
type: "data-textDelta",
|
||||
data: text,
|
||||
data: delta.text,
|
||||
transient: true,
|
||||
});
|
||||
}
|
||||
|
|
@ -34,35 +29,22 @@ export const textDocumentHandler = createDocumentHandler<"text">({
|
|||
|
||||
return draftContent;
|
||||
},
|
||||
onUpdateDocument: async ({ document, description, dataStream }) => {
|
||||
onUpdateDocument: async ({ document, description, dataStream, modelId }) => {
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamText({
|
||||
model: getArtifactModel(),
|
||||
model: getLanguageModel(modelId),
|
||||
system: updateDocumentPrompt(document.content, "text"),
|
||||
experimental_transform: smoothStream({ chunking: "word" }),
|
||||
prompt: description,
|
||||
providerOptions: {
|
||||
openai: {
|
||||
prediction: {
|
||||
type: "content",
|
||||
content: document.content,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === "text-delta") {
|
||||
const { text } = delta;
|
||||
|
||||
draftContent += text;
|
||||
|
||||
if (delta.type === "text-delta") {
|
||||
draftContent += delta.text;
|
||||
dataStream.write({
|
||||
type: "data-textDelta",
|
||||
data: text,
|
||||
data: delta.text,
|
||||
transient: true,
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue