@base44/app-plugin-commerce 0.7.0 → 0.8.0

package/src/commerce/storefront/useCheckout.jsx

@@ -69,6 +69,10 @@ function resolvePaymentMethod(gateways, picked) {
  *   `not_needed` (virtual cart — render nothing). `singleShippingMethod` flags
  *   the one-option case and `chosenShippingMethod` is filled for it, so a single
  *   option is never left unselected and never rendered as a picker of one.
+ *   **A pick applies optimistically**: `chosenShippingMethod` reflects it from
+ *   the click, while the priced view catches up in the background
+ *   (`shippingChoicePending` is true for that window) — a radio that waits for
+ *   the server to look checked reads as a picker that ignored the click.
  * - **Payment choice.** `paymentMethods` come from store info (their ONLY
  *   source — `cart.payment_gateways` is always undefined). One enabled gateway
  *   is selected from the first render that has store info. The selection is
@@ -193,18 +197,33 @@ export function useCheckout(options = {}) {
   const shippingStatus = cart?.shipping_status ?? null;
   const shippingMethods = cart?.available_shipping_methods ?? [];
   const singleShippingMethod = shippingMethods.length === 1;
+  // The optimistic pick: `choose-shipping-method` is a priced round trip, and a
+  // radio that only looks checked once the response lands reads as a picker
+  // that ignored the click. The pick covers exactly the in-flight window — it
+  // clears when its own call settles, so the confirmed view (or, on failure,
+  // the cart's stored choice) takes back over without a flicker.
+  const [pickedShippingMethod, setPickedShippingMethod] = useState("");
   // The backend auto-selects when it offers exactly one rate (`auto_selected`)
   // and echoes it back on the cart, so the lookup normally finds it. The
   // fallback covers the seam where a freshly repriced address offers one rate
   // the cart's stored id hasn't caught up with: a single option is selected,
   // and must read as selected, from the moment it is offered.
   const chosenShippingMethod =
+    shippingMethods.find((m) => m.id === pickedShippingMethod) ??
     shippingMethods.find((m) => m.id === cart?.chosen_shipping_method) ??
     (singleShippingMethod ? shippingMethods[0] : null);
   const chooseShippingMethod = useCallback(
-    (methodId) => runCart(() => client.chooseShippingMethod(methodId)),
+    (methodId) => {
+      setPickedShippingMethod(methodId);
+      return runCart(() => client.chooseShippingMethod(methodId)).finally(() =>
+        // Only the call's own pick is cleared — a newer click stays optimistic
+        // until its own call settles (the queue serializes them in order).
+        setPickedShippingMethod((cur) => (cur === methodId ? "" : cur)),
+      );
+    },
     [client, runCart],
   );
+  const shippingChoicePending = !!pickedShippingMethod;
 
   // ── payment choice (gateways live on store info ONLY) ────────────────────
   // The pick is state; the *method* is derived, so a lone gateway is selected
@@ -224,9 +243,14 @@ export function useCheckout(options = {}) {
   else if (!cart || !cart.items?.length) blockers.push("empty_cart");
   if (missingBilling.length) blockers.push("billing_incomplete");
   if (shipToDifferent && !complete) blockers.push("shipping_address_incomplete");
-  if (syncPending || syncing) blockers.push("shipping_recalculating");
+  if (syncPending || syncing || shippingChoicePending) blockers.push("shipping_recalculating");
   if (shippingStatus === "missing_address") blockers.push("shipping_address_required");
-  if (shippingStatus === "choice_required") blockers.push("shipping_method_required");
+  // A pick in flight already shows as selected — flagging "choose one" over a
+  // visibly chosen radio contradicts the screen; the transient code above
+  // covers the window, and the blocker returns if the pick fails.
+  if (shippingStatus === "choice_required" && !shippingChoicePending) {
+    blockers.push("shipping_method_required");
+  }
   if (shippingStatus === "none_available" || addressError?.code === "shipping_not_available") {
     blockers.push("shipping_not_available");
   }
@@ -322,6 +346,7 @@ export function useCheckout(options = {}) {
     chosenShippingMethod,
     singleShippingMethod,
     chooseShippingMethod,
+    shippingChoicePending,
     // payment choice
     paymentMethods,
     paymentMethod,

package/src/commerce/utils/storefront.js

@@ -24,6 +24,34 @@
  *   payload) returns an action's payload as-is.
  */
 
+/**
+ * Near-miss payload keys, rejected rather than aliased: the same names come
+ * back on the review rows, so a store that posts `content` reads
+ * `reviewer_name` too — aliasing the submit would leave every author blank
+ * with nothing failing to say why.
+ */
+const REVIEW_FIELD_FIXES = {
+  content: "review",
+  text: "review",
+  body: "review",
+  comment: "review",
+  reviewer_name: "reviewer",
+  name: "reviewer",
+  author: "reviewer",
+  reviewer_email: "email",
+};
+
+const REVIEW_SIGNATURE = "submitReview({ product_id, review, rating, reviewer, email })";
+
+/** Throw when a payload uses a near-miss name and leaves the real field empty. */
+function assertReviewFieldNames(payload) {
+  const wrong = Object.keys(payload).filter((k) => {
+    const canonical = REVIEW_FIELD_FIXES[k];
+    return canonical && !String(payload[canonical] ?? "").trim();
+  });
+  if (wrong.length) throw new Error(`${REVIEW_SIGNATURE} — got: ${wrong.join(", ")}`);
+}
+
 /** The stable error code a failed storefront call carries, if any. */
 export function storefrontErrorCode(e) {
   return e?.response?.data?.code ?? e?.data?.code ?? e?.code ?? null;
@@ -111,7 +139,16 @@ export function createStorefront(base44, { storageKey = "cart_token", storage }
     /**
      * Submit a review. `email` is required for a guest and ignored for a
      * signed-in caller (the session's email always wins, so nobody can
-     * review as someone else). `rating` is optional, 0–5.
+     * review as someone else). At least one of `review` (the text) or
+     * `rating` (1–5 stars) is required — a stars-only submission is valid,
+     * and so is text-only; with neither this **throws synchronously**, naming
+     * the keys it did receive, instead of letting the server answer about a
+     * field the customer filled in.
+     *
+     * **One set of names, both directions** — `{ product_id, review, rating,
+     * reviewer, email }` in, `{ id, reviewer, review, rating, verified,
+     * created_date }` back. Not the entity's columns: a near-miss (`content`,
+     * `reviewer_name`, `reviewer_email`, …) throws rather than being aliased.
      *
      * Resolves to `{ review_id, status, verified }` — **`status` is
      * `"approved"` or `"hold"` depending on the store's `auto_approve_reviews`
@@ -119,7 +156,17 @@ export function createStorefront(base44, { storageKey = "cart_token", storage }
      * moderation. Rejects with `email_required` | `review_incomplete` |
      * `invalid_rating` | `not_found`.
      */
-    submitReview({ product_id, review, rating, reviewer, email } = {}) {
+    submitReview(payload = {}) {
+      const { product_id, review, rating, reviewer, email } = payload;
+      // A wrong field name used to vanish in the destructure: the text never
+      // left the browser and the server answered "review is required" about a
+      // field the customer had filled in. Name the mistake instead, here,
+      // where the fix also applies to the list the store renders back.
+      assertReviewFieldNames(payload);
+      const rated = rating != null && Number(rating) >= 1;
+      if (!String(review ?? "").trim() && !rated) {
+        throw new Error(`${REVIEW_SIGNATURE} — needs review text or a rating of 1-5`);
+      }
       return inv("commerce/storefront-catalog", {
         action: "submit-review",
         product_id,