@paro.io/expert-shared-components 1.14.57 → 1.14.59

package/lib/tax-axis/components/documents/qbo/useQboFlow.js

@@ -0,0 +1,207 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useQboFlow = useQboFlow;
+const react_1 = require("react");
+const qboConstants_1 = require("./qboConstants");
+function buildCompany(companyName) {
+    const name = companyName || "My QuickBooks Company";
+    const initials = name
+        .split(/\s+/)
+        .slice(0, 2)
+        .map((w) => { var _a, _b; return (_b = (_a = w[0]) === null || _a === void 0 ? void 0 : _a.toUpperCase()) !== null && _b !== void 0 ? _b : ""; })
+        .join("");
+    return { id: "connected", name, initials, color: "#2CA01C" };
+}
+function useQboFlow({ qboConnected, qboCompanyName, qboAuthorizeUrl, onImportQboReport, fetchUploadedDocuments, sessionId, profileYear, onQboConnected, onQboDisconnected, onQboImportComplete, }) {
+    const [modalStep, setModalStep] = (0, react_1.useState)("closed");
+    const [selectedCompany, setSelectedCompany] = (0, react_1.useState)(qboConnected ? buildCompany(qboCompanyName) : null);
+    const [selectedReports, setSelectedReports] = (0, react_1.useState)([]);
+    const [selectedYear, setSelectedYear] = (0, react_1.useState)(profileYear !== null && profileYear !== void 0 ? profileYear : new Date().getFullYear());
+    const [importStepIndex, setImportStepIndex] = (0, react_1.useState)(0);
+    const [error, setError] = (0, react_1.useState)(null);
+    const pollTimerRef = (0, react_1.useRef)(null);
+    // Keep selectedYear in sync if profileYear prop changes
+    const prevProfileYear = (0, react_1.useRef)(profileYear);
+    if (profileYear !== prevProfileYear.current) {
+        prevProfileYear.current = profileYear;
+        if (profileYear)
+            setSelectedYear(profileYear);
+    }
+    // Sync company when qboCompanyName prop changes
+    (0, react_1.useEffect)(() => {
+        if (qboConnected)
+            setSelectedCompany(buildCompany(qboCompanyName));
+    }, [qboConnected, qboCompanyName]);
+    // Cleanup poll timer on unmount
+    (0, react_1.useEffect)(() => {
+        return () => {
+            if (pollTimerRef.current)
+                clearInterval(pollTimerRef.current);
+        };
+    }, []);
+    // ── Already connected: skip straight to report selection ──
+    const openImport = (0, react_1.useCallback)(() => {
+        setError(null);
+        setSelectedCompany(buildCompany(qboCompanyName));
+        setModalStep("available_reports");
+    }, [qboCompanyName]);
+    // ── Not yet connected: start OAuth flow ──
+    const openPermissions = (0, react_1.useCallback)(() => {
+        setError(null);
+        setModalStep("permissions");
+    }, []);
+    // ── After permissions: start OAuth popup ──
+    const handlePermissionsContinue = (0, react_1.useCallback)(() => {
+        const isDemoMode = typeof window !== "undefined" &&
+            (!qboAuthorizeUrl || window.location.hostname === "localhost");
+        if (isDemoMode) {
+            setSelectedCompany(buildCompany(qboCompanyName));
+            setModalStep("client_selector");
+            return;
+        }
+        setModalStep("oauth_pending");
+        const authorizeUrl = qboAuthorizeUrl;
+        const redirectUri = `${window.location.origin}/integrations-hub/callback`;
+        const authUrl = authorizeUrl.includes("?")
+            ? `${authorizeUrl}&redirectUri=${encodeURIComponent(redirectUri)}`
+            : `${authorizeUrl}?redirectUri=${encodeURIComponent(redirectUri)}`;
+        const popup = window.open(authUrl, "qbo_oauth", "width=600,height=700,scrollbars=yes");
+        // Poll for popup close — parent will re-fetch EPS and update qboConnected prop
+        let elapsed = 0;
+        pollTimerRef.current = setInterval(() => {
+            elapsed += 500;
+            if (popup && popup.closed) {
+                if (pollTimerRef.current)
+                    clearInterval(pollTimerRef.current);
+                // Parent prop update will trigger the useEffect above to set selectedCompany
+                setModalStep("client_selector");
+            }
+            if (elapsed >= 120000) {
+                if (pollTimerRef.current)
+                    clearInterval(pollTimerRef.current);
+                setError("QuickBooks authorization timed out. Please try again.");
+                setModalStep("closed");
+            }
+        }, 500);
+    }, [qboAuthorizeUrl, qboCompanyName]);
+    // ── Company selected ──
+    const handleCompanySelected = (0, react_1.useCallback)((company) => {
+        setSelectedCompany(company);
+        setModalStep("available_reports");
+    }, []);
+    // ── Reports confirmed → import ──
+    const handleReportsConfirmed = (0, react_1.useCallback)((reportIds) => __awaiter(this, void 0, void 0, function* () {
+        var _a;
+        setSelectedReports(reportIds);
+        if (!onImportQboReport || !sessionId || !selectedCompany) {
+            setError("Import configuration is incomplete.");
+            setModalStep("closed");
+            return;
+        }
+        setModalStep("importing");
+        setImportStepIndex(0);
+        try {
+            yield new Promise((r) => setTimeout(r, 600));
+            setImportStepIndex(1);
+            yield new Promise((r) => setTimeout(r, 400));
+            setImportStepIndex(2);
+            const realmId = selectedCompany.id;
+            const importPromises = reportIds.map((reportId) => {
+                const reportType = reportId === "profit_loss" ? "profit_loss" : "balance_sheet";
+                return onImportQboReport(sessionId, realmId, reportType, "Accrual", selectedYear);
+            });
+            const results = yield Promise.allSettled(importPromises);
+            setImportStepIndex(3);
+            const failures = results.filter((r) => r.status === "rejected");
+            if (failures.length === results.length) {
+                const msg = ((_a = failures[0].reason) === null || _a === void 0 ? void 0 : _a.message) || "Import failed";
+                setError(msg);
+                setModalStep("closed");
+                return;
+            }
+            yield new Promise((r) => setTimeout(r, 500));
+            setImportStepIndex(4);
+            if (failures.length > 0) {
+                const msg = failures
+                    .map((f) => { var _a; return ((_a = f.reason) === null || _a === void 0 ? void 0 : _a.message) || "Import failed"; })
+                    .join("; ");
+                setError(msg);
+            }
+            if (fetchUploadedDocuments) {
+                try {
+                    yield fetchUploadedDocuments();
+                }
+                catch ( /* non-fatal */_b) { /* non-fatal */ }
+            }
+            if (onQboConnected)
+                onQboConnected(selectedCompany.name);
+            if (onQboImportComplete) {
+                const mappedDocs = reportIds
+                    .map((reportId) => {
+                    const option = qboConstants_1.QBO_REPORT_OPTIONS.find((o) => o.id === reportId);
+                    return option ? { slot: option.documentType, fileName: option.label } : null;
+                })
+                    .filter((m) => m !== null);
+                onQboImportComplete(mappedDocs);
+            }
+            setModalStep("done");
+            setTimeout(() => { setModalStep("closed"); }, 1500);
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : "Import failed. Please try again.";
+            setError(msg);
+            setModalStep("closed");
+        }
+    }), [
+        onImportQboReport,
+        sessionId,
+        selectedCompany,
+        selectedYear,
+        fetchUploadedDocuments,
+        onQboConnected,
+        onQboImportComplete,
+    ]);
+    const handleMappingConfirm = (0, react_1.useCallback)(() => __awaiter(this, void 0, void 0, function* () {
+        yield handleReportsConfirmed(selectedReports);
+    }), [handleReportsConfirmed, selectedReports]);
+    const handleDisconnect = (0, react_1.useCallback)(() => {
+        setSelectedCompany(null);
+        setSelectedReports([]);
+        setImportStepIndex(0);
+        setModalStep("closed");
+        if (onQboDisconnected)
+            onQboDisconnected();
+    }, [onQboDisconnected]);
+    const closeModal = (0, react_1.useCallback)(() => {
+        setModalStep("closed");
+        setError(null);
+    }, []);
+    const companies = selectedCompany ? [selectedCompany] : [];
+    return {
+        modalStep,
+        selectedCompany,
+        selectedReports,
+        selectedYear,
+        setSelectedYear,
+        importStepIndex,
+        error,
+        companies,
+        openPermissions,
+        openImport,
+        handlePermissionsContinue,
+        handleCompanySelected,
+        handleReportsConfirmed,
+        handleMappingConfirm,
+        handleDisconnect,
+        closeModal,
+    };
+}

package/lib/tax-axis/components/intake/ClientParametersSection.js

@@ -83,7 +83,7 @@ function ClientParametersSection({ userContext = "expert", }) {
             react_1.default.createElement("svg", { className: `transition-transform ${expanded ? "rotate-180" : "rotate-0"}`, width: "10", height: "10", viewBox: "0 0 12 12", fill: "none" },
                 react_1.default.createElement("path", { d: "M3 4.5l3 3 3-3", stroke: "#9498B8", strokeWidth: "1.5", strokeLinecap: "round" }))),
         expanded && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Business Name"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "bizName", control: control, render: ({ field }) => (react_1.default.createElement("input", Object.assign({}, field, { placeholder: "Acme Consulting LLC", className: inputCls }))) }),

package/lib/tax-axis/components/intake/CpaIntakeQuestionsSection.js

@@ -50,7 +50,7 @@ function CpaIntakeQuestionsSection({ userContext = "expert", }) {
             react_1.default.createElement("svg", { className: `transition-transform ${expanded ? "rotate-180" : "rotate-0"}`, width: "10", height: "10", viewBox: "0 0 12 12", fill: "none" },
                 react_1.default.createElement("path", { d: "M3 4.5l3 3 3-3", stroke: "#9498B8", strokeWidth: "1.5", strokeLinecap: "round" }))),
         expanded && (react_1.default.createElement("div", null,
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Overtime Premium Paid"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "overtimePremium", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -63,7 +63,7 @@ function CpaIntakeQuestionsSection({ userContext = "expert", }) {
                             react_1.default.createElement("input", Object.assign({}, field, { placeholder: "0", className: `${inputCls} pr-6` })),
                             react_1.default.createElement("span", { className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-tax-axis-text-3 text-[13px]" }, "%"))) }),
                     industry !== "Restaurant / Hospitality" && (react_1.default.createElement("div", { className: helperCls }, "Typically relevant for Restaurant / Hospitality")))),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Retirement Plan Contributions"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "retirementContributions", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -79,7 +79,7 @@ function CpaIntakeQuestionsSection({ userContext = "expert", }) {
                         react_1.default.createElement(react_hook_form_1.Controller, { name: "hsaContributions", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
                                 react_1.default.createElement("span", { className: "absolute left-2.5 top-1/2 -translate-y-1/2 text-tax-axis-text-3 text-[13px]" }, "$"),
                                 react_1.default.createElement("input", Object.assign({}, field, { placeholder: "0", className: `${inputCls} pl-6` })))) }))))),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "WOTC Qualifying Hires"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "wotcHires", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },

package/lib/tax-axis/components/intake/IntakeCtaCards.js

@@ -8,7 +8,7 @@ const react_1 = __importDefault(require("react"));
 const TaxAxisButton_1 = require("../shared/TaxAxisButton");
 const TaxAxisBadge_1 = require("../shared/TaxAxisBadge");
 function IntakeCtaCards({ onProspect, onFullAnalysis, userContext = "expert", }) {
-    return (react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3" },
+    return (react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3" },
         react_1.default.createElement("div", { className: "bg-tax-axis-surface border border-tax-axis-border rounded-xl p-4 min-h-[140px] flex flex-col transition-all" },
             react_1.default.createElement("div", { className: "text-[11px] font-bold text-tax-axis-orange uppercase tracking-widest mb-2.5 font-tax-axis-body" }, "Prospect Report"),
             react_1.default.createElement("div", { className: "text-xs text-tax-axis-text-3 font-tax-axis-body mb-3" }, "Top 3 strategies \u00B7 Savings ranges \u00B7 ~2 min \u00B7 No docs"),

package/lib/tax-axis/components/intake/RefineAnalysisSection.js

@@ -70,7 +70,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
         expanded && (react_1.default.createElement("div", null,
             react_1.default.createElement("div", { className: "text-[11px] text-tax-axis-text-4 italic mb-3" }, "These fields improve accuracy. Many will be auto-populated when documents are uploaded."),
             react_1.default.createElement("div", { className: subHeaderCls, style: { marginTop: 0 } }, "Client Profile"),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Filing Status"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "filingStatus", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -79,7 +79,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Age"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "age", control: control, render: ({ field }) => (react_1.default.createElement("input", Object.assign({}, field, { type: "number", placeholder: "45", className: inputCls }))) }))),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "SSTB"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "sstb", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -91,7 +91,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "ownsRealEstate", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
                             react_1.default.createElement("select", Object.assign({}, field, { className: selectCls }), REAL_ESTATE_OPTIONS.map(o => (react_1.default.createElement("option", { key: o, value: o, className: "bg-tax-axis-surface-2" }, o)))),
                             react_1.default.createElement(Chevron, null))) }))),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Itemizes Deductions"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "itemizesDeductions", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -103,7 +103,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
                             react_1.default.createElement("select", Object.assign({}, field, { className: selectCls }), SINGLE_OWNER_OPTIONS.map(o => (react_1.default.createElement("option", { key: o, value: o, className: "bg-tax-axis-surface-2" }, o)))),
                             react_1.default.createElement(Chevron, null))) }))),
             react_1.default.createElement("div", { className: subHeaderCls }, "Financial Data"),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Net Income"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "netIncome", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -114,7 +114,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "equipmentPurchased", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
                             react_1.default.createElement("span", { className: "absolute left-2.5 top-1/2 -translate-y-1/2 text-tax-axis-text-3 text-[13px]" }, "$"),
                             react_1.default.createElement("input", Object.assign({}, field, { placeholder: "0", className: `${inputCls} pl-6` })))) }))),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 ownsRealEstate !== "No" ? (react_1.default.createElement("div", { className: "transition-opacity" },
                     react_1.default.createElement("label", { className: labelCls }, "Real Estate Value"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "realEstateValue", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -126,7 +126,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
                             react_1.default.createElement("span", { className: "absolute left-2.5 top-1/2 -translate-y-1/2 text-tax-axis-text-3 text-[13px]" }, "$"),
                             react_1.default.createElement("input", Object.assign({}, field, { placeholder: "0", className: `${inputCls} pl-6` })))) }))),
             react_1.default.createElement("div", { className: subHeaderCls }, "Tax Profile"),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Federal Marginal Rate"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "federalRate", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
@@ -137,7 +137,7 @@ function RefineAnalysisSection({ userContext: _userContext, }) {
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "stateRate", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },
                             react_1.default.createElement("input", Object.assign({}, field, { placeholder: "4.95", className: `${inputCls} pr-6` })),
                             react_1.default.createElement("span", { className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-tax-axis-text-3 text-[13px]" }, "%"))) }))),
-            react_1.default.createElement("div", { className: "grid grid-cols-2 gap-3 mb-2.5" },
+            react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-3 mb-2.5" },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { className: labelCls }, "Tax Data Years Available"),
                     react_1.default.createElement(react_hook_form_1.Controller, { name: "taxDataYears", control: control, render: ({ field }) => (react_1.default.createElement("div", { className: "relative" },

package/lib/tax-axis/components/intake/TaxAxisIntake.js

@@ -27,12 +27,12 @@ function TaxAxisIntake({ userContext = "expert", onProspect, onFullAnalysis, ini
         methods.handleSubmit((valid) => onFullAnalysis(valid), () => { })();
     };
     return (react_1.default.createElement(react_hook_form_1.FormProvider, Object.assign({}, methods),
-        react_1.default.createElement("div", { className: "grid grid-cols-[1fr_1fr] gap-5" },
+        react_1.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-5" },
             react_1.default.createElement("div", { className: "flex flex-col gap-4" },
                 react_1.default.createElement(ClientParametersSection_1.ClientParametersSection, { userContext: userContext }),
                 react_1.default.createElement(RefineAnalysisSection_1.RefineAnalysisSection, { userContext: userContext }),
                 react_1.default.createElement(CpaIntakeQuestionsSection_1.CpaIntakeQuestionsSection, { userContext: userContext }),
                 react_1.default.createElement(IntakeCtaCards_1.IntakeCtaCards, { onProspect: handleProspect, onFullAnalysis: handleFull, userContext: userContext })),
-            react_1.default.createElement("div", { className: "sticky top-5 self-start" },
+            react_1.default.createElement("div", { className: "hidden sm:block sm:sticky sm:top-5 sm:self-start" },
                 react_1.default.createElement(StrategyRadar_1.StrategyRadar, { profile: profile })))));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paro.io/expert-shared-components",
-  "version": "1.14.57",
+  "version": "1.14.59",
   "description": "",
   "main": "lib/index.js",
   "scripts": {