Second team review requested changes

- Fix incorrect discount/subsidy context in FoodDetail - FooDetail, move vendor below the divider line - Fix showing of the available credit on the FoodCart page - apply the subsidy for the subtotal (show $10 instead of $90) - ensure the offering can be paid at checkout without problems - Fulfillment options have link to address in google maps - "checkout whats available" typo, -> "what's" - FoodDetail, change order of discount and subsidy credit context
lithictech · Nov 17, 2023 · b739488 · b739488
1 parent 8846193
commit b739488
Show file tree

Hide file tree

Showing 7 changed files with 53 additions and 16 deletions.
diff --git a/lib/suma/api/commerce.rb b/lib/suma/api/commerce.rb
@@ -310,9 +310,15 @@ class OfferingWithContextEntity < BaseEntity
     end
   end
 
+  class FulfillmentOptionAddressEntity < BaseEntity
+    expose :one_line_address, &self.delegate_to(:one_line_address)
+  end
+
   class FulfillmentOptionEntity < BaseEntity
+    include Suma::API::Entities
     expose :id
     expose_translated :description
+    expose :address, with: FulfillmentOptionAddressEntity
   end
 
   class CheckoutProductEntity < OfferingProductEntity

diff --git a/webapp/public/locale/en/strings.json b/webapp/public/locale/en/strings.json
@@ -59,7 +59,7 @@
     "success_intro": "Thank you for signing up, and welcome to the suma app!\n\nWe will update you on all future projects, money saving opportunities, and how to complete the app enrollment process. To learn more about suma, visit our website at $t(strings:common:mysuma_website_link), or check us out on our social media using the link below. Chat soon!"
   },
   "dashboard": {
-    "check_available_for_purchase": "Check out whats available for purchase",
+    "check_available_for_purchase": "Check out what's available for purchase",
     "check_ongoing_trip": "You have an ongoing trip. Please make sure you end it when you are finished with your ride!",
     "check_ongoing_trip_button": "See My Trip",
     "claim_orders": "Your order is ready for pickup.",
@@ -112,6 +112,7 @@
   "food": {
     "add_card": "Add debit/credit card",
     "add_to_cart": "Add to cart",
+    "address": "Address",
     "available_offerings": "Available Offerings",
     "available_until": "Until",
     "button_press_warning": "Don't press this button until you are at the market",
@@ -131,7 +132,7 @@
     "continue_to_checkout": "Continue to Checkout",
     "current_offerings": "Current Offerings",
     "details_header": "Details",
-    "discount_applied": "{{discountAmount, sumaCurrency}} discount",
+    "discount_applied": "{{discountAmount, sumaCurrency}} discount from {{vendorName}}",
     "edit_quantities": "Edit quantities",
     "ending_in": "ending in {{last4}}",
     "from_vendor": "From {{vendorName}}",
@@ -177,7 +178,7 @@
     "save_payment": "Save for future orders",
     "shop": "Shop",
     "sold_out": "Sold out",
-    "subsidy_and_discount_applied": "{{subsidyAmount, sumaCurrency}} suma subsidy credit and {{discountAmount, sumaCurrency}} discount",
+    "subsidy_and_discount_applied": "{{discountAmount, sumaCurrency}} discount from {{vendorName}} and {{subsidyAmount, sumaCurrency}} suma subsidy credit",
     "subsidy_applied": "{{subsidyAmount, sumaCurrency}} suma subsidy credit",
     "subtotal_items": "Subtotal ({{totalItems}} items): **{{customerCost, sumaCurrency}}**",
     "terms_of_use_agreement": "By clicking \"place order\" you agree to suma's [Terms of Use](/terms-of-use__blank__).",

diff --git a/webapp/public/locale/es/strings.json b/webapp/public/locale/es/strings.json
@@ -112,6 +112,7 @@
   "food": {
     "add_card": "Añadir tarjeta de débito/crédito",
     "add_to_cart": "Añadir al carrito",
+    "address": "Dirección",
     "available_offerings": "Ofertas disponibles",
     "available_until": "Hasta",
     "button_press_warning": "No presione este botón hasta que esté en el mercado",
@@ -131,7 +132,7 @@
     "continue_to_checkout": "Continúe para finalizar",
     "current_offerings": "Ofertas presentes",
     "details_header": "Detalles",
-    "discount_applied": "{{amount, sumaCurrency}} descuento",
+    "discount_applied": "{{discountAmount, sumaCurrency}} descuento de {{vendorName}}",
     "edit_quantities": "Editar cantidades",
     "ending_in": "terminan en {{last4}}",
     "from_vendor": "De {{vendorName}}",
@@ -177,7 +178,7 @@
     "save_payment": "Guardar para pedidos futuros",
     "shop": "Comprar",
     "sold_out": "Todo vendido",
-    "subsidy_and_discount_applied": "{{subsidyAmount, sumaCurrency}} suma subsidio crédito y {{discountAmount, sumaCurrency}} descuento",
+    "subsidy_and_discount_applied": "{{discountAmount, sumaCurrency}} descuento de {{vendorName}} y {{subsidyAmount, sumaCurrency}} suma subsidio crédito",
     "subsidy_applied": "{{subsidyAmount, sumaCurrency}} suma subsidio crédito",
     "subtotal_items": "Subtotal ({{totalItems}} artículos): **{{customerCost, sumaCurrency}} **",
     "terms_of_use_agreement": "Al hacer clic en \"realizar pedido\" usted acepta los [Términos de uso](/terms-of-use__blank__) de suma.",

diff --git a/webapp/src/components/FoodPrice.jsx b/webapp/src/components/FoodPrice.jsx
@@ -10,6 +10,7 @@ export default function FoodPrice({
   discountAmount,
   displayableNoncashLedgerContributionAmount,
   displayableCashPrice,
+  vendorName,
   fs,
   bold,
   direction,
@@ -39,6 +40,7 @@ export default function FoodPrice({
           <p className="mb-0 small text-success">
             {t("food:discount_applied", {
               discountAmount: discountAmount,
+              vendorName: vendorName,
             })}
           </p>
         )}
@@ -54,8 +56,9 @@ export default function FoodPrice({
         anyMoney(displayableNoncashLedgerContributionAmount) && (
           <p className="mb-0 small text-success">
             {t("food:subsidy_and_discount_applied", {
+              discountAmount: discountAmount,
+              vendorName: vendorName,
               subsidyAmount: displayableNoncashLedgerContributionAmount,
-              discountAmount: displayableNoncashLedgerContributionAmount,
             })}
           </p>
         )}

diff --git a/webapp/src/pages/FoodCart.jsx b/webapp/src/pages/FoodCart.jsx
@@ -93,10 +93,10 @@ export default function FoodCart() {
                   customerCost: cart.customerCost,
                 })}
               </div>
-              {anyMoney(cart.displayableNoncashLedgerContributionAmount) && (
+              {anyMoney(cart.noncashLedgerContributionAmount) && (
                 <div className="text-success">
                   {md("food:cart_available_credit", {
-                    amount: cart.displayableNoncashLedgerContributionAmount,
+                    amount: cart.noncashLedgerContributionAmount,
                   })}
                 </div>
               )}
@@ -125,8 +125,14 @@ export default function FoodCart() {
 }
 
 function CartItem({ offeringId, product, vendor }) {
-  const { productId, name, isDiscounted, customerPrice, undiscountedPrice, images } =
-    product;
+  const {
+    productId,
+    name,
+    isDiscounted,
+    displayableCashPrice,
+    undiscountedPrice,
+    images,
+  } = product;
   return (
     <Stack direction="horizontal" gap={3} className="align-items-start">
       <Link to={`/product/${offeringId}/${productId}`} className="">
@@ -147,7 +153,8 @@ function CartItem({ offeringId, product, vendor }) {
           undiscountedPrice={undiscountedPrice}
           // We don't want to show noncash contributions here,
           // so use the customer price as the cash price.
-          displayableCashPrice={customerPrice}
+          // except for turkey hacking holiday 2023.
+          displayableCashPrice={displayableCashPrice}
           fs={6}
           bold={false}
           direction="vertical"

diff --git a/webapp/src/pages/FoodCheckout.jsx b/webapp/src/pages/FoodCheckout.jsx
@@ -1,5 +1,6 @@
 import api from "../api";
 import ErrorScreen from "../components/ErrorScreen";
+import ExternalLink from "../components/ExternalLink";
 import FoodPrice from "../components/FoodPrice";
 import FormButtons from "../components/FormButtons";
 import LinearBreadcrumbs from "../components/LinearBreadcrumbs";
@@ -250,7 +251,20 @@ function CheckoutFulfillment({ checkout, onCheckoutChange }) {
               id={fo.id}
               name={fo.description}
               type="radio"
-              label={fo.description}
+              label={
+                <>
+                  {fo.description}
+                  {fo.address?.oneLineAddress && (
+                    <ExternalLink
+                      href={`https://www.google.com/maps/place/${fo.address.oneLineAddress}`}
+                      className="ms-1 nowrap"
+                    >
+                      <i className="bi bi-geo-alt-fill me-1"></i>
+                      {t("food:address")}
+                    </ExternalLink>
+                  )}
+                </>
+              }
               checked={checkout.fulfillmentOptionId === fo.id}
               onChange={() => onCheckoutChange({ fulfillmentOptionId: fo.id })}
             />
@@ -425,7 +439,7 @@ function CheckoutItem({ item }) {
               <FoodPrice
                 undiscountedPrice={product.undiscountedPrice}
                 isDiscounted={product.isDiscounted}
-                displayableCashPrice={product.customerPrice}
+                displayableCashPrice={product.displayableCashPrice}
                 direction="vertical"
               />
             </div>

diff --git a/webapp/src/pages/FoodDetails.jsx b/webapp/src/pages/FoodDetails.jsx
@@ -78,8 +78,12 @@ export default function FoodDetails() {
       <LayoutContainer gutters top>
         <Row>
           <Col>
-            <FoodPrice {...product} fs={4} className="mb-2 lh-1 gap-2" />
-            <p className="mb-3">{t("food:from_vendor", { vendorName: vendor.name })}</p>
+            <FoodPrice
+              {...product}
+              vendorName={vendor.name}
+              fs={4}
+              className="mb-2 lh-1 gap-2"
+            />
           </Col>
           <Col>
             <div className="text-end">
@@ -103,7 +107,8 @@ export default function FoodDetails() {
       <hr className="my-4" />
       <LayoutContainer gutters>
         <Row>
-          <h5>{t("food:details_header")}</h5>
+          <h5>{t("food:from_vendor", { vendorName: vendor.name })}</h5>
+          <h4>{t("food:details_header")}</h4>
           <p>{product.description}</p>
         </Row>
       </LayoutContainer>