wip

samselikoff · samselikoff · commit b87ad3ce8269 · 2024-12-18T12:35:01.000-05:00
diff --git a/app/(main)/chats/[id]/code-viewer.tsx b/app/(main)/chats/[id]/code-viewer.tsx
@@ -103,13 +103,13 @@ export default function CodeViewer({
               <SyntaxHighlighter code={code} language={language} />
             </div>
           ) : (
-            <div>
+            <>
               {language && (
-                <div className="mt-8 flex items-center justify-center">
+                <div className="flex h-full items-center justify-center">
                   <CodeRunner language={language} code={code} key={refresh} />
                 </div>
               )}
-            </div>
+            </>
           )}
         </div>
       ) : (
@@ -156,7 +156,9 @@ export default function CodeViewer({
           <p className="text-sm">
             Version <span className="tabular-nums">{currentVersion + 1}</span>{" "}
             <span className="text-gray-400">of</span>{" "}
-            <span className="tabular-nums">{assistantMessages.length}</span>
+            <span className="tabular-nums">
+              {Math.max(currentVersion + 1, assistantMessages.length)}
+            </span>
           </p>
 
           {nextMessage ? (
diff --git a/app/(main)/page.tsx b/app/(main)/page.tsx
@@ -11,7 +11,7 @@ import assert from "assert";
 import Image from "next/image";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
-import { use, useState } from "react";
+import { startTransition, use, useState } from "react";
 import TextareaAutosize from "react-textarea-autosize";
 import { createChat, getNextCompletionStreamPromise } from "./actions";
 import { Context } from "./providers";
@@ -77,9 +77,11 @@ export default function Home() {
               lastMessageId,
               model,
             );
-            setStreamPromise(streamPromise);
 
-            router.push(`/chats/${chatId}`);
+            startTransition(() => {
+              setStreamPromise(streamPromise);
+              router.push(`/chats/${chatId}`);
+            });
           }}
         >
           <Fieldset>
@@ -89,7 +91,7 @@ export default function Home() {
                 required
                 name="prompt"
                 rows={1}
-                className="peer relative w-full resize-none bg-transparent p-2 placeholder-gray-500 focus:outline-none"
+                className="peer relative w-full resize-none bg-transparent p-2 placeholder-gray-500 focus:outline-none disabled:opacity-50"
                 value={prompt}
                 onChange={(e) => setPrompt(e.target.value)}
                 onKeyDown={(event) => {
diff --git a/app/share/layout.tsx b/app/share/layout.tsx
@@ -1,6 +1,6 @@
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
-    <body className="flex min-h-full flex-col items-center justify-center">
+    <body className="flex h-full min-h-full flex-col items-center justify-center">
       {children}
     </body>
   );
diff --git a/app/share/v2/[messageId]/page.tsx b/app/share/v2/[messageId]/page.tsx
@@ -44,7 +44,7 @@ export default async function SharePage({
   }
 
   return (
-    <div className="flex h-full items-center justify-center">
+    <div className="flex h-full w-full grow items-center justify-center">
       <CodeRunner language={app.language} code={app.code} />
     </div>
   );
diff --git a/components/code-runner-react.tsx b/components/code-runner-react.tsx
@@ -12,6 +12,7 @@ export default function ReactCodeRunner({ code }: { code: string }) {
     <SandpackProvider
       key={code}
       template="react-ts"
+      className="h-full w-full [&_.sp-preview-container]:flex [&_.sp-preview-container]:h-full [&_.sp-preview-container]:w-full [&_.sp-preview-container]:grow [&_.sp-preview-container]:flex-col [&_.sp-preview-container]:justify-center [&_.sp-preview-iframe]:grow"
       files={{
         "App.tsx": code,
         ...shadcnFiles,
@@ -31,7 +32,7 @@ export default function ReactCodeRunner({ code }: { code: string }) {
         showRefreshButton={false}
         showRestartButton={false}
         showOpenNewtab={false}
-        className="w-full"
+        className="h-full w-full"
       />
     </SandpackProvider>
   );
diff --git a/components/code-runner.tsx b/components/code-runner.tsx
@@ -12,6 +12,8 @@ export default function CodeRunner({
   language: string;
   code: string;
 }) {
+  return <CodeRunnerReact code={code} />;
+
   return (
     <>
       {language === "python" ? (

Original file line number	Diff line number	Diff line change
`@@ -44,7 +44,7 @@ export default async function SharePage({`
`44`	`44`	`}`
`45`	`45`
`46`	`46`	`return (`
`47`		`- <div className="flex h-full items-center justify-center">`
	`47`	`+ <div className="flex h-full w-full grow items-center justify-center">`
`48`	`48`	`<CodeRunner language={app.language} code={app.code} />`
`49`	`49`	`</div>`
`50`	`50`	`);`