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

package/lib/README.md

@@ -0,0 +1,2 @@
+# expert-shared-components
+Repository to store Components shared between the Expert Apps and Internal Apps

package/lib/components/DocumentCenter/MultiFileUploadSection.js

@@ -38,7 +38,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MultiFileUploadSection = void 0;
 const react_1 = __importStar(require("react"));
 const core_1 = require("@material-ui/core");
-const CheckCircle_1 = __importDefault(require("@material-ui/icons/CheckCircle"));
 const ExpandMore_1 = __importDefault(require("@material-ui/icons/ExpandMore"));
 const ExpandLess_1 = __importDefault(require("@material-ui/icons/ExpandLess"));
 const date_fns_1 = require("date-fns");
@@ -71,13 +70,15 @@ const generateOptions = (array, clientOptions, isClientPortal) => {
             ? `${item === null || item === void 0 ? void 0 : item.id}_${index}`
             : item === null || item === void 0 ? void 0 : item.split(" ").join("_").concat(index);
         if (clientOptions) {
-            // Show only project name for project dropdown
-            if (projectName) {
-                newText = projectName;
+            if (name && projectName) {
+                newText = `${name} - ${projectName}`;
             }
             else if (name) {
                 newText = name;
             }
+            else if (projectName) {
+                newText = projectName;
+            }
             else {
                 newText = "N/A";
             }
@@ -93,6 +94,7 @@ const generateOptions = (array, clientOptions, isClientPortal) => {
     });
 };
 const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadExpertClientFiles, uploadInternalFile, foldername, refetchFiles, legacyFreelancerId, freelancerName, freelancerEmail, isClientPortal = false, documentUploadUrl, showAsPage, }) => {
+    var _a;
     const [uploadItems, setUploadItems] = (0, react_1.useState)([]);
     const [isUploading, setIsUploading] = (0, react_1.useState)(false);
     const [showUploadSection, setShowUploadSection] = (0, react_1.useState)(true);
@@ -120,9 +122,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
             const excludedStatuses = ["complete", "completed", "doa", "churned"];
             const isValidProject = projectStatus &&
                 !excludedStatuses.includes(projectStatus.toLowerCase());
-            // Filter out "System Fee" expert on client side
-            const isSystemFee = isClientPortal && (name === null || name === void 0 ? void 0 : name.toLowerCase()) === "system fee";
-            if (id && name && !isSystemFee) {
+            if (id && name) {
                 if (!groups.has(id)) {
                     groups.set(id, {
                         expert: { id, name },
@@ -193,7 +193,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
         if (!selectedExpert)
             return [];
         return clientOptions.filter((opt) => {
-            var _a, _b, _c, _d;
+            var _a, _b;
             const isMatch = isClientPortal
                 ? ((_a = opt.freelancer) === null || _a === void 0 ? void 0 : _a.id) === selectedExpert.id
                 : ((_b = opt.client) === null || _b === void 0 ? void 0 : _b.id) === selectedExpert.id;
@@ -201,12 +201,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
             const excludedStatuses = ["complete", "completed", "doa", "churned"];
             const isValidProject = projectStatus &&
                 !excludedStatuses.includes(projectStatus.toLowerCase());
-            // Filter out System Fee projects on client side
-            const expertName = isClientPortal
-                ? (_c = opt.freelancer) === null || _c === void 0 ? void 0 : _c.name
-                : (_d = opt.client) === null || _d === void 0 ? void 0 : _d.name;
-            const isSystemFee = isClientPortal && (expertName === null || expertName === void 0 ? void 0 : expertName.toLowerCase()) === "system fee";
-            return isMatch && isValidProject && !isSystemFee;
+            return isMatch && isValidProject;
         });
     }, [selectedExpert, clientOptions, isClientPortal]);
     // Check if all files have projects assigned (for multi-project experts/clients)
@@ -215,15 +210,6 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
             return true;
         return uploadItems.every((item) => { var _a; return (_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value; });
     }, [uploadItems, hasMultipleProjects]);
-    // Count files that need projects
-    const filesNeedingProjects = react_1.default.useMemo(() => {
-        if (!selectedExpert)
-            return 0;
-        return uploadItems.filter((item) => { var _a; return !((_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) && item.status !== "success"; }).length;
-    }, [uploadItems, selectedExpert]);
-    // Determine step states
-    const step1Complete = selectedExpert !== null;
-    const step2Complete = step1Complete && uploadItems.length > 0 && allFilesHaveProjects;
     const handleFilesSelected = (files) => {
         const newItems = files.map((file) => ({
             id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
@@ -425,198 +411,78 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
                             ".jpg",
                             ".png",
                         ], disabled: isUploading })),
-                uploadItems.length > 0 && (react_1.default.createElement(core_1.Box, { mb: 3 },
-                    react_1.default.createElement(core_1.Typography, { variant: "h5", style: {
-                            fontWeight: 700,
-                            color: "#1a1a2e",
-                            marginBottom: "4px",
-                        } }, !paroDocuments
-                        ? isClientPortal
-                            ? "Send Files to Expert"
-                            : "Send Files to Client"
-                        : "Upload Documents"),
-                    react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: "#8b8fa3" } }, "Choose a recipient, assign each file to a project, then upload."))),
-                !paroDocuments &&
-                    expertGroups.length > 0 &&
-                    uploadItems.length > 0 && (react_1.default.createElement(core_1.Paper, { elevation: 0, style: {
-                        marginBottom: "24px",
-                        borderRadius: "12px",
-                        border: step1Complete
-                            ? "2px solid #248384"
-                            : "2px solid #a8a8a8",
-                        backgroundColor: step1Complete ? "#FDFEFD" : "#fafafa",
-                        overflow: "hidden",
-                    } },
-                    react_1.default.createElement(core_1.Box, { p: 2, style: {
-                            backgroundColor: step1Complete ? "#F0FAF0" : "#f7f7f9",
-                            borderBottom: "1px solid #f0f0f5",
-                            display: "flex",
-                            alignItems: "center",
-                            gap: "12px",
-                        } },
-                        react_1.default.createElement(core_1.Box, { style: {
-                                width: "24px",
-                                height: "24px",
-                                borderRadius: "50%",
-                                backgroundColor: step1Complete ? "white" : "gray",
-                                color: step1Complete ? "#248384" : "white",
-                                display: "flex",
-                                alignItems: "center",
-                                justifyContent: "center",
-                                fontSize: "13px",
-                                fontWeight: 700,
-                                flexShrink: 0,
-                            } }, step1Complete ? (react_1.default.createElement(CheckCircle_1.default, { style: { fontSize: "28px" } })) : ("1")),
-                        react_1.default.createElement(core_1.Box, null,
-                            react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: {
-                                    fontSize: "14px",
-                                    fontWeight: 600,
-                                    color: "#1a1a2e",
-                                } }, "Select recipient"),
-                            react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontSize: "12px", color: "#8b8fa3" } }, "Who should receive these files?"))),
-                    react_1.default.createElement(core_1.Box, { p: 2 },
-                        react_1.default.createElement(core_1.Box, { display: "flex", flexWrap: "wrap", style: { gap: "10px" } }, expertGroups.map((group) => (react_1.default.createElement(core_1.Chip, { key: group.expert.id, label: react_1.default.createElement(core_1.Box, { display: "flex", alignItems: "center", style: { gap: "6px" } },
-                                (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id && (react_1.default.createElement(CheckCircle_1.default, { style: { fontSize: "20px" } })),
-                                react_1.default.createElement("span", { style: { fontWeight: 600 } }, group.expert.name),
-                                react_1.default.createElement("span", { style: {
-                                        fontSize: "11px",
-                                        fontWeight: 500,
-                                        padding: "2px 7px",
-                                        borderRadius: "10px",
-                                        backgroundColor: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
-                                            ? "#e2e8f0"
-                                            : "#f0f1f4",
-                                        color: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
-                                            ? "#248384"
-                                            : "#8b8fa3",
-                                    } },
-                                    group.projects.length,
-                                    " ",
-                                    group.projects.length === 1
-                                        ? "project"
-                                        : "projects")), onClick: () => handleExpertSelection(group.expert), clickable: true, disabled: group.projects.length === 0, style: {
-                                padding: "10px 18px",
-                                height: "auto",
-                                borderRadius: "8px",
-                                border: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
-                                    ? "2px solid #248384"
-                                    : "2px solid #e2e4ea",
-                                backgroundColor: "#fff",
-                                color: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
-                                    ? "#248384"
-                                    : "#3d3f4a",
-                                opacity: group.projects.length === 0 ? 0.5 : 1,
-                                cursor: group.projects.length === 0
-                                    ? "not-allowed"
-                                    : "pointer",
-                            } }))))))),
-                uploadItems.length > 0 && (react_1.default.createElement(core_1.Paper, { elevation: 0, style: {
-                        marginBottom: "24px",
-                        borderRadius: "12px",
-                        border: step2Complete
-                            ? "2px solid #248384"
-                            : !paroDocuments && !step1Complete
-                                ? "2px solid #e2e4ea"
-                                : "2px solid #006cff",
-                        backgroundColor: step2Complete
-                            ? "#FDFEFD"
-                            : !paroDocuments && !step1Complete
-                                ? "#fafafa"
-                                : "#ffffff",
-                        overflow: "hidden",
-                        opacity: !paroDocuments && !step1Complete ? 0.5 : 1,
-                        pointerEvents: !paroDocuments && !step1Complete ? "none" : "auto",
-                    } },
-                    react_1.default.createElement(core_1.Box, { p: 2, style: {
-                            backgroundColor: step2Complete
-                                ? "#F0FAF0"
-                                : !paroDocuments && !step1Complete
-                                    ? "#f7f7f9"
-                                    : "#f2f2f25e",
-                            borderBottom: "1px solid #f0f0f5",
-                            display: "flex",
-                            alignItems: "center",
-                            gap: "12px",
-                        } },
+                uploadItems.length > 0 &&
+                    !paroDocuments &&
+                    expertGroups.length > 0 && (react_1.default.createElement(core_1.Box, { mb: 3, p: 2, style: { backgroundColor: "#F7FAFC", borderRadius: "8px" } },
+                    react_1.default.createElement(core_1.Box, { display: "flex", alignItems: "center", mb: 2 },
                         react_1.default.createElement(core_1.Box, { style: {
-                                width: "24px",
-                                height: "24px",
+                                width: "32px",
+                                height: "32px",
                                 borderRadius: "50%",
-                                backgroundColor: step2Complete
-                                    ? "white"
-                                    : !paroDocuments && !step1Complete
-                                        ? "#ccc"
-                                        : "#006cff",
-                                color: step2Complete ? "#248384" : "white",
+                                backgroundColor: "#48BB78",
+                                color: "white",
                                 display: "flex",
                                 alignItems: "center",
                                 justifyContent: "center",
-                                fontSize: "13px",
-                                fontWeight: 700,
-                                flexShrink: 0,
-                            } }, step2Complete ? (react_1.default.createElement(CheckCircle_1.default, { style: { fontSize: "28px" } })) : paroDocuments ? ("1") : ("2")),
-                        react_1.default.createElement(core_1.Box, { flex: 1 },
-                            react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: {
-                                    fontSize: "14px",
-                                    fontWeight: 600,
-                                    color: "#1a1a2e",
-                                } }, "Assign files to projects"),
-                            react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontSize: "12px", color: "#8b8fa3" } }, "Categorize each file and select its project")),
-                        !paroDocuments && filesNeedingProjects > 0 && (react_1.default.createElement(core_1.Chip, { label: `${filesNeedingProjects} need${filesNeedingProjects === 1 ? "s" : ""} a project`, size: "small", style: {
-                                fontSize: "11px",
+                                fontWeight: "bold",
+                                marginRight: "12px",
+                            } }, "1"),
+                        react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { fontWeight: 600 } }, isClientPortal
+                            ? "SEND TO EXPERT — select who these files are for"
+                            : "SEND TO CLIENT — select which client these files are for")),
+                    react_1.default.createElement(core_1.Box, { display: "flex", flexWrap: "wrap", style: { gap: "8px" } }, expertGroups.map((group) => (react_1.default.createElement(core_1.Chip, { key: group.expert.id, label: react_1.default.createElement(core_1.Box, null,
+                            react_1.default.createElement("strong", null, group.expert.name),
+                            react_1.default.createElement(core_1.Box, { component: "span", ml: 1, style: { color: "#718096" } },
+                                group.projects.length,
+                                " ",
+                                group.projects.length === 1
+                                    ? "project"
+                                    : "projects")), onClick: () => handleExpertSelection(group.expert), clickable: true, disabled: group.projects.length === 0, color: "default", style: {
+                            padding: "8px 12px",
+                            height: "auto",
+                            borderRadius: "20px",
+                            border: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
+                                ? "2px solid #3182CE"
+                                : "1px solid #CBD5E0",
+                            backgroundColor: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
+                                ? "#EBF8FF"
+                                : "white",
+                            opacity: group.projects.length === 0 ? 0.5 : 1,
+                            cursor: group.projects.length === 0
+                                ? "not-allowed"
+                                : "pointer",
+                        } })))),
+                    selectedExpert && hasSingleProject && (react_1.default.createElement(core_1.Box, { mt: 2 },
+                        react_1.default.createElement(core_1.Chip, { label: "AUTO-ASSIGNED", size: "small", style: {
+                                backgroundColor: "#C6F6D5",
+                                color: "#22543D",
                                 fontWeight: 600,
-                                padding: "4px 10px",
-                                backgroundColor: "#FFF3E0",
-                                color: "#E65100",
-                            } }))),
-                    react_1.default.createElement(core_1.Box, { p: 2 },
+                            } }),
+                        react_1.default.createElement(core_1.Typography, { variant: "caption", style: { marginLeft: "8px", color: "#718096" } },
+                            ((_a = selectedExpertProjects[0]) === null || _a === void 0 ? void 0 : _a.name) || "Project",
+                            " \u2014 only project with ",
+                            selectedExpert.name))),
+                    selectedExpert && hasMultipleProjects && (react_1.default.createElement(core_1.Box, { mt: 2 },
+                        react_1.default.createElement(core_1.Chip, { label: `${selectedExpertProjects.length} PROJECTS`, size: "small", style: {
+                                backgroundColor: "#FEF5E7",
+                                color: "#D97706",
+                                fontWeight: 600,
+                            }, icon: react_1.default.createElement(base_icons_1.IconExclamation, { stroke: "#D97706" }) }),
+                        react_1.default.createElement(core_1.Typography, { variant: "caption", style: { marginLeft: "8px", color: "#718096" } }, "Select which project each file is for below"))))),
+                uploadItems.length > 0 && (react_1.default.createElement(core_1.Box, null,
+                    react_1.default.createElement(core_1.Box, null,
                         react_1.default.createElement(core_1.Grid, { container: true, spacing: 2 }, uploadItems.map((item, index) => {
-                            var _a, _b, _c;
-                            const needsProject = !paroDocuments && !((_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value);
+                            var _a;
                             return (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, key: item.id },
                                 react_1.default.createElement(core_1.Paper, { elevation: 1, style: {
                                         padding: "12px 16px",
-                                        backgroundColor: needsProject ? "#FFFBF5" : "white",
-                                        border: needsProject
-                                            ? "2px solid #FFE0B2"
-                                            : "1.5px solid #f0f1f4",
-                                        borderRadius: "10px",
+                                        backgroundColor: "white",
+                                        border: "1px solid #E2E8F0",
+                                        borderRadius: "4px",
                                     } },
                                     react_1.default.createElement(core_1.Grid, { container: true, spacing: 2 },
-                                        react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: "auto", style: {
-                                                display: "flex",
-                                                alignItems: "center",
-                                            } },
-                                            react_1.default.createElement(core_1.Box, { style: {
-                                                    width: "36px",
-                                                    height: "42px",
-                                                    borderRadius: "4px",
-                                                    display: "flex",
-                                                    alignItems: "flex-end",
-                                                    justifyContent: "center",
-                                                    paddingBottom: "4px",
-                                                    fontSize: "10px",
-                                                    fontWeight: 700,
-                                                    letterSpacing: "0.5px",
-                                                    textTransform: "uppercase",
-                                                    backgroundColor: item.file.name.endsWith(".csv")
-                                                        ? "#E8F5E9"
-                                                        : item.file.name.endsWith(".pdf")
-                                                            ? "#FFF3E0"
-                                                            : "#E3F2FD",
-                                                    border: item.file.name.endsWith(".csv")
-                                                        ? "1.5px solid #A5D6A7"
-                                                        : item.file.name.endsWith(".pdf")
-                                                            ? "1.5px solid #FFCC80"
-                                                            : "1.5px solid #90CAF9",
-                                                    color: item.file.name.endsWith(".csv")
-                                                        ? "#248384"
-                                                        : item.file.name.endsWith(".pdf")
-                                                            ? "#E65100"
-                                                            : "#1976D2",
-                                                } }, ((_b = item.file.name
-                                                .split(".")
-                                                .pop()) === null || _b === void 0 ? void 0 : _b.toUpperCase()) || "FILE")),
+                                        react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: "auto", style: { display: "flex", alignItems: "center" } },
+                                            react_1.default.createElement(base_icons_1.IconDocument, { size: "lg" })),
                                         react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: true },
                                             react_1.default.createElement(base_ui_1.Input, { type: "text", value: item.documentName, onChange: (e) => updateItem(item.id, {
                                                     documentName: e.target.value,
@@ -645,8 +511,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
                                                     }
                                                 }, options: documentTypeOptions, disabled: item.status === "uploading" ||
                                                     item.status === "success", required: false })),
-                                        paroDocuments &&
-                                            item.docType === "EO Insurance" && (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: 3, style: { marginTop: "5px" } },
+                                        paroDocuments && item.docType === "EO Insurance" && (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: 3, style: { marginTop: "5px" } },
                                             react_1.default.createElement(core_1.TextField, { type: "date", label: "Expiration Date", value: item.expiryDate
                                                     ? new Date(item.expiryDate)
                                                         .toISOString()
@@ -681,7 +546,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
                                                 }, disabled: item.status === "uploading" ||
                                                     item.status === "success", fullWidth: true, variant: "outlined", size: "small", required: true, error: !!item.dateError, helperText: item.dateError }))),
                                         !paroDocuments && !hasSingleProject && (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: 3 },
-                                            react_1.default.createElement(base_ui_1.Select, { value: ((_c = item.clientAndProject) === null || _c === void 0 ? void 0 : _c.value) || "", onChange: (e) => {
+                                            react_1.default.createElement(base_ui_1.Select, { value: ((_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) || "", onChange: (e) => {
                                                     // Handle empty selection
                                                     if (e.target.value === "") {
                                                         updateItem(item.id, {
@@ -697,7 +562,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
                                                     {
                                                         id: "placeholder",
                                                         value: "",
-                                                        label: "Select project",
+                                                        label: "Which project?",
                                                     },
                                                     ...filteredProjectOptions,
                                                 ], disabled: item.status === "uploading" ||
@@ -720,19 +585,55 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
                                         react_1.default.createElement(core_1.Typography, { variant: "caption", style: { color: "#38A169" } }, "\u2713 Upload successful"))),
                                     item.status === "error" && (react_1.default.createElement(core_1.Box, { mt: 1, ml: { xs: 0, sm: 6 } },
                                         react_1.default.createElement(core_1.Typography, { variant: "caption", style: { color: "#E53E3E" } }, "\u2717 Upload failed"))))));
-                        }))))),
-                uploadItems.length > 0 && (react_1.default.createElement(core_1.Box, { display: "flex", justifyContent: "flex-end" },
-                    react_1.default.createElement(base_ui_1.Button, { label: isUploading
-                            ? "Uploading..."
-                            : `Upload ${uploadItems.filter((i) => i.status !== "success").length} File${uploadItems.filter((i) => i.status !== "success").length !== 1 ? "s" : ""}`, onClick: handleUploadAll, disabled: uploadItems.length === 0 ||
-                            isUploading ||
-                            uploadItems.every((i) => i.status === "success") ||
-                            (!paroDocuments && !selectedExpert) ||
-                            (hasMultipleProjects && !allFilesHaveProjects) ||
-                            uploadItems.some((i) => paroDocuments &&
-                                i.docType === "EO Insurance" &&
-                                (!i.expiryDate || !!i.dateError) &&
-                                i.status !== "success"), color: "primary", isLoading: isUploading })))))));
+                        }))),
+                    react_1.default.createElement(core_1.Divider, { style: { marginTop: "24px" } }),
+                    react_1.default.createElement(core_1.Box, { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 2, mt: 2 },
+                        react_1.default.createElement(core_1.Box, null,
+                            react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: "#718096" } }, paroDocuments ? (react_1.default.createElement(react_1.default.Fragment, null,
+                                react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => i.status !== "success")
+                                    .length),
+                                " ",
+                                uploadItems.filter((i) => i.status !== "success")
+                                    .length === 1
+                                    ? "file"
+                                    : "files")) : (react_1.default.createElement(react_1.default.Fragment, null,
+                                react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => i.status !== "success")
+                                    .length),
+                                " ",
+                                "files \u2022",
+                                " ",
+                                react_1.default.createElement("span", { style: { color: "#718096" } },
+                                    react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => {
+                                        var _a;
+                                        return ((_a = i.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) &&
+                                            i.status !== "success";
+                                    }).length),
+                                    " ",
+                                    "project-assigned"),
+                                " ",
+                                "\u2022",
+                                " ",
+                                react_1.default.createElement("span", { style: { color: "#D97706" } },
+                                    react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => {
+                                        var _a;
+                                        return !((_a = i.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) &&
+                                            i.status !== "success";
+                                    }).length),
+                                    " ",
+                                    "need project"))))),
+                        react_1.default.createElement(core_1.Box, null,
+                            react_1.default.createElement(core_1.Box, { component: "span", ml: 1 },
+                                react_1.default.createElement(base_ui_1.Button, { label: isUploading
+                                        ? "Uploading..."
+                                        : `Upload ${uploadItems.filter((i) => i.status !== "success").length} Files`, onClick: handleUploadAll, disabled: uploadItems.length === 0 ||
+                                        isUploading ||
+                                        uploadItems.every((i) => i.status === "success") ||
+                                        (!paroDocuments && !selectedExpert) ||
+                                        (hasMultipleProjects && !allFilesHaveProjects) ||
+                                        uploadItems.some((i) => paroDocuments &&
+                                            i.docType === "EO Insurance" &&
+                                            (!i.expiryDate || !!i.dateError) &&
+                                            i.status !== "success"), color: "primary", isLoading: isUploading }))))))))));
 };
 exports.MultiFileUploadSection = MultiFileUploadSection;
 exports.default = exports.MultiFileUploadSection;

package/lib/components/TaxAxis/TaxAxisApi.d.ts

@@ -55,4 +55,5 @@ export type TaxAxisApi = {
     generatePdf: (sessionId: string) => Promise<any>;
     getArtifacts: (sessionId: string) => Promise<any[]>;
     importQboReport?: (sessionId: string, expertId: string, year: number, reportType: string) => Promise<any>;
+    generateProspectReport?: (input: Record<string, unknown>) => Promise<any>;
 };

package/lib/components/TaxAxis/TaxAxisShell.js

@@ -128,6 +128,30 @@ function buildSessionInput(profile) {
         states: profile.states || [],
     };
 }
+function buildProspectInput(profile) {
+    var _a;
+    const fedRateStr = (profile.federalRate || '24%').replace('%', '');
+    const stateRateStr = (profile.stateRate || '0').replace('%', '');
+    return {
+        businessName: profile.bizName || 'Client',
+        entityType: profile.entity || 'S-Corporation',
+        primaryState: ((_a = profile.states) === null || _a === void 0 ? void 0 : _a[0]) || 'IL',
+        states: profile.states || [],
+        industry: profile.industry || 'Professional Services',
+        annualRevenue: toInt(profile.revenue),
+        netIncome: toInt(profile.netIncome) || null,
+        ownerCompensation: toInt(profile.ownerComp) || null,
+        employees: toInt(profile.employees) || null,
+        federalRate: parseFloat(fedRateStr) / 100 || 0.24,
+        stateRate: parseFloat(stateRateStr) / 100 || 0,
+        taxYear: Number(profile.year) || new Date().getFullYear(),
+        analysisPeriod: profile.period || 'Full Year',
+        riskTolerance: profile.riskTolerance || null,
+        equipmentPurchased: toInt(profile.equipmentPurchased) || null,
+        realEstateValue: toInt(profile.realEstateValue) || null,
+        capitalGains: toInt(profile.capitalGains) || null,
+    };
+}
 function ShellContainer({ children, fullWidth = false, }) {
     if (fullWidth) {
         return react_1.default.createElement(react_1.default.Fragment, null, children);
@@ -146,6 +170,8 @@ const TaxAxisShell = ({ taxAxisApi, userContext = 'expert', initialSessionId, in
     const [error, setError] = (0, react_1.useState)(null);
     const [busyMessage, setBusyMessage] = (0, react_1.useState)('Syncing Tax Axis session...');
     const [reportReady, setReportReady] = (0, react_1.useState)(false);
+    const [backendResults, setBackendResults] = (0, react_1.useState)(null);
+    const [generating, setGenerating] = (0, react_1.useState)(false);
     const isPollingRef = react_1.default.useRef(false);
     // QBO state driven by EPS props — not localStorage
     const [qboConnectedState, setQboConnectedState] = (0, react_1.useState)(!!qboConnected);
@@ -236,13 +262,29 @@ const TaxAxisShell = ({ taxAxisApi, userContext = 'expert', initialSessionId, in
         setIsProspectFlow(false);
         setError(null);
         setReportReady(false);
+        setBackendResults(null);
         updateSessionId(null);
     }, [updateSessionId]);
-    const handleProspect = (0, react_1.useCallback)((nextProfile) => {
+    const handleProspect = (0, react_1.useCallback)((nextProfile) => __awaiter(void 0, void 0, void 0, function* () {
         setProfile(nextProfile);
         setIsProspectFlow(true);
+        setBackendResults(null);
+        if (taxAxisApi.generateProspectReport) {
+            setGenerating(true);
+            try {
+                const input = buildProspectInput(nextProfile);
+                const result = yield taxAxisApi.generateProspectReport(input);
+                if (result) {
+                    setBackendResults(result);
+                }
+            }
+            catch (_err) {
+                // LLM call failed — fall through to template mode
+            }
+            setGenerating(false);
+        }
         setStep('PROSPECT_REPORT');
-    }, []);
+    }), [taxAxisApi]);
     const handleFullAnalysis = (0, react_1.useCallback)((nextProfile) => __awaiter(void 0, void 0, void 0, function* () {
         setProfile(nextProfile);
         setIsProspectFlow(false);
@@ -423,7 +465,7 @@ const TaxAxisShell = ({ taxAxisApi, userContext = 'expert', initialSessionId, in
         switch (step) {
             case 'PROSPECT_REPORT':
                 return (react_1.default.createElement(ShellContainer, null,
-                    react_1.default.createElement(TaxAxisProspectReport_1.TaxAxisProspectReport, { profile: profile, userContext: userContext, onUpgrade: () => setStep('DOCUMENT_UPLOAD'), onPresent: () => setStep('PRESENTATION'), onReset: handleReset })));
+                    react_1.default.createElement(TaxAxisProspectReport_1.TaxAxisProspectReport, { profile: profile, userContext: userContext, backendResults: backendResults, onUpgrade: () => setStep('DOCUMENT_UPLOAD'), onPresent: () => setStep('PRESENTATION'), onReset: handleReset })));
             case 'DOCUMENT_UPLOAD':
                 return (react_1.default.createElement(ShellContainer, null,
                     react_1.default.createElement("div", { className: "flex items-center justify-between rounded-lg px-4 py-3 mb-5", style: {
@@ -513,6 +555,8 @@ const TaxAxisShell = ({ taxAxisApi, userContext = 'expert', initialSessionId, in
         llmResult,
         adapted,
         reportReady,
+        backendResults,
+        generating,
         parsedDocuments,
         qboConnectedState,
         qboCompanyNameState,
@@ -530,6 +574,11 @@ const TaxAxisShell = ({ taxAxisApi, userContext = 'expert', initialSessionId, in
                 react_1.default.createElement("div", { className: 'flex items-center gap-2' },
                     react_1.default.createElement("div", { className: 'w-3 h-3 rounded-full animate-spin flex-shrink-0', style: { border: '2px solid transparent', borderTopColor: '#248384' } }),
                     busyMessage)))),
+        generating && (react_1.default.createElement("div", { className: 'fixed inset-0 z-[180] bg-black/25' },
+            react_1.default.createElement("div", { className: 'absolute left-1/2 top-1/3 -translate-x-1/2 rounded-xl bg-tax-axis-surface px-8 py-6 text-center shadow-lg border border-tax-axis-border', style: { maxWidth: 360 } },
+                react_1.default.createElement("div", { className: 'w-6 h-6 rounded-full animate-spin mx-auto mb-3', style: { border: '2.5px solid transparent', borderTopColor: '#248384' } }),
+                react_1.default.createElement("div", { className: 'text-sm font-semibold text-white mb-1 font-tax-axis-body' }, "Generating Prospect Report"),
+                react_1.default.createElement("div", { className: 'text-xs text-tax-axis-text-3 font-tax-axis-body' }, "Analyzing strategies and generating insights...")))),
         currentView));
 };
 exports.TaxAxisShell = TaxAxisShell;

package/lib/components/shared/UploadClient.d.ts

@@ -8,10 +8,9 @@ export default class UploadClient {
         bucketName: string;
         escalationId?: string;
         taskId?: string;
-        keyPrefix?: string;
     };
     constructor(props: any);
-    generateS3Key(projectId: number, escalationId: string, fileName: string, taskId: string, keyPrefix?: string): string;
+    generateS3Key(projectId: number, escalationId: string, fileName: string, taskId: string): string;
     triggerMultipartUpload(): Promise<string | undefined>;
     uploadMultiPartFile(): Promise<string | undefined>;
     completeUpload(partsArray: any): Promise<string | undefined>;

package/lib/components/shared/UploadClient.js

@@ -20,14 +20,10 @@ class UploadClient {
             bucketName: props.bucketName,
             escalationId: props.escalationId,
             taskId: props.taskId,
-            keyPrefix: props.keyPrefix,
         };
     }
-    generateS3Key(projectId, escalationId, fileName, taskId, keyPrefix) {
+    generateS3Key(projectId, escalationId, fileName, taskId) {
         const sanitizedFileName = fileName.replace(/[^a-zA-Z0-9.-]/g, '_');
-        if (!!keyPrefix) {
-            return `${keyPrefix.replace(/\/+$/, '')}/${sanitizedFileName}`;
-        }
         if (!!taskId) {
             return `project-task-${taskId}/${sanitizedFileName}`;
         }
@@ -41,7 +37,7 @@ class UploadClient {
         return __awaiter(this, void 0, void 0, function* () {
             var _a, _b;
             try {
-                const fileName = this.generateS3Key(this.state.projectId, (_a = this.state.escalationId) !== null && _a !== void 0 ? _a : '', this.state.fileName, (_b = this.state.taskId) !== null && _b !== void 0 ? _b : '', this.state.keyPrefix);
+                const fileName = this.generateS3Key(this.state.projectId, (_a = this.state.escalationId) !== null && _a !== void 0 ? _a : '', this.state.fileName, (_b = this.state.taskId) !== null && _b !== void 0 ? _b : '');
                 this.state = Object.assign(Object.assign({}, this.state), { fileName: fileName });
                 const params = {
                     fileName: this.state.fileName,

package/lib/index.d.ts

@@ -16,5 +16,17 @@ export { DiscussionSection } from './components/Invoices/DiscussionSection';
 export { fileDownloader } from './components/FileDownloader';
 export { Escalations } from './components/Escalations';
 export { ProjectIntelligence } from "./components/ProjectIntelligence";
+export { SectionHeader } from './tax-axis';
+export { TaxAxisBadge } from './tax-axis';
+export { TaxAxisButton } from './tax-axis';
+export { TaxAxisCard } from './tax-axis';
+export { TaxAxisIntake } from './tax-axis';
+export { TaxAxisDocuments } from './tax-axis';
+export { TaxAxisProcessing } from './tax-axis';
+export { TaxAxisDashboard } from './tax-axis';
+export { TaxAxisClientReport } from './tax-axis';
+export { TaxAxisPreparerWorkpaper } from './tax-axis';
+export { TaxAxisExtractionReview } from './tax-axis';
+export { TaxAxisProspectReport } from './tax-axis';
+export { TaxAxisPresentationMode } from './tax-axis';
 export { TaxAxisShell } from './components/TaxAxis';
-export type { TaxAxisApi, TaxAxisSessionInput, TaxAxisUploadInput } from './components/TaxAxis';