@tscircuit/runframe 0.0.379 → 0.0.381

package/dist/{chunk-4OLYVIGV.js → chunk-QVSJAK7O.js}

@@ -1037,7 +1037,7 @@ var RenderLogViewer = ({
 };
 
 // package.json
-var version = "0.0.378";
+var version = "0.0.380";
 
 // lib/components/CircuitJsonPreview/CircuitJsonPreview.tsx
 import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
@@ -1754,111 +1754,108 @@ var registryKy = {
   patch: (url, options) => getRegistryKy().patch(url, options)
 };
 
+// lib/hooks/use-create-order-quote.ts
+import { useMutation } from "react-query";
+
+// lib/api/order-quotes.ts
+var createOrderQuote = async (packageReleaseId) => {
+  const { order_quote_id } = await registryKy.post("order_quotes/create", {
+    json: {
+      package_release_id: packageReleaseId,
+      vendor_name: "jlcpcb"
+      // TODO: Remove this once we have more vendor
+    }
+  }).json();
+  return order_quote_id;
+};
+var getOrderQuote = async (orderQuoteId) => {
+  const { order_quote } = await registryKy.get(`order_quotes/get`, {
+    searchParams: {
+      order_quote_id: orderQuoteId
+    }
+  }).json();
+  return order_quote;
+};
+
+// lib/hooks/use-create-order-quote.ts
+var useCreateOrderQuote = () => {
+  return useMutation(
+    (packageReleaseId) => createOrderQuote(packageReleaseId)
+  );
+};
+
+// lib/hooks/use-order-quote-polling.ts
+import { useQuery } from "react-query";
+var useOrderQuotePolling = (orderQuoteId) => {
+  const {
+    data: orderQuote,
+    error,
+    status
+  } = useQuery(
+    ["getOrderQuote", orderQuoteId],
+    () => getOrderQuote(orderQuoteId),
+    {
+      enabled: !!orderQuoteId,
+      refetchInterval: (data) => {
+        if (data?.is_completed || data?.has_error) {
+          return false;
+        }
+        return 4e3;
+      },
+      refetchIntervalInBackground: true,
+      retry: false
+    }
+  );
+  return {
+    status: status === "loading" ? "loading" : status === "error" ? "error" : "success",
+    data: orderQuote ?? null,
+    error: error instanceof Error ? error : null
+  };
+};
+
 // lib/components/OrderDialog/InitialOrder.tsx
 import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
 var InitialOrderScreen = ({
   onCancel,
   packageReleaseId
 }) => {
-  const [quotes, setQuotes] = useState5([]);
-  const [loading, setLoading] = useState5(true);
   const [selectedVendorIdx, setSelectedVendorIdx] = useState5(
     null
   );
   const [selectedShippingIdx, setSelectedShippingIdx] = useState5(
     null
   );
-  const [fetchError, setFetchError] = useState5(null);
-  const [orderQuoteReceived, setOrderQuoteReceived] = useState5(null);
-  const createOrderQuotes = async () => {
-    const { order_quote_id } = await registryKy.post("order_quotes/create", {
-      json: {
-        package_release_id: packageReleaseId,
-        vendor_name: "jlcpcb"
-        // TODO: Remove this once we have more vendor
-      }
-    }).json();
-    return order_quote_id;
-  };
-  const getOrderQuotes = async (orderQuoteId) => {
-    const { order_quote } = await registryKy.get(`order_quotes/get`, {
-      searchParams: {
-        order_quote_id: orderQuoteId
-      }
-    }).json();
-    return order_quote;
-  };
-  const pollToGetOrderQuotes = async (orderQuoteId, maxAttempts = 10) => {
-    let attempts = 0;
-    while (attempts < maxAttempts) {
-      try {
-        const orderQuote = await getOrderQuotes(orderQuoteId);
-        if (orderQuote.is_completed) {
-          setOrderQuoteReceived(orderQuote);
-          return orderQuote;
-        }
-        if (orderQuote.has_error) {
-          throw new Error(orderQuote.error?.message ?? "Unknown error");
-        }
-        attempts++;
-        await new Promise((resolve) => setTimeout(resolve, 2e3));
-      } catch (error) {
-        attempts++;
-        console.error("Error polling order quote:", error);
-        await new Promise((resolve) => setTimeout(resolve, 2e3));
-      }
-    }
-    throw new Error("Polling timed out after maximum attempts");
-  };
-  const redirectToStripeCheckout = async (orderQuoteId) => {
+  const { mutate: createOrderQuote2, data: orderQuoteId } = useCreateOrderQuote();
+  const { status, data: orderQuote, error } = useOrderQuotePolling(orderQuoteId);
+  const redirectToStripeCheckout = async (orderQuoteId2) => {
     const stripeCheckoutBaseUrl = getWindowVar(
       "TSCIRCUIT_STRIPE_CHECKOUT_BASE_URL"
     );
-    window.location.href = `${stripeCheckoutBaseUrl}?client_reference_id=${orderQuoteId}`;
+    window.location.href = `${stripeCheckoutBaseUrl}?client_reference_id=${orderQuoteId2}`;
   };
-  useEffect3(() => {
-    const fetchQuotes = async () => {
-      setLoading(true);
-      setQuotes([]);
-      setFetchError(null);
-      const orderQuoteId = await createOrderQuotes();
-      if (!orderQuoteId) {
-        toast.error("Failed to create order quote.");
-        setLoading(false);
-        return;
-      }
-      try {
-        const orderQuote = await pollToGetOrderQuotes(orderQuoteId);
-        setQuotes([orderQuote]);
-        setLoading(false);
-      } catch (error) {
-        console.error(error);
-        toast.error("Failed to fetch order quotes.");
-        setLoading(false);
-      }
-    };
-    fetchQuotes();
-  }, []);
   useEffect3(() => {
     setSelectedShippingIdx(null);
   }, [selectedVendorIdx]);
+  useEffect3(() => {
+    createOrderQuote2(packageReleaseId);
+  }, [packageReleaseId, createOrderQuote2]);
   return /* @__PURE__ */ jsxs15("div", { className: "rf-max-w-lg rf-mx-auto rf-bg-white rf-rounded-2xl rf-p-8 rf-flex rf-flex-col rf-gap-3", children: [
     /* @__PURE__ */ jsx19("h2", { className: "rf-text-3xl rf-font-bold rf-text-center rf-mb-8", children: "Order PCB \u2013 Choose a Vendor" }),
     /* @__PURE__ */ jsx19("div", { className: "rf-mb-4 rf-text-gray-700 rf-text-center", children: "Select a quote from below, then pick a shipping method." }),
-    loading ? /* @__PURE__ */ jsxs15("div", { className: "rf-flex rf-flex-col rf-items-center rf-gap-2 rf-my-12", children: [
+    status === "loading" ? /* @__PURE__ */ jsxs15("div", { className: "rf-flex rf-flex-col rf-items-center rf-gap-2 rf-my-12", children: [
       /* @__PURE__ */ jsx19(Loader22, { className: "rf-animate-spin rf-w-8 rf-h-8 rf-text-gray-400" }),
       /* @__PURE__ */ jsx19("p", { className: "rf-text-gray-600", children: "Fetching quotes..." })
-    ] }) : quotes.length === 0 ? /* @__PURE__ */ jsx19("div", { className: "rf-text-red-600 rf-text-center rf-py-12", children: "No quotes available." }) : quotes.map((quote, idx) => /* @__PURE__ */ jsx19(
+    ] }) : status === "error" ? /* @__PURE__ */ jsx19("div", { className: "rf-text-red-600 rf-text-center rf-py-12", children: error?.message || "Failed to fetch quotes" }) : !orderQuote ? /* @__PURE__ */ jsx19("div", { className: "rf-text-red-600 rf-text-center rf-py-12", children: "No quotes available." }) : /* @__PURE__ */ jsx19(
       VendorQuoteCard,
       {
-        vendor: quote,
-        isActive: selectedVendorIdx === idx,
-        onSelect: () => setSelectedVendorIdx(idx),
-        selectedShippingIdx: selectedVendorIdx === idx ? selectedShippingIdx : null,
+        vendor: orderQuote,
+        isActive: selectedVendorIdx === 0,
+        onSelect: () => setSelectedVendorIdx(0),
+        selectedShippingIdx: selectedVendorIdx === 0 ? selectedShippingIdx : null,
         onSelectShipping: setSelectedShippingIdx
       },
-      quote.order_quote_id
-    )),
+      orderQuote.order_quote_id
+    ),
     /* @__PURE__ */ jsxs15("div", { className: "rf-flex rf-justify-between rf-mt-5 rf-gap-4", children: [
       /* @__PURE__ */ jsx19(
         Button,
@@ -1875,16 +1872,14 @@ var InitialOrderScreen = ({
         {
           type: "button",
           className: "rf-w-1/2 rf-bg-blue-600 rf-hover:bg-blue-700",
-          disabled: selectedVendorIdx === null || // selectedShippingIdx === null ||
-          loading,
+          disabled: selectedVendorIdx === null || status === "loading",
           onClick: () => {
-            if (selectedVendorIdx === null || // selectedShippingIdx === null ||
-            loading) {
+            if (selectedVendorIdx === null || status === "loading") {
               toast.error("Please select a vendor and shipping option.");
               return;
             }
-            if (orderQuoteReceived) {
-              redirectToStripeCheckout(orderQuoteReceived.order_quote_id);
+            if (orderQuote) {
+              redirectToStripeCheckout(orderQuote.order_quote_id);
             }
           },
           children: "Continue"

package/dist/preview.js

@@ -8,7 +8,7 @@ import {
   linkify,
   useOrderDialog,
   useOrderDialogCli
-} from "./chunk-4OLYVIGV.js";
+} from "./chunk-QVSJAK7O.js";
 export {
   BomTable,
   CadViewer,

package/dist/runner.js

@@ -26,7 +26,7 @@ import {
   useOrderDialog,
   useOrderDialogCli,
   useRunFrameStore
-} from "./chunk-4OLYVIGV.js";
+} from "./chunk-QVSJAK7O.js";
 
 // lib/components/RunFrame/RunFrame.tsx
 import { createCircuitWebWorker } from "@tscircuit/eval/worker";