Restore Ultracite + fix sidebar (#1233)
This commit is contained in:
parent
8fbfc253fa
commit
947ed094a6
177 changed files with 6908 additions and 8306 deletions
|
|
@ -1,5 +1,11 @@
|
|||
import { Artifact } from '@/components/create-artifact';
|
||||
import { CodeEditor } from '@/components/code-editor';
|
||||
import { toast } from "sonner";
|
||||
import { CodeEditor } from "@/components/code-editor";
|
||||
import {
|
||||
Console,
|
||||
type ConsoleOutput,
|
||||
type ConsoleOutputContent,
|
||||
} from "@/components/console";
|
||||
import { Artifact } from "@/components/create-artifact";
|
||||
import {
|
||||
CopyIcon,
|
||||
LogsIcon,
|
||||
|
|
@ -7,14 +13,8 @@ import {
|
|||
PlayIcon,
|
||||
RedoIcon,
|
||||
UndoIcon,
|
||||
} from '@/components/icons';
|
||||
import { toast } from 'sonner';
|
||||
import { generateUUID } from '@/lib/utils';
|
||||
import {
|
||||
Console,
|
||||
type ConsoleOutput,
|
||||
type ConsoleOutputContent,
|
||||
} from '@/components/console';
|
||||
} from "@/components/icons";
|
||||
import { generateUUID } from "@/lib/utils";
|
||||
|
||||
const OUTPUT_HANDLERS = {
|
||||
matplotlib: `
|
||||
|
|
@ -53,40 +53,40 @@ const OUTPUT_HANDLERS = {
|
|||
};
|
||||
|
||||
function detectRequiredHandlers(code: string): string[] {
|
||||
const handlers: string[] = ['basic'];
|
||||
const handlers: string[] = ["basic"];
|
||||
|
||||
if (code.includes('matplotlib') || code.includes('plt.')) {
|
||||
handlers.push('matplotlib');
|
||||
if (code.includes("matplotlib") || code.includes("plt.")) {
|
||||
handlers.push("matplotlib");
|
||||
}
|
||||
|
||||
return handlers;
|
||||
}
|
||||
|
||||
interface Metadata {
|
||||
outputs: Array<ConsoleOutput>;
|
||||
}
|
||||
type Metadata = {
|
||||
outputs: ConsoleOutput[];
|
||||
};
|
||||
|
||||
export const codeArtifact = new Artifact<'code', Metadata>({
|
||||
kind: 'code',
|
||||
export const codeArtifact = new Artifact<"code", Metadata>({
|
||||
kind: "code",
|
||||
description:
|
||||
'Useful for code generation; Code execution is only available for python code.',
|
||||
initialize: async ({ setMetadata }) => {
|
||||
"Useful for code generation; Code execution is only available for python code.",
|
||||
initialize: ({ setMetadata }) => {
|
||||
setMetadata({
|
||||
outputs: [],
|
||||
});
|
||||
},
|
||||
onStreamPart: ({ streamPart, setArtifact }) => {
|
||||
if (streamPart.type === 'data-codeDelta') {
|
||||
if (streamPart.type === "data-codeDelta") {
|
||||
setArtifact((draftArtifact) => ({
|
||||
...draftArtifact,
|
||||
content: streamPart.data,
|
||||
isVisible:
|
||||
draftArtifact.status === 'streaming' &&
|
||||
draftArtifact.status === "streaming" &&
|
||||
draftArtifact.content.length > 300 &&
|
||||
draftArtifact.content.length < 310
|
||||
? true
|
||||
: draftArtifact.isVisible,
|
||||
status: 'streaming',
|
||||
status: "streaming",
|
||||
}));
|
||||
}
|
||||
},
|
||||
|
|
@ -114,11 +114,11 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
actions: [
|
||||
{
|
||||
icon: <PlayIcon size={18} />,
|
||||
label: 'Run',
|
||||
description: 'Execute code',
|
||||
label: "Run",
|
||||
description: "Execute code",
|
||||
onClick: async ({ content, setMetadata }) => {
|
||||
const runId = generateUUID();
|
||||
const outputContent: Array<ConsoleOutputContent> = [];
|
||||
const outputContent: ConsoleOutputContent[] = [];
|
||||
|
||||
setMetadata((metadata) => ({
|
||||
...metadata,
|
||||
|
|
@ -127,7 +127,7 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
{
|
||||
id: runId,
|
||||
contents: [],
|
||||
status: 'in_progress',
|
||||
status: "in_progress",
|
||||
},
|
||||
],
|
||||
}));
|
||||
|
|
@ -135,15 +135,15 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
try {
|
||||
// @ts-expect-error - loadPyodide is not defined
|
||||
const currentPyodideInstance = await globalThis.loadPyodide({
|
||||
indexURL: 'https://cdn.jsdelivr.net/pyodide/v0.23.4/full/',
|
||||
indexURL: "https://cdn.jsdelivr.net/pyodide/v0.23.4/full/",
|
||||
});
|
||||
|
||||
currentPyodideInstance.setStdout({
|
||||
batched: (output: string) => {
|
||||
outputContent.push({
|
||||
type: output.startsWith('data:image/png;base64')
|
||||
? 'image'
|
||||
: 'text',
|
||||
type: output.startsWith("data:image/png;base64")
|
||||
? "image"
|
||||
: "text",
|
||||
value: output,
|
||||
});
|
||||
},
|
||||
|
|
@ -157,8 +157,8 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
...metadata.outputs.filter((output) => output.id !== runId),
|
||||
{
|
||||
id: runId,
|
||||
contents: [{ type: 'text', value: message }],
|
||||
status: 'loading_packages',
|
||||
contents: [{ type: "text", value: message }],
|
||||
status: "loading_packages",
|
||||
},
|
||||
],
|
||||
}));
|
||||
|
|
@ -169,12 +169,12 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
for (const handler of requiredHandlers) {
|
||||
if (OUTPUT_HANDLERS[handler as keyof typeof OUTPUT_HANDLERS]) {
|
||||
await currentPyodideInstance.runPythonAsync(
|
||||
OUTPUT_HANDLERS[handler as keyof typeof OUTPUT_HANDLERS],
|
||||
OUTPUT_HANDLERS[handler as keyof typeof OUTPUT_HANDLERS]
|
||||
);
|
||||
|
||||
if (handler === 'matplotlib') {
|
||||
if (handler === "matplotlib") {
|
||||
await currentPyodideInstance.runPythonAsync(
|
||||
'setup_matplotlib_output()',
|
||||
"setup_matplotlib_output()"
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -189,7 +189,7 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
{
|
||||
id: runId,
|
||||
contents: outputContent,
|
||||
status: 'completed',
|
||||
status: "completed",
|
||||
},
|
||||
],
|
||||
}));
|
||||
|
|
@ -200,8 +200,8 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
...metadata.outputs.filter((output) => output.id !== runId),
|
||||
{
|
||||
id: runId,
|
||||
contents: [{ type: 'text', value: error.message }],
|
||||
status: 'failed',
|
||||
contents: [{ type: "text", value: error.message }],
|
||||
status: "failed",
|
||||
},
|
||||
],
|
||||
}));
|
||||
|
|
@ -210,9 +210,9 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
},
|
||||
{
|
||||
icon: <UndoIcon size={18} />,
|
||||
description: 'View Previous version',
|
||||
description: "View Previous version",
|
||||
onClick: ({ handleVersionChange }) => {
|
||||
handleVersionChange('prev');
|
||||
handleVersionChange("prev");
|
||||
},
|
||||
isDisabled: ({ currentVersionIndex }) => {
|
||||
if (currentVersionIndex === 0) {
|
||||
|
|
@ -224,9 +224,9 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
},
|
||||
{
|
||||
icon: <RedoIcon size={18} />,
|
||||
description: 'View Next version',
|
||||
description: "View Next version",
|
||||
onClick: ({ handleVersionChange }) => {
|
||||
handleVersionChange('next');
|
||||
handleVersionChange("next");
|
||||
},
|
||||
isDisabled: ({ isCurrentVersion }) => {
|
||||
if (isCurrentVersion) {
|
||||
|
|
@ -238,24 +238,24 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
},
|
||||
{
|
||||
icon: <CopyIcon size={18} />,
|
||||
description: 'Copy code to clipboard',
|
||||
description: "Copy code to clipboard",
|
||||
onClick: ({ content }) => {
|
||||
navigator.clipboard.writeText(content);
|
||||
toast.success('Copied to clipboard!');
|
||||
toast.success("Copied to clipboard!");
|
||||
},
|
||||
},
|
||||
],
|
||||
toolbar: [
|
||||
{
|
||||
icon: <MessageIcon />,
|
||||
description: 'Add comments',
|
||||
description: "Add comments",
|
||||
onClick: ({ sendMessage }) => {
|
||||
sendMessage({
|
||||
role: 'user',
|
||||
role: "user",
|
||||
parts: [
|
||||
{
|
||||
type: 'text',
|
||||
text: 'Add comments to the code snippet for understanding',
|
||||
type: "text",
|
||||
text: "Add comments to the code snippet for understanding",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
|
@ -263,14 +263,14 @@ export const codeArtifact = new Artifact<'code', Metadata>({
|
|||
},
|
||||
{
|
||||
icon: <LogsIcon />,
|
||||
description: 'Add logs',
|
||||
description: "Add logs",
|
||||
onClick: ({ sendMessage }) => {
|
||||
sendMessage({
|
||||
role: 'user',
|
||||
role: "user",
|
||||
parts: [
|
||||
{
|
||||
type: 'text',
|
||||
text: 'Add logs to the code snippet for debugging',
|
||||
type: "text",
|
||||
text: "Add logs to the code snippet for debugging",
|
||||
},
|
||||
],
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
import { z } from 'zod';
|
||||
import { streamObject } from 'ai';
|
||||
import { myProvider } from '@/lib/ai/providers';
|
||||
import { codePrompt, updateDocumentPrompt } from '@/lib/ai/prompts';
|
||||
import { createDocumentHandler } from '@/lib/artifacts/server';
|
||||
import { streamObject } from "ai";
|
||||
import { z } from "zod";
|
||||
import { codePrompt, updateDocumentPrompt } from "@/lib/ai/prompts";
|
||||
import { myProvider } from "@/lib/ai/providers";
|
||||
import { createDocumentHandler } from "@/lib/artifacts/server";
|
||||
|
||||
export const codeDocumentHandler = createDocumentHandler<'code'>({
|
||||
kind: 'code',
|
||||
export const codeDocumentHandler = createDocumentHandler<"code">({
|
||||
kind: "code",
|
||||
onCreateDocument: async ({ title, dataStream }) => {
|
||||
let draftContent = '';
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamObject({
|
||||
model: myProvider.languageModel('artifact-model'),
|
||||
model: myProvider.languageModel("artifact-model"),
|
||||
system: codePrompt,
|
||||
prompt: title,
|
||||
schema: z.object({
|
||||
|
|
@ -21,14 +21,14 @@ export const codeDocumentHandler = createDocumentHandler<'code'>({
|
|||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === 'object') {
|
||||
if (type === "object") {
|
||||
const { object } = delta;
|
||||
const { code } = object;
|
||||
|
||||
if (code) {
|
||||
dataStream.write({
|
||||
type: 'data-codeDelta',
|
||||
data: code ?? '',
|
||||
type: "data-codeDelta",
|
||||
data: code ?? "",
|
||||
transient: true,
|
||||
});
|
||||
|
||||
|
|
@ -40,11 +40,11 @@ export const codeDocumentHandler = createDocumentHandler<'code'>({
|
|||
return draftContent;
|
||||
},
|
||||
onUpdateDocument: async ({ document, description, dataStream }) => {
|
||||
let draftContent = '';
|
||||
let draftContent = "";
|
||||
|
||||
const { fullStream } = streamObject({
|
||||
model: myProvider.languageModel('artifact-model'),
|
||||
system: updateDocumentPrompt(document.content, 'code'),
|
||||
model: myProvider.languageModel("artifact-model"),
|
||||
system: updateDocumentPrompt(document.content, "code"),
|
||||
prompt: description,
|
||||
schema: z.object({
|
||||
code: z.string(),
|
||||
|
|
@ -54,14 +54,14 @@ export const codeDocumentHandler = createDocumentHandler<'code'>({
|
|||
for await (const delta of fullStream) {
|
||||
const { type } = delta;
|
||||
|
||||
if (type === 'object') {
|
||||
if (type === "object") {
|
||||
const { object } = delta;
|
||||
const { code } = object;
|
||||
|
||||
if (code) {
|
||||
dataStream.write({
|
||||
type: 'data-codeDelta',
|
||||
data: code ?? '',
|
||||
type: "data-codeDelta",
|
||||
data: code ?? "",
|
||||
transient: true,
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue