@tscircuit/fake-snippets 0.0.110 → 0.0.111

package/fake-snippets-api/routes/api/orgs/update.ts

@@ -13,6 +13,7 @@ export default withRouteSpec({
       z.object({
         name: z.string().optional(),
         display_name: z.string().optional(),
+        github_handle: z.string().trim().min(1).nullable().optional(),
       }),
     ),
   auth: "session",
@@ -20,10 +21,11 @@ export default withRouteSpec({
     org: publicOrgSchema,
   }),
 })(async (req, ctx) => {
-  const { org_id, name, display_name } = req.commonParams as {
+  const { org_id, name, display_name, github_handle } = req.commonParams as {
     org_id: string
     name?: string
     display_name?: string
+    github_handle?: string
   }
 
   const org = ctx.db.getOrg({ org_id }, ctx.auth)
@@ -43,13 +45,13 @@ export default withRouteSpec({
   }
 
   // No changes provided
-  if (!name && display_name === undefined) {
+  if (!name && display_name === undefined && github_handle === null) {
     return ctx.json({ org: publicMapOrg(org) })
   }
 
-  if (name && name !== org.github_handle) {
+  if (name && name !== org.org_name) {
     // Validate duplicate name
-    const duplicate = ctx.db.getOrg({ github_handle: name })
+    const duplicate = ctx.db.getOrg({ org_name: name })
 
     if (duplicate && duplicate.org_id !== org_id) {
       return ctx.error(400, {
@@ -58,20 +60,43 @@ export default withRouteSpec({
       })
     }
   }
+  if (
+    github_handle !== undefined &&
+    github_handle !== org.github_handle &&
+    github_handle !== null
+  ) {
+    const duplicateHandle = ctx.db.getOrg({ github_handle })
+      ? ctx.db.getOrg({ github_handle })?.org_id != org_id
+      : false
 
+    if (duplicateHandle) {
+      return ctx.error(400, {
+        error_code: "org_github_handle_already_exists",
+        message: "An organization with this GitHub handle already exists",
+      })
+    }
+  }
   const updates: {
-    github_handle?: string
+    org_name?: string
     org_display_name?: string
+    github_handle?: string
   } = {}
 
   if (name) {
     updates.github_handle = name
+    updates.org_name = name
+  }
+
+  if (github_handle !== undefined) {
+    updates.github_handle = github_handle
   }
 
   if (display_name !== undefined) {
     const trimmedDisplayName = display_name.trim()
+    const handleForFallback =
+      github_handle !== undefined ? github_handle : org.github_handle
     const fallbackDisplayName =
-      name ?? org.org_display_name ?? org.github_handle ?? ""
+      name ?? org.org_display_name ?? org.org_name ?? handleForFallback ?? ""
     updates.org_display_name =
       trimmedDisplayName.length > 0 ? trimmedDisplayName : fallbackDisplayName
   }

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

@@ -66,6 +66,7 @@ export default withRouteSpec({
       .find(
         (o) =>
           o.org_display_name?.toLowerCase() === requested_owner_lower ||
+          o.org_name?.toLowerCase() === requested_owner_lower ||
           o.github_handle?.toLowerCase() === requested_owner_lower,
       )
 
@@ -78,10 +79,12 @@ export default withRouteSpec({
     }
 
     owner_org_id = memberOrg.org_id
-    owner_github_username = memberOrg.github_handle
+    owner_github_username = memberOrg.github_handle || memberOrg.org_name
   }
 
-  const existingPackage = ctx.db.packages.find((pkg) => pkg.name === final_name)
+  const existingPackage = ctx.db
+    .getState()
+    .packages.find((pkg) => pkg.name === final_name)
 
   if (existingPackage) {
     throw ctx.error(400, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tscircuit/fake-snippets",
-  "version": "0.0.110",
+  "version": "0.0.111",
   "type": "module",
   "repository": {
     "type": "git",
@@ -110,10 +110,12 @@
     "circuit-json-to-bom-csv": "^0.0.7",
     "circuit-json-to-gerber": "^0.0.29",
     "circuit-json-to-gltf": "^0.0.14",
+    "circuit-json-to-kicad": "^0.0.9",
     "circuit-json-to-pnp-csv": "^0.0.7",
     "circuit-json-to-readable-netlist": "^0.0.13",
     "circuit-json-to-simple-3d": "^0.0.7",
     "circuit-json-to-spice": "^0.0.6",
+    "circuit-json-to-step": "^0.0.2",
     "circuit-json-to-tscircuit": "^0.0.9",
     "circuit-to-svg": "^0.0.202",
     "class-variance-authority": "^0.7.1",
@@ -139,6 +141,7 @@
     "jscad-electronics": "^0.0.25",
     "jszip": "^3.10.1",
     "kicad-converter": "^0.0.17",
+    "kicadts": "^0.0.9",
     "ky": "^1.7.5",
     "lucide-react": "^0.488.0",
     "lz-string": "^1.5.0",
@@ -172,6 +175,7 @@
     "sitemap": "^8.0.0",
     "sonner": "^1.5.0",
     "states-us": "^1.1.1",
+    "stepts": "^0.0.1",
     "svgo": "^4.0.0",
     "tailwind-merge": "^2.5.2",
     "tailwindcss": "^3.4.13",
@@ -192,8 +196,6 @@
     "wouter": "^3.3.5",
     "zod": "^3.23.8",
     "zustand": "^4.5.5",
-    "zustand-hoist": "^2.0.1",
-    "circuit-json-to-kicad": "^0.0.3",
-    "kicadts": "^0.0.9"
+    "zustand-hoist": "^2.0.1"
   }
 }

package/src/App.tsx

@@ -87,9 +87,7 @@ const ReleasePreviewPage = lazyImport(() => import("@/pages/preview-release"))
 const OrganizationSettingsPage = lazyImport(
   () => import("@/pages/organization-settings"),
 )
-const SettingsRedirectPage = lazyImport(
-  () => import("@/pages/settings-redirect"),
-)
+const UserSettingsPage = lazyImport(() => import("@/pages/user-settings"))
 
 class ErrorBoundary extends React.Component<
   { children: React.ReactNode },
@@ -270,8 +268,8 @@ function App() {
             {/* Organization creation route */}
             <Route path="/orgs/new" component={CreateOrganizationPage} />
 
-            {/* User settings redirect */}
-            <Route path="/settings" component={SettingsRedirectPage} />
+            {/* User settings */}
+            <Route path="/settings" component={UserSettingsPage} />
 
             {/* Organization settings route */}
             <Route

package/src/components/DownloadButtonAndMenu.tsx

@@ -25,6 +25,7 @@ import { CubeIcon } from "@radix-ui/react-icons"
 import { useState } from "react"
 import { useAxios } from "@/hooks/use-axios"
 import { useCurrentPackageId } from "@/hooks/use-current-package-id"
+import { downloadStepFile } from "@/lib/download-fns/download-step"
 
 interface DownloadButtonAndMenuProps {
   className?: string
@@ -225,7 +226,19 @@ export function DownloadButtonAndMenu({
               kicad_*.zip
             </span>
           </DropdownMenuItem>
-
+          <DropdownMenuItem
+            className="text-xs"
+            onSelect={async () => {
+              const cj = await getCircuitJson()
+              downloadStepFile(cj, unscopedName || "step_file")
+            }}
+          >
+            <Download className="mr-1 h-3 w-3" />
+            <span className="flex-grow mr-6">Step Format</span>
+            <span className="text-[0.6rem] bg-emerald-500 opacity-80 text-white font-mono rounded-md px-1 text-center py-0.5 mr-1">
+              STEP
+            </span>
+          </DropdownMenuItem>
           <DropdownMenuItem
             className="text-xs"
             onSelect={async () => {

package/src/components/SentryNotFoundReporter.tsx

@@ -0,0 +1,44 @@
+import { useEffect, useRef } from "react"
+import { Sentry } from "@/lib/sentry"
+
+type NotFoundContext = "package" | "package_release"
+
+type SentryNotFoundReporterProps = {
+  context: NotFoundContext
+  slug: string
+  status?: number
+  message?: string
+}
+
+export const SentryNotFoundReporter = ({
+  context,
+  slug,
+  status,
+  message,
+}: SentryNotFoundReporterProps) => {
+  const hasLoggedRef = useRef(false)
+
+  useEffect(() => {
+    if (typeof window === "undefined") return
+    if (typeof slug !== "string" || slug.length === 0) return
+    if (typeof status === "number" && status !== 404) return
+    if (hasLoggedRef.current) return
+
+    hasLoggedRef.current = true
+
+    Sentry.captureMessage(`package:view:${context}-not-found`, {
+      level: "warning",
+      tags: {
+        slug,
+      },
+      extra: {
+        status,
+        message,
+      },
+    })
+  }, [context, slug, status, message])
+
+  return null
+}
+
+export default SentryNotFoundReporter

package/src/components/organization/OrganizationCard.tsx

@@ -72,12 +72,14 @@ export const OrganizationCard: React.FC<OrganizationCardProps> = ({
   const handleSettingsClick = (e: React.MouseEvent) => {
     e.preventDefault()
     e.stopPropagation()
-    window.location.href = `/${organization.name}/settings`
+    window.location.href = organization.is_personal_org
+      ? `/settings`
+      : `/${organization.name}/settings`
   }
 
   const cardContent = (
     <div
-      className={`border p-4 rounded-md hover:shadow-md transition-shadow flex flex-col gap-4 ${className}`}
+      className={`border p-4 rounded-md hover:shadow-md transition-shadow flex flex-col gap-4 h-full ${className}`}
       onClick={handleCardClick}
     >
       <div className="flex items-start gap-4">
@@ -193,7 +195,7 @@ export const OrganizationCard: React.FC<OrganizationCardProps> = ({
       <Link
         key={organization.org_id}
         href={`/${organization.name}`}
-        className="block"
+        className="block h-full"
       >
         {cardContent}
       </Link>

package/src/hooks/use-hydration.ts

@@ -0,0 +1,30 @@
+import { useEffect, useState } from "react"
+import { useGlobalStore } from "@/hooks/use-global-store"
+
+export const useHydration = () => {
+  const [hasHydrated, setHasHydrated] = useState(() => {
+    if (typeof window === "undefined") return false
+    return useGlobalStore.persist?.hasHydrated?.() ?? false
+  })
+
+  useEffect(() => {
+    if (typeof window === "undefined") return
+
+    if (useGlobalStore.persist?.hasHydrated?.()) {
+      setHasHydrated(true)
+      return
+    }
+
+    const unsubFinishHydration = useGlobalStore.persist?.onFinishHydration?.(
+      () => {
+        setHasHydrated(true)
+      },
+    )
+
+    return () => {
+      unsubFinishHydration?.()
+    }
+  }, [])
+
+  return hasHydrated
+}

package/src/hooks/use-org-by-github-handle.ts

@@ -18,7 +18,7 @@ export const useOrgByGithubHandle = (githubHandle: string | null) => {
       return data.org
     },
     {
-      enabled: Boolean(githubHandle && session),
+      enabled: Boolean(githubHandle),
       retry: false,
       refetchOnWindowFocus: false,
     },

package/src/lib/download-fns/download-kicad-files.ts

@@ -2,6 +2,7 @@ import { saveAs } from "file-saver"
 import {
   CircuitJsonToKicadPcbConverter,
   CircuitJsonToKicadSchConverter,
+  CircuitJsonToKicadProConverter,
 } from "circuit-json-to-kicad"
 import { AnyCircuitElement } from "circuit-json"
 import JSZip from "jszip"
@@ -18,9 +19,18 @@ export const downloadKicadFiles = (
   schConverter.runUntilFinished()
   const kicadSchContent = schConverter.getOutputString()
 
+  const proConverter = new CircuitJsonToKicadProConverter(circuitJson, {
+    projectName: fileName,
+    schematicFilename: `${fileName}.kicad_sch`,
+    pcbFilename: `${fileName}.kicad_pcb`,
+  })
+  proConverter.runUntilFinished()
+  const kicadProContent = proConverter.getOutputString()
+
   const zip = new JSZip()
   zip.file(`${fileName}.kicad_pcb`, kicadPcbContent)
   zip.file(`${fileName}.kicad_sch`, kicadSchContent)
+  zip.file(`${fileName}.kicad_pro`, kicadProContent)
 
   zip.generateAsync({ type: "blob" }).then((content) => {
     saveAs(content, `${fileName}_kicad.zip`)

package/src/lib/download-fns/download-step.ts

@@ -0,0 +1,12 @@
+import { AnyCircuitElement } from "circuit-json"
+import { saveAs } from "file-saver"
+import { circuitJsonToStep } from "circuit-json-to-step"
+
+export const downloadStepFile = async (
+  circuitJson: AnyCircuitElement[],
+  fileName: string,
+) => {
+  const content = await circuitJsonToStep(circuitJson)
+  const blob = new Blob([content], { type: "text/plain" })
+  saveAs(blob, fileName + ".step")
+}

package/src/pages/create-organization.tsx

@@ -63,6 +63,7 @@ export const CreateOrganizationPage = () => {
           console.error("Failed to create organization:", error)
           toast.error(
             error?.response?.data?.error?.message ||
+              error?.data?.error?.message ||
               "Failed to create organization. Please try again.",
           )
           setIsLoading(false)

package/src/pages/organization-settings.tsx

@@ -16,7 +16,6 @@ import {
 import { Input } from "@/components/ui/input"
 import { Button } from "@/components/ui/button"
 import { Badge } from "@/components/ui/badge"
-import { Separator } from "@/components/ui/separator"
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
 import {
   AlertDialog,
@@ -169,6 +168,10 @@ export default function OrganizationSettingsPage() {
     organization.user_permissions?.can_manage_org ||
     organization.owner_account_id === session?.account_id
 
+  if (organization.is_personal_org) {
+    return <Redirect to="/settings" />
+  }
+
   if (!canManageOrg) {
     return (
       <div className="min-h-screen bg-white">

package/src/pages/search.tsx

@@ -28,7 +28,8 @@ interface ScoredPackage extends Package {
   matches: number[]
 }
 
-interface ScoredAccount extends Omit<Account, "account_id"> {
+interface ScoredAccount
+  extends Omit<Account, "account_id" | "is_tscircuit_staff"> {
   score: number
   matches: number[]
 }
@@ -252,7 +253,11 @@ export const SearchPage = () => {
                 ) : accountSearchResults.length > 0 ? (
                   <div className="grid grid-cols-1 w-full sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-3 sm:gap-4">
                     {accountSearchResults.map((account, i) => (
-                      <UserCard key={i} account={account} className="w-full" />
+                      <UserCard
+                        key={i}
+                        account={account as unknown as Account}
+                        className="w-full"
+                      />
                     ))}
                   </div>
                 ) : (

package/src/pages/user-settings.tsx

@@ -0,0 +1,161 @@
+import { useState } from "react"
+import { useLocation, Redirect } from "wouter"
+import { Helmet } from "react-helmet-async"
+import { Button } from "@/components/ui/button"
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/components/ui/alert-dialog"
+import { useToast } from "@/hooks/use-toast"
+import { useGlobalStore } from "@/hooks/use-global-store"
+import { useHydration } from "@/hooks/use-hydration"
+import { AlertTriangle, Loader2, Trash2 } from "lucide-react"
+import Header from "@/components/Header"
+import Footer from "@/components/Footer"
+import { FullPageLoader } from "@/App"
+
+export default function UserSettingsPage() {
+  const [, navigate] = useLocation()
+  const { toast } = useToast()
+  const session = useGlobalStore((s) => s.session)
+  const hasHydrated = useHydration()
+
+  const [showDeleteAccountDialog, setShowDeleteAccountDialog] = useState(false)
+
+  if (!hasHydrated) {
+    return <FullPageLoader />
+  }
+
+  if (!session) {
+    return <Redirect to="/" />
+  }
+
+  const pageTitle = "User Settings - tscircuit"
+
+  const handleDeleteAccount = () => {
+    setShowDeleteAccountDialog(true)
+  }
+
+  const confirmDeleteAccount = () => {
+    // TODO: Implement delete account functionality
+    toast({
+      title: "Account deleted",
+      description: "Your account has been permanently deleted.",
+    })
+    navigate("/")
+  }
+
+  return (
+    <div className="min-h-screen bg-white">
+      <Helmet>
+        <title>{pageTitle}</title>
+      </Helmet>
+      <Header />
+
+      <section className="w-full px-4 sm:px-6 lg:px-8 xl:px-12 2xl:px-16">
+        <div className="max-w-7xl mx-auto py-8">
+          <div className="mb-8">
+            <div className="flex items-center gap-4 mb-6">
+              <Avatar className="h-16 w-16 border-2 border-gray-200 shadow-sm">
+                <AvatarImage
+                  src={`https://github.com/${session.github_username}.png`}
+                  alt={`${session.github_username} avatar`}
+                />
+                <AvatarFallback className="text-lg bg-gradient-to-br from-blue-100 to-indigo-100 text-blue-700 font-medium">
+                  {(session.github_username || session.account_id || "")
+                    .slice(0, 2)
+                    .toUpperCase()}
+                </AvatarFallback>
+              </Avatar>
+              <div>
+                <h1 className="text-3xl font-bold text-gray-900">
+                  Account Settings
+                </h1>
+                <p className="text-gray-600 mt-1">
+                  Manage your account preferences and settings
+                </p>
+              </div>
+            </div>
+          </div>
+
+          <div className="space-y-8">
+            <div className="bg-white border border-red-200 rounded-xl shadow-sm">
+              <div className="px-6 py-5 border-b border-red-200 bg-red-50 rounded-t-xl">
+                <h2 className="text-xl font-semibold text-red-900">
+                  Danger Zone
+                </h2>
+                <p className="text-sm text-red-600 mt-2">
+                  Irreversible and destructive actions for your account.
+                </p>
+              </div>
+
+              <div className="p-6 lg:p-8">
+                <div className="flex flex-col lg:flex-row lg:items-center lg:justify-between gap-6">
+                  <div className="flex-1">
+                    <h3 className="text-sm font-semibold text-gray-900 mb-2">
+                      Delete Account
+                    </h3>
+                    <p className="text-sm text-gray-500 leading-relaxed">
+                      Permanently delete your account and all associated data.
+                      This action cannot be undone and will remove all your
+                      packages, snippets, and account information.
+                    </p>
+                  </div>
+                  <div className="flex-shrink-0">
+                    <Button
+                      variant="destructive"
+                      onClick={handleDeleteAccount}
+                      className="bg-red-600 hover:bg-red-700 text-white px-6 py-2.5 text-sm font-medium shadow-sm w-full lg:w-auto"
+                    >
+                      <Trash2 className="mr-2 h-4 w-4" />
+                      Delete Account
+                    </Button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <Footer />
+
+      <AlertDialog
+        open={showDeleteAccountDialog}
+        onOpenChange={setShowDeleteAccountDialog}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle className="flex items-center gap-2 text-red-600">
+              <AlertTriangle className="h-5 w-5" />
+              Delete Account
+            </AlertDialogTitle>
+            <AlertDialogDescription>
+              Are you absolutely sure you want to delete your account? This
+              action is permanent and cannot be undone. All your packages,
+              snippets, and account data will be permanently removed.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel>Cancel</AlertDialogCancel>
+            <AlertDialogAction
+              onClick={confirmDeleteAccount}
+              disabled={true}
+              className="bg-red-600 hover:bg-red-700"
+            >
+              {false && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+              Delete Account
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </div>
+  )
+}

package/src/pages/view-package.tsx

@@ -3,9 +3,9 @@ import { usePackageFiles } from "@/hooks/use-package-files"
 import { useCurrentPackageRelease } from "@/hooks/use-current-package-release"
 import { useLocation, useParams } from "wouter"
 import { Helmet } from "react-helmet-async"
-import { useEffect, useState } from "react"
 import NotFoundPage from "./404"
 import { usePackageByName } from "@/hooks/use-package-by-package-name"
+import { SentryNotFoundReporter } from "@/components/SentryNotFoundReporter"
 
 export const ViewPackagePage = () => {
   const { author, packageName } = useParams()
@@ -32,11 +32,31 @@ export const ViewPackagePage = () => {
     usePackageFiles(packageRelease?.package_release_id)
 
   if (!isLoadingPackage && packageError) {
-    return <NotFoundPage heading="Package Not Found" />
+    return (
+      <>
+        <SentryNotFoundReporter
+          context="package"
+          slug={packageNameFull}
+          status={(packageError as any)?.status}
+          message={packageError.message}
+        />
+        <NotFoundPage heading="Package Not Found" />
+      </>
+    )
   }
 
   if (!isLoadingPackageRelease && packageReleaseError?.status == 404) {
-    return <NotFoundPage heading="Package Not Found" />
+    return (
+      <>
+        <SentryNotFoundReporter
+          context="package_release"
+          slug={packageNameFull}
+          status={packageReleaseError.status}
+          message={packageReleaseError.message}
+        />
+        <NotFoundPage heading="Package Not Found" />
+      </>
+    )
   }
 
   return (