@tscircuit/fake-snippets 0.0.66 → 0.0.68

package/src/components/dialogs/edit-package-details-dialog.tsx

@@ -16,6 +16,7 @@ import {
   Dialog,
   DialogContent,
   DialogDescription,
+  DialogFooter,
   DialogHeader,
   DialogTitle,
 } from "../ui/dialog"
@@ -217,151 +218,157 @@ export const EditPackageDetailsDialog = ({
         </DialogContent>
       </Dialog>
       <Dialog open={open !== showConfirmDelete} onOpenChange={onOpenChange}>
-        <DialogContent className="sm:max-w-[500px] lg:h-[70vh] sm:h-[90vh] overflow-y-auto w-[95vw] p-6 gap-6 rounded-2xl shadow-lg">
-          <DialogHeader>
-            <DialogTitle>Edit Package Details</DialogTitle>
-            <DialogDescription>
-              Update your package’s description, website, visibility, or delete
-              it.
-            </DialogDescription>
-          </DialogHeader>
+        <DialogContent className="sm:max-w-[500px] lg:h-[70vh] sm:h-[90vh] overflow-y-auto w-[95vw] h-[80vh] p-6 gap-6 rounded-2xl shadow-lg">
+          <div className="flex flex-col gap-10">
+            <DialogHeader>
+              <DialogTitle>Edit Package Details</DialogTitle>
+              <DialogDescription>
+                Update your package's description, website, visibility, or
+                delete it.
+              </DialogDescription>
+            </DialogHeader>
+            <div className="">
+              <div className="grid gap-2">
+                <div className="space-y-1">
+                  <Label htmlFor="website">Website</Label>
+                  <Input
+                    id="website"
+                    value={formData.website}
+                    onChange={(e) =>
+                      setFormData((prev) => ({
+                        ...prev,
+                        website: e.target.value,
+                      }))
+                    }
+                    placeholder="https://example.com"
+                    disabled={updatePackageDetailsMutation.isLoading}
+                    className="w-full"
+                    aria-invalid={!!websiteError}
+                  />
+                  {websiteError && (
+                    <p className="text-sm text-red-500">{websiteError}</p>
+                  )}
+                </div>
+                <div className="space-y-1">
+                  <Label htmlFor="visibility">Visibility</Label>
+                  <Select
+                    value={formData.visibility}
+                    onValueChange={(val) => {
+                      setFormData((prev) => ({
+                        ...prev,
+                        visibility: val,
+                      }))
+                    }}
+                    disabled={updatePackageDetailsMutation.isLoading}
+                  >
+                    <SelectTrigger className="w-full">
+                      <SelectValue placeholder="Select visibility" />
+                    </SelectTrigger>
+                    <SelectContent className="!z-[999]">
+                      <SelectItem value="public">public</SelectItem>
+                      <SelectItem value="private">private</SelectItem>
+                    </SelectContent>
+                  </Select>
+                </div>
+                <div className="space-y-1">
+                  <Label htmlFor="description">Description</Label>
+                  <Textarea
+                    id="description"
+                    value={formData.description}
+                    onChange={(e) =>
+                      setFormData((prev) => ({
+                        ...prev,
+                        description: e.target.value,
+                      }))
+                    }
+                    placeholder="Enter package description"
+                    disabled={updatePackageDetailsMutation.isLoading}
+                    className="w-full min-h-[80px] resize-none"
+                  />
+                </div>
+                <div className="space-y-1">
+                  <Label htmlFor="license">License</Label>
+                  <Select
+                    value={formData.license || "unset"}
+                    onValueChange={(value) =>
+                      setFormData((prev) => ({
+                        ...prev,
+                        license: value === "unset" ? null : value,
+                      }))
+                    }
+                    disabled={updatePackageDetailsMutation.isLoading}
+                  >
+                    <SelectTrigger className="w-full">
+                      <SelectValue placeholder="Select a license" />
+                    </SelectTrigger>
+                    <SelectContent className="!z-[999]">
+                      <SelectItem value="MIT">MIT</SelectItem>
+                      <SelectItem value="Apache-2.0">Apache-2.0</SelectItem>
+                      <SelectItem value="BSD-3-Clause">BSD-3-Clause</SelectItem>
+                      <SelectItem value="GPL-3.0">GPL-3.0</SelectItem>
+                      <SelectItem value="unset">Unset</SelectItem>
+                    </SelectContent>
+                  </Select>
+                </div>
+              </div>
 
-          <div className="grid gap-4">
-            <div className="space-y-1">
-              <Label htmlFor="website">Website</Label>
-              <Input
-                id="website"
-                value={formData.website}
-                onChange={(e) =>
-                  setFormData((prev) => ({
-                    ...prev,
-                    website: e.target.value,
-                  }))
-                }
-                placeholder="https://example.com"
-                disabled={updatePackageDetailsMutation.isLoading}
-                className="w-full"
-                aria-invalid={!!websiteError}
-              />
-              {websiteError && (
-                <p className="text-sm text-red-500">{websiteError}</p>
-              )}
-            </div>
-            <div className="space-y-1">
-              <Label htmlFor="visibility">Visibility</Label>
-              <Select
-                value={formData.visibility}
-                onValueChange={(val) => {
-                  setFormData((prev) => ({
-                    ...prev,
-                    visibility: val,
-                  }))
-                }}
-                disabled={updatePackageDetailsMutation.isLoading}
+              <details
+                className="mt-2 rounded-md"
+                onToggle={(e) => setDangerOpen(e.currentTarget.open)}
               >
-                <SelectTrigger className="w-full">
-                  <SelectValue placeholder="Select visibility" />
-                </SelectTrigger>
-                <SelectContent className="!z-[999]">
-                  <SelectItem value="public">public</SelectItem>
-                  <SelectItem value="private">private</SelectItem>
-                </SelectContent>
-              </Select>
+                <summary className="cursor-pointer p-2 font-medium text-sm text-black list-none flex justify-between items-center">
+                  Danger Zone
+                  <ChevronDown
+                    className={`w-4 h-4 mr-1 transition-transform ${dangerOpen ? "rotate-180" : ""}`}
+                  />
+                </summary>
+                <div className="p-2 pr-2">
+                  <div className="flex justify-between items-center">
+                    <div>
+                      <p className="text-sm text-muted-foreground">
+                        Once deleted, it cannot be recovered.
+                      </p>
+                    </div>
+                    <Button
+                      variant="destructive"
+                      size="default"
+                      onClick={() => setShowConfirmDelete(true)}
+                      disabled={deleting}
+                      className="shrink-0 lg:w-[115px] w-[70px]"
+                    >
+                      {deleting ? "Deleting..." : "Delete"}
+                    </Button>
+                  </div>
+                </div>
+              </details>
             </div>
-            <div className="space-y-1">
-              <Label htmlFor="description">Description</Label>
-              <Textarea
-                id="description"
-                value={formData.description}
-                onChange={(e) =>
-                  setFormData((prev) => ({
-                    ...prev,
-                    description: e.target.value,
-                  }))
-                }
-                placeholder="Enter package description"
+          </div>
+
+          <DialogFooter className="mt-auto">
+            <div className="lg:px-2 flex flex-col sm:flex-row justify-end gap-2">
+              <Button
+                variant="outline"
+                onClick={() => onOpenChange(false)}
                 disabled={updatePackageDetailsMutation.isLoading}
-                className="w-full min-h-[100px] resize-none"
-              />
-            </div>
-            <div className="space-y-1">
-              <Label htmlFor="license">License</Label>
-              <Select
-                value={formData.license || "unset"}
-                onValueChange={(value) =>
-                  setFormData((prev) => ({
-                    ...prev,
-                    license: value === "unset" ? null : value,
-                  }))
+                className="sm:w-auto w-full"
+              >
+                Cancel
+              </Button>
+              <Button
+                onClick={() => updatePackageDetailsMutation.mutate()}
+                disabled={
+                  updatePackageDetailsMutation.isLoading ||
+                  !hasChanges ||
+                  !isFormValid
                 }
-                disabled={updatePackageDetailsMutation.isLoading}
+                className="sm:w-auto lg:w-[115px]"
               >
-                <SelectTrigger className="w-full">
-                  <SelectValue placeholder="Select a license" />
-                </SelectTrigger>
-                <SelectContent className="!z-[999]">
-                  <SelectItem value="MIT">MIT</SelectItem>
-                  <SelectItem value="Apache-2.0">Apache-2.0</SelectItem>
-                  <SelectItem value="BSD-3-Clause">BSD-3-Clause</SelectItem>
-                  <SelectItem value="GPL-3.0">GPL-3.0</SelectItem>
-                  <SelectItem value="unset">Unset</SelectItem>
-                </SelectContent>
-              </Select>
-            </div>
-          </div>
-          <details
-            className="mt-2 rounded-md"
-            onToggle={(e) => setDangerOpen(e.currentTarget.open)}
-          >
-            <summary className="cursor-pointer p-2 font-medium text-sm text-black list-none flex justify-between items-center">
-              Danger Zone
-              <ChevronDown
-                className={`w-4 h-4 mr-1 transition-transform ${dangerOpen ? "rotate-180" : ""}`}
-              />
-            </summary>
-            <div className="p-2 pr-2">
-              <div className="flex justify-between items-center">
-                <div>
-                  <p className="text-sm text-muted-foreground">
-                    Once deleted, it cannot be recovered.
-                  </p>
-                </div>
-                <Button
-                  variant="destructive"
-                  size="default"
-                  onClick={() => setShowConfirmDelete(true)}
-                  disabled={deleting}
-                  className="shrink-0 lg:w-[115px] w-[70px]"
-                >
-                  {deleting ? "Deleting..." : "Delete"}
-                </Button>
-              </div>
+                {updatePackageDetailsMutation.isLoading
+                  ? "Updating..."
+                  : "Save Changes"}
+              </Button>
             </div>
-          </details>
-
-          <div className=" lg:px-2 flex flex-col sm:flex-row justify-end gap-3">
-            <Button
-              variant="outline"
-              onClick={() => onOpenChange(false)}
-              disabled={updatePackageDetailsMutation.isLoading}
-              className="sm:w-auto w-full"
-            >
-              Cancel
-            </Button>
-            <Button
-              onClick={() => updatePackageDetailsMutation.mutate()}
-              disabled={
-                updatePackageDetailsMutation.isLoading ||
-                !hasChanges ||
-                !isFormValid
-              }
-              className="sm:w-auto lg:w-[115px]"
-            >
-              {updatePackageDetailsMutation.isLoading
-                ? "Updating..."
-                : "Save Changes"}
-            </Button>
-          </div>
+          </DialogFooter>
         </DialogContent>
       </Dialog>
     </div>

package/src/components/package-port/CodeAndPreview.tsx

@@ -22,6 +22,8 @@ import { usePackageFilesLoader } from "@/hooks/usePackageFilesLoader"
 import { findTargetFile } from "@/lib/utils/findTargetFile"
 import { toastManualEditConflicts } from "@/lib/utils/toastManualEditConflicts"
 import { ManualEditEvent } from "@tscircuit/props"
+import { isValidFileName } from "@/lib/utils/isValidFileName"
+import { useFileManagement } from "@/hooks/useFileManagement"
 
 interface Props {
   pkg?: Package
@@ -32,12 +34,19 @@ export interface PackageFile {
   content: string
 }
 
-interface CodeAndPreviewState {
+export interface CreateFileProps {
+  newFileName: string
+  setErrorMessage: (message: string) => void
+  onFileSelect: (fileName: string) => void
+  setNewFileName: (fileName: string) => void
+  setIsCreatingFile: (isCreatingFile: boolean) => void
+}
+
+export interface CodeAndPreviewState {
   pkgFilesWithContent: PackageFile[]
   initialFilesLoad: PackageFile[]
   showPreview: boolean
   fullScreen: boolean
-  dts: string
   lastSavedAt: number
   circuitJson: null | any
   isPrivate: boolean
@@ -92,7 +101,6 @@ export function CodeAndPreview({ pkg }: Props) {
     initialFilesLoad: [],
     showPreview: true,
     fullScreen: false,
-    dts: "",
     lastSavedAt: Date.now(),
     circuitJson: null,
     isPrivate: false,
@@ -148,7 +156,6 @@ export function CodeAndPreview({ pkg }: Props) {
 
     if (loadedFiles && !isLoadingFiles) {
       const processedResults = [...loadedFiles]
-
       setState((prev) => ({
         ...prev,
         pkgFilesWithContent: processedResults,
@@ -159,13 +166,7 @@ export function CodeAndPreview({ pkg }: Props) {
           defaultCode,
       }))
     }
-  }, [
-    isLoadingFiles,
-    pkg,
-    pkgFiles.data,
-    state.pkgFilesWithContent.length,
-    defaultCode,
-  ])
+  }, [isLoadingFiles, pkg, pkgFiles.data, defaultCode])
 
   const createPackageMutation = useCreatePackageMutation()
   const { mutate: createRelease } = useCreatePackageReleaseMutation({
@@ -250,10 +251,21 @@ export function CodeAndPreview({ pkg }: Props) {
     setState((prev) => ({ ...prev, lastSavedAt: Date.now() }))
 
     if (pkg) {
-      updatePackageFilesMutation.mutate({
-        package_name_with_version: `${pkg.name}@latest`,
-        ...pkg,
-      })
+      updatePackageFilesMutation.mutate(
+        {
+          package_name_with_version: `${pkg.name}@latest`,
+          ...pkg,
+        },
+        {
+          onSuccess: () => {
+            setState((prev) => ({
+              ...prev,
+              initialFilesLoad: [...prev.pkgFilesWithContent],
+            }))
+            pkgFiles.refetch()
+          },
+        },
+      )
     }
   }
 
@@ -284,10 +296,17 @@ export function CodeAndPreview({ pkg }: Props) {
     state.pkgFilesWithContent,
   ])
   const mainComponentPath = useMemo(() => {
-    return state.currentFile?.endsWith(".tsx") &&
+    const isReactComponentExported =
+      /export function\s+\w+/.test(currentFileCode) ||
+      /export const\s+\w+\s*=/.test(currentFileCode) ||
+      /export default\s+\w+/.test(currentFileCode) ||
+      /export default\s+function\s*(\w*)\s*\(/.test(currentFileCode) ||
+      /export default\s*\(\s*\)\s*=>/.test(currentFileCode)
+
+    return (state.currentFile?.endsWith(".tsx") ||
+      state.currentFile?.endsWith(".ts")) &&
       !!state.pkgFilesWithContent.some((x) => x.path == state.currentFile) &&
-      (currentFileCode.match(/export function (\w+)/) ||
-        currentFileCode.match(/export const (\w+) ?=/))
+      isReactComponentExported
       ? state.currentFile
       : state.defaultComponentFile
   }, [state.currentFile, state.pkgFilesWithContent, currentFileCode])
@@ -327,6 +346,8 @@ export function CodeAndPreview({ pkg }: Props) {
     })
   }
 
+  const { handleCreateFile } = useFileManagement(state, setState)
+
   if ((!pkg && urlParams.package_id) || pkgFiles.isLoading || isLoadingFiles) {
     return (
       <div className="flex items-center justify-center h-64">
@@ -363,6 +384,7 @@ export function CodeAndPreview({ pkg }: Props) {
           )}
         >
           <CodeEditor
+            handleCreateFile={handleCreateFile}
             currentFile={state.currentFile}
             setCurrentFile={(file) =>
               setState((prev) => ({ ...prev, currentFile: file }))
@@ -379,7 +401,6 @@ export function CodeAndPreview({ pkg }: Props) {
                 ),
               }))
             }}
-            onDtsChange={(dts) => setState((prev) => ({ ...prev, dts }))}
             pkgFilesLoaded={state.pkgFilesLoaded}
           />
         </div>

package/src/components/package-port/CodeEditor.tsx

@@ -23,12 +23,12 @@ import {
 } from "@valtown/codemirror-ts"
 import { EditorView } from "codemirror"
 import { useEffect, useMemo, useRef, useState } from "react"
-import ts from "typescript"
+import tsModule from "typescript"
 import CodeEditorHeader from "@/components/package-port/CodeEditorHeader"
 import { useCodeCompletionApi } from "@/hooks/use-code-completion-ai-api"
 import FileSidebar from "../FileSidebar"
 import { findTargetFile } from "@/lib/utils/findTargetFile"
-import type { PackageFile } from "./CodeAndPreview"
+import type { CreateFileProps, PackageFile } from "./CodeAndPreview"
 import { useShikiHighlighter } from "@/hooks/use-shiki-highlighter"
 
 const defaultImports = `
@@ -39,7 +39,6 @@ import type { CommonLayoutProps } from "@tscircuit/props"
 
 export const CodeEditor = ({
   onCodeChange,
-  onDtsChange,
   readOnly = false,
   files = [],
   isStreaming = false,
@@ -48,10 +47,11 @@ export const CodeEditor = ({
   pkgFilesLoaded,
   currentFile,
   setCurrentFile,
+  handleCreateFile,
 }: {
   onCodeChange: (code: string, filename?: string) => void
-  onDtsChange?: (dts: string) => void
   files: PackageFile[]
+  handleCreateFile: (props: CreateFileProps) => void
   readOnly?: boolean
   isStreaming?: boolean
   pkgFilesLoaded?: boolean
@@ -67,9 +67,8 @@ export const CodeEditor = ({
   const codeCompletionApi = useCodeCompletionApi()
   const [cursorPosition, setCursorPosition] = useState<number | null>(null)
   const [code, setCode] = useState(files[0]?.content || "")
-  const [isCodeEditorReady, setIsCodeEditorReady] = useState(false)
 
-  const { highlighter, isLoading } = useShikiHighlighter()
+  const { highlighter } = useShikiHighlighter()
 
   // Get URL search params for file_path
   const urlParams = new URLSearchParams(window.location.search)
@@ -134,10 +133,10 @@ export const CodeEditor = ({
     ;(window as any).__DEBUG_CODE_EDITOR_FS_MAP = fsMap
 
     createDefaultMapFromCDN(
-      { target: ts.ScriptTarget.ES2022 },
+      { target: tsModule.ScriptTarget.ES2022 },
       "5.6.3",
       true,
-      ts,
+      tsModule,
     ).then((defaultFsMap) => {
       defaultFsMap.forEach((content, filename) => {
         fsMap.set(filename, content)
@@ -145,11 +144,12 @@ export const CodeEditor = ({
     })
 
     const system = createSystem(fsMap)
-    const env = createVirtualTypeScriptEnvironment(system, [], ts, {
-      jsx: ts.JsxEmit.ReactJSX,
+
+    const env = createVirtualTypeScriptEnvironment(system, [], tsModule, {
+      jsx: tsModule.JsxEmit.ReactJSX,
       declaration: true,
       allowJs: true,
-      target: ts.ScriptTarget.ES2022,
+      target: tsModule.ScriptTarget.ES2022,
       resolveJsonModule: true,
     })
 
@@ -160,7 +160,7 @@ export const CodeEditor = ({
     // Initialize ATA
     const ataConfig: ATABootstrapConfig = {
       projectName: "my-project",
-      typescript: ts,
+      typescript: tsModule,
       logger: console,
       fetcher: async (input: RequestInfo | URL, init?: RequestInit) => {
         const registryPrefixes = [
@@ -190,9 +190,6 @@ export const CodeEditor = ({
         return fetch(input, init)
       },
       delegate: {
-        finished: () => {
-          setIsCodeEditorReady(true)
-        },
         started: () => {
           const manualEditsTypeDeclaration = `
 				  declare module "manual-edits.json" {
@@ -247,20 +244,6 @@ export const CodeEditor = ({
           // setCode(newContent)
           onCodeChange(newContent, currentFile)
           onFileContentChanged?.(currentFile, newContent)
-
-          // Generate TypeScript declarations for TypeScript/TSX files
-          if (currentFile.endsWith(".ts") || currentFile.endsWith(".tsx")) {
-            const { outputFiles } = env.languageService.getEmitOutput(
-              currentFile,
-              true,
-            )
-            const dtsFile = outputFiles.find((file) =>
-              file.name.endsWith(".d.ts"),
-            )
-            if (dtsFile?.text && onDtsChange) {
-              onDtsChange(dtsFile.text)
-            }
-          }
         }
         if (update.selectionSet) {
           const pos = update.state.selection.main.head
@@ -336,12 +319,14 @@ export const CodeEditor = ({
 
               const start = info.textSpan.start
               const end = start + info.textSpan.length
-              const content = ts.displayPartsToString(info.displayParts || [])
+              const content = tsModule?.displayPartsToString(
+                info.displayParts || [],
+              )
 
               const dom = document.createElement("div")
               if (highlighter) {
                 dom.innerHTML = highlighter.codeToHtml(content, {
-                  lang: "typescript",
+                  lang: "tsx",
                   themes: {
                     light: "github-light",
                     dark: "github-dark",
@@ -449,14 +434,12 @@ export const CodeEditor = ({
 
     if (currentFile.endsWith(".tsx") || currentFile.endsWith(".ts")) {
       ata(`${defaultImports}${code}`)
-    } else if (!!currentFile) {
-      setIsCodeEditorReady(true)
     }
 
     return () => {
       view.destroy()
     }
-  }, [!isStreaming, currentFile, code !== ""])
+  }, [!isStreaming, currentFile, code !== "", Boolean(highlighter)])
 
   const updateCurrentEditorContent = (newContent: string) => {
     if (viewRef.current) {
@@ -539,6 +522,7 @@ export const CodeEditor = ({
           [sidebarOpen, setSidebarOpen] as ReturnType<typeof useState<boolean>>
         }
         onFileSelect={handleFileChange}
+        handleCreateFile={handleCreateFile}
       />
       <div className="flex flex-col flex-1 w-full min-w-0 h-full">
         {showImportAndFormatButtons && (
@@ -557,9 +541,9 @@ export const CodeEditor = ({
         )}
         <div
           ref={editorRef}
-          className={`flex-1 overflow-auto [&_.cm-editor]:h-full [&_.cm-scroller]:!h-full ${
-            !isCodeEditorReady ? "opacity-50" : ""
-          }`}
+          className={
+            "flex-1 overflow-auto [&_.cm-editor]:h-full [&_.cm-scroller]:!h-full"
+          }
         />
       </div>
     </div>

package/src/components/package-port/CodeEditorHeader.tsx

@@ -101,7 +101,7 @@ export const CodeEditorHeader: React.FC<CodeEditorHeaderProps> = ({
         markdown: "markdown",
       }
 
-      const parser = parserMap[fileExtension] || "typescript"
+      const parser = parserMap[fileExtension] || "tsx"
       const formattedCode = window.prettier.format(currentContent, {
         semi: false,
         parser: parser,

package/src/components/package-port/EditorNav.tsx

@@ -39,7 +39,6 @@ import { Link, useLocation } from "wouter"
 import { useAxios } from "@/hooks/use-axios"
 import { useToast } from "@/hooks/use-toast"
 import { useConfirmDeletePackageDialog } from "@/components/dialogs/confirm-delete-package-dialog"
-import { useCreateOrderDialog } from "@/components/dialogs/create-order-dialog"
 import { useFilesDialog } from "@/components/dialogs/files-dialog"
 import { useViewTsFilesDialog } from "@/components/dialogs/view-ts-files-dialog"
 import { DownloadButtonAndMenu } from "@/components/DownloadButtonAndMenu"
@@ -81,8 +80,6 @@ export default function EditorNav({
   } = useUpdatePackageDescriptionDialog()
   const { Dialog: DeleteDialog, openDialog: openDeleteDialog } =
     useConfirmDeletePackageDialog()
-  const { Dialog: CreateOrderDialog, openDialog: openCreateOrderDialog } =
-    useCreateOrderDialog()
   const { Dialog: FilesDialog, openDialog: openFilesDialog } = useFilesDialog()
   const { Dialog: ViewTsFilesDialog, openDialog: openViewTsFilesDialog } =
     useViewTsFilesDialog()
@@ -315,7 +312,7 @@ export default function EditorNav({
       <div className="flex items-center justify-end -space-x-1">
         <div className="flex mx-2 items-center space-x-1">
           {pkg && <TypeBadge type={`${packageType ?? pkg.snippet_type}`} />}
-          <Button
+          {/* <Button
             variant="ghost"
             size="sm"
             disabled={hasUnsavedChanges || isSaving || !pkg}
@@ -323,7 +320,7 @@ export default function EditorNav({
           >
             <Sparkles className="mr-1 h-3 w-3" />
             Edit with AI
-          </Button>
+          </Button> */}
           <DownloadButtonAndMenu
             snippetUnscopedName={pkg?.unscoped_name}
             circuitJson={circuitJson}
@@ -358,13 +355,6 @@ export default function EditorNav({
                 </Button>
               </DropdownMenuTrigger>
               <DropdownMenuContent>
-                <DropdownMenuItem
-                  className="text-xs"
-                  onClick={() => openCreateOrderDialog()}
-                >
-                  <PackageIcon className="mr-2 h-3 w-3" />
-                  Submit Order
-                </DropdownMenuItem>
                 <DropdownMenuItem
                   className="text-xs"
                   onClick={() => openFilesDialog()}
@@ -519,8 +509,8 @@ export default function EditorNav({
       <DeleteDialog
         packageId={pkg?.package_id ?? ""}
         packageName={pkg?.unscoped_name ?? ""}
+        packageOwner={pkg?.owner_github_username ?? ""}
       />
-      <CreateOrderDialog />
       <FilesDialog snippetId={pkg?.package_id ?? ""} />
       <ViewTsFilesDialog />
     </nav>

package/src/hooks/use-global-store.ts

@@ -30,4 +30,5 @@ export const useGlobalStore = create<Store>()(
 
 useGlobalStore.subscribe((state, prevState) => {
   ;(window as any).globalStore = state
+  window.TSCIRCUIT_REGISTRY_TOKEN = state.session?.token ?? null
 })