feat: update checkout for send email feature

serbia70 · Mar 8, 2022 · b38dcbf · b38dcbf
1 parent 55fef34
commit b38dcbf
Showing 1 changed file with 25 additions and 0 deletions.
diff --git a/pages/checkout.tsx b/pages/checkout.tsx
@@ -52,6 +52,7 @@ const ShoppingCart = () => {
   const [errorMsg, setErrorMsg] = useState("");
   const [completedOrder, setCompletedOrder] = useState<Order | null>(null);
   const [orderError, setOrderError] = useState("");
+  const [sendEmail, setSendEmail] = useState(false);
 
   const products = cart.map((item) => ({
     id: item.id,
@@ -95,6 +96,7 @@ const ShoppingCart = () => {
           paymentType: paymentMethod,
           deliveryType: deli,
           products,
+          sendEmail,
         }
       );
       if (res.data.success) {
@@ -484,6 +486,29 @@ const ShoppingCart = () => {
                       </span>
                     </label>
                   </div>
+
+                  <div className="my-8">
+                    <div className="relative inline-block w-10 mr-2 align-middle select-none transition duration-200 ease-in">
+                      <input
+                        type="checkbox"
+                        name="send-email-toggle"
+                        id="send-email-toggle"
+                        checked={sendEmail}
+                        onChange={() => setSendEmail(!sendEmail)}
+                        className="toggle-checkbox absolute block w-6 h-6 rounded-full bg-white border-4 border-gray300 appearance-none cursor-pointer"
+                      />
+                      <label
+                        htmlFor="send-email-toggle"
+                        className="toggle-label block overflow-hidden h-6 rounded-full bg-gray300 cursor-pointer"
+                      ></label>
+                    </div>
+                    <label
+                      htmlFor="send-email-toggle"
+                      className="text-xs text-gray-700"
+                    >
+                      {t("send_order_email")}
+                    </label>
+                  </div>
                 </div>
 
                 <Button