Basic oAuth for QBO BOD-266

client/src/components/_test/test.component.jsx

@@ -1,96 +1,27 @@
-import {
-  PaymentRequestButtonElement,
-  useStripe
-} from "@stripe/react-stripe-js";
-import React, { useEffect, useState } from "react";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import { setEmailOptions } from "../../redux/email/email.actions";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-import { TemplateList } from "../../utils/TemplateConstants";
+import Axios from "axios";
+import React from "react";
+export default function Test() {
+  const handleQbSignIn = async () => {
+    const result = await Axios.post("/qbo/authorize", { userId: "1234" });
+    console.log("handleQbSignIn -> result", result.data);
+    // window.open(result.data, "_blank", "toolbar=0,location=0,menubar=0");
 
-const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop,
-});
+    var win;
+    var checkConnect;
+    var parameters = "location=1,width=800,height=650";
+    parameters +=
+      ",left=" +
+      (window.screen.width - 800) / 2 +
+      ",top=" +
+      (window.screen.height - 650) / 2;
 
-const mapDispatchToProps = (dispatch) => ({
-  setEmailOptions: (e) => dispatch(setEmailOptions(e)),
-});
-
-function Test({ bodyshop, setEmailOptions }) {
-  const stripe = useStripe();
-
-  const [paymentRequest, setPaymentRequest] = useState(null);
-  useEffect(() => {
-    if (stripe) {
-      const pr = stripe.paymentRequest({
-        country: "CA",
-        displayItems: [{ label: "Deductible", amount: 1099 }],
-        currency: "cad",
-        total: {
-          label: "Demo total",
-          amount: 1099,
-        },
-        requestPayerName: true,
-        requestPayerEmail: true,
-      });
-
-      // Check the availability of the Payment Request API.
-      pr.canMakePayment().then((result) => {
-        if (result) {
-          setPaymentRequest(pr);
-        } else {
-          // var details = {
-          //   total: { label: "", amount: { currency: "CAD", value: "0.00" } },
-          // };
-          new PaymentRequest(
-            [{ supportedMethods: ["basic-card"] }],
-            {}
-            //  details
-          ).show();
-        }
-      });
-    }
-  }, [stripe]);
-
-  if (paymentRequest) {
-    return (
-      <div style={{ height: "300px" }}>
-        <PaymentRequestButtonElement options={{ paymentRequest }} />
-      </div>
-    );
-  }
+    // Launch Popup
+    win = window.open(result.data, "connectPopup", parameters);
+  };
 
   return (
     <div>
-      <button
-        onClick={() => {
-          setEmailOptions({
-            messageOptions: {
-              to: ["patrickwf@gmail.com"],
-              replyTo: bodyshop.email,
-            },
-            template: {
-              name: TemplateList.parts_order_confirmation.key,
-              variables: {
-                id: "a7c2d4e1-f519-42a9-a071-c48cf0f22979",
-              },
-            },
-          });
-        }}
-      >
-        send email
-      </button>
-      <button
-        onClick={() => {
-          logImEXEvent("IMEXEVENT", { somethignArThare: 5 });
-        }}
-      >
-        Log an ImEX Event.
-      </button>
+      <button onClick={handleQbSignIn}>Sign Into Qb.</button>
     </div>
   );
 }
-
-export default connect(mapStateToProps, mapDispatchToProps)(Test);