IO-256 QBO Improvements.

client/src/components/jobs-close-export-button/jobs-close-export-button.component.jsx

@@ -14,6 +14,7 @@ import {
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 import { useHistory } from "react-router-dom";
+import { useCookies } from "react-cookie";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -32,6 +33,7 @@ export function JobsCloseExportButton({
   const [updateJob] = useMutation(UPDATE_JOB);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
   const [loading, setLoading] = useState(false);
+  const [cookies] = useCookies();
 
   const handleQbxml = async () => {
     //Check if it's a CDK setup.
@@ -180,7 +182,16 @@ export function JobsCloseExportButton({
   };
 
   return (
-    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={
+        disabled ||
+        (bodyshop.accountingconfig &&
+          bodyshop.accountingconfig.qbo &&
+          !cookies.qbo_realmId)
+      }
+    >
       {t("jobs.actions.export")}
     </Button>
   );

client/src/components/jobs-export-all-button/jobs-export-all-button.component.jsx

@@ -13,6 +13,7 @@ import {
   selectBodyshop,
   selectCurrentUser,
 } from "../../redux/user/user.selectors";
+import { useCookies } from "react-cookie";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -30,6 +31,7 @@ export function JobsExportAllButton({
   const { t } = useTranslation();
   const [updateJob] = useMutation(UPDATE_JOBS);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
+  const [cookies] = useCookies();
 
   const [loading, setLoading] = useState(false);
   const handleQbxml = async () => {
@@ -173,7 +175,16 @@ export function JobsExportAllButton({
   };
 
   return (
-    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={
+        disabled ||
+        (bodyshop.accountingconfig &&
+          bodyshop.accountingconfig.qbo &&
+          !cookies.qbo_realmId)
+      }
+    >
       {t("jobs.actions.export")}
     </Button>
   );

client/src/components/payable-export-all-button/payable-export-all-button.component.jsx

@@ -14,6 +14,7 @@ import {
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import _ from "lodash";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
+import { useCookies } from "react-cookie";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -32,6 +33,7 @@ export function PayableExportAll({
   const [updateBill] = useMutation(UPDATE_BILLS);
   const [loading, setLoading] = useState(false);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
+  const [cookies] = useCookies();
 
   const handleQbxml = async () => {
     logImEXEvent("accounting_payables_export_all");
@@ -172,7 +174,16 @@ export function PayableExportAll({
   };
 
   return (
-    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={
+        disabled ||
+        (bodyshop.accountingconfig &&
+          bodyshop.accountingconfig.qbo &&
+          !cookies.qbo_realmId)
+      }
+    >
       {t("jobs.actions.exportselected")}
     </Button>
   );

client/src/components/payable-export-button/payable-export-button.component.jsx

@@ -13,6 +13,7 @@ import {
 } from "../../redux/user/user.selectors";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
+import { useCookies } from "react-cookie";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -31,6 +32,7 @@ export function PayableExportButton({
   const [updateBill] = useMutation(UPDATE_BILLS);
   const [loading, setLoading] = useState(false);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
+  const [cookies] = useCookies();
 
   const handleQbxml = async () => {
     logImEXEvent("accounting_export_payable");
@@ -174,7 +176,16 @@ export function PayableExportButton({
   };
 
   return (
-    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={
+        disabled ||
+        (bodyshop.accountingconfig &&
+          bodyshop.accountingconfig.qbo &&
+          !cookies.qbo_realmId)
+      }
+    >
       {t("jobs.actions.export")}
     </Button>
   );

client/src/components/payment-export-button/payment-export-button.component.jsx

@@ -8,6 +8,8 @@ import { createStructuredSelector } from "reselect";
 import { auth, logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 import { UPDATE_PAYMENTS } from "../../graphql/payments.queries";
+import { useCookies } from "react-cookie";
+
 import {
   selectBodyshop,
   selectCurrentUser,
@@ -30,6 +32,7 @@ export function PaymentExportButton({
   const [updatePayment] = useMutation(UPDATE_PAYMENTS);
   const [loading, setLoading] = useState(false);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
+  const [cookies] = useCookies();
 
   const handleQbxml = async () => {
     logImEXEvent("accounting_payment_export");
@@ -174,7 +177,16 @@ export function PaymentExportButton({
   };
 
   return (
-    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={
+        disabled ||
+        (bodyshop.accountingconfig &&
+          bodyshop.accountingconfig.qbo &&
+          !cookies.qbo_realmId)
+      }
+    >
       {t("jobs.actions.export")}
     </Button>
   );

client/src/components/payments-export-all-button/payments-export-all-button.component.jsx

@@ -8,6 +8,8 @@ import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
 import { UPDATE_PAYMENTS } from "../../graphql/payments.queries";
+import { useCookies } from "react-cookie";
+
 import {
   selectBodyshop,
   selectCurrentUser,
@@ -29,6 +31,7 @@ export function PaymentsExportAllButton({
   const [updatePayments] = useMutation(UPDATE_PAYMENTS);
   const [loading, setLoading] = useState(false);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
+  const [cookies] = useCookies();
 
   const handleQbxml = async () => {
     setLoading(true);
@@ -155,7 +158,16 @@ export function PaymentsExportAllButton({
   };
 
   return (
-    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
+    <Button
+      onClick={handleQbxml}
+      loading={loading}
+      disabled={
+        disabled ||
+        (bodyshop.accountingconfig &&
+          bodyshop.accountingconfig.qbo &&
+          !cookies.qbo_realmId)
+      }
+    >
       {t("jobs.actions.exportselected")}
     </Button>
   );

client/src/components/qbo-authorize/qbo-authorize.component.jsx

@@ -33,7 +33,10 @@ export default function QboAuthorizeComponent() {
       setCookie("qbo_realmId", realmId, {
         path: "/",
         expires,
-        domain: `.${window.location.host}`,
+
+        ...(process.env.NODE_ENV !== "development"
+          ? { domain: `.${window.location.host}` }
+          : {}),
       });
 
       history.push({ pathname: `/manage/accounting/receivables` });