Skip to content

Commit

Permalink
feat: execute python code snippets
Browse files Browse the repository at this point in the history
  • Loading branch information
@jeremyphilemon
jeremyphilemon committed Dec 10, 2024
1 parent 3df0fd4 commit 7d49dae
Show file tree
Hide file tree
Showing 6 changed files with 340 additions and 121 deletions.
25 changes: 16 additions & 9 deletions app/(chat)/layout.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import { cookies } from 'next/headers';
import { cookies } from "next/headers";

import { AppSidebar } from '@/components/app-sidebar';
import { SidebarInset, SidebarProvider } from '@/components/ui/sidebar';
import { AppSidebar } from "@/components/app-sidebar";
import { SidebarInset, SidebarProvider } from "@/components/ui/sidebar";

import { auth } from '../(auth)/auth';
import { auth } from "../(auth)/auth";
import Script from "next/script";

export const experimental_ppr = true;

Expand All @@ -13,12 +14,18 @@ export default async function Layout({
children: React.ReactNode;
}) {
const [session, cookieStore] = await Promise.all([auth(), cookies()]);
const isCollapsed = cookieStore.get('sidebar:state')?.value !== 'true';
const isCollapsed = cookieStore.get("sidebar:state")?.value !== "true";

return (
<SidebarProvider defaultOpen={!isCollapsed}>
<AppSidebar user={session?.user} />
<SidebarInset>{children}</SidebarInset>
</SidebarProvider>
<>
<Script
src="https://cdn.jsdelivr.net/pyodide/v0.23.4/full/pyodide.js"
strategy="beforeInteractive"
/>
<SidebarProvider defaultOpen={!isCollapsed}>
<AppSidebar user={session?.user} />
<SidebarInset>{children}</SidebarInset>
</SidebarProvider>
</>
);
}
89 changes: 47 additions & 42 deletions components/block.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,39 +3,40 @@ import type {
ChatRequestOptions,
CreateMessage,
Message,
} from 'ai';
import { formatDistance } from 'date-fns';
import { AnimatePresence, motion } from 'framer-motion';
} from "ai";
import { formatDistance } from "date-fns";
import { AnimatePresence, motion } from "framer-motion";
import {
type Dispatch,
memo,
type SetStateAction,
useCallback,
useEffect,
useState,
} from 'react';
import useSWR, { useSWRConfig } from 'swr';
import { useDebounceCallback, useWindowSize } from 'usehooks-ts';

import type { Document, Suggestion, Vote } from '@/lib/db/schema';
import { fetcher } from '@/lib/utils';

import { DiffView } from './diffview';
import { DocumentSkeleton } from './document-skeleton';
import { Editor } from './editor';
import { MultimodalInput } from './multimodal-input';
import { Toolbar } from './toolbar';
import { VersionFooter } from './version-footer';
import { BlockActions } from './block-actions';
import { BlockCloseButton } from './block-close-button';
import { BlockMessages } from './block-messages';
} from "react";
import useSWR, { useSWRConfig } from "swr";
import { useDebounceCallback, useWindowSize } from "usehooks-ts";

import type { Document, Suggestion, Vote } from "@/lib/db/schema";
import { fetcher } from "@/lib/utils";

import { DiffView } from "./diffview";
import { DocumentSkeleton } from "./document-skeleton";
import { Editor } from "./editor";
import { MultimodalInput } from "./multimodal-input";
import { Toolbar } from "./toolbar";
import { VersionFooter } from "./version-footer";
import { BlockActions } from "./block-actions";
import { BlockCloseButton } from "./block-close-button";
import { BlockMessages } from "./block-messages";
import { Markdown } from "./markdown";

export interface UIBlock {
title: string;
documentId: string;
content: string;
isVisible: boolean;
status: 'streaming' | 'idle';
status: "streaming" | "idle";
boundingBox: {
top: number;
left: number;
Expand Down Expand Up @@ -94,14 +95,14 @@ function PureBlock({
isLoading: isDocumentsFetching,
mutate: mutateDocuments,
} = useSWR<Array<Document>>(
block && block.status !== 'streaming'
block && block.status !== "streaming"
? `/api/document?id=${block.documentId}`
: null,
fetcher,
);

const { data: suggestions } = useSWR<Array<Suggestion>>(
documents && block && block.status !== 'streaming'
documents && block && block.status !== "streaming"
? `/api/suggestions?documentId=${block.documentId}`
: null,
fetcher,
Expand All @@ -110,7 +111,7 @@ function PureBlock({
},
);

const [mode, setMode] = useState<'edit' | 'diff'>('edit');
const [mode, setMode] = useState<"edit" | "diff">("edit");
const [document, setDocument] = useState<Document | null>(null);
const [currentVersionIndex, setCurrentVersionIndex] = useState(-1);

Expand All @@ -123,7 +124,7 @@ function PureBlock({
setCurrentVersionIndex(documents.length - 1);
setBlock((currentBlock) => ({
...currentBlock,
content: mostRecentDocument.content ?? '',
content: mostRecentDocument.content ?? "",
}));
}
}
Expand Down Expand Up @@ -154,7 +155,7 @@ function PureBlock({

if (currentDocument.content !== updatedContent) {
await fetch(`/api/document?id=${block.documentId}`, {
method: 'POST',
method: "POST",
body: JSON.stringify({
title: block.title,
content: updatedContent,
Expand Down Expand Up @@ -200,28 +201,28 @@ function PureBlock({
);

function getDocumentContentById(index: number) {
if (!documents) return '';
if (!documents[index]) return '';
return documents[index].content ?? '';
if (!documents) return "";
if (!documents[index]) return "";
return documents[index].content ?? "";
}

const handleVersionChange = (type: 'next' | 'prev' | 'toggle' | 'latest') => {
const handleVersionChange = (type: "next" | "prev" | "toggle" | "latest") => {
if (!documents) return;

if (type === 'latest') {
if (type === "latest") {
setCurrentVersionIndex(documents.length - 1);
setMode('edit');
setMode("edit");
}

if (type === 'toggle') {
setMode((mode) => (mode === 'edit' ? 'diff' : 'edit'));
if (type === "toggle") {
setMode((mode) => (mode === "edit" ? "diff" : "edit"));
}

if (type === 'prev') {
if (type === "prev") {
if (currentVersionIndex > 0) {
setCurrentVersionIndex((index) => index - 1);
}
} else if (type === 'next') {
} else if (type === "next") {
if (currentVersionIndex < documents.length - 1) {
setCurrentVersionIndex((index) => index + 1);
}
Expand Down Expand Up @@ -261,7 +262,7 @@ function PureBlock({
scale: 1,
transition: {
delay: 0.2,
type: 'spring',
type: "spring",
stiffness: 200,
damping: 30,
},
Expand Down Expand Up @@ -345,11 +346,11 @@ function PureBlock({
x: 0,
y: 0,
width: windowWidth,
height: '100dvh',
height: "100dvh",
borderRadius: 0,
transition: {
delay: 0,
type: 'spring',
type: "spring",
stiffness: 200,
damping: 30,
},
Expand All @@ -359,11 +360,11 @@ function PureBlock({
x: 400,
y: 0,
height: windowHeight,
width: windowWidth ? windowWidth - 400 : 'calc(100dvw-400px)',
width: windowWidth ? windowWidth - 400 : "calc(100dvw-400px)",
borderRadius: 0,
transition: {
delay: 0,
type: 'spring',
type: "spring",
stiffness: 200,
damping: 30,
},
Expand All @@ -374,7 +375,7 @@ function PureBlock({
scale: 0.5,
transition: {
delay: 0.1,
type: 'spring',
type: "spring",
stiffness: 600,
damping: 30,
},
Expand Down Expand Up @@ -422,7 +423,11 @@ function PureBlock({
<div className="flex flex-row max-w-[600px] mx-auto">
{isDocumentsFetching && !block.content ? (
<DocumentSkeleton />
) : mode === 'edit' ? (
) : true ? (
<div className="flex flex-col">
<Markdown>{block.content}</Markdown>
</div>
) : mode === "edit" ? (
<Editor
content={
isCurrentVersion
Expand Down
Loading

0 comments on commit 7d49dae

Please sign in to comment.