@undp/carbon-library 1.0.140 → 1.0.142

Sign up to get free protection for your applications and to get access to all the features.
package/dist/cjs/index.js CHANGED
@@ -24518,7 +24518,7 @@ var css_248z$4 = ".steps-actions {\n display: flex;\n flex-direction: row-reve
24518
24518
  styleInject(css_248z$4);
24519
24519
 
24520
24520
  var NdcDetailsComponent = function (props) {
24521
- var t = props.t; props.useConnection;
24521
+ var t = props.t; props.useConnection; var useUserContext = props.useUserContext;
24522
24522
  var RangePicker = antd.DatePicker.RangePicker;
24523
24523
  var _a = React.useState([]), ndcDetailsData = _a[0], setNdcDetailsData = _a[1];
24524
24524
  var _b = React.useState(false), loading = _b[0]; _b[1];
@@ -24526,6 +24526,20 @@ var NdcDetailsComponent = function (props) {
24526
24526
  var _c = React.useState([]), periodItems = _c[0], setPeriodItems = _c[1];
24527
24527
  var _d = React.useState("add_new"), selectedTab = _d[0], setSelectedTab = _d[1];
24528
24528
  var selectedPeriod = React.useRef({});
24529
+ var addedNdcDetailId = React.useRef(0);
24530
+ var userInfoState = useUserContext().userInfoState;
24531
+ var isAddRangeVisible = function () {
24532
+ return (((userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === exports.CompanyRole.MINISTRY ||
24533
+ (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === exports.CompanyRole.GOVERNMENT) &&
24534
+ (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.userRole) !== exports.Role.ViewOnly);
24535
+ };
24536
+ var isAddNdcActionVisible = function () {
24537
+ return ((userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.companyRole) === exports.CompanyRole.GOVERNMENT &&
24538
+ (userInfoState === null || userInfoState === void 0 ? void 0 : userInfoState.userRole) !== exports.Role.ViewOnly);
24539
+ };
24540
+ var inRange = function (num, min, max) {
24541
+ return num >= min && num <= max;
24542
+ };
24529
24543
  var handleSave = function (row) {
24530
24544
  var newData = __spreadArray([], ndcDetailsData, true);
24531
24545
  var index = newData.findIndex(function (item) { return row.key === item.key; });
@@ -24533,6 +24547,18 @@ var NdcDetailsComponent = function (props) {
24533
24547
  newData.splice(index, 1, __assign(__assign({}, item), row));
24534
24548
  setNdcDetailsData(newData);
24535
24549
  };
24550
+ var getNdcDetailsForPeriod = function () {
24551
+ var range = selectedTab.split("-");
24552
+ if (range.length > 1) {
24553
+ var filteredData = ndcDetailsData.filter(function (item) {
24554
+ return inRange(Number(moment(item.startDate).year()), Number(range[0]), Number(range[1]));
24555
+ });
24556
+ return filteredData;
24557
+ }
24558
+ else {
24559
+ return [];
24560
+ }
24561
+ };
24536
24562
  var defaultColumns = [
24537
24563
  {
24538
24564
  title: t("ndc:ndcColumnsNationalPlanObj"),
@@ -24562,11 +24588,14 @@ var NdcDetailsComponent = function (props) {
24562
24588
  }); } });
24563
24589
  });
24564
24590
  function onAddNewNdcDetail() {
24591
+ var range = selectedTab.split("-");
24592
+ addedNdcDetailId.current = addedNdcDetailId.current + 1;
24565
24593
  var newData = {
24566
- startDate: new Date("2014-12-24 23:12:00"),
24567
- endDate: new Date("2014-12-24 23:12:00"),
24568
- nationalPlanObj: "sample text2",
24569
- kpi: 34,
24594
+ key: addedNdcDetailId.current,
24595
+ startDate: new Date("".concat(Number(range[0]), "-01-24 23:12:00")),
24596
+ endDate: new Date("".concat(Number(range[0]), "-12-24 23:12:00")),
24597
+ nationalPlanObj: t("ndc:enterNewPlanTxt"),
24598
+ kpi: 0,
24570
24599
  };
24571
24600
  setNdcDetailsData(__spreadArray(__spreadArray([], ndcDetailsData, true), [newData], false));
24572
24601
  }
@@ -24609,7 +24638,10 @@ var NdcDetailsComponent = function (props) {
24609
24638
  end: selectedPeriod.current.end,
24610
24639
  children: ndcDetailsTableContent(),
24611
24640
  };
24612
- var existingIndex = periodItemsRef.current.findIndex(function (item) { return item.start === newPeriodItem_1.start || item.end === newPeriodItem_1.end; });
24641
+ var existingIndex = periodItemsRef.current.findIndex(function (item) {
24642
+ return inRange(newPeriodItem_1.start, item.start, item.end) ||
24643
+ inRange(newPeriodItem_1.end, item.start, item.end);
24644
+ });
24613
24645
  if (existingIndex === -1) {
24614
24646
  setPeriodItems(function (items) { return __spreadArray(__spreadArray([], items, true), [newPeriodItem_1], false); });
24615
24647
  periodItemsRef.current = __spreadArray(__spreadArray([], periodItemsRef.current, true), [newPeriodItem_1], false);
@@ -24651,31 +24683,69 @@ var NdcDetailsComponent = function (props) {
24651
24683
  React.useEffect(function () {
24652
24684
  var defaultNdcDetails = [
24653
24685
  {
24686
+ key: 1,
24687
+ startDate: new Date("2019-03-25"),
24688
+ endDate: new Date("2020-03-25"),
24689
+ nationalPlanObj: "Enhance value addition in key growth opportunities",
24690
+ kpi: 25,
24691
+ },
24692
+ {
24693
+ key: 2,
24694
+ startDate: new Date("2019-03-25"),
24695
+ endDate: new Date("2019-08-25"),
24696
+ nationalPlanObj: "Strengthen the private sector to create 10,000 jobs",
24697
+ kpi: 10500,
24698
+ },
24699
+ {
24700
+ key: 3,
24701
+ startDate: new Date("2021-03-25"),
24702
+ endDate: new Date("2022-03-25"),
24703
+ nationalPlanObj: "Consolidate and increase the stock and quality of productive infrastructure by 50%",
24704
+ kpi: 48,
24705
+ },
24706
+ {
24707
+ key: 4,
24708
+ startDate: new Date("2022-03-25"),
24709
+ endDate: new Date("2022-05-25"),
24710
+ nationalPlanObj: "Enhance the productivity and social wellbeing of the population",
24711
+ kpi: 20,
24712
+ },
24713
+ {
24714
+ key: 5,
24654
24715
  startDate: new Date("2022-03-25"),
24655
24716
  endDate: new Date("2023-03-25"),
24656
- nationalPlanObj: "sample text1",
24657
- kpi: 23,
24717
+ nationalPlanObj: "Strengthen the role of the state in guiding and facilitating development",
24718
+ kpi: 10,
24658
24719
  },
24720
+ ];
24721
+ var initialPeriods = [
24659
24722
  {
24660
- startDate: new Date("2023-03-25"),
24661
- endDate: new Date("2024-03-25"),
24662
- nationalPlanObj: "sample text2",
24663
- kpi: 34,
24723
+ key: "2019-2020",
24724
+ label: "2019-2020",
24725
+ start: 2019,
24726
+ end: 2020,
24727
+ children: ndcDetailsTableContent(),
24664
24728
  },
24665
24729
  {
24666
- startDate: new Date("2024-03-25"),
24667
- endDate: new Date("2025-03-25"),
24668
- nationalPlanObj: "sample text3",
24669
- kpi: 25,
24730
+ key: "2021-2023",
24731
+ label: "2021-2023",
24732
+ start: 2021,
24733
+ end: 2021,
24734
+ children: ndcDetailsTableContent(),
24670
24735
  },
24671
24736
  ];
24672
- var addNewItem = {
24673
- key: "add_new",
24674
- label: "Add New",
24675
- children: addNewPeriodContent(),
24676
- };
24677
- setPeriodItems([addNewItem]);
24678
- periodItemsRef.current = [addNewItem];
24737
+ if (isAddRangeVisible()) {
24738
+ initialPeriods.unshift({
24739
+ key: "add_new",
24740
+ label: "Add New",
24741
+ start: 0,
24742
+ end: 0,
24743
+ children: addNewPeriodContent(),
24744
+ });
24745
+ }
24746
+ addedNdcDetailId.current = 5;
24747
+ setPeriodItems(initialPeriods);
24748
+ periodItemsRef.current = initialPeriods;
24679
24749
  setNdcDetailsData(defaultNdcDetails);
24680
24750
  }, []);
24681
24751
  return (React.createElement("div", { className: "ndc-management content-container" },
@@ -24688,11 +24758,13 @@ var NdcDetailsComponent = function (props) {
24688
24758
  React.createElement(antd.Tabs, { centered: false, defaultActiveKey: "1", items: periodItems, activeKey: selectedTab, onChange: onTabChange })),
24689
24759
  selectedTab !== "add_new" && (React.createElement("div", null,
24690
24760
  React.createElement("div", null,
24691
- React.createElement(antd.Table, { components: components, rowClassName: function () { return "editable-row"; }, bordered: true, dataSource: ndcDetailsData, columns: columns, footer: function () { return (React.createElement(antd.Row, { justify: "center" },
24692
- React.createElement(antd.Button, { onClick: onAddNewNdcDetail, type: "default", style: {
24693
- marginBottom: 16,
24694
- width: '100%'
24695
- } }, t("ndc:addNdcAction")))); } }))))));
24761
+ React.createElement(antd.Table, { components: components, rowClassName: function () { return "editable-row"; }, bordered: true, dataSource: getNdcDetailsForPeriod(), columns: columns, footer: function () {
24762
+ return isAddNdcActionVisible() && (React.createElement(antd.Row, { justify: "center" },
24763
+ React.createElement(antd.Button, { onClick: onAddNewNdcDetail, type: "default", style: {
24764
+ marginBottom: 16,
24765
+ width: "100%",
24766
+ } }, t("ndc:addNdcAction"))));
24767
+ } }))))));
24696
24768
  };
24697
24769
 
24698
24770
  var ImgWithFallback = function (_a) {