@tscircuit/fake-snippets 0.0.90 → 0.0.92

package/dist/index.js

@@ -387,7 +387,8 @@ var loadPackageWithDependencies = async (db, owner, name, loadedPackages = /* @_
     ...pkg,
     created_at: (/* @__PURE__ */ new Date()).toISOString(),
     updated_at: (/* @__PURE__ */ new Date()).toISOString(),
-    latest_package_release_id: release.package_release_id
+    latest_package_release_id: release.package_release_id,
+    star_count: Math.floor(Math.random() * 11)
   });
   db.addPackageRelease({
     ...release,

package/fake-snippets-api/lib/db/autoload-dev-packages.ts

@@ -118,6 +118,7 @@ const loadPackageWithDependencies = async (
     created_at: new Date().toISOString(),
     updated_at: new Date().toISOString(),
     latest_package_release_id: release.package_release_id,
+    star_count: Math.floor(Math.random() * 11),
   })
 
   db.addPackageRelease({

package/fake-snippets-api/routes/api/packages/list_trending.ts

@@ -24,7 +24,7 @@ export default withRouteSpec({
   })
 
   // Filter out packages with no stars and sort by star count
-  const trendingPackages = packagesWithStars
+  const trendingPackages = ctx.db.packages
     .filter((p) => p.star_count > 0)
     .sort((a, b) => b.star_count - a.star_count)
     .slice(0, 50)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tscircuit/fake-snippets",
-  "version": "0.0.90",
+  "version": "0.0.92",
   "type": "module",
   "repository": {
     "type": "git",
@@ -77,16 +77,12 @@
     "@tailwindcss/typography": "^0.5.16",
     "@tscircuit/3d-viewer": "^0.0.279",
     "@tscircuit/assembly-viewer": "^0.0.1",
-    "@tscircuit/core": "^0.0.536",
     "@tscircuit/create-snippet-url": "^0.0.8",
     "@tscircuit/eval": "^0.0.244",
-    "@tscircuit/footprinter": "^0.0.186",
     "@tscircuit/layout": "^0.0.29",
-    "@tscircuit/math-utils": "^0.0.10",
     "@tscircuit/mm": "^0.0.8",
     "@tscircuit/pcb-viewer": "^1.11.194",
     "@tscircuit/prompt-benchmarks": "^0.0.28",
-    "@tscircuit/props": "^0.0.246",
     "@tscircuit/runframe": "^0.0.669",
     "@tscircuit/schematic-viewer": "^2.0.21",
     "@types/babel__standalone": "^7.1.7",
@@ -108,7 +104,6 @@
     "@vitejs/plugin-react": "^4.3.1",
     "autoprefixer": "^10.4.20",
     "change-case": "^5.4.4",
-    "circuit-json": "^0.0.190",
     "circuit-json-to-bom-csv": "^0.0.7",
     "circuit-json-to-gerber": "^0.0.25",
     "circuit-json-to-pnp-csv": "^0.0.7",
@@ -124,7 +119,7 @@
     "date-fns": "^4.1.0",
     "dotenv": "^16.5.0",
     "dsn-converter": "^0.0.60",
-    "easyeda": "^0.0.195",
+    "easyeda": "^0.0.203",
     "embla-carousel-react": "^8.3.0",
     "extract-codefence": "^0.0.4",
     "fflate": "^0.8.2",
@@ -139,7 +134,7 @@
     "jose": "^5.9.3",
     "jscad-electronics": "^0.0.25",
     "jszip": "^3.10.1",
-    "kicad-converter": "^0.0.16",
+    "kicad-converter": "^0.0.17",
     "ky": "^1.7.5",
     "lucide-react": "^0.488.0",
     "lz-string": "^1.5.0",
@@ -179,6 +174,7 @@
     "terser": "^5.27.0",
     "three": "^0.177.0",
     "three-stdlib": "^2.36.0",
+    "tscircuit": "^0.0.522",
     "tsup": "^8.5.0",
     "typescript": "^5.6.3",
     "use-async-memo": "^1.2.5",

package/src/ContextProviders.tsx

@@ -4,7 +4,6 @@ import { useEffect } from "react"
 import { useGlobalStore } from "./hooks/use-global-store"
 import { posthog } from "./lib/posthog"
 import { Toaster } from "react-hot-toast"
-import { Toaster as SonnerToaster } from "@/components/ui/sonner"
 import { populateQueryCacheWithSSRData } from "./lib/populate-query-cache-with-ssr-data"
 
 const staffGithubUsernames = [
@@ -66,7 +65,6 @@ export const ContextProviders = ({ children }: any) => {
         <PostHogIdentifier />
         {children}
         <Toaster position="bottom-right" />
-        <SonnerToaster position="bottom-left" />
       </HelmetProvider>
     </QueryClientProvider>
   )

package/src/components/PageSearchComponent.tsx

@@ -3,7 +3,7 @@ import { useAxios } from "@/hooks/use-axios"
 import { useLocation } from "wouter"
 import React, { useState } from "react"
 import { useQuery } from "react-query"
-import { useSnippetsBaseApiUrl } from "@/hooks/use-snippets-base-api-url"
+import { usePackagesBaseApiUrl } from "@/hooks/use-packages-base-api-url"
 import { Search } from "lucide-react"
 import { Button } from "./ui/button"
 import { PackageCardSkeleton } from "./PackageCardSkeleton"
@@ -20,7 +20,7 @@ const PageSearchComponent: React.FC<PageSearchComponentProps> = ({
 }) => {
   const [location, setLocation] = useLocation()
   const axios = useAxios()
-  const snippetsBaseApiUrl = useSnippetsBaseApiUrl()
+  const snippetsBaseApiUrl = usePackagesBaseApiUrl()
 
   // Initialize search query directly from URL
   const [searchQuery, setSearchQuery] = useState(

package/src/components/SearchComponent.tsx

@@ -4,7 +4,7 @@ import { useLocation } from "wouter"
 import React, { useEffect, useRef, useState } from "react"
 import { useQuery } from "react-query"
 import { Alert } from "./ui/alert"
-import { useSnippetsBaseApiUrl } from "@/hooks/use-snippets-base-api-url"
+import { usePackagesBaseApiUrl } from "@/hooks/use-packages-base-api-url"
 import { PrefetchPageLink } from "./PrefetchPageLink"
 import { CircuitBoard } from "lucide-react"
 import { cn } from "@/lib/utils"
@@ -60,7 +60,7 @@ const SearchComponent: React.FC<SearchComponentProps> = ({
   const resultsRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
   const [location, setLocation] = useLocation()
-  const snippetsBaseApiUrl = useSnippetsBaseApiUrl()
+  const snippetsBaseApiUrl = usePackagesBaseApiUrl()
 
   const { data: searchResults, isLoading } = useQuery(
     ["packageSearch", searchQuery],

package/src/components/TrendingPackagesCarousel.tsx

@@ -4,7 +4,7 @@ import { StarFilledIcon } from "@radix-ui/react-icons"
 import { Link } from "wouter"
 import { Package } from "fake-snippets-api/lib/db/schema"
 import { useRef, useState } from "react"
-import { useSnippetsBaseApiUrl } from "@/hooks/use-snippets-base-api-url"
+import { usePackagesBaseApiUrl } from "@/hooks/use-packages-base-api-url"
 
 const CarouselItem = ({
   pkg,
@@ -36,7 +36,7 @@ export const TrendingPackagesCarousel = () => {
   const axios = useAxios()
   const scrollRef = useRef<HTMLDivElement>(null)
   const [isHovered, setIsHovered] = useState(false)
-  const apiBaseUrl = useSnippetsBaseApiUrl()
+  const apiBaseUrl = usePackagesBaseApiUrl()
 
   const { data: trendingPackages } = useQuery<Package[]>(
     "trendingPackages",

package/src/components/dialogs/import-component-dialog.tsx

@@ -0,0 +1,25 @@
+import { createUseDialog } from "./create-use-dialog"
+import {
+  ComponentSearchResult,
+  ImportComponentDialog as RunframeImportComponentDialog,
+} from "@tscircuit/runframe/runner"
+
+export const ImportComponentDialog = ({
+  open,
+  onOpenChange,
+  onComponentSelected,
+}: {
+  open: boolean
+  onOpenChange: (open: boolean) => any
+  onComponentSelected: (pkg: ComponentSearchResult) => any
+}) => {
+  return (
+    <RunframeImportComponentDialog
+      isOpen={open}
+      onClose={() => onOpenChange(false)}
+      onImport={(data) => onComponentSelected(data)}
+    />
+  )
+}
+
+export const useImportComponentDialog = createUseDialog(ImportComponentDialog)

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

@@ -1,4 +1,4 @@
-import { useSnippetsBaseApiUrl } from "@/hooks/use-snippets-base-api-url"
+import { usePackagesBaseApiUrl } from "@/hooks/use-packages-base-api-url"
 import { useHotkeyCombo } from "@/hooks/use-hotkey"
 import { basicSetup } from "@/lib/codemirror/basic-setup"
 import {
@@ -76,25 +76,27 @@ export const CodeEditor = ({
   showImportAndFormatButtons?: boolean
   onFileContentChanged?: (path: string, content: string) => void
   currentFile: string | null
-  onFileSelect: (path: string) => void
+  onFileSelect: (path: string, lineNumber?: number) => void
 }) => {
   const editorRef = useRef<HTMLDivElement>(null)
   const viewRef = useRef<EditorView | null>(null)
   const ataRef = useRef<ReturnType<typeof setupTypeAcquisition> | null>(null)
   const lastReceivedTsFileTimeRef = useRef<number>(0)
-  const apiUrl = useSnippetsBaseApiUrl()
-  const codeCompletionApi = useCodeCompletionApi()
+  const apiUrl = usePackagesBaseApiUrl()
   const [cursorPosition, setCursorPosition] = useState<number | null>(null)
   const [code, setCode] = useState(files[0]?.content || "")
   const [fontSize, setFontSize] = useState(14)
   const [showQuickOpen, setShowQuickOpen] = useState(false)
   const [showGlobalFindReplace, setShowGlobalFindReplace] = useState(false)
+  const [highlightedLine, setHighlightedLine] = useState<number | null>(null)
+  const highlightTimeoutRef = useRef<number | null>(null)
 
   const { highlighter } = useShikiHighlighter()
 
   // Get URL search params for file_path
   const urlParams = new URLSearchParams(window.location.search)
   const filePathFromUrl = urlParams.get("file_path")
+  const lineNumberFromUrl = urlParams.get("line")
   const [aiAutocompleteEnabled, setAiAutocompleteEnabled] = useState(false)
 
   const entryPointFileName = useMemo(() => {
@@ -109,10 +111,13 @@ export const CodeEditor = ({
 
     const targetFile = findTargetFile(files, filePathFromUrl)
     if (targetFile) {
-      handleFileChange(targetFile.path)
+      const lineNumber = lineNumberFromUrl
+        ? parseInt(lineNumberFromUrl, 10)
+        : undefined
+      handleFileChange(targetFile.path, lineNumber)
       setCode(targetFile.content)
     }
-  }, [filePathFromUrl, pkgFilesLoaded])
+  }, [filePathFromUrl, lineNumberFromUrl, pkgFilesLoaded])
 
   const fileMap = useMemo(() => {
     const map: Record<string, string> = {}
@@ -309,6 +314,14 @@ export const CodeEditor = ({
         ".cm-content": {
           fontSize: `${fontSize}px`,
         },
+        ".cm-line-highlight": {
+          backgroundColor: "#dbeafe !important",
+          animation: "lineHighlightFade 3s ease-in-out forwards",
+        },
+        "@keyframes lineHighlightFade": {
+          "0%": { backgroundColor: "#93c5fd" },
+          "100%": { backgroundColor: "transparent" },
+        },
       }),
       EditorView.domEventHandlers({
         wheel: (event) => {
@@ -325,21 +338,39 @@ export const CodeEditor = ({
           return false
         },
       }),
+      EditorView.decorations.of((view) => {
+        const decorations = []
+        if (highlightedLine) {
+          const doc = view.state.doc
+          if (highlightedLine >= 1 && highlightedLine <= doc.lines) {
+            const line = doc.line(highlightedLine)
+            decorations.push(
+              Decoration.line({
+                class: "cm-line-highlight",
+              }).range(line.from),
+            )
+          }
+        }
+        return Decoration.set(decorations)
+      }),
     ]
     if (aiAutocompleteEnabled) {
       baseExtensions.push(
         inlineCopilot(async (prefix, suffix) => {
-          const res = await fetch("/api/autocomplete/create_autocomplete", {
-            method: "POST",
-            headers: {
-              "Content-Type": "application/json",
+          const res = await fetch(
+            `${apiUrl}/autocomplete/create_autocomplete`,
+            {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify({
+                prefix,
+                suffix,
+                language: "typescript",
+              }),
             },
-            body: JSON.stringify({
-              prefix,
-              suffix,
-              language: "typescript",
-            }),
-          })
+          )
 
           const { prediction } = await res.json()
           return prediction
@@ -543,6 +574,11 @@ export const CodeEditor = ({
 
     return () => {
       view.destroy()
+      // Clean up any pending highlight timeout
+      if (highlightTimeoutRef.current) {
+        window.clearTimeout(highlightTimeoutRef.current)
+        highlightTimeoutRef.current = null
+      }
     }
   }, [
     !isStreaming,
@@ -552,6 +588,7 @@ export const CodeEditor = ({
     isSaving,
     fontSize,
     aiAutocompleteEnabled,
+    highlightedLine,
   ])
 
   const updateCurrentEditorContent = (newContent: string) => {
@@ -571,6 +608,35 @@ export const CodeEditor = ({
     }
   }
 
+  const navigateToLine = (lineNumber: number) => {
+    if (!viewRef.current) return
+
+    const view = viewRef.current
+    const doc = view.state.doc
+
+    if (lineNumber < 1 || lineNumber > doc.lines) return
+
+    if (highlightTimeoutRef.current) {
+      window.clearTimeout(highlightTimeoutRef.current)
+      highlightTimeoutRef.current = null
+    }
+
+    const line = doc.line(lineNumber)
+    const pos = line.from
+
+    view.dispatch({
+      selection: { anchor: pos, head: pos },
+      effects: EditorView.scrollIntoView(pos, { y: "center" }),
+    })
+
+    setHighlightedLine(lineNumber)
+
+    highlightTimeoutRef.current = window.setTimeout(() => {
+      setHighlightedLine(null)
+      highlightTimeoutRef.current = null
+    }, 3000)
+  }
+
   const updateEditorToMatchCurrentFile = () => {
     const currentContent = fileMap[currentFile || ""] || ""
     updateCurrentEditorContent(currentContent)
@@ -587,14 +653,26 @@ export const CodeEditor = ({
     }
   }, [codeImports])
 
-  const handleFileChange = (path: string) => {
-    onFileSelect(path)
+  const handleFileChange = (path: string, lineNumber?: number) => {
+    onFileSelect(path, lineNumber)
     try {
-      // Set url query to file path
+      // Set url query to file path and line number
       const urlParams = new URLSearchParams(window.location.search)
       urlParams.set("file_path", path)
+      if (lineNumber) {
+        urlParams.set("line", lineNumber.toString())
+      } else {
+        urlParams.delete("line")
+      }
       window.history.replaceState(null, "", `?${urlParams.toString()}`)
     } catch {}
+
+    // Navigate to line after a short delay to ensure editor is ready
+    if (lineNumber) {
+      setTimeout(() => {
+        navigateToLine(lineNumber)
+      }, 100)
+    }
   }
 
   const updateFileContent = (path: FileName | null, newContent: string) => {
@@ -653,7 +731,7 @@ export const CodeEditor = ({
         fileSidebarState={
           [sidebarOpen, setSidebarOpen] as ReturnType<typeof useState<boolean>>
         }
-        onFileSelect={handleFileChange}
+        onFileSelect={(path) => handleFileChange(path)}
         handleCreateFile={handleCreateFile}
         handleDeleteFile={handleDeleteFile}
       />
@@ -661,6 +739,10 @@ export const CodeEditor = ({
         {showImportAndFormatButtons && (
           <CodeEditorHeader
             entrypointFileName={entryPointFileName}
+            appendNewFile={(path: string, content: string) => {
+              onFileContentChanged?.(path, content)
+            }}
+            createFile={handleCreateFile}
             fileSidebarState={
               [sidebarOpen, setSidebarOpen] as ReturnType<
                 typeof useState<boolean>
@@ -687,7 +769,7 @@ export const CodeEditor = ({
         <QuickOpen
           files={files.filter((f) => !isHiddenFile(f.path))}
           currentFile={currentFile}
-          onFileSelect={handleFileChange}
+          onFileSelect={(path) => handleFileChange(path)}
           onClose={() => setShowQuickOpen(false)}
         />
       )}

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

@@ -1,7 +1,7 @@
 import React, { useState, useCallback } from "react"
 import { Button } from "@/components/ui/button"
 import { handleManualEditsImportWithSupportForMultipleFiles } from "@/lib/handleManualEditsImportWithSupportForMultipleFiles"
-import { useImportPackageDialog } from "@/components/dialogs/import-package-dialog"
+import { useImportComponentDialog } from "@/components/dialogs/import-component-dialog"
 import { useToast } from "@/hooks/use-toast"
 import {
   DropdownMenu,
@@ -19,14 +19,16 @@ import {
   SelectValue,
 } from "../ui/select"
 import { isHiddenFile } from "../ViewPackagePage/utils/is-hidden-file"
-import { Package } from "fake-snippets-api/lib/db/schema"
 import {
   Tooltip,
   TooltipContent,
   TooltipProvider,
   TooltipTrigger,
 } from "@/components/ui/tooltip"
-import ai from "fake-snippets-api/routes/api/ai"
+import { convertRawEasyToTsx, fetchEasyEDAComponent } from "easyeda/browser"
+import { ComponentSearchResult } from "@tscircuit/runframe/runner"
+import { usePackagesBaseApiUrl } from "@/hooks/use-packages-base-api-url"
+import { ICreateFileProps, ICreateFileResult } from "@/hooks/useFileManagement"
 
 export type FileName = string
 
@@ -37,6 +39,8 @@ interface CodeEditorHeaderProps {
   fileSidebarState: ReturnType<typeof useState<boolean>>
   handleFileChange: (filename: FileName) => void
   entrypointFileName?: string
+  appendNewFile: (path: string, content: string) => void
+  createFile: (props: ICreateFileProps) => ICreateFileResult
   aiAutocompleteState: [boolean, React.Dispatch<React.SetStateAction<boolean>>]
 }
 
@@ -44,15 +48,18 @@ export const CodeEditorHeader: React.FC<CodeEditorHeaderProps> = ({
   currentFile,
   files,
   updateFileContent,
+  appendNewFile,
   fileSidebarState,
   handleFileChange,
   entrypointFileName = "index.tsx",
+  createFile,
   aiAutocompleteState,
 }) => {
-  const { Dialog: ImportPackageDialog, openDialog: openImportDialog } =
-    useImportPackageDialog()
-  const { toast } = useToast()
+  const { Dialog: ImportComponentDialog, openDialog: openImportDialog } =
+    useImportComponentDialog()
+  const { toast, toastLibrary } = useToast()
   const [sidebarOpen, setSidebarOpen] = fileSidebarState
+  const API_BASE = usePackagesBaseApiUrl()
   const [aiAutocompleteEnabled, setAiAutocompleteEnabled] = aiAutocompleteState
 
   const handleFormatFile = useCallback(() => {
@@ -144,6 +151,49 @@ export const CodeEditorHeader: React.FC<CodeEditorHeaderProps> = ({
     }
   }, [currentFile, files, toast, updateFileContent])
 
+  const handleComponentImport = async (component: ComponentSearchResult) => {
+    if (component.source == "tscircuit.com") {
+      const newContent = `import {} from "@tsci/${component.owner}.${component.name}"\n${files[currentFile || ""]}`
+      updateFileContent(currentFile, newContent)
+    }
+    if (component.source == "jlcpcb") {
+      const jlcpcbComponent = await fetchEasyEDAComponent("C1", {
+        fetch: ((url, options: any) => {
+          return fetch(`${API_BASE}/proxy`, {
+            ...options,
+            headers: {
+              ...options?.headers,
+              "X-Target-Url": url.toString(),
+              "X-Sender-Origin": options?.headers?.origin ?? "",
+              "X-Sender-Host": options?.headers?.host ?? "https://easyeda.com",
+              "X-Sender-Referer": options?.headers?.referer ?? "",
+              "X-Sender-User-Agent": options?.headers?.userAgent ?? "",
+              "X-Sender-Cookie": options?.headers?.cookie ?? "",
+            },
+          })
+        }) as typeof fetch,
+      })
+      const tsxComponent = await convertRawEasyToTsx(jlcpcbComponent)
+      let componentName = component.name.replace(/ /g, "-")
+      if (files[`${componentName}.tsx`] || files[`./${componentName}.tsx`]) {
+        componentName = `${componentName}-1`
+      }
+      const createFileResult = createFile({
+        newFileName: `${componentName}.tsx`,
+        content: tsxComponent,
+        onError: (error) => {
+          throw error
+        },
+        openFile: false,
+      })
+      if (!createFileResult.newFileCreated) {
+        throw new Error("Failed to create file")
+      }
+      const newContent = `import ${componentName.replace(/-/g, "")} from "./${componentName}.tsx"\n${files[currentFile || ""]}`
+      updateFileContent(currentFile, newContent)
+    }
+  }
+
   return (
     <>
       <div className="flex items-center gap-2 px-2 border-b border-gray-200">
@@ -275,10 +325,17 @@ export const CodeEditorHeader: React.FC<CodeEditorHeaderProps> = ({
             Format
           </Button>
         </div>
-        <ImportPackageDialog
-          onPackageSelected={(pkg: Package) => {
-            const newContent = `import {} from "@tsci/${pkg.owner_github_username}.${pkg.unscoped_name}"\n${files[currentFile || ""]}`
-            updateFileContent(currentFile, newContent)
+        <ImportComponentDialog
+          onComponentSelected={async (component) => {
+            toastLibrary.promise(handleComponentImport(component), {
+              loading: "Importing component...",
+              success: <p>Component imported successfully!</p>,
+              error: (error) => (
+                <p>
+                  Error importing component: {error.message || String(error)}
+                </p>
+              ),
+            })
           }}
         />
       </div>

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

@@ -371,13 +371,6 @@ export default function EditorNav({
                 </Button>
               </DropdownMenuTrigger>
               <DropdownMenuContent>
-                <DropdownMenuItem
-                  className="text-xs"
-                  onClick={() => openupdateDescriptionDialog()}
-                >
-                  <FilePenLine className="mr-2 h-3 w-3" />
-                  Edit Description
-                </DropdownMenuItem>
                 <DropdownMenuItem
                   className="text-xs"
                   onClick={() => openViewTsFilesDialog()}
@@ -385,53 +378,66 @@ export default function EditorNav({
                   <File className="mr-2 h-3 w-3" />
                   View Files
                 </DropdownMenuItem>
-                <DropdownMenuSub>
-                  <DropdownMenuSubTrigger
-                    className="text-xs"
-                    disabled={isChangingType || hasUnsavedChanges}
-                  >
-                    <Edit2 className="mr-2 h-3 w-3" />
-                    {isChangingType ? "Changing..." : "Change Type"}
-                  </DropdownMenuSubTrigger>
-                  <DropdownMenuSubContent>
-                    <DropdownMenuItem
-                      className="text-xs"
-                      disabled={currentType === "board" || isChangingType}
-                      onClick={() => handleTypeChange("board")}
-                    >
-                      Board {currentType === "board" && "✓"}
-                    </DropdownMenuItem>
-                    <DropdownMenuItem
-                      className="text-xs"
-                      disabled={currentType === "package" || isChangingType}
-                      onClick={() => handleTypeChange("package")}
-                    >
-                      Module {currentType === "package" && "✓"}
-                    </DropdownMenuItem>
-                  </DropdownMenuSubContent>
-                </DropdownMenuSub>
-                <DropdownMenuSub>
-                  <DropdownMenuSubTrigger className="text-xs">
-                    <Edit2 className="mr-2 h-3 w-3" />
-                    Change Package Visibility
-                  </DropdownMenuSubTrigger>
-                  <DropdownMenuSubContent>
-                    <DropdownMenuItem
-                      className="text-xs"
-                      disabled={isPrivate}
-                      onClick={() => updatePackageVisibilityToPrivate(true)}
-                    >
-                      Private {isPrivate && "✓"}
-                    </DropdownMenuItem>
+                {session?.github_username === pkg.owner_github_username && (
+                  <>
                     <DropdownMenuItem
                       className="text-xs"
-                      disabled={!isPrivate}
-                      onClick={() => updatePackageVisibilityToPrivate(false)}
+                      onClick={() => openupdateDescriptionDialog()}
                     >
-                      Public {!isPrivate && "✓"}
+                      <FilePenLine className="mr-2 h-3 w-3" />
+                      Edit Description
                     </DropdownMenuItem>
-                  </DropdownMenuSubContent>
-                </DropdownMenuSub>
+                    <DropdownMenuSub>
+                      <DropdownMenuSubTrigger
+                        className="text-xs"
+                        disabled={isChangingType || hasUnsavedChanges}
+                      >
+                        <Edit2 className="mr-2 h-3 w-3" />
+                        {isChangingType ? "Changing..." : "Change Type"}
+                      </DropdownMenuSubTrigger>
+                      <DropdownMenuSubContent>
+                        <DropdownMenuItem
+                          className="text-xs"
+                          disabled={currentType === "board" || isChangingType}
+                          onClick={() => handleTypeChange("board")}
+                        >
+                          Board {currentType === "board" && "✓"}
+                        </DropdownMenuItem>
+                        <DropdownMenuItem
+                          className="text-xs"
+                          disabled={currentType === "package" || isChangingType}
+                          onClick={() => handleTypeChange("package")}
+                        >
+                          Module {currentType === "package" && "✓"}
+                        </DropdownMenuItem>
+                      </DropdownMenuSubContent>
+                    </DropdownMenuSub>
+                    <DropdownMenuSub>
+                      <DropdownMenuSubTrigger className="text-xs">
+                        <Edit2 className="mr-2 h-3 w-3" />
+                        Change Package Visibility
+                      </DropdownMenuSubTrigger>
+                      <DropdownMenuSubContent>
+                        <DropdownMenuItem
+                          className="text-xs"
+                          disabled={isPrivate}
+                          onClick={() => updatePackageVisibilityToPrivate(true)}
+                        >
+                          Private {isPrivate && "✓"}
+                        </DropdownMenuItem>
+                        <DropdownMenuItem
+                          className="text-xs"
+                          disabled={!isPrivate}
+                          onClick={() =>
+                            updatePackageVisibilityToPrivate(false)
+                          }
+                        >
+                          Public {!isPrivate && "✓"}
+                        </DropdownMenuItem>
+                      </DropdownMenuSubContent>
+                    </DropdownMenuSub>
+                  </>
+                )}
                 <DropdownMenuItem
                   className="text-xs text-red-600"
                   onClick={() => openDeleteDialog()}