@tscircuit/fake-snippets 0.0.108 → 0.0.110

package/src/hooks/use-organization.ts

@@ -0,0 +1,42 @@
+import { useQuery } from "react-query"
+import { useAxios } from "@/hooks/use-axios"
+import type { PublicOrgSchema } from "fake-snippets-api/lib/db/schema"
+
+export const useOrganization = ({
+  orgId,
+  orgName,
+  github_handle,
+}: { orgId?: string; orgName?: string; github_handle?: string }) => {
+  const axios = useAxios()
+
+  const orgQuery = useQuery<PublicOrgSchema, Error & { status: number }>(
+    ["orgs", "get", orgId || orgName || github_handle],
+    async () => {
+      if (!orgId && !orgName && !github_handle) {
+        throw new Error("Organization ID, name, or GitHub handle is required")
+      }
+      const params = orgId
+        ? { org_id: orgId }
+        : orgName
+          ? { org_name: orgName }
+          : { github_handle }
+      const { data } = await axios.get("/orgs/get", { params })
+      return data.org
+    },
+    {
+      enabled: Boolean(orgId || orgName),
+      retry: false,
+      refetchOnWindowFocus: false,
+      keepPreviousData: true,
+    },
+  )
+
+  return {
+    organization: orgQuery.data,
+    membersCount: orgQuery.data?.member_count || 0,
+    packagesCount: orgQuery.data?.package_count || 0,
+    isLoading: orgQuery.isLoading,
+    isError: orgQuery.isError,
+    error: orgQuery.error,
+  }
+}

package/src/hooks/use-package-as-snippet.ts

@@ -32,8 +32,10 @@ export const usePackageAsSnippet = (packageId: string | null) => {
       if (!packageQuery.data?.latest_package_release_id) {
         throw new Error("No latest release ID available")
       }
-      const { data } = await axios.post("/package_files/list", {
-        package_release_id: packageQuery.data.latest_package_release_id,
+      const { data } = await axios.get("/package_files/list", {
+        params: {
+          package_release_id: packageQuery.data.latest_package_release_id,
+        },
       })
       return data.package_files
     },

package/src/hooks/use-package-builds.ts

@@ -56,11 +56,14 @@ export const usePackageBuildsByReleaseId = (releaseId?: string | null) => {
   return usePackageBuilds(releaseId ? { package_release_id: releaseId } : null)
 }
 
-export const usePackageBuild = (packageBuildId: string | null) => {
+export const usePackageBuild = (
+  packageBuildId: string | null,
+  options?: { include_logs?: boolean },
+) => {
   const axios = useAxios()
 
   return useQuery<PackageBuild, Error & { status: number }>(
-    ["packageBuild", packageBuildId],
+    ["packageBuild", packageBuildId, options?.include_logs],
     async () => {
       if (!packageBuildId) {
         throw new Error("package_build_id is required")
@@ -69,6 +72,7 @@ export const usePackageBuild = (packageBuildId: string | null) => {
       const { data } = await axios.get("/package_builds/get", {
         params: {
           package_build_id: packageBuildId,
+          include_logs: options?.include_logs,
         },
       })
 

package/src/hooks/use-package-files.ts

@@ -36,7 +36,9 @@ export const usePackageFile = (
     async () => {
       if (!query) return
 
-      const { data } = await axios.post("/package_files/get", query)
+      const { data } = await axios.get("/package_files/get", {
+        params: query,
+      })
 
       if (!data.package_file) {
         throw new Error("Package file not found")
@@ -98,8 +100,8 @@ export const usePackageFiles = (packageReleaseId?: string | null) => {
       if (!packageReleaseId) return []
 
       try {
-        const { data } = await axios.post("/package_files/list", {
-          package_release_id: packageReleaseId,
+        const { data } = await axios.get("/package_files/list", {
+          params: { package_release_id: packageReleaseId },
         })
 
         if (!data.package_files) {

package/src/hooks/use-package-release-by-id-or-version.ts

@@ -1,36 +1,45 @@
-import {
-  usePackageReleaseById,
-  usePackageReleaseByNameAndVersion,
-} from "./use-package-release"
+import { usePackageRelease } from "./use-package-release"
 import { isUuid } from "@/lib/utils/isUuid"
 
 export const usePackageReleaseByIdOrVersion = (
   releaseIdOrVersion: string | null,
   packageName?: string | null,
+  options?: {
+    include_logs?: boolean
+    include_ai_review?: boolean
+    refetchInterval?:
+      | number
+      | false
+      | ((
+          data:
+            | import("fake-snippets-api/lib/db/schema").PackageRelease
+            | undefined,
+        ) => number | false)
+  },
 ) => {
   const isReleaseIdUuid = releaseIdOrVersion
     ? isUuid(releaseIdOrVersion)
     : false
 
-  // If it's a UUID, use the ID-based hook
-  const releaseByIdQuery = usePackageReleaseById(
-    isReleaseIdUuid ? releaseIdOrVersion : null,
-  )
+  let query: Parameters<typeof usePackageRelease>[0] = null
 
-  // If it's not a UUID and we have a package name, construct the version-based query
-  const packageNameWithVersion =
-    !isReleaseIdUuid && packageName && releaseIdOrVersion
-      ? `${packageName}@${releaseIdOrVersion}`
+  if (isReleaseIdUuid) {
+    query = releaseIdOrVersion
+      ? { package_release_id: releaseIdOrVersion }
       : null
+  } else if (packageName && releaseIdOrVersion) {
+    query = {
+      package_name_with_version: `${packageName}@${releaseIdOrVersion}`,
+    }
+  }
 
-  const releaseByVersionQuery = usePackageReleaseByNameAndVersion(
-    packageNameWithVersion,
-  )
+  if (query && options?.include_logs !== undefined) {
+    query.include_logs = options.include_logs
+  }
 
-  // Return the appropriate query result
-  if (isReleaseIdUuid) {
-    return releaseByIdQuery
-  } else {
-    return releaseByVersionQuery
+  if (query && options?.include_ai_review !== undefined) {
+    query.include_ai_review = options.include_ai_review
   }
+
+  return usePackageRelease(query, { refetchInterval: options?.refetchInterval })
 }

package/src/hooks/use-package-release-images.ts

@@ -0,0 +1,105 @@
+import { useMemo, useCallback } from "react"
+import { useQueries } from "react-query"
+import { useAxios } from "./use-axios"
+import { useParams } from "wouter"
+import { useApiBaseUrl } from "./use-packages-base-api-url"
+
+interface UsePackageReleaseImagesProps {
+  packageReleaseId?: string | null
+  availableFilePaths?: string[] | undefined
+}
+
+interface ViewConfig {
+  id: string
+  label: string
+  backgroundClass: string
+}
+
+const VIEWS: ViewConfig[] = [
+  {
+    id: "3d",
+    label: "3D",
+    backgroundClass: "bg-gray-100",
+  },
+  {
+    id: "pcb",
+    label: "PCB",
+    backgroundClass: "bg-black",
+  },
+  {
+    id: "schematic",
+    label: "Schematic",
+    backgroundClass: "bg-[#F5F1ED]",
+  },
+]
+
+export function usePackageReleaseImages({
+  packageReleaseId,
+}: UsePackageReleaseImagesProps) {
+  const apiurl = useApiBaseUrl()
+  const axios = useAxios()
+  const { author, packageName } = useParams()
+
+  const createQueryFn = useCallback(
+    (viewId: string) => async () => {
+      if (!packageReleaseId || !author || !packageName) return null
+
+      const imageUrl = `${apiurl}/packages/images/${author}/${packageName}/${viewId}.png?package_release_id=${packageReleaseId}`
+
+      try {
+        const response = await axios.head(imageUrl)
+        return response.status === 200 ? imageUrl : null
+      } catch {
+        return null
+      }
+    },
+    [packageReleaseId, author, packageName, apiurl, axios],
+  )
+
+  const queryConfigs = useMemo(
+    () =>
+      VIEWS.map((view) => ({
+        queryKey: [
+          "packageReleaseImage",
+          packageReleaseId,
+          view.id,
+          author,
+          packageName,
+        ],
+        queryFn: createQueryFn(view.id),
+        enabled: Boolean(packageReleaseId && author && packageName),
+        retry: false,
+        refetchOnWindowFocus: false,
+        refetchOnMount: false,
+        refetchOnReconnect: false,
+        staleTime: Infinity,
+        cacheTime: Infinity,
+      })),
+    [packageReleaseId, author, packageName, createQueryFn],
+  )
+
+  const queries = useQueries(queryConfigs)
+
+  const availableViews = useMemo(() => {
+    const result = []
+
+    for (let i = 0; i < VIEWS.length; i++) {
+      const view = VIEWS[i]
+      const query = queries[i]
+
+      if (query.isLoading || query.data) {
+        result.push({
+          id: view.id,
+          label: view.label,
+          imageUrl: query.data || "",
+          isLoading: query.isLoading,
+          backgroundClass: view.backgroundClass,
+        })
+      }
+    }
+
+    return result
+  }, [queries])
+
+  return { availableViews }
+}

package/src/hooks/use-package-release.ts

@@ -40,8 +40,8 @@ export const usePackageRelease = (
 
       const { data } = await axios.post("/package_releases/get", query, {
         params: {
-          include_logs: query.include_logs,
-          include_ai_review: query.include_ai_review,
+          include_logs: Boolean(query.include_logs),
+          include_ai_review: Boolean(query.include_ai_review),
         },
       })
 

package/src/hooks/use-package-stars.ts

@@ -38,25 +38,77 @@ export const usePackageStarMutation = (query: PackageStarQuery) => {
   const axios = useAxios()
   const queryClient = useQueryClient()
 
-  const addStar = useMutation(
+  const addStar = useMutation<
+    any,
+    Error,
+    void,
+    { previousStars?: PackageStarResponse }
+  >(
     async () => {
       const { data } = await axios.post("/packages/add_star", query)
       return data
     },
     {
-      onSuccess: () => {
+      onMutate: async () => {
+        await queryClient.cancelQueries(["packageStars", query])
+        const previousStars = queryClient.getQueryData<PackageStarResponse>([
+          "packageStars",
+          query,
+        ])
+        const optimistic: PackageStarResponse = {
+          is_starred: true,
+          star_count: (previousStars?.star_count ?? 0) + 1,
+        }
+        queryClient.setQueryData(["packageStars", query], optimistic)
+        return { previousStars }
+      },
+      onError: (_error, _vars, context) => {
+        if (context?.previousStars) {
+          queryClient.setQueryData(
+            ["packageStars", query],
+            context.previousStars,
+          )
+        }
+      },
+      onSettled: () => {
         queryClient.invalidateQueries(["packageStars", query])
       },
     },
   )
 
-  const removeStar = useMutation(
+  const removeStar = useMutation<
+    any,
+    Error,
+    void,
+    { previousStars?: PackageStarResponse }
+  >(
     async () => {
       const { data } = await axios.post("/packages/remove_star", query)
       return data
     },
     {
-      onSuccess: () => {
+      onMutate: async () => {
+        await queryClient.cancelQueries(["packageStars", query])
+        const previousStars = queryClient.getQueryData<PackageStarResponse>([
+          "packageStars",
+          query,
+        ])
+        const optimistic: PackageStarResponse = {
+          is_starred: false,
+          star_count: Math.max(0, (previousStars?.star_count ?? 1) - 1),
+        }
+        queryClient.setQueryData(["packageStars", query], optimistic)
+        return { previousStars }
+      },
+      onError: (_error, _vars, context) => {
+        if (context?.previousStars) {
+          queryClient.setQueryData(
+            ["packageStars", query],
+            context.previousStars,
+          )
+        }
+      },
+      onSettled: () => {
         queryClient.invalidateQueries(["packageStars", query])
       },
     },
@@ -84,3 +136,27 @@ export const usePackageStarMutationById = (packageId: string) => {
 export const usePackageStarMutationByName = (packageName: string) => {
   return usePackageStarMutation({ name: packageName })
 }
+
+// High-level hook that exposes current star state and a single toggle action
+export const usePackageStarring = (query: PackageStarQuery | null) => {
+  const starsQuery = usePackageStars(query)
+  const mutations = usePackageStarMutation(query ?? { name: "" })
+
+  const toggleStar = async () => {
+    if (!query) return
+    const currentlyStarred = starsQuery.data?.is_starred ?? false
+    if (currentlyStarred) await mutations.removeStar.mutateAsync()
+    else await mutations.addStar.mutateAsync()
+  }
+
+  return {
+    isStarred: starsQuery.data?.is_starred ?? false,
+    starCount: starsQuery.data?.star_count ?? 0,
+    isPending: mutations.addStar.isLoading || mutations.removeStar.isLoading,
+    toggleStar,
+  }
+}
+
+export const usePackageStarringByName = (packageName: string | null) => {
+  return usePackageStarring(packageName ? { name: packageName } : null)
+}

package/src/hooks/use-preview-images.ts

@@ -21,22 +21,25 @@ export function usePreviewImages({
     {
       id: "3d",
       label: "3D View",
+      backgroundClass: "bg-gray-100",
       imageUrl: packageName
-        ? `https://registry-api.tscircuit.com/packages/images/${packageName}/3d.png?fs_sha=${fsMapHash}`
+        ? `https://api.tscircuit.com/packages/images/${packageName}/3d.png?fs_sha=${fsMapHash}`
         : undefined,
     },
     {
       id: "pcb",
       label: "PCB View",
+      backgroundClass: "bg-black",
       imageUrl: packageName
-        ? `https://registry-api.tscircuit.com/packages/images/${packageName}/pcb.png?fs_sha=${fsMapHash}`
+        ? `https://api.tscircuit.com/packages/images/${packageName}/pcb.png?fs_sha=${fsMapHash}`
         : undefined,
     },
     {
       id: "schematic",
       label: "Schematic View",
+      backgroundClass: "bg-[#F5F1ED]",
       imageUrl: packageName
-        ? `https://registry-api.tscircuit.com/packages/images/${packageName}/schematic.png?fs_sha=${fsMapHash}`
+        ? `https://api.tscircuit.com/packages/images/${packageName}/schematic.png?fs_sha=${fsMapHash}`
         : undefined,
     },
   ]

package/src/hooks/use-remove-org-member-mutation.ts

@@ -0,0 +1,32 @@
+import { useMutation, useQueryClient } from "react-query"
+import { useAxios } from "@/hooks/use-axios"
+import { useGlobalStore } from "@/hooks/use-global-store"
+
+export const useRemoveOrgMemberMutation = ({
+  onSuccess,
+}: { onSuccess?: () => void } = {}) => {
+  const axios = useAxios()
+  const session = useGlobalStore((s) => s.session)
+  const queryClient = useQueryClient()
+
+  return useMutation(
+    ["removeOrgMember"],
+    async ({ orgId, accountId }: { orgId: string; accountId: string }) => {
+      if (!session) throw new Error("No session")
+
+      await axios.post("/orgs/remove_member", {
+        org_id: orgId,
+        account_id: accountId,
+      })
+    },
+    {
+      onSuccess: () => {
+        queryClient.invalidateQueries(["orgs", "members"])
+        onSuccess?.()
+      },
+      onError: (error: any) => {
+        console.error("Error removing organization member:", error)
+      },
+    },
+  )
+}

package/src/hooks/use-update-ai-description-mutation.ts

@@ -0,0 +1,42 @@
+import { useMutation, useQueryClient } from "react-query"
+import { useAxios } from "./use-axios"
+import { useToast } from "./use-toast"
+
+export const useUpdateAiDescriptionMutation = ({
+  onSuccess,
+}: {
+  onSuccess?: () => void
+} = {}) => {
+  const axios = useAxios()
+  const { toast } = useToast()
+  const queryClient = useQueryClient()
+
+  return useMutation(
+    async ({ package_id }: { package_id: string }) => {
+      const { data } = await axios.post("/packages/update_ai_description", {
+        package_id,
+      })
+      return data
+    },
+    {
+      onSuccess: () => {
+        toast({
+          title: "AI description update requested",
+          description: "The AI description will be regenerated shortly.",
+        })
+        queryClient.invalidateQueries(["package"])
+        onSuccess?.()
+      },
+      onError: (error: any) => {
+        toast({
+          title: "Error",
+          description:
+            error?.response?.data?.message ||
+            error?.data?.message ||
+            "Failed to request AI description update.",
+          variant: "destructive",
+        })
+      },
+    },
+  )
+}

package/src/hooks/use-update-org-mutation.ts

@@ -0,0 +1,41 @@
+import { useMutation, useQueryClient } from "react-query"
+import { useAxios } from "@/hooks/use-axios"
+import { useGlobalStore } from "@/hooks/use-global-store"
+import type { PublicOrgSchema } from "fake-snippets-api/lib/db/schema"
+
+export const useUpdateOrgMutation = ({
+  onSuccess,
+}: { onSuccess?: (org: PublicOrgSchema) => void } = {}) => {
+  const axios = useAxios()
+  const session = useGlobalStore((s) => s.session)
+  const queryClient = useQueryClient()
+
+  return useMutation(
+    ["updateOrg"],
+    async ({ orgId, name }: { orgId: string; name?: string }) => {
+      if (!session) throw new Error("No session")
+
+      const {
+        data: { org: updatedOrg },
+      } = await axios.post("/orgs/update", {
+        org_id: orgId,
+        name,
+      })
+
+      if (!updatedOrg) {
+        throw new Error("Failed to update organization")
+      }
+
+      return updatedOrg
+    },
+    {
+      onSuccess: (org: PublicOrgSchema) => {
+        queryClient.invalidateQueries(["orgs"])
+        onSuccess?.(org)
+      },
+      onError: (error: any) => {
+        console.error("Error updating organization:", error)
+      },
+    },
+  )
+}

package/src/hooks/use-warn-user-on-page-change.ts

@@ -1,23 +1,90 @@
-import { useEffect } from "react"
+import { useEffect, useRef } from "react"
+
 export default function useWarnUserOnPageChange({
   hasUnsavedChanges,
+  isPackageThere,
 }: {
   hasUnsavedChanges: boolean
+  isPackageThere: Boolean
 }) {
+  const originalTitleRef = useRef<string>("")
+
   useEffect(() => {
+    if (!hasUnsavedChanges || !originalTitleRef.current) {
+      originalTitleRef.current = document.title.replace(/^⚠️\s*/, "")
+    }
+
     const handleBeforeUnload = (event: BeforeUnloadEvent) => {
       if (hasUnsavedChanges) {
+        const message =
+          "You have unsaved changes. Are you sure you want to leave?"
         event.preventDefault()
-        event.returnValue = "" // Shows the confirmation dialog on reload or close if there are unsaved changes
+        event.returnValue = message
+        return message
+      }
+    }
+
+    const handleVisibilityChange = () => {
+      if (document.hidden && hasUnsavedChanges) {
+        if (!document.title.startsWith("⚠️")) {
+          document.title = "⚠️ " + originalTitleRef.current
+        }
+      } else if (!document.hidden) {
+        document.title = originalTitleRef.current
+      }
+    }
+
+    const handlePopState = (event: PopStateEvent) => {
+      if (hasUnsavedChanges && isPackageThere) {
+        const shouldLeave = window.confirm(
+          "You have unsaved changes. Are you sure you want to leave this page?",
+        )
+        if (!shouldLeave) {
+          window.history.pushState(null, "", window.location.href)
+        }
+      }
+    }
+
+    const handleLinkClick = (event: MouseEvent) => {
+      if (!hasUnsavedChanges) return
+
+      const target = event.target as HTMLElement
+      const link = target.closest("a[href]") as HTMLAnchorElement
+
+      if (link && link.href) {
+        try {
+          const linkUrl = new URL(link.href)
+          const currentUrl = new URL(window.location.href)
+
+          if (linkUrl.origin === currentUrl.origin) {
+            event.preventDefault()
+            event.stopPropagation()
+
+            const shouldLeave = window.confirm(
+              "You have unsaved changes. Are you sure you want to leave this page?",
+            )
+
+            if (shouldLeave) {
+              window.location.href = link.href
+            }
+          }
+        } catch (error) {
+          console.warn("Failed to parse link URL:", error)
+        }
       }
     }
 
-    // Attach event listeners
     window.addEventListener("beforeunload", handleBeforeUnload)
+    document.addEventListener("visibilitychange", handleVisibilityChange)
+    window.addEventListener("popstate", handlePopState)
+    document.addEventListener("click", handleLinkClick, true)
 
-    // Cleanup event listeners on component unmount
     return () => {
       window.removeEventListener("beforeunload", handleBeforeUnload)
+      document.removeEventListener("visibilitychange", handleVisibilityChange)
+      window.removeEventListener("popstate", handlePopState)
+      document.removeEventListener("click", handleLinkClick, true)
+      document.title = originalTitleRef.current
     }
   }, [hasUnsavedChanges])
 }