@tscircuit/fake-snippets 0.0.93 → 0.0.95

package/dist/index.d.ts

@@ -1069,7 +1069,7 @@ declare const createDatabase: ({ seed }?: {
         }[] | null;
         datasheet_pdf_urls: string[] | null;
     }[];
-}, "addOrder" | "getOrderById" | "getOrderFilesByOrderId" | "addOrderQuote" | "getOrderQuoteById" | "getJlcpcbOrderStatesByOrderId" | "getJlcpcbOrderStepRunsByJlcpcbOrderStateId" | "updateOrder" | "addJlcpcbOrderState" | "updateJlcpcbOrderState" | "addOrderFile" | "getOrderFileById" | "addAccount" | "addAccountPackage" | "getAccountPackageById" | "updateAccountPackage" | "deleteAccountPackage" | "addSnippet" | "getLatestSnippets" | "getTrendingSnippets" | "getPackagesByAuthor" | "getSnippetByAuthorAndName" | "updateSnippet" | "getSnippetById" | "searchSnippets" | "searchPackages" | "deleteSnippet" | "addSession" | "getSessions" | "createLoginPage" | "getLoginPage" | "updateLoginPage" | "getAccount" | "updateAccount" | "createSession" | "addStar" | "removeStar" | "hasStarred" | "addPackage" | "updatePackage" | "getPackageById" | "getPackageReleaseById" | "addPackageRelease" | "updatePackageRelease" | "deletePackageFile" | "addPackageFile" | "updatePackageFile" | "getStarCount" | "getPackageFilesByReleaseId" | "updatePackageReleaseFsSha" | "addAiReview" | "updateAiReview" | "getAiReviewById" | "listAiReviews" | "addDatasheet" | "getDatasheetById" | "listDatasheets" | "updateDatasheet"> & {
+}, "addOrder" | "getOrderById" | "getOrderFilesByOrderId" | "addOrderQuote" | "getOrderQuoteById" | "getJlcpcbOrderStatesByOrderId" | "getJlcpcbOrderStepRunsByJlcpcbOrderStateId" | "updateOrder" | "addJlcpcbOrderState" | "updateJlcpcbOrderState" | "addOrderFile" | "getOrderFileById" | "addAccount" | "addAccountPackage" | "getAccountPackageById" | "updateAccountPackage" | "deleteAccountPackage" | "addSnippet" | "getLatestSnippets" | "getTrendingSnippets" | "getPackagesByAuthor" | "getSnippetByAuthorAndName" | "updateSnippet" | "getSnippetById" | "searchSnippets" | "searchPackages" | "deleteSnippet" | "addSession" | "getSessions" | "createLoginPage" | "getLoginPage" | "updateLoginPage" | "getAccount" | "updateAccount" | "createSession" | "addStar" | "removeStar" | "hasStarred" | "addPackage" | "updatePackage" | "getPackageById" | "getPackageReleaseById" | "addPackageRelease" | "updatePackageRelease" | "deletePackageFile" | "addPackageFile" | "updatePackageFile" | "getStarCount" | "getPackageFilesByReleaseId" | "updatePackageReleaseFsSha" | "addAiReview" | "updateAiReview" | "getAiReviewById" | "listAiReviews" | "addDatasheet" | "getDatasheetById" | "getDatasheetByChipName" | "listDatasheets" | "updateDatasheet"> & {
     addOrder: (order: Omit<Order, "order_id">) => Order;
     getOrderById: (orderId: string) => Order | undefined;
     getOrderFilesByOrderId: (orderId: string) => OrderFile[];
@@ -1155,6 +1155,7 @@ declare const createDatabase: ({ seed }?: {
         chip_name: string;
     }) => Datasheet;
     getDatasheetById: (datasheetId: string) => Datasheet | undefined;
+    getDatasheetByChipName: (chipName: string) => Datasheet | undefined;
     listDatasheets: ({ chip_name, is_popular, }?: {
         chip_name?: string;
         is_popular?: boolean;
@@ -1420,7 +1421,7 @@ declare const createDatabase: ({ seed }?: {
         }[] | null;
         datasheet_pdf_urls: string[] | null;
     }[];
-}, "addOrder" | "getOrderById" | "getOrderFilesByOrderId" | "addOrderQuote" | "getOrderQuoteById" | "getJlcpcbOrderStatesByOrderId" | "getJlcpcbOrderStepRunsByJlcpcbOrderStateId" | "updateOrder" | "addJlcpcbOrderState" | "updateJlcpcbOrderState" | "addOrderFile" | "getOrderFileById" | "addAccount" | "addAccountPackage" | "getAccountPackageById" | "updateAccountPackage" | "deleteAccountPackage" | "addSnippet" | "getLatestSnippets" | "getTrendingSnippets" | "getPackagesByAuthor" | "getSnippetByAuthorAndName" | "updateSnippet" | "getSnippetById" | "searchSnippets" | "searchPackages" | "deleteSnippet" | "addSession" | "getSessions" | "createLoginPage" | "getLoginPage" | "updateLoginPage" | "getAccount" | "updateAccount" | "createSession" | "addStar" | "removeStar" | "hasStarred" | "addPackage" | "updatePackage" | "getPackageById" | "getPackageReleaseById" | "addPackageRelease" | "updatePackageRelease" | "deletePackageFile" | "addPackageFile" | "updatePackageFile" | "getStarCount" | "getPackageFilesByReleaseId" | "updatePackageReleaseFsSha" | "addAiReview" | "updateAiReview" | "getAiReviewById" | "listAiReviews" | "addDatasheet" | "getDatasheetById" | "listDatasheets" | "updateDatasheet"> & {
+}, "addOrder" | "getOrderById" | "getOrderFilesByOrderId" | "addOrderQuote" | "getOrderQuoteById" | "getJlcpcbOrderStatesByOrderId" | "getJlcpcbOrderStepRunsByJlcpcbOrderStateId" | "updateOrder" | "addJlcpcbOrderState" | "updateJlcpcbOrderState" | "addOrderFile" | "getOrderFileById" | "addAccount" | "addAccountPackage" | "getAccountPackageById" | "updateAccountPackage" | "deleteAccountPackage" | "addSnippet" | "getLatestSnippets" | "getTrendingSnippets" | "getPackagesByAuthor" | "getSnippetByAuthorAndName" | "updateSnippet" | "getSnippetById" | "searchSnippets" | "searchPackages" | "deleteSnippet" | "addSession" | "getSessions" | "createLoginPage" | "getLoginPage" | "updateLoginPage" | "getAccount" | "updateAccount" | "createSession" | "addStar" | "removeStar" | "hasStarred" | "addPackage" | "updatePackage" | "getPackageById" | "getPackageReleaseById" | "addPackageRelease" | "updatePackageRelease" | "deletePackageFile" | "addPackageFile" | "updatePackageFile" | "getStarCount" | "getPackageFilesByReleaseId" | "updatePackageReleaseFsSha" | "addAiReview" | "updateAiReview" | "getAiReviewById" | "listAiReviews" | "addDatasheet" | "getDatasheetById" | "getDatasheetByChipName" | "listDatasheets" | "updateDatasheet"> & {
     addOrder: (order: Omit<Order, "order_id">) => Order;
     getOrderById: (orderId: string) => Order | undefined;
     getOrderFilesByOrderId: (orderId: string) => OrderFile[];
@@ -1506,6 +1507,7 @@ declare const createDatabase: ({ seed }?: {
         chip_name: string;
     }) => Datasheet;
     getDatasheetById: (datasheetId: string) => Datasheet | undefined;
+    getDatasheetByChipName: (chipName: string) => Datasheet | undefined;
     listDatasheets: ({ chip_name, is_popular, }?: {
         chip_name?: string;
         is_popular?: boolean;

package/dist/index.js

@@ -3127,6 +3127,12 @@ var initializer = combine(databaseSchema.parse({}), (set, get) => ({
     const state = get();
     return state.datasheets.find((d) => d.datasheet_id === datasheetId);
   },
+  getDatasheetByChipName: (chipName) => {
+    const state = get();
+    return state.datasheets.find(
+      (d) => d.chip_name.toLowerCase() === chipName.toLowerCase()
+    );
+  },
   listDatasheets: ({
     chip_name,
     is_popular

package/fake-snippets-api/lib/db/db-client.ts

@@ -1397,6 +1397,12 @@ const initializer = combine(databaseSchema.parse({}), (set, get) => ({
     const state = get()
     return state.datasheets.find((d) => d.datasheet_id === datasheetId)
   },
+  getDatasheetByChipName: (chipName: string): Datasheet | undefined => {
+    const state = get()
+    return state.datasheets.find(
+      (d) => d.chip_name.toLowerCase() === chipName.toLowerCase(),
+    )
+  },
   listDatasheets: ({
     chip_name,
     is_popular,

package/fake-snippets-api/routes/api/datasheets/get.ts

@@ -5,16 +5,26 @@ import { z } from "zod"
 export default withRouteSpec({
   methods: ["GET", "POST"],
   auth: "session",
-  queryParams: z.object({
-    datasheet_id: z.string(),
-  }),
+  queryParams: z
+    .object({
+      datasheet_id: z.string().optional(),
+      chip_name: z.string().optional(),
+    })
+    .refine((val) => val.datasheet_id || val.chip_name, {
+      message: "datasheet_id or chip_name required",
+    }),
   jsonBody: z.any().optional(),
   jsonResponse: z.object({
     datasheet: datasheetSchema,
   }),
 })(async (req, ctx) => {
-  const { datasheet_id } = req.query
-  const datasheet = ctx.db.getDatasheetById(datasheet_id)
+  const { datasheet_id, chip_name } = req.query
+  let datasheet
+  if (datasheet_id) {
+    datasheet = ctx.db.getDatasheetById(datasheet_id)
+  } else if (chip_name) {
+    datasheet = ctx.db.getDatasheetByChipName(chip_name)
+  }
   if (!datasheet) {
     return ctx.error(404, {
       error_code: "datasheet_not_found",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tscircuit/fake-snippets",
-  "version": "0.0.93",
+  "version": "0.0.95",
   "type": "module",
   "repository": {
     "type": "git",

package/src/App.tsx

@@ -68,6 +68,8 @@ const DevLoginPage = lazyImport(() => import("@/pages/dev-login"))
 const ViewPackagePage = lazyImport(() => import("@/pages/view-package"))
 const PackageBuildsPage = lazyImport(() => import("@/pages/package-builds"))
 const TrendingPage = lazyImport(() => import("@/pages/trending"))
+const DatasheetPage = lazyImport(() => import("@/pages/datasheet"))
+const DatasheetsPage = lazyImport(() => import("@/pages/datasheets"))
 const PackageEditorPage = lazyImport(async () => {
   const [editorModule] = await Promise.all([
     import("@/pages/package-editor"),
@@ -180,6 +182,8 @@ function App() {
             <Route path="/settings" component={SettingsPage} />
             <Route path="/search" component={SearchPage} />
             <Route path="/trending" component={TrendingPage} />
+            <Route path="/datasheets" component={DatasheetsPage} />
+            <Route path="/datasheets/:chipName" component={DatasheetPage} />
             <Route path="/authorize" component={AuthenticatePage} />
             <Route path="/my-orders" component={MyOrdersPage} />
             <Route path="/dev-login" component={DevLoginPage} />

package/src/hooks/use-create-datasheet.ts

@@ -0,0 +1,30 @@
+import { useMutation, useQueryClient } from "react-query"
+import { useAxios } from "@/hooks/use-axios"
+import type { Datasheet } from "fake-snippets-api/lib/db/schema"
+
+export const useCreateDatasheet = ({
+  onSuccess,
+}: { onSuccess?: (datasheet: Datasheet) => void } = {}) => {
+  const axios = useAxios()
+  const queryClient = useQueryClient()
+
+  return useMutation(
+    ["createDatasheet"],
+    async ({ chip_name }: { chip_name: string }) => {
+      const { data } = await axios.post("/datasheets/create", { chip_name })
+      await axios.get("/_fake/run_async_tasks")
+      return data.datasheet as Datasheet
+    },
+    {
+      onSuccess: (datasheet, variables) => {
+        if (variables?.chip_name) {
+          queryClient.invalidateQueries(["datasheet", variables.chip_name])
+        }
+        onSuccess?.(datasheet)
+      },
+      onError: (error: any) => {
+        console.error("Error creating datasheet:", error)
+      },
+    },
+  )
+}

package/src/hooks/use-datasheet.ts

@@ -0,0 +1,18 @@
+import { useQuery } from "react-query"
+import { useAxios } from "@/hooks/use-axios"
+import type { Datasheet } from "fake-snippets-api/lib/db/schema"
+
+export const useDatasheet = (chipName: string | null) => {
+  const axios = useAxios()
+  return useQuery<Datasheet, Error & { status: number }>(
+    ["datasheet", chipName],
+    async () => {
+      if (!chipName) throw new Error("chip name required")
+      const { data } = await axios.get("/datasheets/get", {
+        params: { chip_name: chipName },
+      })
+      return data.datasheet as Datasheet
+    },
+    { enabled: Boolean(chipName), retry: false, refetchOnWindowFocus: false },
+  )
+}

package/src/pages/datasheet.tsx

@@ -0,0 +1,87 @@
+import { useParams } from "wouter"
+import { useDatasheet } from "@/hooks/use-datasheet"
+import { useCreateDatasheet } from "@/hooks/use-create-datasheet"
+import Header from "@/components/Header"
+import Footer from "@/components/Footer"
+import type { Datasheet } from "fake-snippets-api/lib/db/schema"
+
+export const DatasheetPage = () => {
+  const { chipName } = useParams<{ chipName: string }>()
+  const datasheetQuery = useDatasheet(chipName)
+  const createDatasheet = useCreateDatasheet()
+
+  const handleCreate = () => {
+    if (!chipName) return
+    createDatasheet.mutate({ chip_name: chipName })
+  }
+
+  return (
+    <div className="min-h-screen flex flex-col">
+      <Header />
+      <main className="container mx-auto flex-1 px-4 py-8">
+        <h1 className="text-3xl font-bold mb-6">{chipName} Datasheet</h1>
+        {datasheetQuery.isLoading ? (
+          <p>Loading...</p>
+        ) : datasheetQuery.data ? (
+          <div>
+            <h2 className="text-xl font-semibold mb-2">Pin Information</h2>
+            {datasheetQuery.data.pin_information ? (
+              <table className="table-auto border-collapse mb-6">
+                <thead>
+                  <tr>
+                    <th className="border px-2 py-1">Pin</th>
+                    <th className="border px-2 py-1">Name</th>
+                    <th className="border px-2 py-1">Description</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {datasheetQuery.data.pin_information.map((pin) => (
+                    <tr key={pin.pin_number}>
+                      <td className="border px-2 py-1">{pin.pin_number}</td>
+                      <td className="border px-2 py-1">{pin.name}</td>
+                      <td className="border px-2 py-1">{pin.description}</td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            ) : (
+              <p>No pin information available.</p>
+            )}
+
+            <h2 className="text-xl font-semibold mb-2">PDFs</h2>
+            {datasheetQuery.data.datasheet_pdf_urls ? (
+              <ul className="list-disc pl-5">
+                {datasheetQuery.data.datasheet_pdf_urls.map((url) => (
+                  <li key={url}>
+                    <a href={url} className="text-blue-600 underline">
+                      {url}
+                    </a>
+                  </li>
+                ))}
+              </ul>
+            ) : (
+              <p>No datasheet PDFs available.</p>
+            )}
+          </div>
+        ) : datasheetQuery.error &&
+          (datasheetQuery.error as any).status === 404 ? (
+          <div>
+            <p>No datasheet found.</p>
+            <button
+              className="mt-2 px-4 py-2 bg-blue-500 text-white rounded"
+              onClick={handleCreate}
+              disabled={createDatasheet.isLoading}
+            >
+              {createDatasheet.isLoading ? "Creating..." : "Create Datasheet"}
+            </button>
+          </div>
+        ) : (
+          <p>Error loading datasheet.</p>
+        )}
+      </main>
+      <Footer />
+    </div>
+  )
+}
+
+export default DatasheetPage

package/src/pages/datasheets.tsx

@@ -0,0 +1,80 @@
+import React, { useState } from "react"
+import { useQuery } from "react-query"
+import { useAxios } from "@/hooks/use-axios"
+import Header from "@/components/Header"
+import Footer from "@/components/Footer"
+import { Input } from "@/components/ui/input"
+import { Search } from "lucide-react"
+import { Link } from "wouter"
+
+interface DatasheetSummary {
+  datasheet_id: string
+  chip_name: string
+}
+
+export const DatasheetsPage: React.FC = () => {
+  const axios = useAxios()
+  const [searchQuery, setSearchQuery] = useState("")
+
+  const {
+    data: datasheets,
+    isLoading,
+    error,
+  } = useQuery(
+    ["datasheetList", searchQuery],
+    async () => {
+      const params = new URLSearchParams()
+      if (searchQuery) {
+        params.append("chip_name", searchQuery)
+      } else {
+        params.append("is_popular", "true")
+      }
+      const { data } = await axios.get(
+        `/api/datasheets/list?${params.toString()}`,
+      )
+      return data.datasheets as DatasheetSummary[]
+    },
+    { keepPreviousData: true },
+  )
+
+  return (
+    <div className="min-h-screen flex flex-col">
+      <Header />
+      <main className="container mx-auto flex-1 px-4 py-8">
+        <h1 className="text-3xl font-bold mb-6">Datasheets</h1>
+        <div className="max-w-md mb-6">
+          <div className="relative">
+            <Search className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 h-4 w-4" />
+            <Input
+              type="search"
+              placeholder="Search datasheets..."
+              className="pl-10"
+              value={searchQuery}
+              onChange={(e) => setSearchQuery(e.target.value)}
+              aria-label="Search datasheets"
+              role="searchbox"
+            />
+          </div>
+        </div>
+        {isLoading ? (
+          <p>Loading...</p>
+        ) : error ? (
+          <p>Error loading datasheets.</p>
+        ) : datasheets && datasheets.length > 0 ? (
+          <ul className="list-disc pl-5 space-y-2">
+            {datasheets.map((ds) => (
+              <li key={ds.datasheet_id}>
+                <Link href={`/datasheets/${ds.chip_name}`}>{ds.chip_name}</Link>
+              </li>
+            ))}
+          </ul>
+        ) : (
+          <p>No datasheets found.</p>
+        )}
+      </main>
+      <Footer />
+    </div>
+  )
+}
+
+export default DatasheetsPage