npm - @paro.io/expert-shared-components - Versions diffs - 1.14.4 → 1.14.6 - Mend

@paro.io/expert-shared-components 1.14.4 → 1.14.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/lib/components/ProjectIntelligence/EngagementHeader/index.d.ts CHANGED Viewed

@@ -9,10 +9,13 @@ interface EngagementHeaderProps {
     expertName: string;
     expertTitle: string;
     startDate: string;
-    status: 'Discovery' | 'Kickoff_Complete' | 'In_Progress' | 'Completed' | 'Paused' | 'Cancelled';
+    status: 'PreKickoff' | 'Kickoff' | 'Setup' | 'Active' | 'Renewal';
     clientTabs: ClientTab[];
     selectedClientId: string | null;
     onClientChange: (opportunityId: string) => void;
+    allFocusAreasCompleted?: boolean;
+    onMoveToNextStage?: () => void;
+    isLoading?: boolean;
 }
 export declare const EngagementHeader: React.FC<EngagementHeaderProps>;
 export {};

package/lib/components/ProjectIntelligence/EngagementHeader/index.js CHANGED Viewed

@@ -7,22 +7,20 @@ exports.EngagementHeader = void 0;
 const react_1 = __importDefault(require("react"));
 const date_fns_1 = require("date-fns");
 const STATUS_COLORS = {
-    Discovery: 'bg-orange-100 text-orange-800 border-orange-200',
-    Kickoff_Complete: 'bg-green-100 text-green-800 border-green-200',
-    In_Progress: 'bg-blue-100 text-blue-800 border-blue-200',
-    Completed: 'bg-gray-100 text-gray-800 border-gray-200',
-    Paused: 'bg-orange-100 text-orange-800 border-orange-200',
-    Cancelled: 'bg-red-100 text-red-800 border-red-200',
+    'PreKickoff': 'bg-orange-100 text-orange-800 border-orange-200',
+    Kickoff: 'bg-green-100 text-green-800 border-green-200',
+    Setup: 'bg-green-100 text-green-800 border-green-200',
+    Active: 'bg-green-100 text-green-800 border-green-200',
+    Renewal: 'bg-green-100 text-green-800 border-green-200',
 };
 const STATUS_LABELS = {
-    Discovery: 'DISCOVERY',
-    Kickoff_Complete: 'KICKOFF COMPLETE',
-    In_Progress: 'IN PROGRESS',
-    Completed: 'COMPLETED',
-    Paused: 'PAUSED',
-    Cancelled: 'CANCELLED',
+    'PreKickoff': 'PRE KICKOFF',
+    Kickoff: 'KICKOFF',
+    Setup: 'SETUP',
+    Active: 'ACTIVE',
+    Renewal: 'RENEWAL',
 };
-const EngagementHeader = ({ clientName, expertName, expertTitle, startDate, status, clientTabs, selectedClientId, onClientChange }) => {
+const EngagementHeader = ({ clientName, expertName, expertTitle, startDate, status, clientTabs, selectedClientId, onClientChange, allFocusAreasCompleted = false, onMoveToNextStage, isLoading = false }) => {
     const formattedDate = startDate ? (0, date_fns_1.format)(new Date(startDate), 'MMMM dd, yyyy') : (0, date_fns_1.format)(new Date(), 'MMMM dd, yyyy');
     return (react_1.default.createElement("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200" },
         react_1.default.createElement("div", { className: "px-6 pt-4" },
@@ -42,9 +40,14 @@ const EngagementHeader = ({ clientName, expertName, expertTitle, startDate, stat
                         expertTitle,
                         " \u2022 Started ",
                         formattedDate)),
-                react_1.default.createElement("div", { className: "flex items-center" },
+                react_1.default.createElement("div", { className: "flex items-center space-x-3" },
                     react_1.default.createElement("span", { className: `inline-flex items-center px-3 py-1 rounded-full text-sm font-medium ${STATUS_COLORS[status]}` },
                         react_1.default.createElement("div", { className: "w-2 h-2 bg-current rounded-full mr-1.5" }),
-                        STATUS_LABELS[status]))))));
+                        STATUS_LABELS[status]),
+                    allFocusAreasCompleted && status !== 'Active' && onMoveToNextStage && (react_1.default.createElement("button", { onClick: onMoveToNextStage, disabled: isLoading, className: `inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition-colors ${isLoading ? 'opacity-50 cursor-not-allowed' : ''}` }, isLoading ? (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement("svg", { className: "animate-spin -ml-1 mr-2 h-4 w-4 text-white", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" },
+                            react_1.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+                            react_1.default.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })),
+                        "Processing...")) : ('Move to Next Stage'))))))));
 };
 exports.EngagementHeader = EngagementHeader;

package/lib/components/ProjectIntelligence/FocusAreas/index.js CHANGED Viewed

@@ -28,9 +28,9 @@ const react_1 = __importStar(require("react"));
 const date_fns_1 = require("date-fns");
 const utils_1 = require("../../shared/utils");
 const STATUS_COLORS = {
-    CONFIRMED: 'bg-green-100 text-green-800 border-green-200',
+    CONFIRMED: 'bg-blue-100 text-blue-800 border-blue-200',
     IN_PROGRESS: 'bg-blue-100 text-blue-800 border-blue-200',
-    COMPLETED: 'bg-gray-100 text-gray-800 border-gray-200',
+    COMPLETED: 'bg-green-100 text-green-800 border-green-200',
     AT_RISK: 'bg-red-100 text-red-800 border-red-200',
 };
 const STATUS_ICONS = {
@@ -125,6 +125,32 @@ const FocusAreas = ({ focusAreas, updateOpportunityFocusArea, GetOpportunityInsi
         // Here you would typically call an API to update the focus area
         console.log('Saving focus area:', id, newTitle, newDescription);
     };
+    const handleStatusUpdate = (focusArea, newStatus) => {
+        try {
+            // Update in the backend
+            updateOpportunityFocusArea({
+                variables: {
+                    opportunityId: selectedOpportunityId,
+                    input: {
+                        id: focusArea.id,
+                        status: newStatus
+                    }
+                },
+                refetchQueries: [
+                    { query: GetOpportunityInsightsDocument, variables: { opportunityId: selectedOpportunityId } }
+                ]
+            });
+            // Update local state
+            setLocalFocusAreas(prev => prev.map(area => area.id === focusArea.id
+                ? Object.assign(Object.assign({}, area), { status: newStatus }) : area));
+            (0, utils_1.showToast)('success', `Focus area marked as ${newStatus.toLowerCase()}`);
+            onSaveFocusArea && onSaveFocusArea();
+        }
+        catch (error) {
+            console.error('Error updating focus area status:', error);
+            (0, utils_1.showToast)('warning', 'Error updating focus area status. Please try again.');
+        }
+    };
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200" },
             react_1.default.createElement("div", { className: "px-6 py-4 border-b border-gray-200" },
@@ -145,9 +171,13 @@ const FocusAreas = ({ focusAreas, updateOpportunityFocusArea, GetOpportunityInsi
                                     STATUS_ICONS[area.status],
                                     " ",
                                     area.status.replace('_', ' '))),
-                            react_1.default.createElement("button", { onClick: () => handleEditClick(area), className: "flex items-center space-x-1 px-2 py-1 text-xs font-medium text-gray-600 hover:text-blue-600 hover:bg-blue-50 rounded transition-colors" },
-                                react_1.default.createElement("span", null, "\u270F\uFE0F"),
-                                react_1.default.createElement("span", null, "Edit Focus Area"))),
+                            react_1.default.createElement("div", { className: "flex items-center space-x-2" },
+                                area.status !== 'COMPLETED' && (react_1.default.createElement("button", { onClick: () => handleStatusUpdate(area, 'COMPLETED'), className: "flex items-center space-x-1 px-2 py-1 text-xs font-medium text-green-600 bg-green-50 hover:text-green-800 hover:bg-green-100 rounded transition-colors" },
+                                    react_1.default.createElement("span", null, "\u2713"),
+                                    react_1.default.createElement("span", null, "Mark as Complete"))),
+                                react_1.default.createElement("button", { onClick: () => handleEditClick(area), className: "flex items-center space-x-1 px-2 py-1 text-xs font-medium text-gray-600 hover:text-blue-600 hover:bg-blue-50 rounded transition-colors" },
+                                    react_1.default.createElement("span", null, "\u270F\uFE0F"),
+                                    react_1.default.createElement("span", null, "Edit Focus Area")))),
                         react_1.default.createElement("p", { className: "text-sm text-gray-600 mb-2" }, area.description),
                         react_1.default.createElement("div", { className: "flex items-center space-x-4 text-xs text-gray-500" },
                             react_1.default.createElement("span", null, (0, date_fns_1.format)(new Date(area.dueDate), 'MMM dd, yyyy')),

package/lib/components/ProjectIntelligence/MissingInformation/index.js CHANGED Viewed

@@ -77,48 +77,51 @@ const getPriorityLevel = (priority) => {
             return PRIORITY_LEVELS[0];
     }
 };
+// Convert priority level string to priority value
+const getPriorityNumber = (priorityLevel) => {
+    switch (priorityLevel) {
+        case 'Urgent - Blocks current work': return 'HIGH';
+        case 'High - Needed this week': return 'MEDIUM';
+        case 'Medium - Needed next week':
+        case 'Low - Needed eventually':
+        default: return 'LOW';
+    }
+};
 // Request Information Modal Component
 const RequestInfoModal = ({ isOpen, missingInfoItem, onClose, onSubmit, documentCenterController, isInternal, handleRouteToDocuments, isParoIntelligenceRolePresent, }) => {
     const [submitting, setSubmitting] = (0, react_1.useState)(false);
-    const [formData, setFormData] = (0, react_1.useState)({
-        informationCategory: INFORMATION_CATEGORIES[0], // Default to first category
-        priorityLevel: PRIORITY_LEVELS[0], // Default to first priority
-        specificInformation: '',
-    });
+    const [informationCategory, setInformationCategory] = (0, react_1.useState)(INFORMATION_CATEGORIES[0]);
+    const [priorityLevel, setPriorityLevel] = (0, react_1.useState)(PRIORITY_LEVELS[0]);
+    const [specificInformation, setSpecificInformation] = (0, react_1.useState)('');
     react_1.default.useEffect(() => {
         if (missingInfoItem) {
-            setFormData({
-                informationCategory: missingInfoItem.category || INFORMATION_CATEGORIES[0],
-                priorityLevel: getPriorityLevel(missingInfoItem.priority),
-                specificInformation: missingInfoItem.description || '',
-            });
+            setInformationCategory(missingInfoItem.category || INFORMATION_CATEGORIES[0]);
+            setPriorityLevel(getPriorityLevel(missingInfoItem.priority));
+            setSpecificInformation(missingInfoItem.description || '');
         }
     }, [missingInfoItem]);
+    const handleCancel = () => {
+        setInformationCategory(INFORMATION_CATEGORIES[0]);
+        setPriorityLevel(PRIORITY_LEVELS[0]);
+        setSpecificInformation('');
+        setSubmitting(false);
+        onClose();
+    };
     const handleSubmit = () => {
         setSubmitting(true);
-        try {
-            onSubmit(Object.assign(Object.assign({}, formData), { itemId: missingInfoItem === null || missingInfoItem === void 0 ? void 0 : missingInfoItem.id, itemTitle: missingInfoItem === null || missingInfoItem === void 0 ? void 0 : missingInfoItem.title }));
-        }
-        catch (e) {
-            console.error("Error while submitting request", e);
-        }
-        finally {
+        const data = {
+            informationCategory: informationCategory,
+            priority: getPriorityNumber(priorityLevel),
+            specificInformation: specificInformation,
+        };
+        if (onSubmit) {
+            onSubmit(data);
+            setInformationCategory(INFORMATION_CATEGORIES[0]);
+            setPriorityLevel(PRIORITY_LEVELS[0]);
+            setSpecificInformation('');
             setSubmitting(false);
+            onClose();
         }
-        onClose();
-    };
-    const handleCancel = () => {
-        // Reset form data when canceling
-        if (missingInfoItem) {
-            setFormData({
-                informationCategory: missingInfoItem.category || '',
-                priorityLevel: missingInfoItem.priority === 'HIGH' ? 'Urgent - Blocks current work' :
-                    missingInfoItem.priority === 'MEDIUM' ? 'High - Needed this week' :
-                        'Medium - Needed next week',
-                specificInformation: missingInfoItem.description || '',
-            });
-        }
-        onClose();
     };
     const handleOpenDocumentCenter = () => {
         if (isInternal && handleRouteToDocuments) {
@@ -155,17 +158,13 @@ const RequestInfoModal = ({ isOpen, missingInfoItem, onClose, onSubmit, document
                             "View Documents in Document Center"))))),
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { htmlFor: "informationCategory", className: "block text-sm font-medium text-gray-700 mb-1" }, "Information Category"),
-                    react_1.default.createElement("select", { id: "informationCategory", disabled: isInternal && !isParoIntelligenceRolePresent, value: formData.informationCategory, onChange: (e) => setFormData(prev => { var _a; return (Object.assign(Object.assign({}, prev), { informationCategory: (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value })); }), className: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm" }, INFORMATION_CATEGORIES.map((category) => (react_1.default.createElement("option", { key: category, value: category }, category))))),
+                    react_1.default.createElement("select", { id: "informationCategory", disabled: isInternal && !isParoIntelligenceRolePresent, value: informationCategory, onChange: (e) => { var _a; return setInformationCategory((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value); }, className: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm" }, INFORMATION_CATEGORIES.map((category) => (react_1.default.createElement("option", { key: category, value: category }, category))))),
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { htmlFor: "priorityLevel", className: "block text-sm font-medium text-gray-700 mb-1" }, "Priority Level"),
-                    react_1.default.createElement("select", { id: "priorityLevel", disabled: isInternal && !isParoIntelligenceRolePresent, value: formData.priorityLevel, onChange: (e) => setFormData(prev => { var _a; return (Object.assign(Object.assign({}, prev), { priorityLevel: (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value })); }), className: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm" }, PRIORITY_LEVELS.map((level) => (react_1.default.createElement("option", { key: level, value: level }, level))))),
+                    react_1.default.createElement("select", { id: "priorityLevel", disabled: isInternal && !isParoIntelligenceRolePresent, value: priorityLevel, onChange: (e) => { var _a; return setPriorityLevel((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value); }, className: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm" }, PRIORITY_LEVELS.map((level) => (react_1.default.createElement("option", { key: level, value: level }, level))))),
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("label", { htmlFor: "specificInformation", className: "block text-sm font-medium text-gray-700 mb-1" }, "Specific Information Needed"),
-                    react_1.default.createElement("textarea", { id: "specificInformation", disabled: isInternal && !isParoIntelligenceRolePresent, value: formData.specificInformation, onChange: (e) => {
-                            debugger;
-                            setFormData(prev => { var _a; return (Object.assign(Object.assign({}, prev), { specificInformation: (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value })); });
-                            console.log('formData', formData);
-                        }, rows: 4, className: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm", placeholder: "Need NetSuite configuration details:\n  \n  1. US vs Colombian entity setup\n  2. Consolidation process and requirements" }))),
+                    react_1.default.createElement("textarea", { id: "specificInformation", disabled: isInternal && !isParoIntelligenceRolePresent, value: specificInformation, onChange: (e) => { var _a; return setSpecificInformation((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value); }, rows: 4, className: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm", placeholder: "Need NetSuite configuration details:\n  \n  1. US vs Colombian entity setup\n  2. Consolidation process and requirements" }))),
             react_1.default.createElement("div", { className: "px-6 py-4 border-t border-gray-200 flex justify-end space-x-3" },
                 react_1.default.createElement("button", { onClick: handleCancel, className: "px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-500 transition-colors" }, "Cancel"),
                 react_1.default.createElement("button", { onClick: handleSubmit, disabled: isInternal && !isParoIntelligenceRolePresent, className: `px-4 py-2 text-sm font-medium text-white bg-blue bg-blue-600 border border-transparent rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-colors cursor-${isInternal && !isParoIntelligenceRolePresent ? "not-allowed" : "pointer"}` }, buttonText)))));

package/lib/components/ProjectIntelligence/ProgressTracker/index.d.ts CHANGED Viewed

@@ -2,7 +2,6 @@ import React from 'react';
 interface ProgressTrackerProps {
     percentage: number;
     currentPhase: string;
-    nextSteps: string;
 }
 export declare const ProgressTracker: React.FC<ProgressTrackerProps>;
 export {};

package/lib/components/ProjectIntelligence/ProgressTracker/index.js CHANGED Viewed

@@ -6,16 +6,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ProgressTracker = void 0;
 const react_1 = __importDefault(require("react"));
 const PHASE_TABS = [
-    { id: 'discovery', label: 'Discovery', active: true },
+    { id: 'prekickoff', label: 'Pre-Kickoff', active: true },
     { id: 'kickoff', label: 'Kickoff', active: false },
     { id: 'setup', label: 'Setup', active: false },
     { id: 'active', label: 'Active', active: false },
     { id: 'renewal', label: 'Renewal', active: false },
 ];
-const ProgressTracker = ({ percentage, currentPhase, nextSteps }) => {
+const ProgressTracker = ({ percentage, currentPhase, }) => {
     return (react_1.default.createElement("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200 mt-6" },
         react_1.default.createElement("div", { className: "px-6 py-4 border-b border-gray-200" },
-            react_1.default.createElement("div", { className: "flex space-x-2" }, PHASE_TABS.map((phase) => (react_1.default.createElement("button", { key: phase.id, disabled: !phase.active, className: `px-4 py-2 text-sm font-medium rounded-md transition-colors ${phase.active
+            react_1.default.createElement("div", { className: "flex space-x-2" }, PHASE_TABS.map((phase) => (react_1.default.createElement("button", { key: phase.id, disabled: phase.id.toLowerCase() !== currentPhase.toLowerCase(), className: `px-4 py-2 text-sm font-medium rounded-md transition-colors ${phase.id.toLowerCase() === currentPhase.toLowerCase()
                     ? 'bg-green-100 text-green-800 border border-green-200 hover:bg-green-200 cursor-pointer'
                     : 'text-gray-400 bg-gray-50 border border-gray-200 cursor-not-allowed opacity-60'}` }, phase.label)))))));
 };

package/lib/components/ProjectIntelligence/index.js CHANGED Viewed

@@ -1,10 +1,30 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ProjectIntelligence = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const EngagementHeader_1 = require("./EngagementHeader");
 const ProgressTracker_1 = require("./ProgressTracker");
 const FocusAreas_1 = require("./FocusAreas");
@@ -14,7 +34,13 @@ const KeyMetrics_1 = require("./KeyMetrics");
 const MissingInformation_1 = require("./MissingInformation");
 const ProjectIntelligence = ({ checkIfOpportunityInsightsExistData, opportunityInsightsData, selectedOpportunityId, setSelectedOpportunityId, GetOpportunityInsightsDocument, updateOpportunityMissingInformation, documentCenterController = null, updateOpportunityFocusArea, isInternal = false, handleRouteToDocuments, onSaveFocusArea, onSaveMissingInformation, isParoIntelligenceRolePresent = false, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10;
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const [currentPhase, setCurrentPhase] = (0, react_1.useState)('Setup');
+    const [nextStageData, setNextStageData] = (0, react_1.useState)(null);
     const opportunityInsights = opportunityInsightsData === null || opportunityInsightsData === void 0 ? void 0 : opportunityInsightsData.getOpportunityInsights;
+    (0, react_1.useEffect)(() => {
+        setCurrentPhase((opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.phase) || 'In_Progress');
+    }, [opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.phase]);
     // Create client tabs from checkIfOpportunityInsightsExistData
     const clientTabs = ((_a = checkIfOpportunityInsightsExistData === null || checkIfOpportunityInsightsExistData === void 0 ? void 0 : checkIfOpportunityInsightsExistData.checkIfOpportunityInsightsExist) === null || _a === void 0 ? void 0 : _a.map((insight) => ({
         id: insight.opportunityId,
@@ -77,8 +103,12 @@ const ProjectIntelligence = ({ checkIfOpportunityInsightsExistData, opportunityI
     };
     // Convert API focus areas to component format
     const convertFocusAreas = () => {
-        if (!(opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.focusAreas))
+        if (!(opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.focusAreas) && !nextStageData)
             return [];
+        // If we're showing the next stage data, return that instead
+        if (nextStageData && currentPhase === 'Active') {
+            return nextStageData.focusAreas;
+        }
         return opportunityInsights.focusAreas.map((area, index) => ({
             id: (area === null || area === void 0 ? void 0 : area.id) || `focus-${index}`,
             title: (area === null || area === void 0 ? void 0 : area.title) || 'N/A',
@@ -88,6 +118,87 @@ const ProjectIntelligence = ({ checkIfOpportunityInsightsExistData, opportunityI
             priority: mapPriority(area === null || area === void 0 ? void 0 : area.priority)
         }));
     };
+    // Check if all focus areas are completed
+    const areAllFocusAreasCompleted = () => {
+        if (!(opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.focusAreas) || opportunityInsights.focusAreas.length === 0) {
+            return false;
+        }
+        return opportunityInsights.focusAreas.every((area) => mapFocusAreaStatus(area === null || area === void 0 ? void 0 : area.status) === 'COMPLETED');
+    };
+    // Handle moving to the next stage
+    const handleMoveToNextStage = () => {
+        setIsLoading(true);
+        // Create next stage data with financial focus areas and carry over missing information
+        const nextStageFocusAreas = [
+            {
+                id: 'next-focus-1',
+                title: 'Clean up prior accounting periods',
+                description: 'Review and bring the company\'s books up-to-date for all prior accounting periods before the project start date. This includes entering invoices, applying payments, entering bills, categorizing transactions, and reconciling accounts test',
+                status: 'CONFIRMED',
+                dueDate: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString(), // 7 days from now
+                priority: 'HIGH'
+            },
+            {
+                id: 'next-focus-2',
+                title: 'Ongoing bookkeeping and accounting',
+                description: 'Provide monthly bookkeeping and accounting support including invoice entry, payment processing, bill entry, transaction categorization, account reconciliations, and reporting package delivery.',
+                status: 'CONFIRMED',
+                dueDate: new Date(Date.now() + 14 * 24 * 60 * 60 * 1000).toISOString(), // 14 days from now
+                priority: 'MEDIUM'
+            },
+            {
+                id: 'next-focus-3',
+                title: 'Transition to new accounting system',
+                description: 'Assist in preparing the books and migrating data to the company\'s new front-end accounting system once implemented.',
+                status: 'CONFIRMED',
+                dueDate: new Date(Date.now() + 10 * 24 * 60 * 60 * 1000).toISOString(), // 10 days from now
+                priority: 'HIGH'
+            }
+        ];
+        // Carry over missing information that doesn't have CLIENT_RESPONDED status
+        const carriedOverMissingInfo = (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.missingInformation)
+            ? opportunityInsights.missingInformation
+                .filter((item) => (item === null || item === void 0 ? void 0 : item.status) !== 'CLIENT_RESPONDED')
+                .map((item, index) => (Object.assign(Object.assign({}, item), { id: `carried-${item.id || index}` })))
+            : [];
+        // Add new missing information items
+        const newMissingInfo = [
+            {
+                id: 'new-missing-1',
+                title: 'Financial Transaction History',
+                description: 'Need access to the last 6 months of financial transaction history for the project',
+                priority: 'HIGH',
+                category: 'Financial',
+                status: 'PENDING'
+            },
+            {
+                id: 'new-missing-2',
+                title: 'Budget Approval Documentation',
+                description: 'Require documentation showing approval of the current budget allocation',
+                priority: 'MEDIUM',
+                category: 'Documentation',
+                status: 'PENDING'
+            },
+            {
+                id: 'new-missing-3',
+                title: 'Financial Stakeholder Contact Information',
+                description: 'Need contact details for all financial stakeholders involved in the project',
+                priority: 'LOW',
+                category: 'Contact',
+                status: 'PENDING'
+            }
+        ];
+        // Set the next stage data
+        setNextStageData({
+            focusAreas: nextStageFocusAreas,
+            missingInformation: [...carriedOverMissingInfo, ...newMissingInfo]
+        });
+        // Simulate loading and then update the UI
+        setTimeout(() => {
+            setCurrentPhase('Active');
+            setIsLoading(false);
+        }, 3000);
+    };
     const hasNoProjectIntelligence = !(checkIfOpportunityInsightsExistData === null || checkIfOpportunityInsightsExistData === void 0 ? void 0 : checkIfOpportunityInsightsExistData.checkIfOpportunityInsightsExist) ||
         checkIfOpportunityInsightsExistData.checkIfOpportunityInsightsExist.length === 0;
     // If there's no data, show a message
@@ -99,11 +210,54 @@ const ProjectIntelligence = ({ checkIfOpportunityInsightsExistData, opportunityI
                     react_1.default.createElement("div", { className: "text-2xl font-bold text-gray-700 mb-2" }, "No project intelligence found"),
                     react_1.default.createElement("p", { className: "text-gray-500 max-w-md" }, "No project intelligence found for your won projects. Please check back after you win your next Opportunity!")))));
     }
+    // Get missing information items based on current phase
+    const getMissingInformationItems = () => {
+        if (nextStageData && currentPhase === 'Active') {
+            return nextStageData.missingInformation.map((item, index) => ({
+                id: (item === null || item === void 0 ? void 0 : item.id) || `missing-${index}`,
+                title: (item === null || item === void 0 ? void 0 : item.title) || 'N/A',
+                description: (item === null || item === void 0 ? void 0 : item.description) || 'N/A',
+                priority: mapPriority(item === null || item === void 0 ? void 0 : item.priority),
+                category: (item === null || item === void 0 ? void 0 : item.category) || 'N/A',
+                status: (item === null || item === void 0 ? void 0 : item.status) || undefined,
+                clientResponse: (item === null || item === void 0 ? void 0 : item.clientResponse) || undefined
+            }));
+        }
+        return (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.missingInformation) ?
+            opportunityInsights.missingInformation.map((item, index) => ({
+                id: (item === null || item === void 0 ? void 0 : item.id) || `missing-${index}`,
+                title: (item === null || item === void 0 ? void 0 : item.title) || 'N/A',
+                description: (item === null || item === void 0 ? void 0 : item.description) || 'N/A',
+                priority: mapPriority(item === null || item === void 0 ? void 0 : item.priority),
+                category: (item === null || item === void 0 ? void 0 : item.category) || 'N/A',
+                status: (item === null || item === void 0 ? void 0 : item.status) || undefined,
+                clientResponse: (item === null || item === void 0 ? void 0 : item.clientResponse) || undefined
+            })) : [];
+    };
+    // Get the current phase and next steps text based on the current phase
+    const getPhaseInfo = () => {
+        if (currentPhase === 'Kickoff') {
+            return {
+                phaseDisplay: 'Kickoff Phase (Day 1 of 3)',
+                nextSteps: 'System access & team introductions'
+            };
+        }
+        else {
+            return {
+                phaseDisplay: 'Preparation Phase',
+                nextSteps: 'Complete initial focus areas'
+            };
+        }
+    };
+    const phaseInfo = getPhaseInfo();
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("div", { className: "mx-auto px-4 py-8" },
-            react_1.default.createElement(EngagementHeader_1.EngagementHeader, { clientName: (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.opportunityName) || '', expertName: ((_b = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.expertInfo) === null || _b === void 0 ? void 0 : _b.name) || '', expertTitle: ((_c = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.expertInfo) === null || _c === void 0 ? void 0 : _c.role) || '', startDate: (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.startDate) || '', status: (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.phase) || 'In_Progress', clientTabs: clientTabs, selectedClientId: selectedOpportunityId, onClientChange: handleClientChange }),
-            react_1.default.createElement(ProgressTracker_1.ProgressTracker, { percentage: 0, currentPhase: "Kickoff Phase (Day 1 of 3)", nextSteps: "System access & team introductions" }),
-            react_1.default.createElement("div", { className: "flex flex-row space-x-4 mt-8" },
+            react_1.default.createElement(EngagementHeader_1.EngagementHeader, { clientName: (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.opportunityName) || '', expertName: ((_b = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.expertInfo) === null || _b === void 0 ? void 0 : _b.name) || '', expertTitle: ((_c = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.expertInfo) === null || _c === void 0 ? void 0 : _c.role) || '', startDate: (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.startDate) || '', status: currentPhase || (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.phase) || 'In_Progress', clientTabs: clientTabs, selectedClientId: selectedOpportunityId, onClientChange: handleClientChange, allFocusAreasCompleted: areAllFocusAreasCompleted(), onMoveToNextStage: handleMoveToNextStage, isLoading: isLoading }),
+            react_1.default.createElement(ProgressTracker_1.ProgressTracker, { percentage: 0, currentPhase: currentPhase }),
+            isLoading ? (react_1.default.createElement("div", { className: "flex items-center justify-center h-64" },
+                react_1.default.createElement("div", { className: "text-center" },
+                    react_1.default.createElement("div", { className: "animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto mb-4" }),
+                    react_1.default.createElement("p", { className: "text-lg font-medium text-gray-700" }, "Calculating Intelligence for your next Stage")))) : (react_1.default.createElement("div", { className: "flex flex-row space-x-4 mt-8" },
                 react_1.default.createElement("div", { className: "w-2/3 space-7-4" },
                     react_1.default.createElement(FocusAreas_1.FocusAreas, { focusAreas: convertFocusAreas(), onEditFocusAreas: () => { }, updateOpportunityFocusArea: updateOpportunityFocusArea, GetOpportunityInsightsDocument: GetOpportunityInsightsDocument, selectedOpportunityId: selectedOpportunityId, onSaveFocusArea: onSaveFocusArea }),
                     react_1.default.createElement(ProjectHealth_1.ProjectHealth, { healthData: {
@@ -124,16 +278,7 @@ const ProjectIntelligence = ({ checkIfOpportunityInsightsExistData, opportunityI
                                 description: ((_u = (_t = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.opportunityHealth) === null || _t === void 0 ? void 0 : _t.riskManagement) === null || _u === void 0 ? void 0 : _u.description) || 'N/A'
                             }
                         }, className: "mt-8" }),
-                    react_1.default.createElement(MissingInformation_1.MissingInformation, { items: (opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.missingInformation) ?
-                            opportunityInsights.missingInformation.map((item, index) => ({
-                                id: (item === null || item === void 0 ? void 0 : item.id) || `missing-${index}`,
-                                title: (item === null || item === void 0 ? void 0 : item.title) || 'N/A',
-                                description: (item === null || item === void 0 ? void 0 : item.description) || 'N/A',
-                                priority: mapPriority(item === null || item === void 0 ? void 0 : item.priority),
-                                category: (item === null || item === void 0 ? void 0 : item.category) || 'N/A',
-                                status: (item === null || item === void 0 ? void 0 : item.status) || undefined,
-                                clientResponse: (item === null || item === void 0 ? void 0 : item.clientResponse) || undefined
-                            })) : [], className: "mt-8", opportunityId: selectedOpportunityId, GetOpportunityInsightsDocument: GetOpportunityInsightsDocument, updateOpportunityMissingInformation: updateOpportunityMissingInformation, documentCenterController: documentCenterController, isInternal: isInternal, handleRouteToDocuments: handleRouteToDocuments, onSaveMissingInformation: onSaveMissingInformation, isParoIntelligenceRolePresent: isParoIntelligenceRolePresent })),
+                    react_1.default.createElement(MissingInformation_1.MissingInformation, { items: getMissingInformationItems(), className: "mt-8", opportunityId: selectedOpportunityId, GetOpportunityInsightsDocument: GetOpportunityInsightsDocument, updateOpportunityMissingInformation: updateOpportunityMissingInformation, documentCenterController: documentCenterController, isInternal: isInternal, handleRouteToDocuments: handleRouteToDocuments, onSaveMissingInformation: onSaveMissingInformation, isParoIntelligenceRolePresent: isParoIntelligenceRolePresent })),
                 react_1.default.createElement("div", { className: "w-1/3 space-y-4" },
                     react_1.default.createElement(TeamSection_1.TeamSection, { clientTeam: opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.clientTeam, expert: {
                             id: 'expert-1',
@@ -159,6 +304,6 @@ const ProjectIntelligence = ({ checkIfOpportunityInsightsExistData, opportunityI
                             challenge: ((_8 = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.businessContext) === null || _8 === void 0 ? void 0 : _8.challenge) || 'N/A',
                             opportunity: ((_9 = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.businessContext) === null || _9 === void 0 ? void 0 : _9.opportunity) || 'N/A',
                             tags: ((_10 = opportunityInsights === null || opportunityInsights === void 0 ? void 0 : opportunityInsights.businessContext) === null || _10 === void 0 ? void 0 : _10.tags) || []
-                        }, GetOpportunityInsightsDocument: GetOpportunityInsightsDocument, selectedOpportunityId: selectedOpportunityId }))))));
+                        }, GetOpportunityInsightsDocument: GetOpportunityInsightsDocument, selectedOpportunityId: selectedOpportunityId })))))));
 };
 exports.ProjectIntelligence = ProjectIntelligence;

package/package.json CHANGED Viewed

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