@undp/carbon-library 1.0.150-CARBON-343.6 → 1.0.150-CARBON-320.2

package/dist/cjs/types/Components/Common/AntComponents/antTableComponents.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 interface Item {
     key: string;
     name: string;

package/dist/esm/index.js

@@ -19444,7 +19444,7 @@ var AddNdcActionComponent = function (props) {
                 React.createElement(Steps, { progressDot: true, direction: "vertical", current: current, items: stepItems })))));
 };
 
-var css_248z$d = ".ndc-details-view .card-container {\n  margin-bottom: 16px;\n  width: 100%;\n  border-radius: 10px; }\n  .ndc-details-view .card-container .co-benifits-view .title {\n    color: rgba(58, 53, 65, 0.8);\n    font-weight: 600;\n    margin-left: 0.5rem; }\n  .ndc-details-view .card-container .action-btns {\n    margin-top: 25px;\n    margin-bottom: -15px;\n    justify-content: end; }\n\n.ndc-details-view .fix-height {\n  height: 350px; }\n";
+var css_248z$d = ".ndc-details-view .card-container {\n  margin-bottom: 16px;\n  width: 100%;\n  border-radius: 10px; }\n  .ndc-details-view .card-container .co-benifits-view .title {\n    color: rgba(58, 53, 65, 0.8);\n    font-weight: 600;\n    margin-left: 0.5rem; }\n  .ndc-details-view .card-container .action-btns {\n    margin-top: 25px;\n    margin-bottom: -15px;\n    justify-content: end; }\n\n.ndc-details-view .fix-height {\n  height: 350px; }\n\n.title-icon {\n  padding-right: 10px; }\n\n.title-text {\n  color: rgba(58, 53, 65, 0.8);\n  font-weight: 600; }\n\n.title {\n  margin-bottom: 5px; }\n\n.ndc-action-report-body {\n  display: flex;\n  flex-direction: column;\n  width: 100%; }\n  .ndc-action-report-body .report-details {\n    display: flex;\n    flex-direction: row;\n    width: 100%;\n    align-items: center;\n    justify-content: space-between;\n    margin: 5px 25px;\n    font-size: 0.8rem; }\n    .ndc-action-report-body .report-details .report-type {\n      display: flex;\n      flex-direction: row;\n      width: 60%; }\n      .ndc-action-report-body .report-details .report-type .name-time-container {\n        display: flex;\n        flex-direction: column;\n        width: 70%;\n        margin-bottom: 0.5rem; }\n      .ndc-action-report-body .report-details .report-type .name {\n        font-weight: 500;\n        color: rgba(58, 53, 65, 0.6); }\n      .ndc-action-report-body .report-details .report-type .time {\n        color: rgba(58, 53, 65, 0.5);\n        width: max-content; }\n      .ndc-action-report-body .report-details .report-type .icon {\n        display: flex;\n        align-items: center;\n        width: 30%;\n        color: rgba(58, 53, 65, 0.6); }\n      .ndc-action-report-body .report-details .report-type .empty {\n        font-weight: 500;\n        color: rgba(58, 53, 65, 0.6); }\n    .ndc-action-report-body .report-details .ant-row {\n      margin: 0px 30px auto; }\n    .ndc-action-report-body .report-details .report-link {\n      display: flex;\n      flex-direction: row;\n      width: 40%; }\n      .ndc-action-report-body .report-details .report-link .version {\n        font-weight: 600;\n        color: #cacaca; }\n      .ndc-action-report-body .report-details .report-link .link {\n        margin-left: 1rem; }\n";
 styleInject(css_248z$d);
 
 var css_248z$c = ".info-view .title-icon {\n  padding-right: 10px; }\n\n.info-view .title-text {\n  color: rgba(58, 53, 65, 0.8);\n  font-weight: 600; }\n\n.info-view .title {\n  margin-bottom: 5px; }\n\n.info-view .field-key {\n  color: rgba(58, 53, 65, 0.6);\n  font-weight: 500;\n  text-overflow: ellipsis;\n  overflow: hidden; }\n\n.info-view .field-value {\n  color: rgba(58, 53, 65, 0.6);\n  text-overflow: ellipsis;\n  overflow: hidden; }\n  .info-view .field-value .row {\n    display: flex;\n    width: 40%;\n    align-items: center;\n    justify-content: space-between; }\n    .info-view .field-value .row .key {\n      display: flex;\n      width: 50%;\n      align-items: center;\n      justify-content: flex-start; }\n    .info-view .field-value .row .data {\n      display: flex;\n      width: 50%;\n      align-items: center;\n      justify-content: flex-start; }\n\n.info-view .field {\n  margin: 15px 25px;\n  font-size: 0.8rem; }\n";
@@ -19542,15 +19542,19 @@ var NdcActionViewComponent = function (props) {
     var userInfoState = useUserContext().userInfoState;
     var post = useConnection().post;
     var state = useLocation().state;
-    var _d = useState({}), ndcActionReportDetails = _d[0], setNdcActionReportDetails = _d[1];
+    var _d = useState({}); _d[0]; var setNdcActionReportDetails = _d[1];
     var _e = useState(false), isLoading = _e[0], setIsLoading = _e[1];
-    var _f = useState(), ndcActionDetails = _f[0], setNdcActionDetails = _f[1];
-    var _g = useState(); _g[0]; var setCoBenifitsComponentnDetails = _g[1];
-    var _h = useState(0), emissionsReductionExpected = _h[0], setEmissionsReductionExpected = _h[1];
-    var _j = useState(0), emissionsReductionAchieved = _j[0], setEmissionsReductionAchieved = _j[1];
-    var _k = useState([]), programmeOwnerId = _k[0], setProgrammeOwnerId = _k[1];
-    var _l = useState(false), canUploadMonitorReport = _l[0], setCanUploadMonitorReport = _l[1];
-    var _m = useState(false), monitoringReportAccepted = _m[0], setMonitoringReportAccepted = _m[1];
+    var _f = useState(), monitoringReportData = _f[0], setMonitoringReportData = _f[1];
+    var _g = useState(""), monitoringReportversion = _g[0], setMonitoringReportversion = _g[1];
+    var _h = useState(), verificationReportData = _h[0], setVerificationReportData = _h[1];
+    var _j = useState(""), verificationReportVersion = _j[0], setVerificationReportversion = _j[1];
+    var _k = useState(), ndcActionDetails = _k[0], setNdcActionDetails = _k[1];
+    var _l = useState(); _l[0]; var setCoBenifitsComponentnDetails = _l[1];
+    var _m = useState(0), emissionsReductionExpected = _m[0], setEmissionsReductionExpected = _m[1];
+    var _o = useState(0), emissionsReductionAchieved = _o[0], setEmissionsReductionAchieved = _o[1];
+    var _p = useState([]), programmeOwnerId = _p[0], setProgrammeOwnerId = _p[1];
+    var _q = useState(false), canUploadMonitorReport = _q[0], setCanUploadMonitorReport = _q[1];
+    var _r = useState(false), monitoringReportAccepted = _r[0], setMonitoringReportAccepted = _r[1];
     var getProgrammeById = function (programmeId) { return __awaiter(void 0, void 0, void 0, function () {
         var response, error_1;
         var _a, _b, _c;
@@ -19592,13 +19596,16 @@ var NdcActionViewComponent = function (props) {
             }
         });
     }); };
-    var getProjectReportActions = function (reportData) {
+    var getProjectReportActions = function (reportData, reportVersion) {
         return (React.createElement(Row, null,
             React.createElement("div", { className: "icon" },
                 (reportData === null || reportData === void 0 ? void 0 : reportData.status) === DocumentStatus.ACCEPTED && (React.createElement(CheckCircleOutlined, { className: "common-progress-icon", style: { color: "#5DC380" } })),
                 (reportData === null || reportData === void 0 ? void 0 : reportData.status) === DocumentStatus.REJECTED && (React.createElement(ExclamationCircleOutlined, { className: "common-progress-icon", style: { color: "#FD6F70" } }))),
             React.createElement("div", { className: "link mg-left-1" }, (reportData === null || reportData === void 0 ? void 0 : reportData.url) && linkDocVisible(reportData === null || reportData === void 0 ? void 0 : reportData.status) && (React.createElement("a", { href: reportData === null || reportData === void 0 ? void 0 : reportData.url, target: "_blank", rel: "noopener noreferrer", download: true },
-                React.createElement(BookOutlined, { className: "common-progress-icon margin-right-1", style: { color: "#3F3A47" } }))))));
+                React.createElement(BookOutlined, { className: "common-progress-icon margin-right-1", style: { color: "#3F3A47" } })))),
+            (reportData === null || reportData === void 0 ? void 0 : reportData.txTime) && (React.createElement("div", { className: "time" },
+                moment(parseInt(reportData === null || reportData === void 0 ? void 0 : reportData.txTime)).format("DD MMMM YYYY @ HH:mm"),
+                " ~ " + reportVersion))));
     };
     var getProjectReports = function () { return __awaiter(void 0, void 0, void 0, function () {
         var reportDetails, response, exception_1;
@@ -19646,12 +19653,24 @@ var NdcActionViewComponent = function (props) {
                                 if ((item === null || item === void 0 ? void 0 : item.status) === DocumentStatus.ACCEPTED) {
                                     setMonitoringReportAccepted(true);
                                 }
+                                var versionfull = (item === null || item === void 0 ? void 0 : item.url).split("_")[(item === null || item === void 0 ? void 0 : item.url).split("_").length - 1];
+                                var version = versionfull ? versionfull.split(".")[0] : "1";
+                                var moniteringVersion = version.startsWith("V") ? version : "V1";
                                 reportDetails[t("ndcAction:viewMoniteringReport")] =
-                                    getProjectReportActions(item);
+                                    getProjectReportActions(item, moniteringVersion);
+                                setMonitoringReportData(item);
+                                setMonitoringReportversion(moniteringVersion);
                             }
                             else if ((_b = item === null || item === void 0 ? void 0 : item.url) === null || _b === void 0 ? void 0 : _b.includes("VERIFICATION_REPORT")) {
+                                var versionfull = (item === null || item === void 0 ? void 0 : item.url).split("_")[(item === null || item === void 0 ? void 0 : item.url).split("_").length - 1];
+                                var version = versionfull ? versionfull.split(".")[0] : "1";
+                                var verificationVersion = version.startsWith("V")
+                                    ? version
+                                    : "V1";
                                 reportDetails[t("ndcAction:viewVerificationReport")] =
-                                    getProjectReportActions(item);
+                                    getProjectReportActions(item, verificationVersion);
+                                setVerificationReportData(item);
+                                setVerificationReportversion(verificationVersion);
                             }
                         });
                     }
@@ -19905,8 +19924,60 @@ var NdcActionViewComponent = function (props) {
                 React.createElement(Col, { lg: 8, md: 24 },
                     React.createElement(Skeleton, { loading: isLoading, active: true },
                         React.createElement(Card, { className: "card-container fix-height" },
-                            React.createElement("div", null,
-                                React.createElement(InfoView, { data: ndcActionReportDetails, title: t("ndcAction:viewReportsTitle"), icon: React.createElement(Icon.FileEarmarkText, null) })))))),
+                            React.createElement("div", { className: "title" },
+                                React.createElement("span", { className: "title-icon" }, React.createElement(Icon.FileEarmarkText, null)),
+                                React.createElement("span", { className: "title-text" }, t("ndcAction:viewReportsTitle"))),
+                            React.createElement("div", { className: "ndc-action-report-body" },
+                                React.createElement("div", { className: "report-details" },
+                                    React.createElement("div", { className: "report-type" },
+                                        React.createElement("div", { className: "name-time-container" },
+                                            React.createElement("div", { className: canUploadMonitorReport && monitoringReportAccepted
+                                                    ? "name"
+                                                    : "empty" }, t("programme:monitoringReport")),
+                                            (monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.txTime) && (React.createElement("div", { className: "time" },
+                                                moment(parseInt(monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.txTime)).format("DD MMMM YYYY @ HH:mm"),
+                                                " ~ " + monitoringReportversion))),
+                                        React.createElement("div", { className: "icon" }, !(monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.url) && (React.createElement(Tooltip, { arrowPointAtCenter: true, placement: "top", trigger: "hover", title: (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.userRole) === Role.ViewOnly
+                                                ? t("programme:notAuthToUploadDoc")
+                                                : uploadDocUserPermission(userInfoState, DocType.MONITORING_REPORT, programmeOwnerId)
+                                                    ? !canUploadMonitorReport &&
+                                                        t("programme:programmeNotAuth")
+                                                    : t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
+                                            React.createElement(FileAddOutlined, null))))),
+                                    (monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.url) && (React.createElement(Row, null,
+                                        React.createElement("div", { className: "icon" },
+                                            (monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.status) ===
+                                                DocumentStatus.ACCEPTED && (React.createElement(CheckCircleOutlined, { className: "common-progress-icon", style: { color: "#5DC380" } })),
+                                            (monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.status) ===
+                                                DocumentStatus.REJECTED && (React.createElement(ExclamationCircleOutlined, { className: "common-progress-icon", style: { color: "#FD6F70" } }))),
+                                        React.createElement("div", { className: "link mg-left-1" }, (monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.url) &&
+                                            linkDocVisible(monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.status) && (React.createElement("a", { href: monitoringReportData === null || monitoringReportData === void 0 ? void 0 : monitoringReportData.url, target: "_blank", rel: "noopener noreferrer", download: true },
+                                            React.createElement(BookOutlined, { className: "common-progress-icon margin-right-1", style: { color: "#3F3A47" } }))))))),
+                                React.createElement("div", { className: "report-details" },
+                                    React.createElement("div", { className: "report-type" },
+                                        React.createElement("div", { className: "name-time-container" },
+                                            React.createElement("div", { className: canUploadMonitorReport && monitoringReportAccepted
+                                                    ? "name"
+                                                    : "empty" }, t("programme:verificationReport")),
+                                            (verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.txTime) && (React.createElement("div", { className: "time" },
+                                                moment(parseInt(verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.txTime)).format("DD MMMM YYYY @ HH:mm"),
+                                                " ~ " + verificationReportVersion))),
+                                        React.createElement("div", { className: "icon" }, !(verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.url) && (React.createElement(Tooltip, { arrowPointAtCenter: true, placement: "top", trigger: "hover", title: (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.userRole) === Role.ViewOnly
+                                                ? t("programme:notAuthToUploadDoc")
+                                                : uploadDocUserPermission(userInfoState, DocType.VERIFICATION_REPORT, programmeOwnerId)
+                                                    ? !monitoringReportAccepted &&
+                                                        t("programme:monitoringRepNotApproved")
+                                                    : t("programme:notAuthToUploadDoc"), overlayClassName: "custom-tooltip" },
+                                            React.createElement(FileAddOutlined, null))))),
+                                    (verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.url) && (React.createElement(Row, null,
+                                        React.createElement("div", { className: "icon" },
+                                            (verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.status) ===
+                                                DocumentStatus.ACCEPTED && (React.createElement(CheckCircleOutlined, { className: "common-progress-icon", style: { color: "#5DC380" } })),
+                                            (verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.status) ===
+                                                DocumentStatus.REJECTED && (React.createElement(ExclamationCircleOutlined, { className: "common-progress-icon", style: { color: "#FD6F70" } }))),
+                                        React.createElement("div", { className: "link mg-left-1" }, (verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.url) &&
+                                            linkDocVisible(verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.status) && (React.createElement("a", { href: verificationReportData === null || verificationReportData === void 0 ? void 0 : verificationReportData.url, target: "_blank", rel: "noopener noreferrer", download: true },
+                                            React.createElement(BookOutlined, { className: "common-progress-icon margin-right-1", style: { color: "#3F3A47" } })))))))))))),
             ((ndcActionDetails === null || ndcActionDetails === void 0 ? void 0 : ndcActionDetails.action) === NdcActionTypes.Mitigation ||
                 (ndcActionDetails === null || ndcActionDetails === void 0 ? void 0 : ndcActionDetails.action) === NdcActionTypes.CrossCutting) && (React.createElement(Row, null,
                 React.createElement(Col, { lg: 24, className: "gutter-row" },
@@ -24475,7 +24546,7 @@ var EditableCell = function (_a) {
                     return [3 /*break*/, 3];
                 case 2:
                     errInfo_1 = _a.sent();
-                    console.log("Save failed:", errInfo_1);
+                    console.log('Save failed:', errInfo_1);
                     return [3 /*break*/, 3];
                 case 3: return [2 /*return*/];
             }
@@ -24489,7 +24560,7 @@ var EditableCell = function (_a) {
                     message: "".concat(title, " is required."),
                 },
             ] },
-            React.createElement(Input, { ref: inputRef, onPressEnter: save, onBlur: save }))) : (React.createElement("div", { className: "editable-cell-value-wrap", style: { paddingRight: 24, minWidth: "100px", minHeight: "20px" }, onClick: toggleEdit }, children));
+            React.createElement(Input, { ref: inputRef, onPressEnter: save, onBlur: save }))) : (React.createElement("div", { className: "editable-cell-value-wrap", style: { paddingRight: 24 }, onClick: toggleEdit }, children));
     }
     return React.createElement("td", __assign({}, restProps), childNode);
 };
@@ -24507,8 +24578,6 @@ var NdcDetailsComponent = function (props) {
     var _d = useState("add_new"), selectedTab = _d[0], setSelectedTab = _d[1];
     var selectedPeriod = useRef({});
     var addedNdcDetailId = useRef(0);
-    var selectedNdcDetail = useRef({});
-    var _e = useState(0), tableKey = _e[0]; _e[1];
     var userInfoState = useUserContext().userInfoState;
     var isAddRangeVisible = function () {
         return (((userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === CompanyRole.MINISTRY ||
@@ -24541,15 +24610,6 @@ var NdcDetailsComponent = function (props) {
             return [];
         }
     };
-    var getSubNdcDetails = function (key) {
-        var ndcDetail = ndcDetailsData.find(function (item) { return item.key === key; });
-        if (ndcDetail) {
-            return ndcDetail.subNdcDetails;
-        }
-        else {
-            return [];
-        }
-    };
     var defaultColumns = [
         {
             title: t("ndc:ndcColumnsNationalPlanObj"),
@@ -24557,7 +24617,6 @@ var NdcDetailsComponent = function (props) {
             key: "nationalPlanObj",
             align: "left",
             editable: true,
-            width: 800,
         },
         {
             title: t("ndc:ndcColumnsKpi"),
@@ -24565,10 +24624,9 @@ var NdcDetailsComponent = function (props) {
             key: "kpi",
             align: "left",
             editable: true,
-            width: 100,
         },
         {
-            title: "Ministry",
+            title: 'Ministry',
             dataIndex: "ministry",
             key: "ministry",
             align: "left",
@@ -24596,7 +24654,7 @@ var NdcDetailsComponent = function (props) {
             endDate: new Date("".concat(Number(range[0]), "-12-24 23:12:00")),
             nationalPlanObj: t("ndc:enterNewPlanTxt"),
             kpi: 0,
-            ministry: "Please add the Ministry name",
+            ministry: "Please add the Ministry name"
         };
         setNdcDetailsData(__spreadArray(__spreadArray([], ndcDetailsData, true), [newData], false));
     }
@@ -24678,10 +24736,6 @@ var NdcDetailsComponent = function (props) {
                     React.createElement(Button, { type: "primary", onClick: onAddNewPeriod, htmlType: "submit", loading: loading }, t("ndc:submit")),
                     React.createElement(Button, { className: "back-btn", onClick: onCancelPeriod, loading: loading }, t("ndc:back"))))));
     }
-    function getSubNdcActionContent(record) {
-        selectedNdcDetail.current = record;
-        return (React.createElement(Table, { components: components, rowClassName: function () { return "editable-row"; }, bordered: true, dataSource: getSubNdcDetails(record.key), columns: columns, showHeader: false, pagination: false }));
-    }
     var onTabChange = function (key) {
         setSelectedTab(key);
     };
@@ -24693,25 +24747,7 @@ var NdcDetailsComponent = function (props) {
                 endDate: new Date("2020-03-25"),
                 nationalPlanObj: "Enhance value addition in key growth opportunities",
                 kpi: 25,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 6,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "Enhance value addition in key growth opportunities sub details",
-                        kpi: 25,
-                        ministry: "Ministry of Agriculture, Water and Forestry (MAWF)",
-                    },
-                    {
-                        key: 7,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
+                ministry: "Ministry of Agriculture, Water and Forestry (MAWF)"
             },
             {
                 key: 2,
@@ -24719,35 +24755,7 @@ var NdcDetailsComponent = function (props) {
                 endDate: new Date("2019-08-25"),
                 nationalPlanObj: "Strengthen the private sector to create 10,000 jobs",
                 kpi: 10500,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 8,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
-            },
-            {
-                key: 12,
-                startDate: new Date("2019-03-25"),
-                endDate: new Date("2019-08-25"),
-                nationalPlanObj: "Other",
-                kpi: 10500,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 8,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
+                ministry: "Ministry of Tourism (MoT)"
             },
             {
                 key: 3,
@@ -24755,17 +24763,7 @@ var NdcDetailsComponent = function (props) {
                 endDate: new Date("2022-03-25"),
                 nationalPlanObj: "Consolidate and increase the stock and quality of productive infrastructure by 50%",
                 kpi: 48,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 9,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
+                ministry: "Ministry of Education, Arts and Culture (MoE)"
             },
             {
                 key: 4,
@@ -24773,17 +24771,7 @@ var NdcDetailsComponent = function (props) {
                 endDate: new Date("2022-05-25"),
                 nationalPlanObj: "Enhance the productivity and social wellbeing of the population",
                 kpi: 20,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 10,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
+                ministry: "Ministry of Environment, Forestry and Tourism (MEFT)"
             },
             {
                 key: 5,
@@ -24791,35 +24779,7 @@ var NdcDetailsComponent = function (props) {
                 endDate: new Date("2023-03-25"),
                 nationalPlanObj: "Strengthen the role of the state in guiding and facilitating development",
                 kpi: 10,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 11,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
-            },
-            {
-                key: 13,
-                startDate: new Date("2022-03-25"),
-                endDate: new Date("2023-03-25"),
-                nationalPlanObj: "Other",
-                kpi: 10,
-                ministry: "Ministry of Environment",
-                subNdcDetails: [
-                    {
-                        key: 11,
-                        startDate: new Date("2019-03-25"),
-                        endDate: new Date("2020-03-25"),
-                        nationalPlanObj: "",
-                        kpi: "",
-                        ministry: "",
-                    },
-                ],
+                ministry: "Ministry of Tourism (MoT)"
             },
         ];
         var initialPeriods = [
@@ -24862,11 +24822,7 @@ var NdcDetailsComponent = function (props) {
             React.createElement(Tabs, { centered: false, defaultActiveKey: "1", items: periodItems, activeKey: selectedTab, onChange: onTabChange })),
         selectedTab !== "add_new" && (React.createElement("div", null,
             React.createElement("div", null,
-                React.createElement(Table, { key: tableKey, components: components, rowClassName: function () { return "editable-row"; }, bordered: true, dataSource: getNdcDetailsForPeriod(), columns: columns, expandable: {
-                        expandedRowRender: function (record) { return getSubNdcActionContent(record); },
-                        indentSize: 0,
-                        defaultExpandedRowKeys: [selectedNdcDetail.current.key],
-                    }, footer: function () {
+                React.createElement(Table, { components: components, rowClassName: function () { return "editable-row"; }, bordered: true, dataSource: getNdcDetailsForPeriod(), columns: columns, footer: function () {
                         return isAddNdcActionVisible() && (React.createElement(Row, { justify: "center" },
                             React.createElement(Button, { onClick: onAddNewNdcDetail, type: "default", style: {
                                     marginBottom: 16,
@@ -25528,7 +25484,7 @@ var RejectDocumentationConfirmationModel = function (props) {
                 React.createElement(Button, { className: "mg-left-2", type: "primary", danger: true, htmlType: "submit", loading: loading, disabled: actionInfo.type === "reject" && comment === "" }, "REJECT")))));
 };
 
-var css_248z$2 = ".ndc-action-body {\n  display: flex;\n  flex-direction: column;\n  width: 100%; }\n  .ndc-action-body .report-details {\n    display: flex;\n    flex-direction: row;\n    width: 100%;\n    align-items: center;\n    justify-content: space-between; }\n    .ndc-action-body .report-details .report-type {\n      display: flex;\n      flex-direction: row;\n      width: 60%; }\n      .ndc-action-body .report-details .report-type .name-time-container {\n        display: flex;\n        flex-direction: column;\n        width: 70%;\n        margin-bottom: 0.5rem; }\n      .ndc-action-body .report-details .report-type .name {\n        font-weight: 600;\n        color: rgba(58, 53, 65, 0.8); }\n      .ndc-action-body .report-details .report-type .icon {\n        display: flex;\n        align-items: center;\n        width: 30%; }\n      .ndc-action-body .report-details .report-type .empty {\n        font-weight: 600;\n        color: #cacaca; }\n    .ndc-action-body .report-details .report-link {\n      display: flex;\n      flex-direction: row;\n      width: 40%; }\n      .ndc-action-body .report-details .report-link .version {\n        font-weight: 600;\n        color: #cacaca; }\n      .ndc-action-body .report-details .report-link .link {\n        margin-left: 1rem; }\n";
+var css_248z$2 = ".ndc-action-body {\n  display: flex;\n  flex-direction: column;\n  width: 100%; }\n  .ndc-action-body .report-details {\n    display: flex;\n    flex-direction: row;\n    width: 100%;\n    align-items: center;\n    justify-content: space-between; }\n    .ndc-action-body .report-details .report-type {\n      display: flex;\n      flex-direction: row;\n      width: 60%; }\n      .ndc-action-body .report-details .report-type .name-time-container {\n        display: flex;\n        flex-direction: column;\n        width: 70%;\n        margin-bottom: 0.5rem; }\n      .ndc-action-body .report-details .report-type .name {\n        font-weight: 600;\n        color: rgba(58, 53, 65, 0.8); }\n      .ndc-action-body .report-details .report-type .icon {\n        display: flex;\n        align-items: center;\n        width: 30%; }\n      .ndc-action-body .report-details .report-type .empty {\n        font-weight: 600;\n        color: #cacaca; }\n    .ndc-action-body .report-details .report-link {\n      display: flex;\n      flex-direction: row;\n      width: 40%;\n      align-items: center;\n      justify-content: flex-start;\n      gap: 20px; }\n      .ndc-action-body .report-details .report-link .version {\n        font-weight: 600;\n        color: #cacaca; }\n      .ndc-action-body .report-details .report-link .link {\n        margin-left: 1rem; }\n";
 styleInject(css_248z$2);
 
 var NdcActionBody = function (props) {
@@ -25746,8 +25702,8 @@ var NdcActionBody = function (props) {
                                     : t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: canUploadMonitorReport &&
                                     uploadDocUserPermission(userInfoState, DocType.MONITORING_REPORT, programmeOwnerId, ministryLevelPermission)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     if (canUploadMonitorReport &&
                                         uploadDocUserPermission(userInfoState, DocType.MONITORING_REPORT, programmeOwnerId, ministryLevelPermission)) {
                                         handleFileUploadMonitor();
@@ -25770,8 +25726,8 @@ var NdcActionBody = function (props) {
                                     : t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: canUploadMonitorReport &&
                                     uploadDocUserPermission(userInfoState, DocType.MONITORING_REPORT, programmeOwnerId, ministryLevelPermission)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     if (canUploadMonitorReport &&
                                         uploadDocUserPermission(userInfoState, DocType.MONITORING_REPORT, programmeOwnerId, ministryLevelPermission)) {
                                         handleFileUploadMonitor();
@@ -25820,8 +25776,8 @@ var NdcActionBody = function (props) {
                                     : t("programme:notAuthToUploadDoc"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: monitoringReportAccepted &&
                                     uploadDocUserPermission(userInfoState, DocType.VERIFICATION_REPORT, programmeOwnerId, ministryLevelPermission)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     if (monitoringReportAccepted &&
                                         uploadDocUserPermission(userInfoState, DocType.VERIFICATION_REPORT, programmeOwnerId, ministryLevelPermission)) {
                                         handleFileUploadVerification();
@@ -25844,8 +25800,8 @@ var NdcActionBody = function (props) {
                                     : t("programme:notAuthToUploadDoc"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: monitoringReportAccepted &&
                                     uploadDocUserPermission(userInfoState, DocType.VERIFICATION_REPORT, programmeOwnerId, ministryLevelPermission)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     if (monitoringReportAccepted &&
                                         uploadDocUserPermission(userInfoState, DocType.VERIFICATION_REPORT, programmeOwnerId, ministryLevelPermission)) {
                                         handleFileUploadVerification();
@@ -25859,7 +25815,7 @@ var NdcActionBody = function (props) {
         React.createElement(RejectDocumentationConfirmationModel, { actionInfo: actionInfo, onActionConfirmed: handleOk, onActionCanceled: handleCancel, openModal: openRejectDocConfirmationModal, errorMsg: "", loading: loading, translator: translator })));
 };
 
-var css_248z$1 = ".info-view .title-icon {\n  padding-right: 10px; }\n\n.info-view .title-text {\n  color: rgba(58, 53, 65, 0.8);\n  font-weight: 600; }\n\n.info-view .title {\n  margin-bottom: 5px; }\n\n.info-view .field-key {\n  color: rgba(58, 53, 65, 0.6);\n  font-weight: 500;\n  text-overflow: ellipsis;\n  overflow: hidden; }\n  .info-view .field-key .label-container {\n    display: flex;\n    flex-direction: row; }\n  .info-view .field-key .label {\n    width: 70%; }\n  .info-view .field-key .label-uploaded {\n    color: rgba(58, 53, 65, 0.8);\n    width: 70%; }\n\n.info-view .field-value {\n  color: rgba(58, 53, 65, 0.6);\n  text-overflow: ellipsis;\n  overflow: hidden; }\n  .info-view .field-value .link {\n    display: flex;\n    flex-direction: row; }\n\n.info-view .field {\n  margin: 15px 25px;\n  font-size: 0.8rem; }\n";
+var css_248z$1 = ".info-view .title-icon {\n  padding-right: 10px; }\n\n.info-view .title-text {\n  color: rgba(58, 53, 65, 0.8);\n  font-weight: 600; }\n\n.info-view .title {\n  margin-bottom: 5px; }\n\n.info-view .field-key {\n  color: rgba(58, 53, 65, 0.6);\n  font-weight: 500;\n  text-overflow: ellipsis;\n  overflow: hidden; }\n  .info-view .field-key .label-container {\n    display: flex;\n    flex-direction: row; }\n  .info-view .field-key .label {\n    width: 70%; }\n  .info-view .field-key .label-uploaded {\n    color: rgba(58, 53, 65, 0.8);\n    width: 70%; }\n\n.info-view .field-value {\n  color: rgba(58, 53, 65, 0.6);\n  text-overflow: ellipsis;\n  overflow: hidden; }\n  .info-view .field-value .link {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 20px; }\n\n.info-view .field {\n  margin: 15px 25px;\n  font-size: 0.8rem; }\n";
 styleInject(css_248z$1);
 
 var ProgrammeDocuments = function (props) {
@@ -26126,8 +26082,8 @@ var ProgrammeDocuments = function (props) {
                                     ? t("programme:notAuthToUploadDoc")
                                     : !uploadDocUserPermission(userInfoState, DocType.DESIGN_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                                 React.createElement(FileAddOutlined, { className: "common-progress-icon", style: uploadDocUserPermission(userInfoState, DocType.DESIGN_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus)
-                                        ? { color: "#3F3A47", cursor: "pointer" }
-                                        : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                        ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                        : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                         return uploadDocUserPermission(userInfoState, DocType.DESIGN_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && handleDesignDocFileUpload();
                                     } })),
                             React.createElement("input", { type: "file", ref: fileInputRef, style: { display: "none" }, accept: ".xls, .xlsx, .ppt, .pptx, .csv, .doc, .docx, .pdf, .png, .jpg", onChange: function (e) {
@@ -26140,8 +26096,8 @@ var ProgrammeDocuments = function (props) {
                                 ? t("programme:notAuthToUploadDoc")
                                 : !uploadDocUserPermission(userInfoState, DocType.DESIGN_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: uploadDocUserPermission(userInfoState, DocType.DESIGN_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     return uploadDocUserPermission(userInfoState, DocType.DESIGN_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && handleDesignDocFileUpload();
                                 } })),
                         React.createElement("input", { type: "file", ref: fileInputRef, style: { display: "none" }, accept: ".xls, .xlsx, .ppt, .pptx, .csv, .doc, .docx, .pdf, .png, .jpg", onChange: function (e) {
@@ -26194,8 +26150,8 @@ var ProgrammeDocuments = function (props) {
                                     : !uploadDocUserPermission(userInfoState, DocType.METHODOLOGY_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                                 React.createElement(FileAddOutlined, { className: "common-progress-icon", style: designDocStatus === DocumentStatus.ACCEPTED &&
                                         uploadDocUserPermission(userInfoState, DocType.METHODOLOGY_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus)
-                                        ? { color: "#3F3A47", cursor: "pointer" }
-                                        : { color: "#cacaca" }, onClick: function () {
+                                        ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                        : { color: "#cacaca", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                         return designDocStatus === DocumentStatus.ACCEPTED &&
                                             uploadDocUserPermission(userInfoState, DocType.METHODOLOGY_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) &&
                                             handleMethodologyFileUpload();
@@ -26214,8 +26170,8 @@ var ProgrammeDocuments = function (props) {
                                     : t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: designDocStatus === DocumentStatus.ACCEPTED &&
                                     uploadDocUserPermission(userInfoState, DocType.METHODOLOGY_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     return designDocStatus === DocumentStatus.ACCEPTED &&
                                         uploadDocUserPermission(userInfoState, DocType.METHODOLOGY_DOCUMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) &&
                                         handleMethodologyFileUpload();
@@ -26269,8 +26225,8 @@ var ProgrammeDocuments = function (props) {
                                     ? t("programme:notAuthToUploadDoc")
                                     : !uploadDocUserPermission(userInfoState, DocType.ENVIRONMENTAL_IMPACT_ASSESSMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                                 React.createElement(FileAddOutlined, { className: "common-progress-icon", style: uploadDocUserPermission(userInfoState, DocType.ENVIRONMENTAL_IMPACT_ASSESSMENT, programmeOwnerId, ministryLevelPermission, programmeStatus)
-                                        ? { color: "#3F3A47", cursor: "pointer" }
-                                        : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                        ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                        : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                         return uploadDocUserPermission(userInfoState, DocType.ENVIRONMENTAL_IMPACT_ASSESSMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && handleImpactAssessmentFileUpload();
                                     } })),
                             React.createElement("input", { type: "file", ref: fileInputRefImpactAssessment, style: { display: "none" }, accept: ".doc, .docx, .pdf, .png, .jpg", onChange: function (e) {
@@ -26282,8 +26238,8 @@ var ProgrammeDocuments = function (props) {
                                 ? t("programme:notAuthToUploadDoc")
                                 : !uploadDocUserPermission(userInfoState, DocType.ENVIRONMENTAL_IMPACT_ASSESSMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && t("programme:orgNotAuth"), overlayClassName: "custom-tooltip" },
                             React.createElement(FileAddOutlined, { className: "common-progress-icon", style: uploadDocUserPermission(userInfoState, DocType.ENVIRONMENTAL_IMPACT_ASSESSMENT, programmeOwnerId, ministryLevelPermission, programmeStatus)
-                                    ? { color: "#3F3A47", cursor: "pointer" }
-                                    : { color: "#cacaca", cursor: "default" }, onClick: function () {
+                                    ? { color: "#3F3A47", cursor: "pointer", margin: "0px 0px 2.5px 0px" }
+                                    : { color: "#cacaca", cursor: "default", margin: "0px 0px 2.5px 0px" }, onClick: function () {
                                     return uploadDocUserPermission(userInfoState, DocType.ENVIRONMENTAL_IMPACT_ASSESSMENT, programmeOwnerId, ministryLevelPermission, programmeStatus) && handleImpactAssessmentFileUpload();
                                 } })),
                         React.createElement("input", { type: "file", ref: fileInputRefImpactAssessment, style: { display: "none" }, accept: ".doc, .docx, .pdf, .png, .jpg", onChange: function (e) {