@undp/carbon-library 1.0.140 → 1.0.142

package/dist/esm/index.js

@@ -24498,7 +24498,7 @@ var css_248z$4 = ".steps-actions {\n  display: flex;\n  flex-direction: row-reve
 styleInject(css_248z$4);
 
 var NdcDetailsComponent = function (props) {
-    var t = props.t; props.useConnection;
+    var t = props.t; props.useConnection; var useUserContext = props.useUserContext;
     var RangePicker = DatePicker.RangePicker;
     var _a = useState([]), ndcDetailsData = _a[0], setNdcDetailsData = _a[1];
     var _b = useState(false), loading = _b[0]; _b[1];
@@ -24506,6 +24506,20 @@ var NdcDetailsComponent = function (props) {
     var _c = useState([]), periodItems = _c[0], setPeriodItems = _c[1];
     var _d = useState("add_new"), selectedTab = _d[0], setSelectedTab = _d[1];
     var selectedPeriod = useRef({});
+    var addedNdcDetailId = useRef(0);
+    var userInfoState = useUserContext().userInfoState;
+    var isAddRangeVisible = function () {
+        return (((userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === CompanyRole.MINISTRY ||
+            (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === CompanyRole.GOVERNMENT) &&
+            (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.userRole) !== Role.ViewOnly);
+    };
+    var isAddNdcActionVisible = function () {
+        return ((userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === CompanyRole.GOVERNMENT &&
+            (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.userRole) !== Role.ViewOnly);
+    };
+    var inRange = function (num, min, max) {
+        return num >= min && num <= max;
+    };
     var handleSave = function (row) {
         var newData = __spreadArray([], ndcDetailsData, true);
         var index = newData.findIndex(function (item) { return row.key === item.key; });
@@ -24513,6 +24527,18 @@ var NdcDetailsComponent = function (props) {
         newData.splice(index, 1, __assign(__assign({}, item), row));
         setNdcDetailsData(newData);
     };
+    var getNdcDetailsForPeriod = function () {
+        var range = selectedTab.split("-");
+        if (range.length > 1) {
+            var filteredData = ndcDetailsData.filter(function (item) {
+                return inRange(Number(moment(item.startDate).year()), Number(range[0]), Number(range[1]));
+            });
+            return filteredData;
+        }
+        else {
+            return [];
+        }
+    };
     var defaultColumns = [
         {
             title: t("ndc:ndcColumnsNationalPlanObj"),
@@ -24542,11 +24568,14 @@ var NdcDetailsComponent = function (props) {
             }); } });
     });
     function onAddNewNdcDetail() {
+        var range = selectedTab.split("-");
+        addedNdcDetailId.current = addedNdcDetailId.current + 1;
         var newData = {
-            startDate: new Date("2014-12-24 23:12:00"),
-            endDate: new Date("2014-12-24 23:12:00"),
-            nationalPlanObj: "sample text2",
-            kpi: 34,
+            key: addedNdcDetailId.current,
+            startDate: new Date("".concat(Number(range[0]), "-01-24 23:12:00")),
+            endDate: new Date("".concat(Number(range[0]), "-12-24 23:12:00")),
+            nationalPlanObj: t("ndc:enterNewPlanTxt"),
+            kpi: 0,
         };
         setNdcDetailsData(__spreadArray(__spreadArray([], ndcDetailsData, true), [newData], false));
     }
@@ -24589,7 +24618,10 @@ var NdcDetailsComponent = function (props) {
                 end: selectedPeriod.current.end,
                 children: ndcDetailsTableContent(),
             };
-            var existingIndex = periodItemsRef.current.findIndex(function (item) { return item.start === newPeriodItem_1.start || item.end === newPeriodItem_1.end; });
+            var existingIndex = periodItemsRef.current.findIndex(function (item) {
+                return inRange(newPeriodItem_1.start, item.start, item.end) ||
+                    inRange(newPeriodItem_1.end, item.start, item.end);
+            });
             if (existingIndex === -1) {
                 setPeriodItems(function (items) { return __spreadArray(__spreadArray([], items, true), [newPeriodItem_1], false); });
                 periodItemsRef.current = __spreadArray(__spreadArray([], periodItemsRef.current, true), [newPeriodItem_1], false);
@@ -24631,31 +24663,69 @@ var NdcDetailsComponent = function (props) {
     useEffect(function () {
         var defaultNdcDetails = [
             {
+                key: 1,
+                startDate: new Date("2019-03-25"),
+                endDate: new Date("2020-03-25"),
+                nationalPlanObj: "Enhance value addition in key growth opportunities",
+                kpi: 25,
+            },
+            {
+                key: 2,
+                startDate: new Date("2019-03-25"),
+                endDate: new Date("2019-08-25"),
+                nationalPlanObj: "Strengthen the private sector to create 10,000 jobs",
+                kpi: 10500,
+            },
+            {
+                key: 3,
+                startDate: new Date("2021-03-25"),
+                endDate: new Date("2022-03-25"),
+                nationalPlanObj: "Consolidate and increase the stock and quality of productive infrastructure by 50%",
+                kpi: 48,
+            },
+            {
+                key: 4,
+                startDate: new Date("2022-03-25"),
+                endDate: new Date("2022-05-25"),
+                nationalPlanObj: "Enhance the productivity and social wellbeing of the population",
+                kpi: 20,
+            },
+            {
+                key: 5,
                 startDate: new Date("2022-03-25"),
                 endDate: new Date("2023-03-25"),
-                nationalPlanObj: "sample text1",
-                kpi: 23,
+                nationalPlanObj: "Strengthen the role of the state in guiding and facilitating development",
+                kpi: 10,
             },
+        ];
+        var initialPeriods = [
             {
-                startDate: new Date("2023-03-25"),
-                endDate: new Date("2024-03-25"),
-                nationalPlanObj: "sample text2",
-                kpi: 34,
+                key: "2019-2020",
+                label: "2019-2020",
+                start: 2019,
+                end: 2020,
+                children: ndcDetailsTableContent(),
             },
             {
-                startDate: new Date("2024-03-25"),
-                endDate: new Date("2025-03-25"),
-                nationalPlanObj: "sample text3",
-                kpi: 25,
+                key: "2021-2023",
+                label: "2021-2023",
+                start: 2021,
+                end: 2021,
+                children: ndcDetailsTableContent(),
             },
         ];
-        var addNewItem = {
-            key: "add_new",
-            label: "Add New",
-            children: addNewPeriodContent(),
-        };
-        setPeriodItems([addNewItem]);
-        periodItemsRef.current = [addNewItem];
+        if (isAddRangeVisible()) {
+            initialPeriods.unshift({
+                key: "add_new",
+                label: "Add New",
+                start: 0,
+                end: 0,
+                children: addNewPeriodContent(),
+            });
+        }
+        addedNdcDetailId.current = 5;
+        setPeriodItems(initialPeriods);
+        periodItemsRef.current = initialPeriods;
         setNdcDetailsData(defaultNdcDetails);
     }, []);
     return (React.createElement("div", { className: "ndc-management content-container" },
@@ -24668,11 +24738,13 @@ 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, { components: components, rowClassName: function () { return "editable-row"; }, bordered: true, dataSource: ndcDetailsData, columns: columns, footer: function () { return (React.createElement(Row, { justify: "center" },
-                        React.createElement(Button, { onClick: onAddNewNdcDetail, type: "default", style: {
-                                marginBottom: 16,
-                                width: '100%'
-                            } }, t("ndc:addNdcAction")))); } }))))));
+                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,
+                                    width: "100%",
+                                } }, t("ndc:addNdcAction"))));
+                    } }))))));
 };
 
 var ImgWithFallback = function (_a) {