Restore Ultracite + fix sidebar (#1233)

artifacts/image/client.tsx

@@ -1,18 +1,18 @@
-import { Artifact } from '@/components/create-artifact';
-import { CopyIcon, RedoIcon, UndoIcon } from '@/components/icons';
-import { ImageEditor } from '@/components/image-editor';
-import { toast } from 'sonner';
+import { toast } from "sonner";
+import { Artifact } from "@/components/create-artifact";
+import { CopyIcon, RedoIcon, UndoIcon } from "@/components/icons";
+import { ImageEditor } from "@/components/image-editor";
 
 export const imageArtifact = new Artifact({
-  kind: 'image',
-  description: 'Useful for image generation',
+  kind: "image",
+  description: "Useful for image generation",
   onStreamPart: ({ streamPart, setArtifact }) => {
-    if (streamPart.type === 'data-imageDelta') {
+    if (streamPart.type === "data-imageDelta") {
       setArtifact((draftArtifact) => ({
         ...draftArtifact,
         content: streamPart.data,
         isVisible: true,
-        status: 'streaming',
+        status: "streaming",
       }));
     }
   },
@@ -20,9 +20,9 @@ export const imageArtifact = new Artifact({
   actions: [
     {
       icon: <UndoIcon size={18} />,
-      description: 'View Previous version',
+      description: "View Previous version",
       onClick: ({ handleVersionChange }) => {
-        handleVersionChange('prev');
+        handleVersionChange("prev");
       },
       isDisabled: ({ currentVersionIndex }) => {
         if (currentVersionIndex === 0) {
@@ -34,9 +34,9 @@ export const imageArtifact = new Artifact({
     },
     {
       icon: <RedoIcon size={18} />,
-      description: 'View Next version',
+      description: "View Next version",
       onClick: ({ handleVersionChange }) => {
-        handleVersionChange('next');
+        handleVersionChange("next");
       },
       isDisabled: ({ isCurrentVersion }) => {
         if (isCurrentVersion) {
@@ -48,27 +48,27 @@ export const imageArtifact = new Artifact({
     },
     {
       icon: <CopyIcon size={18} />,
-      description: 'Copy image to clipboard',
+      description: "Copy image to clipboard",
       onClick: ({ content }) => {
         const img = new Image();
         img.src = `data:image/png;base64,${content}`;
 
         img.onload = () => {
-          const canvas = document.createElement('canvas');
+          const canvas = document.createElement("canvas");
           canvas.width = img.width;
           canvas.height = img.height;
-          const ctx = canvas.getContext('2d');
+          const ctx = canvas.getContext("2d");
           ctx?.drawImage(img, 0, 0);
           canvas.toBlob((blob) => {
             if (blob) {
               navigator.clipboard.write([
-                new ClipboardItem({ 'image/png': blob }),
+                new ClipboardItem({ "image/png": blob }),
               ]);
             }
-          }, 'image/png');
+          }, "image/png");
         };
 
-        toast.success('Copied image to clipboard!');
+        toast.success("Copied image to clipboard!");
       },
     },
   ],