Split current 'order with promo' chapter into two separate chapters

docs/.vitepress/config.js

@@ -41,6 +41,7 @@ export default defineConfig({
           { text: 'Discounts Using Lists', link: '/discounts-lists/' },
           { text: 'Promo Codes', link: '/promo-codes/' },
           { text: 'Promo Component', link: '/promo-component/' },
+          { text: 'From Polymorphic to Normal Variant', link: '/poly-to-normal-variant/' },
           { text: 'Order with Promo', link: '/order-with-promo/' },
         ]
       }

docs/order-with-promo/Demo.re → docs/order-with-promo/App.re

@@ -1,31 +1,3 @@
-// #region initial
-let items: Order.t = [
-  Sandwich(Portabello),
-  Sandwich(Unicorn),
-  Sandwich(Ham),
-  Sandwich(Turducken),
-  Hotdog,
-  Burger({lettuce: true, tomatoes: true, onions: 3, cheese: 2, bacon: 6}),
-  Burger({lettuce: false, tomatoes: false, onions: 0, cheese: 0, bacon: 0}),
-  Burger({lettuce: true, tomatoes: false, onions: 1, cheese: 1, bacon: 1}),
-  Burger({lettuce: false, tomatoes: false, onions: 1, cheese: 0, bacon: 0}),
-  Burger({lettuce: false, tomatoes: false, onions: 0, cheese: 1, bacon: 0}),
-];
-
-[@react.component]
-let make = () => {
-  let (date, setDate) =
-    RR.useStateValue(Js.Date.fromString("2024-05-28T00:00"));
-
-  <div>
-    <h1> {RR.s("Order confirmation")} </h1>
-    <DateInput date onChange=setDate />
-    <h2> {RR.s("Order")} </h2>
-    <Order items date />
-  </div>;
-};
-// #endregion initial
-
 // #region datasets
 let burger =
   Item.Burger.{
@@ -117,26 +89,42 @@ let datasets': list((string, list(Item.t))) = [
   // #endregion burger-expression
 ];
 */
-ignore(make);
 
 // #region refactor
 [@react.component]
+let make = () => {
+  let date = Js.Date.fromString("2024-05-28T00:00");
+
+  <div>
+    <h1> {RR.s("Order Confirmation")} </h1>
+    {datasets
+     |> List.map(((label, items)) => {
+          <div key=label> <h3> {RR.s(label)} </h3> <Order items date /> </div>
+        })
+     |> RR.list}
+  </div>;
+};
+// #endregion refactor
+
+ignore(make);
+
+// #region add-date-input
+[@react.component]
 let make = () => {
   let (date, setDate) =
     RR.useStateValue(Js.Date.fromString("2024-05-28T00:00"));
 
   <div>
     <h1> {RR.s("Order Confirmation")} </h1>
     <DateInput date onChange=setDate />
-    <h2> {RR.s("Order")} </h2>
     {datasets
      |> List.map(((label, items)) => {
           <div key=label> <h3> {RR.s(label)} </h3> <Order items date /> </div>
         })
      |> RR.list}
   </div>;
 };
-// #endregion refactor
+// #endregion add-date-input
 
 ignore(make);
 

docs/order-with-promo/DateInput.re

@@ -1,10 +1,13 @@
+// #region initial
 let stringToDate = s =>
   // add "T00:00" to make sure the date is in local time
   s ++ "T00:00" |> Js.Date.fromString;
 
+/* Convert a Date to the yyyy-mm-dd format that the input element accepts for
+   its value attribute */
 let dateToString = d =>
   Printf.sprintf(
-    "%4.0f-%02.0f-%02.0f",
+    "%04.0f-%02.0f-%02.0f",
     Js.Date.getFullYear(d),
     Js.Date.getMonth(d) +. 1.,
     Js.Date.getDate(d),
@@ -19,3 +22,37 @@ let make = (~date: Js.Date.t, ~onChange: Js.Date.t => unit) => {
     onChange={evt => evt |> RR.getValueFromEvent |> stringToDate |> onChange}
   />;
 };
+// #endregion initial
+
+// #region string-to-date-option
+let stringToDate = s => {
+  // add "T00:00" to make sure the date is in local time
+  let date = s ++ "T00:00" |> Js.Date.fromString;
+  date |> Js.Date.valueOf |> Js.Float.isNaN ? None : Some(date);
+};
+// #endregion string-to-date-option
+
+let _ =
+  onChange => {
+    <input
+      // #region on-change-switch
+      onChange={evt =>
+        switch (evt |> RR.getValueFromEvent |> stringToDate) {
+        | None => ()
+        | Some(date) => onChange(date)
+        }
+      }
+      // #endregion on-change-switch
+    />;
+  };
+
+let _ =
+  onChange => {
+    <input
+      // #region on-change-option-iter
+      onChange={evt =>
+        evt |> RR.getValueFromEvent |> stringToDate |> Option.iter(onChange)
+      }
+      // #endregion on-change-option-iter
+    />;
+  };

docs/order-with-promo/DiscountTests.re

@@ -9,14 +9,9 @@ module SandwichHalfOff = {
     |> deepEqual(
          Discount.getSandwichHalfOff(
            ~date=june3,
-           [
-             Sandwich(Unicorn),
-             Hotdog,
-             Sandwich(Portabello),
-             Sandwich(Ham),
-           ],
+           [Sandwich(Portabello), Hotdog, Sandwich(Ham)],
          ),
-         Error(`MissingSandwichTypes(["turducken"])),
+         Error(`MissingSandwichTypes(["unicorn", "turducken"])),
        )
   );
   // #endregion not-all-sandwiches

docs/order-with-promo/ListSafe.re

@@ -0,0 +1,25 @@
+// #region humanize
+/** Take a list of strings and return a human-readable string */
+let humanize =
+  fun
+  | [] => ""
+  | [x] => x
+  | [x, y] => x ++ " and " ++ y
+  | [first, ...rest] =>
+    rest
+    |> List.rev
+    |> List.mapi((i, s) => i == 0 ? "and " ++ s : s)
+    |> List.rev
+    |> List.fold_left((acc, s) => acc ++ ", " ++ s, first);
+// #endregion humanize
+
+let _ =
+  (rest, first) => {
+    // #region alternate
+    rest
+    |> List.rev
+    |> List.mapi((i, s) => ", " ++ (i == 0 ? "and " ++ s : s))
+    |> List.rev
+    |> List.fold_left((++), first);
+                                   // #endregion alternate
+  };