@kartverket/backstage-plugin-risk-scorecard 1.0.9 → 1.0.10

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.
@@ -1,9 +1,9 @@
1
- import React, { useState, useEffect, createContext, useContext, Fragment, useRef } from 'react';
1
+ import React, { useState, useEffect, useCallback, createContext, useContext, Fragment, useRef } from 'react';
2
2
  import { makeStyles, FormControl, FormLabel, FormHelperText, TextField as TextField$1, Grid, Typography, Box as Box$1, Paper, Button, Radio, CircularProgress, Dialog, DialogTitle, DialogActions, Stepper, Step, StepButton, Divider as Divider$1, Drawer, List, ListSubheader, ListItem, ListItemText as ListItemText$1, ClickAwayListener, Tooltip, DialogContent, DialogContentText, IconButton, Tab } from '@material-ui/core';
3
3
  import { InfoCard, ContentHeader } from '@backstage/core-components';
4
4
  import { useEntity } from '@backstage/plugin-catalog-react';
5
5
  import { useRouteRef, useApi, googleAuthApiRef, identityApiRef, fetchApiRef, configApiRef } from '@backstage/core-plugin-api';
6
- import { s as scenarioRouteRef, r as riScRouteRef, p as pluginRiScTranslationRef } from './index-558ec32a.esm.js';
6
+ import { s as scenarioRouteRef, r as riScRouteRef, p as pluginRiScTranslationRef } from './index-aa781c2b.esm.js';
7
7
  import { useNavigate, useLocation, useParams } from 'react-router';
8
8
  import { useEffectOnce } from 'react-use';
9
9
  import { useSearchParams, Routes, Route } from 'react-router-dom';
@@ -25,8 +25,9 @@ import { LocalizationProvider, DatePicker } from '@mui/x-date-pickers';
25
25
  import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFnsV3';
26
26
  import { nb } from 'date-fns/locale/nb';
27
27
  import Button$1 from '@mui/material/Button';
28
- import { KeyboardArrowLeft, KeyboardArrowRight } from '@material-ui/icons';
29
28
  import Alert from '@mui/material/Alert';
29
+ import KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight';
30
+ import KeyboardArrowLeft from '@material-ui/icons/KeyboardArrowLeft';
30
31
  import Box$2 from '@mui/material/Box';
31
32
  import KeyboardDoubleArrowRightIcon from '@mui/icons-material/KeyboardDoubleArrowRight';
32
33
  import EditIcon from '@mui/icons-material/Edit';
@@ -470,19 +471,24 @@ const requiresNewApproval = (oldRiSc, updatedRiSc) => {
470
471
  return requiresApproval;
471
472
  };
472
473
  function formatNumber(cost, t) {
473
- if (cost < 1e4) {
474
- return formatNOK(cost);
475
- } else {
476
- let { threshold, unit } = [
477
- { threshold: 1e6, unit: "thousand" },
478
- { threshold: 1e9, unit: "million" },
479
- { threshold: 1e12, unit: "billion" },
480
- { threshold: 1e15, unit: "trillion" }
481
- ].find(({ threshold: threshold2 }) => cost < threshold2);
474
+ function getTranslationWithCorrectUnit(costValue, threshold, unit) {
482
475
  return t(`riskMatrix.estimatedRisk.suffix.${unit}`, {
483
- count: Number((cost / threshold * 1e3).toFixed(0))
476
+ count: Number((costValue / threshold * 1e3).toFixed(0))
484
477
  });
485
478
  }
479
+ if (cost < 1e4) {
480
+ return formatNOK(cost);
481
+ }
482
+ if (cost < 1e6) {
483
+ return getTranslationWithCorrectUnit(cost, 1e6, "thousand");
484
+ }
485
+ if (cost < 1e9) {
486
+ return getTranslationWithCorrectUnit(cost, 1e9, "million");
487
+ }
488
+ if (cost < 1e12) {
489
+ return getTranslationWithCorrectUnit(cost, 1e12, "billion");
490
+ }
491
+ return getTranslationWithCorrectUnit(cost, 1e15, "trillion");
486
492
  }
487
493
 
488
494
  function dtoToRiSc(riScDTO) {
@@ -749,7 +755,7 @@ const useScenarioDrawer = (riSc, updateRiSc, scenarioIdFromParams) => {
749
755
  setOriginalScenario(selectedScenario);
750
756
  setScenarioDrawerState(2 /* View */);
751
757
  }
752
- }, [riSc, scenarioIdFromParams]);
758
+ }, [getRiScPath, isNewScenario, navigate, riSc, scenarioIdFromParams, setSearchParams]);
753
759
  const openScenario = (id) => {
754
760
  if (riSc) {
755
761
  navigate(getScenarioPath({ riScId: riSc.id, scenarioId: id }));
@@ -943,7 +949,7 @@ const useFetchRiScs = (riScIdFromParams) => {
943
949
  status: ProcessingStatus.ErrorWhenFetchingRiScs
944
950
  });
945
951
  }
946
- }, [location]);
952
+ }, [location, setResponse]);
947
953
  useEffectOnce(() => {
948
954
  fetchRiScs(
949
955
  (res) => {
@@ -983,11 +989,13 @@ const useFetchRiScs = (riScIdFromParams) => {
983
989
  }
984
990
  }
985
991
  }, [riScs, riScIdFromParams]);
986
- const resetRiScStatus = () => setUpdateRiScStatus({
987
- isLoading: false,
988
- isSuccess: false,
989
- isError: false
990
- });
992
+ const resetRiScStatus = useCallback(() => {
993
+ setUpdateRiScStatus({
994
+ isLoading: false,
995
+ isSuccess: false,
996
+ isError: false
997
+ });
998
+ }, []);
991
999
  const selectRiSc = (title) => {
992
1000
  var _a;
993
1001
  const riScId = (_a = riScs == null ? void 0 : riScs.find((riSc) => riSc.content.title === title)) == null ? void 0 : _a.id;
@@ -1542,6 +1550,7 @@ const ActionsStep = () => {
1542
1550
  )), /* @__PURE__ */ React.createElement(Typography, { variant: "h6", className: actionSubtitle }, t("scenarioDrawer.measureTab.plannedMeasures")), scenario.actions.map((action, index) => /* @__PURE__ */ React.createElement(
1543
1551
  ActionEdit,
1544
1552
  {
1553
+ key: action.ID,
1545
1554
  action,
1546
1555
  index: index + 1,
1547
1556
  updateAction,
@@ -1663,11 +1672,11 @@ const RiskStep = ({ riskType, restEqualsInitial }) => {
1663
1672
  useEffect(() => {
1664
1673
  if (restEqualsInitial)
1665
1674
  setRemainingConsequence(getConsequenceLevel(scenario.risk));
1666
- }, [scenario.risk.consequence]);
1675
+ }, [restEqualsInitial, scenario.risk, scenario.risk.consequence, setRemainingConsequence]);
1667
1676
  useEffect(() => {
1668
1677
  if (restEqualsInitial)
1669
1678
  setRemainingProbability(getProbabilityLevel(scenario.risk));
1670
- }, [scenario.risk.probability]);
1679
+ }, [restEqualsInitial, scenario.risk, scenario.risk.probability, setRemainingProbability]);
1671
1680
  const setC = riskType === "initial" ? setConsequence : setRemainingConsequence;
1672
1681
  const setP = riskType === "initial" ? setProbability : setRemainingProbability;
1673
1682
  return /* @__PURE__ */ React.createElement(Fragment, null, /* @__PURE__ */ React.createElement(Box, { className: box }, /* @__PURE__ */ React.createElement(Typography, { className: h2 }, t(`scenarioStepper.${resourceKey}.title`)), /* @__PURE__ */ React.createElement(Typography, { className: subtitle2 }, t(`scenarioStepper.${resourceKey}.subtitle`))), /* @__PURE__ */ React.createElement(Box, { className: box }, /* @__PURE__ */ React.createElement(Typography, { className: h3 }, t("dictionary.probability")), /* @__PURE__ */ React.createElement(Typography, { className: subtitle2 }, t(`scenarioStepper.${resourceKey}.probabilitySubtitle`))), /* @__PURE__ */ React.createElement(Box, { className: box }, /* @__PURE__ */ React.createElement(
@@ -1736,7 +1745,7 @@ const CloseConfirmation = ({
1736
1745
  return /* @__PURE__ */ React.createElement(Dialog, { open: isOpen }, /* @__PURE__ */ React.createElement(DialogTitle, null, t("scenarioDrawer.closeConfirmation")), /* @__PURE__ */ React.createElement(DialogActions, null, /* @__PURE__ */ React.createElement(Button, { style: { textTransform: "none" }, onClick: close }, t("dictionary.discardChanges")), /* @__PURE__ */ React.createElement(Button, { style: { textTransform: "none" }, onClick: save }, t("dictionary.save"))));
1737
1746
  };
1738
1747
 
1739
- const ScenarioWizardSteps = [
1748
+ const scenarioWizardSteps = [
1740
1749
  "scenario",
1741
1750
  "initialRisk",
1742
1751
  "measure",
@@ -1775,6 +1784,10 @@ const ScenarioWizard = ({
1775
1784
  if (step === "restRisk")
1776
1785
  setRestEqualsInitial(false);
1777
1786
  }, [step]);
1787
+ const close = useCallback(() => {
1788
+ closeScenario();
1789
+ setShowCloseConfirmation(false);
1790
+ }, [closeScenario]);
1778
1791
  useEffect(() => {
1779
1792
  if (updateStatus.isSuccess) {
1780
1793
  close();
@@ -1782,11 +1795,7 @@ const ScenarioWizard = ({
1782
1795
  setShowCloseConfirmation(false);
1783
1796
  wizardRef.current.scrollIntoView({ behavior: "smooth", block: "end" });
1784
1797
  }
1785
- }, [updateStatus]);
1786
- const close = () => {
1787
- closeScenario();
1788
- setShowCloseConfirmation(false);
1789
- };
1798
+ }, [close, updateStatus]);
1790
1799
  const saveAndClose = () => {
1791
1800
  saveScenario();
1792
1801
  };
@@ -1800,32 +1809,32 @@ const ScenarioWizard = ({
1800
1809
  const nextStep = () => {
1801
1810
  const isValidScenario = validateScenario();
1802
1811
  if (isValidScenario) {
1803
- const currentIndex = ScenarioWizardSteps.indexOf(step);
1804
- if (currentIndex < ScenarioWizardSteps.length - 1) {
1805
- editScenario(ScenarioWizardSteps[currentIndex + 1]);
1812
+ const currentIndex = scenarioWizardSteps.indexOf(step);
1813
+ if (currentIndex < scenarioWizardSteps.length - 1) {
1814
+ editScenario(scenarioWizardSteps[currentIndex + 1]);
1806
1815
  }
1807
1816
  }
1808
1817
  };
1809
1818
  const previousStep = () => {
1810
- const currentIndex = ScenarioWizardSteps.indexOf(step);
1819
+ const currentIndex = scenarioWizardSteps.indexOf(step);
1811
1820
  if (currentIndex > 0) {
1812
- editScenario(ScenarioWizardSteps[currentIndex - 1]);
1821
+ editScenario(scenarioWizardSteps[currentIndex - 1]);
1813
1822
  }
1814
1823
  };
1815
1824
  const isFirstStep = () => {
1816
- return ScenarioWizardSteps.indexOf(step) === 0;
1825
+ return scenarioWizardSteps.indexOf(step) === 0;
1817
1826
  };
1818
1827
  const isLastStep = () => {
1819
- return ScenarioWizardSteps.indexOf(step) === ScenarioWizardSteps.length - 1;
1828
+ return scenarioWizardSteps.indexOf(step) === scenarioWizardSteps.length - 1;
1820
1829
  };
1821
1830
  return /* @__PURE__ */ React.createElement("div", { ref: wizardRef }, /* @__PURE__ */ React.createElement(Box, { className: root }, /* @__PURE__ */ React.createElement(Box, { className: container }, /* @__PURE__ */ React.createElement(Box, { className: header }, /* @__PURE__ */ React.createElement(Typography, { className: h1 }, t("scenarioDrawer.title")), /* @__PURE__ */ React.createElement(Button$1, { variant: "outlined", onClick: handleCloseStepper }, t("dictionary.cancel"))), /* @__PURE__ */ React.createElement(
1822
1831
  Stepper,
1823
1832
  {
1824
1833
  className: stepper,
1825
- activeStep: ScenarioWizardSteps.indexOf(step),
1834
+ activeStep: scenarioWizardSteps.indexOf(step),
1826
1835
  alternativeLabel: true
1827
1836
  },
1828
- ScenarioWizardSteps.map((wizardStep) => /* @__PURE__ */ React.createElement(Step, { key: wizardStep, completed: false }, /* @__PURE__ */ React.createElement(
1837
+ scenarioWizardSteps.map((wizardStep) => /* @__PURE__ */ React.createElement(Step, { key: wizardStep, completed: false }, /* @__PURE__ */ React.createElement(
1829
1838
  StepButton,
1830
1839
  {
1831
1840
  disabled: false,
@@ -1840,16 +1849,16 @@ const ScenarioWizard = ({
1840
1849
  " "
1841
1850
  )))
1842
1851
  ), /* @__PURE__ */ React.createElement(Divider, null), isFetching ? /* @__PURE__ */ React.createElement(Spinner, { size: 80 }) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Box, { className: steps }, {
1843
- [ScenarioWizardSteps[0]]: /* @__PURE__ */ React.createElement(ScenarioStep, null),
1844
- [ScenarioWizardSteps[1]]: /* @__PURE__ */ React.createElement(
1852
+ [scenarioWizardSteps[0]]: /* @__PURE__ */ React.createElement(ScenarioStep, null),
1853
+ [scenarioWizardSteps[1]]: /* @__PURE__ */ React.createElement(
1845
1854
  RiskStep,
1846
1855
  {
1847
1856
  riskType: "initial",
1848
1857
  restEqualsInitial
1849
1858
  }
1850
1859
  ),
1851
- [ScenarioWizardSteps[2]]: /* @__PURE__ */ React.createElement(ActionsStep, null),
1852
- [ScenarioWizardSteps[3]]: /* @__PURE__ */ React.createElement(RiskStep, { riskType: "rest" })
1860
+ [scenarioWizardSteps[2]]: /* @__PURE__ */ React.createElement(ActionsStep, null),
1861
+ [scenarioWizardSteps[3]]: /* @__PURE__ */ React.createElement(RiskStep, { riskType: "rest" })
1853
1862
  }[step]), updateStatus.isError && /* @__PURE__ */ React.createElement(Alert, { style: { marginBottom: "1rem" }, severity: "error" }, /* @__PURE__ */ React.createElement(Typography, null, t("dictionary.saveError"))), /* @__PURE__ */ React.createElement(
1854
1863
  Box,
1855
1864
  {
@@ -2497,19 +2506,19 @@ const RiskMatrix = ({ riSc }) => {
2497
2506
  riSc,
2498
2507
  initialRisk: tab === "initialRisk" /* initialRisk */
2499
2508
  }
2500
- )), /* @__PURE__ */ React.createElement(Box$2, { className: gridWrapper }, /* @__PURE__ */ React.createElement(Box$2, { className: grid }, /* @__PURE__ */ React.createElement(Box$2, { className: konsekvens }, /* @__PURE__ */ React.createElement(Typography, { className: `${centered} ${label2}` }, t("dictionary.consequence"))), riskMatrix.map((_, row) => /* @__PURE__ */ React.createElement(Fragment, { key: row }, /* @__PURE__ */ React.createElement(Box$2, { className: centered }, /* @__PURE__ */ React.createElement(Typography, { className: text }, 5 - row)), riskMatrix[0].map((_2, col) => /* @__PURE__ */ React.createElement(
2509
+ )), /* @__PURE__ */ React.createElement(Box$2, { className: gridWrapper }, /* @__PURE__ */ React.createElement(Box$2, { className: grid }, /* @__PURE__ */ React.createElement(Box$2, { className: konsekvens }, /* @__PURE__ */ React.createElement(Typography, { className: `${centered} ${label2}` }, t("dictionary.consequence"))), riskMatrix.map((row, rowIndex) => /* @__PURE__ */ React.createElement(Fragment, { key: rowIndex }, /* @__PURE__ */ React.createElement(Box$2, { className: centered }, /* @__PURE__ */ React.createElement(Typography, { className: text }, 5 - rowIndex)), row.map((col, colIndex) => /* @__PURE__ */ React.createElement(
2501
2510
  Box$2,
2502
2511
  {
2503
2512
  className: `${square} ${centered}`,
2504
- style: { backgroundColor: riskMatrix[row][col] },
2505
- key: col
2513
+ style: { backgroundColor: col },
2514
+ key: colIndex
2506
2515
  },
2507
2516
  /* @__PURE__ */ React.createElement(
2508
2517
  RiskMatrixScenarioCount,
2509
2518
  {
2510
2519
  riSc,
2511
- probability: col,
2512
- consequence: 4 - row,
2520
+ probability: colIndex,
2521
+ consequence: 4 - rowIndex,
2513
2522
  initialRisk: tab === "initialRisk" /* initialRisk */
2514
2523
  }
2515
2524
  )
@@ -2521,7 +2530,9 @@ const useTableStyles = makeStyles((theme) => ({
2521
2530
  display: "flex",
2522
2531
  alignItems: "center",
2523
2532
  justifyContent: "center",
2524
- padding: theme.spacing(1)
2533
+ padding: theme.spacing(1),
2534
+ width: theme.spacing(1),
2535
+ height: theme.spacing(1)
2525
2536
  },
2526
2537
  rowBackground: {
2527
2538
  display: "flex",
@@ -2530,7 +2541,8 @@ const useTableStyles = makeStyles((theme) => ({
2530
2541
  border: "none",
2531
2542
  padding: 0,
2532
2543
  "&.MuiTableRow-root": {
2533
- backgroundColor: theme.palette.type === "dark" ? "#424242" : "white"
2544
+ backgroundColor: theme.palette.type === "dark" ? "#424242" : "white",
2545
+ border: "none"
2534
2546
  },
2535
2547
  transition: "background-color 0.3s",
2536
2548
  "&:hover": {
@@ -2546,15 +2558,37 @@ const useTableStyles = makeStyles((theme) => ({
2546
2558
  rowBorder: {
2547
2559
  display: "flex",
2548
2560
  alignItems: "center",
2549
- borderBottom: theme.palette.type === "dark" ? "1px solid #616161" : "1px solid #0000001f"
2561
+ "&.MuiTableRow-root": {
2562
+ borderBottom: theme.palette.type === "dark" ? "1px solid #616161" : "1px solid #0000001f"
2563
+ }
2550
2564
  },
2551
2565
  tableCell: {
2566
+ minWidth: "120px",
2567
+ padding: "20px 10px 20px 16px",
2568
+ width: "15%",
2569
+ gap: "0.4rem",
2570
+ "&.MuiTableCell-root": {
2571
+ fontSize: theme.spacing(2),
2572
+ color: theme.palette.type === "dark" ? "#F8F8F8" : "rgba(0, 0, 0, 0.87)",
2573
+ border: "none"
2574
+ }
2575
+ },
2576
+ tableCellTitle: {
2552
2577
  display: "flex",
2553
- width: "20%",
2554
2578
  minWidth: "120px",
2555
2579
  padding: "20px 10px 20px 16px",
2556
2580
  gap: "0.4rem",
2557
- fontSize: theme.spacing(2)
2581
+ width: "55%",
2582
+ "&.MuiTableCell-root": {
2583
+ fontSize: theme.spacing(2),
2584
+ color: theme.palette.type === "dark" ? "#F8F8F8" : "rgba(0, 0, 0, 0.87)",
2585
+ border: "none"
2586
+ }
2587
+ },
2588
+ tableCellContainer: {
2589
+ display: "flex",
2590
+ gap: theme.spacing(1),
2591
+ alignItems: "center"
2558
2592
  }
2559
2593
  }));
2560
2594
 
@@ -2564,7 +2598,14 @@ const ScenarioTableRow = ({
2564
2598
  isLastRow
2565
2599
  }) => {
2566
2600
  const { t } = useTranslationRef(pluginRiScTranslationRef);
2567
- const { riskColor, rowBackground, rowBorder, tableCell } = useTableStyles();
2601
+ const {
2602
+ riskColor,
2603
+ rowBackground,
2604
+ rowBorder,
2605
+ tableCell,
2606
+ tableCellTitle,
2607
+ tableCellContainer
2608
+ } = useTableStyles();
2568
2609
  const remainingActions = scenario.actions.filter(
2569
2610
  (a) => a.status !== "Completed"
2570
2611
  );
@@ -2574,18 +2615,8 @@ const ScenarioTableRow = ({
2574
2615
  className: `${isLastRow ? void 0 : rowBorder} ${rowBackground}`,
2575
2616
  onClick: () => viewRow(scenario.ID)
2576
2617
  },
2577
- /* @__PURE__ */ React.createElement(
2578
- TableCell,
2579
- {
2580
- className: tableCell,
2581
- style: {
2582
- width: "40%",
2583
- minWidth: "200px"
2584
- }
2585
- },
2586
- /* @__PURE__ */ React.createElement(Typography, { color: "primary", style: { fontWeight: 600 } }, scenario.title)
2587
- ),
2588
- /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement(
2618
+ /* @__PURE__ */ React.createElement(TableCell, { className: tableCellTitle }, /* @__PURE__ */ React.createElement(Typography, { color: "primary", style: { fontWeight: 600 } }, scenario.title)),
2619
+ /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement("div", { className: tableCellContainer }, /* @__PURE__ */ React.createElement(
2589
2620
  Paper,
2590
2621
  {
2591
2622
  className: riskColor,
@@ -2593,9 +2624,9 @@ const ScenarioTableRow = ({
2593
2624
  backgroundColor: getRiskMatrixColor(scenario.risk)
2594
2625
  }
2595
2626
  }
2596
- ), t("scenarioTable.columns.probabilityChar"), ":", getProbabilityLevel(scenario.risk), " ", t("scenarioTable.columns.consequenceChar"), ":", getConsequenceLevel(scenario.risk)),
2597
- /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, remainingActions.length > 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, remainingActions.length, " ", t("dictionary.planned").toLowerCase()) : t("dictionary.completed")),
2598
- /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement(
2627
+ ), t("scenarioTable.columns.probabilityChar"), ":", getProbabilityLevel(scenario.risk), " ", t("scenarioTable.columns.consequenceChar"), ":", getConsequenceLevel(scenario.risk))),
2628
+ /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement("div", { className: tableCellContainer }, remainingActions.length > 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, remainingActions.length, " ", t("dictionary.planned").toLowerCase()) : t("dictionary.completed"))),
2629
+ /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement("div", { className: tableCellContainer }, /* @__PURE__ */ React.createElement(
2599
2630
  Paper,
2600
2631
  {
2601
2632
  className: riskColor,
@@ -2603,13 +2634,13 @@ const ScenarioTableRow = ({
2603
2634
  backgroundColor: getRiskMatrixColor(scenario.remainingRisk)
2604
2635
  }
2605
2636
  }
2606
- ), t("scenarioTable.columns.probabilityChar"), ":", getProbabilityLevel(scenario.remainingRisk), " ", t("scenarioTable.columns.consequenceChar"), ":", getConsequenceLevel(scenario.remainingRisk))
2637
+ ), t("scenarioTable.columns.probabilityChar"), ":", getProbabilityLevel(scenario.remainingRisk), " ", t("scenarioTable.columns.consequenceChar"), ":", getConsequenceLevel(scenario.remainingRisk)))
2607
2638
  );
2608
2639
  };
2609
2640
 
2610
2641
  const ScenarioTable = ({ riSc }) => {
2611
2642
  const { t } = useTranslationRef(pluginRiScTranslationRef);
2612
- const { titleBox, rowBorder, tableCell } = useTableStyles();
2643
+ const { titleBox, rowBorder, tableCell, tableCellTitle } = useTableStyles();
2613
2644
  const { newScenario, openScenario } = useContext(ScenarioContext);
2614
2645
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paper, null, /* @__PURE__ */ React.createElement(Box$1, { className: titleBox }, /* @__PURE__ */ React.createElement(Typography, { variant: "h5", style: { padding: "1rem" } }, t("scenarioTable.title")), riSc.scenarios.length > 0 && /* @__PURE__ */ React.createElement(
2615
2646
  Box$1,
@@ -2655,24 +2686,14 @@ const ScenarioTable = ({ riSc }) => {
2655
2686
  },
2656
2687
  t("scenarioTable.addScenarioButton")
2657
2688
  )
2658
- ) : /* @__PURE__ */ React.createElement(TableContainer, { style: { overflow: "auto" }, component: Paper }, /* @__PURE__ */ React.createElement(Table, null, /* @__PURE__ */ React.createElement(TableHead, null, /* @__PURE__ */ React.createElement(TableRow, { className: rowBorder }, /* @__PURE__ */ React.createElement(
2659
- TableCell,
2689
+ ) : /* @__PURE__ */ React.createElement(TableContainer, { style: { overflow: "auto" }, component: Paper }, /* @__PURE__ */ React.createElement(Table, null, /* @__PURE__ */ React.createElement(TableHead, null, /* @__PURE__ */ React.createElement(TableRow, { className: rowBorder }, /* @__PURE__ */ React.createElement(TableCell, { className: tableCellTitle }, /* @__PURE__ */ React.createElement(
2690
+ Typography,
2660
2691
  {
2661
- className: tableCell,
2662
- style: {
2663
- width: "40%",
2664
- minWidth: "200px"
2665
- }
2692
+ variant: "subtitle1",
2693
+ style: { fontWeight: "bold", textTransform: "uppercase" }
2666
2694
  },
2667
- /* @__PURE__ */ React.createElement(
2668
- Typography,
2669
- {
2670
- variant: "subtitle1",
2671
- style: { fontWeight: "bold", textTransform: "uppercase" }
2672
- },
2673
- t("dictionary.title")
2674
- )
2675
- ), /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement(
2695
+ t("dictionary.title")
2696
+ )), /* @__PURE__ */ React.createElement(TableCell, { className: tableCell }, /* @__PURE__ */ React.createElement(
2676
2697
  Typography,
2677
2698
  {
2678
2699
  variant: "subtitle1",
@@ -2690,7 +2711,10 @@ const ScenarioTable = ({ riSc }) => {
2690
2711
  Typography,
2691
2712
  {
2692
2713
  variant: "subtitle1",
2693
- style: { fontWeight: "bold", textTransform: "uppercase" }
2714
+ style: {
2715
+ fontWeight: "bold",
2716
+ textTransform: "uppercase"
2717
+ }
2694
2718
  },
2695
2719
  t("dictionary.restRisk")
2696
2720
  )))), /* @__PURE__ */ React.createElement(TableBody, null, riSc.scenarios.map((scenario, idx) => /* @__PURE__ */ React.createElement(
@@ -2897,7 +2921,7 @@ const getChipColor = (status, classes) => {
2897
2921
  return classes.riScDraft;
2898
2922
  }
2899
2923
  };
2900
- const chipText = (status) => {
2924
+ const useChipText = (status) => {
2901
2925
  const { t } = useTranslationRef(pluginRiScTranslationRef);
2902
2926
  switch (status) {
2903
2927
  case RiScStatus.Draft:
@@ -2909,11 +2933,15 @@ const chipText = (status) => {
2909
2933
  return t("rosStatus.statusBadge.error");
2910
2934
  }
2911
2935
  };
2912
- const getChipTextStatus = (status) => {
2936
+ function ChipTextStatus({ status }) {
2913
2937
  const { statusChipText } = useStatusChipStyles();
2914
- return /* @__PURE__ */ React.createElement("span", { className: statusChipText }, chipText(status));
2915
- };
2916
- const getPRStatus = (status, classes) => {
2938
+ const chipText = useChipText(status);
2939
+ return /* @__PURE__ */ React.createElement("span", { className: statusChipText }, chipText);
2940
+ }
2941
+ function PRStatus({
2942
+ status,
2943
+ classes
2944
+ }) {
2917
2945
  const { t } = useTranslationRef(pluginRiScTranslationRef);
2918
2946
  switch (status) {
2919
2947
  case RiScStatus.SentForApproval:
@@ -2923,7 +2951,7 @@ const getPRStatus = (status, classes) => {
2923
2951
  default:
2924
2952
  return null;
2925
2953
  }
2926
- };
2954
+ }
2927
2955
  const StatusChip = ({ currentRiScStatus }) => {
2928
2956
  const chipClasses = useStatusChipStyles();
2929
2957
  const textClasses = useStatusTextStyles();
@@ -2946,12 +2974,12 @@ const StatusChip = ({ currentRiScStatus }) => {
2946
2974
  color: "primary",
2947
2975
  size: "medium",
2948
2976
  variant: "outlined",
2949
- label: getChipTextStatus(currentRiScStatus),
2977
+ label: /* @__PURE__ */ React.createElement(ChipTextStatus, { status: currentRiScStatus }),
2950
2978
  icon: /* @__PURE__ */ React.createElement(CircleIcon$1, { className: chipClasses.statusIcon }),
2951
2979
  className: [chipColorClass, chipClasses.statusChip].join(" ")
2952
2980
  }
2953
2981
  )),
2954
- /* @__PURE__ */ React.createElement(Grid, { item: true }, getPRStatus(currentRiScStatus, textClasses))
2982
+ /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(PRStatus, { status: currentRiScStatus, classes: textClasses }))
2955
2983
  );
2956
2984
  };
2957
2985
 
@@ -3105,7 +3133,7 @@ const Plugin = () => {
3105
3133
  useEffect(() => {
3106
3134
  if (scenarioWizardStep !== null)
3107
3135
  resetRiScStatus();
3108
- }, [scenarioWizardStep]);
3136
+ }, [resetRiScStatus, scenarioWizardStep]);
3109
3137
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ScenarioContext.Provider, { value: scenario }, response && /* @__PURE__ */ React.createElement(Alert, { severity: getAlertSeverity(response.status) }, /* @__PURE__ */ React.createElement(Typography, null, response.statusMessage)), scenarioWizardStep !== null ? /* @__PURE__ */ React.createElement(
3110
3138
  ScenarioWizard,
3111
3139
  {
@@ -3168,4 +3196,4 @@ const RiScPlugin = () => {
3168
3196
  };
3169
3197
 
3170
3198
  export { RiScPlugin };
3171
- //# sourceMappingURL=index-28348a2f.esm.js.map
3199
+ //# sourceMappingURL=index-32d8d9ac.esm.js.map