@kartverket/backstage-plugin-risk-scorecard 3.11.0 → 3.11.1

package/dist/components/action/ActionRow.esm.js

@@ -28,8 +28,8 @@ function ActionRow(props) {
         openDeleteDialog: () => setDeleteActionConfirmationIsOpen(true),
         allowDeletion: props.allowDeletion,
         allowEdit: props.allowEdit,
+        updatedStatus: props.updatedStatus,
         optimisticStatus: props.optimisticStatus,
-        optimisticUpdatedStatus: props.optimisticUpdatedStatus,
         index: props.index
       }
     ),

package/dist/components/action/ActionRow.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionRow.esm.js","sources":["../../../src/components/action/ActionRow.tsx"],"sourcesContent":["import { UpdatedStatusEnumType } from '../../utils/utilityfunctions.ts';\nimport { ActionStatusOptions } from '../../utils/constants.ts';\nimport { DeleteActionConfirmation } from '../scenarioDrawer/components/DeleteConfirmation.tsx';\nimport { Action } from '../../utils/types.ts';\nimport { useState } from 'react';\nimport { ActionEdit } from './ActionEdit.tsx';\nimport { ActionView } from './ActionView.tsx';\n\ntype ActionRowProps = {\n  action: Action;\n  onRefreshActionStatus: (action: Action) => void;\n  onNewActionStatus: (actionId: string, newStatus: ActionStatusOptions) => void;\n  onDeleteAction: (actionId: string) => void;\n  onSaveAction: (\n    newAction: Action,\n    setIsEditing?: (isEditing: boolean) => void,\n  ) => void;\n  allowDeletion?: boolean;\n  allowEdit?: boolean;\n  optimisticStatus?: ActionStatusOptions;\n  optimisticUpdatedStatus?: UpdatedStatusEnumType;\n  index?: number;\n};\n\nexport function ActionRow(props: ActionRowProps) {\n  const [isEditing, setIsEditing] = useState<boolean>(false);\n  const [deleteActionConfirmationIsOpen, setDeleteActionConfirmationIsOpen] =\n    useState(false);\n\n  return (\n    <div key={props.action.ID}>\n      {isEditing ? (\n        <ActionEdit\n          onSaveAction={(a: Action) => {\n            props.onSaveAction(a, setIsEditing);\n          }}\n          onDeleteAction={() => setDeleteActionConfirmationIsOpen(true)}\n          onCancelEdit={() => setIsEditing(false)}\n          action={props.action}\n        />\n      ) : (\n        <ActionView\n          action={props.action}\n          onRefreshActionStatus={props.onRefreshActionStatus}\n          onNewActionStatus={props.onNewActionStatus}\n          toggleEditMode={() => setIsEditing(!isEditing)}\n          openDeleteDialog={() => setDeleteActionConfirmationIsOpen(true)}\n          allowDeletion={props.allowDeletion}\n          allowEdit={props.allowEdit}\n          optimisticStatus={props.optimisticStatus}\n          optimisticUpdatedStatus={props.optimisticUpdatedStatus}\n          index={props.index}\n        />\n      )}\n      <DeleteActionConfirmation\n        isOpen={deleteActionConfirmationIsOpen}\n        setIsOpen={setDeleteActionConfirmationIsOpen}\n        onConfirm={() => props.onDeleteAction(props.action.ID)}\n      />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAwBO,SAAS,UAAU,KAAA,EAAuB;AAC/C,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAkB,KAAK,CAAA;AACzD,EAAA,MAAM,CAAC,8BAAA,EAAgC,iCAAiC,CAAA,GACtE,SAAS,KAAK,CAAA;AAEhB,EAAA,4BACG,KAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,SAAA,mBACC,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAc,CAAC,CAAA,KAAc;AAC3B,UAAA,KAAA,CAAM,YAAA,CAAa,GAAG,YAAY,CAAA;AAAA,QACpC,CAAA;AAAA,QACA,cAAA,EAAgB,MAAM,iCAAA,CAAkC,IAAI,CAAA;AAAA,QAC5D,YAAA,EAAc,MAAM,YAAA,CAAa,KAAK,CAAA;AAAA,QACtC,QAAQ,KAAA,CAAM;AAAA;AAAA,KAChB,mBAEA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,QAAQ,KAAA,CAAM,MAAA;AAAA,QACd,uBAAuB,KAAA,CAAM,qBAAA;AAAA,QAC7B,mBAAmB,KAAA,CAAM,iBAAA;AAAA,QACzB,cAAA,EAAgB,MAAM,YAAA,CAAa,CAAC,SAAS,CAAA;AAAA,QAC7C,gBAAA,EAAkB,MAAM,iCAAA,CAAkC,IAAI,CAAA;AAAA,QAC9D,eAAe,KAAA,CAAM,aAAA;AAAA,QACrB,WAAW,KAAA,CAAM,SAAA;AAAA,QACjB,kBAAkB,KAAA,CAAM,gBAAA;AAAA,QACxB,yBAAyB,KAAA,CAAM,uBAAA;AAAA,QAC/B,OAAO,KAAA,CAAM;AAAA;AAAA,KACf;AAAA,oBAEF,GAAA;AAAA,MAAC,wBAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ,8BAAA;AAAA,QACR,SAAA,EAAW,iCAAA;AAAA,QACX,WAAW,MAAM,KAAA,CAAM,cAAA,CAAe,KAAA,CAAM,OAAO,EAAE;AAAA;AAAA;AACvD,GAAA,EAAA,EA5BQ,KAAA,CAAM,OAAO,EA6BvB,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ActionRow.esm.js","sources":["../../../src/components/action/ActionRow.tsx"],"sourcesContent":["import { UpdatedStatusEnumType } from '../../utils/utilityfunctions.ts';\nimport { ActionStatusOptions } from '../../utils/constants.ts';\nimport { DeleteActionConfirmation } from '../scenarioDrawer/components/DeleteConfirmation.tsx';\nimport { Action } from '../../utils/types.ts';\nimport { useState } from 'react';\nimport { ActionEdit } from './ActionEdit.tsx';\nimport { ActionView } from './ActionView.tsx';\n\ntype ActionRowProps = {\n  action: Action;\n  onRefreshActionStatus: (action: Action) => void;\n  onNewActionStatus: (actionId: string, newStatus: ActionStatusOptions) => void;\n  onDeleteAction: (actionId: string) => void;\n  onSaveAction: (\n    newAction: Action,\n    setIsEditing?: (isEditing: boolean) => void,\n  ) => void;\n  updatedStatus: UpdatedStatusEnumType | 'UPDATING' | 'NONE';\n  optimisticStatus?: ActionStatusOptions;\n  allowDeletion?: boolean;\n  allowEdit?: boolean;\n  index?: number;\n};\n\nexport function ActionRow(props: ActionRowProps) {\n  const [isEditing, setIsEditing] = useState<boolean>(false);\n  const [deleteActionConfirmationIsOpen, setDeleteActionConfirmationIsOpen] =\n    useState(false);\n\n  return (\n    <div key={props.action.ID}>\n      {isEditing ? (\n        <ActionEdit\n          onSaveAction={(a: Action) => {\n            props.onSaveAction(a, setIsEditing);\n          }}\n          onDeleteAction={() => setDeleteActionConfirmationIsOpen(true)}\n          onCancelEdit={() => setIsEditing(false)}\n          action={props.action}\n        />\n      ) : (\n        <ActionView\n          action={props.action}\n          onRefreshActionStatus={props.onRefreshActionStatus}\n          onNewActionStatus={props.onNewActionStatus}\n          toggleEditMode={() => setIsEditing(!isEditing)}\n          openDeleteDialog={() => setDeleteActionConfirmationIsOpen(true)}\n          allowDeletion={props.allowDeletion}\n          allowEdit={props.allowEdit}\n          updatedStatus={props.updatedStatus}\n          optimisticStatus={props.optimisticStatus}\n          index={props.index}\n        />\n      )}\n      <DeleteActionConfirmation\n        isOpen={deleteActionConfirmationIsOpen}\n        setIsOpen={setDeleteActionConfirmationIsOpen}\n        onConfirm={() => props.onDeleteAction(props.action.ID)}\n      />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAwBO,SAAS,UAAU,KAAA,EAAuB;AAC/C,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAkB,KAAK,CAAA;AACzD,EAAA,MAAM,CAAC,8BAAA,EAAgC,iCAAiC,CAAA,GACtE,SAAS,KAAK,CAAA;AAEhB,EAAA,4BACG,KAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,SAAA,mBACC,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAc,CAAC,CAAA,KAAc;AAC3B,UAAA,KAAA,CAAM,YAAA,CAAa,GAAG,YAAY,CAAA;AAAA,QACpC,CAAA;AAAA,QACA,cAAA,EAAgB,MAAM,iCAAA,CAAkC,IAAI,CAAA;AAAA,QAC5D,YAAA,EAAc,MAAM,YAAA,CAAa,KAAK,CAAA;AAAA,QACtC,QAAQ,KAAA,CAAM;AAAA;AAAA,KAChB,mBAEA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,QAAQ,KAAA,CAAM,MAAA;AAAA,QACd,uBAAuB,KAAA,CAAM,qBAAA;AAAA,QAC7B,mBAAmB,KAAA,CAAM,iBAAA;AAAA,QACzB,cAAA,EAAgB,MAAM,YAAA,CAAa,CAAC,SAAS,CAAA;AAAA,QAC7C,gBAAA,EAAkB,MAAM,iCAAA,CAAkC,IAAI,CAAA;AAAA,QAC9D,eAAe,KAAA,CAAM,aAAA;AAAA,QACrB,WAAW,KAAA,CAAM,SAAA;AAAA,QACjB,eAAe,KAAA,CAAM,aAAA;AAAA,QACrB,kBAAkB,KAAA,CAAM,gBAAA;AAAA,QACxB,OAAO,KAAA,CAAM;AAAA;AAAA,KACf;AAAA,oBAEF,GAAA;AAAA,MAAC,wBAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ,8BAAA;AAAA,QACR,SAAA,EAAW,iCAAA;AAAA,QACX,WAAW,MAAM,KAAA,CAAM,cAAA,CAAe,KAAA,CAAM,OAAO,EAAE;AAAA;AAAA;AACvD,GAAA,EAAA,EA5BQ,KAAA,CAAM,OAAO,EA6BvB,CAAA;AAEJ;;;;"}

package/dist/components/action/ActionRowList.esm.js

@@ -7,12 +7,12 @@ import { Flex, Text } from '@backstage/ui';
 import Divider from '@mui/material/Divider';
 import { useDebounce } from '../../utils/hooks.esm.js';
 import { useBackstageContext } from '../../contexts/BackstageContext.esm.js';
-import { UpdatedStatusEnum } from '../../utils/utilityfunctions.esm.js';
 import { useRiScs } from '../../contexts/RiScContext.esm.js';
 import { getScenarioOfIdFromRiSc } from '../../utils/scenario.esm.js';
 import styles from './ActionRowList.module.css.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
+import { getUpdatedStatus } from '../../utils/actions.esm.js';
 
 function ActionRowList(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
@@ -30,7 +30,6 @@ function ActionRowList(props) {
         [action.ID]: action.status
       }
     }));
-    setPendingActionUpdatesHistory((prev) => [...prev, action.ID]);
   };
   const onNewActionStatus = (actionId, newStatus) => {
     setPendingActionStatusUpdates((prev) => ({
@@ -40,7 +39,6 @@ function ActionRowList(props) {
         [actionId]: newStatus
       }
     }));
-    setPendingActionUpdatesHistory((prev) => [...prev, actionId]);
   };
   const onDeleteAction = (actionId) => {
     const oldScenario = getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc);
@@ -93,19 +91,22 @@ function ActionRowList(props) {
           ),
           profileInfo,
           onSuccess: () => {
-            setPendingActionStatusUpdates({});
-          },
-          onError: () => {
             setPendingActionStatusUpdates((prevStatusUpdates) => {
-              setPendingActionUpdatesHistory(
-                (prevHistory) => prevHistory.filter(
-                  (actionId) => Object.keys(prevStatusUpdates[scenarioId] ?? {}).includes(
-                    actionId
-                  )
-                )
-              );
+              const scenarioUpdates = prevStatusUpdates[scenarioId];
+              if (scenarioUpdates) {
+                const actionIds = Object.keys(scenarioUpdates);
+                if (actionIds.length > 0) {
+                  setPendingActionUpdatesHistory((prevHistory) => [
+                    ...prevHistory,
+                    ...actionIds
+                  ]);
+                }
+              }
               return {};
             });
+          },
+          onError: () => {
+            setPendingActionStatusUpdates({});
           }
         });
       });
@@ -127,26 +128,49 @@ function ActionRowList(props) {
   }
   return /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [
     /* @__PURE__ */ jsx(Divider, {}),
-    actions.map((action, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        ActionRow,
-        {
-          action,
-          index,
-          onRefreshActionStatus,
-          onNewActionStatus,
-          onDeleteAction,
-          onSaveAction,
-          optimisticUpdatedStatus: pendingActionUpdatesHistory.includes(action.ID) ? UpdatedStatusEnum.UPDATED : void 0,
-          optimisticStatus: pendingActionStatusUpdates[props.scenarioId]?.[action.ID],
-          allowDeletion: props.allowDeletion,
-          allowEdit: props.allowEdit
-        }
-      ),
-      /* @__PURE__ */ jsx(Divider, {})
-    ] }, `Action-${action.ID}-${index}`))
+    actions.map((action, index) => {
+      const updatedStatus = getUpdatedStatusOfAction(
+        props.scenarioId,
+        action,
+        pendingActionStatusUpdates,
+        pendingActionUpdatesHistory
+      );
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          ActionRow,
+          {
+            action,
+            index,
+            onRefreshActionStatus,
+            onNewActionStatus,
+            onDeleteAction,
+            onSaveAction,
+            updatedStatus,
+            optimisticStatus: pendingActionStatusUpdates[props.scenarioId]?.[action.ID],
+            allowDeletion: props.allowDeletion,
+            allowEdit: props.allowEdit
+          }
+        ),
+        /* @__PURE__ */ jsx(Divider, {})
+      ] }, `Action-${action.ID}-${index}`);
+    })
   ] });
 }
+function getUpdatedStatusOfAction(scenarioId, action, pendingActionStatusUpdates, pendingActionUpdatesHistory) {
+  const isActionUpdating = !!pendingActionStatusUpdates[scenarioId]?.[action.ID];
+  let updatedStatus;
+  if (isActionUpdating) {
+    updatedStatus = "UPDATING";
+  } else {
+    if (pendingActionUpdatesHistory.includes(action.ID)) {
+      updatedStatus = "UPDATED";
+    } else {
+      const baseStatus = getUpdatedStatus(action);
+      updatedStatus = baseStatus === "UPDATED" ? "NONE" : baseStatus;
+    }
+  }
+  return updatedStatus;
+}
 
 export { ActionRowList };
 //# sourceMappingURL=ActionRowList.esm.js.map

package/dist/components/action/ActionRowList.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionRowList.esm.js","sources":["../../../src/components/action/ActionRowList.tsx"],"sourcesContent":["import { Action } from '../../utils/types.ts';\nimport { ActionRow } from './ActionRow.tsx';\nimport { Fragment, useCallback, useEffect, useState } from 'react';\nimport { isToday } from '../../utils/date.ts';\nimport { ActionStatusOptions } from '../../utils/constants.ts';\nimport { useScenario } from '../../contexts/ScenarioContext.tsx';\nimport { Flex, Text } from '@backstage/ui';\nimport Divider from '@mui/material/Divider';\nimport { useDebounce } from '../../utils/hooks.ts';\nimport { useBackstageContext } from '../../contexts/BackstageContext.tsx';\nimport { UpdatedStatusEnum } from '../../utils/utilityfunctions.ts';\nimport { useRiScs } from '../../contexts/RiScContext.tsx';\nimport { getScenarioOfIdFromRiSc } from '../../utils/scenario.ts';\nimport styles from './ActionRowList.module.css';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\n\ntype ActionRowListProps = {\n  scenarioId: string;\n  displayedActions?: Action[]; // Specify if not every action of scenario is to be displayed\n  allowDeletion?: boolean;\n  allowEdit?: boolean;\n};\n\nexport function ActionRowList(props: ActionRowListProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { selectedRiSc } = useRiScs();\n  const { submitEditedScenarioToRiSc } = useScenario();\n  const { profileInfo } = useBackstageContext();\n  const [pendingActionStatusUpdates, setPendingActionStatusUpdates] = useState<\n    Record<string, Record<string, ActionStatusOptions>>\n  >({});\n  const [pendingActionUpdatesHistory, setPendingActionUpdatesHistory] =\n    useState<string[]>([]);\n\n  const onRefreshActionStatus = (action: Action) => {\n    if (isToday(action.lastUpdated ?? null)) return;\n\n    setPendingActionStatusUpdates(prev => ({\n      ...prev,\n      [props.scenarioId]: {\n        ...prev[props.scenarioId],\n        [action.ID]: action.status as ActionStatusOptions,\n      },\n    }));\n    setPendingActionUpdatesHistory(prev => [...prev, action.ID]);\n  };\n\n  const onNewActionStatus = (\n    actionId: string,\n    newStatus: ActionStatusOptions,\n  ) => {\n    setPendingActionStatusUpdates(prev => ({\n      ...prev,\n      [props.scenarioId]: {\n        ...prev[props.scenarioId],\n        [actionId]: newStatus,\n      },\n    }));\n    setPendingActionUpdatesHistory(prev => [...prev, actionId]);\n  };\n\n  const onDeleteAction = (actionId: string) => {\n    const oldScenario = getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc);\n    if (!oldScenario) return;\n    const newScenario = {\n      ...oldScenario,\n      actions: oldScenario.actions.filter(a => a.ID !== actionId),\n    };\n    submitEditedScenarioToRiSc(newScenario);\n  };\n\n  const onSaveAction = (\n    newAction: Action,\n    setIsEditing?: (isEditing: boolean) => void,\n  ) => {\n    const oldScenario = getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc);\n    if (!oldScenario) return;\n    submitEditedScenarioToRiSc(\n      {\n        ...oldScenario,\n        actions: oldScenario.actions.map(a =>\n          a.ID === newAction.ID ? newAction : a,\n        ),\n      },\n      {\n        profileInfo: profileInfo,\n        onSuccess: () => {\n          if (setIsEditing) {\n            setIsEditing(false);\n          }\n        },\n      },\n    );\n  };\n\n  const debounceCallback = useCallback(\n    (updates: Record<string, Record<string, ActionStatusOptions>>) => {\n      if (Object.keys(updates).length === 0) return;\n\n      Object.keys(updates).forEach(scenarioId => {\n        const oldScenario = getScenarioOfIdFromRiSc(scenarioId, selectedRiSc);\n        if (!oldScenario) return;\n        const newActionArray = oldScenario.actions.map(a =>\n          a.ID in updates[scenarioId]\n            ? {\n                ...a,\n                status: updates[scenarioId][a.ID] ?? a.status,\n              }\n            : a,\n        );\n\n        const updatedScenario = {\n          ...oldScenario,\n          actions: newActionArray,\n        };\n\n        submitEditedScenarioToRiSc(updatedScenario, {\n          idsOfActionsToForceUpdateLastUpdatedValue: Object.keys(\n            updates[scenarioId],\n          ),\n          profileInfo: profileInfo,\n          onSuccess: () => {\n            setPendingActionStatusUpdates({});\n          },\n          onError: () => {\n            // TODO: Should probably retry once before canceling updates\n            setPendingActionStatusUpdates(prevStatusUpdates => {\n              setPendingActionUpdatesHistory(prevHistory =>\n                prevHistory.filter(actionId =>\n                  Object.keys(prevStatusUpdates[scenarioId] ?? {}).includes(\n                    actionId,\n                  ),\n                ),\n              );\n              return {};\n            });\n          },\n        });\n      });\n    },\n    [submitEditedScenarioToRiSc, profileInfo, selectedRiSc],\n  );\n\n  const { flush } = useDebounce<\n    Record<string, Record<string, ActionStatusOptions>>\n  >(pendingActionStatusUpdates, 6000, debounceCallback);\n\n  const actions =\n    props.displayedActions ??\n    getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc)?.actions ??\n    [];\n\n  useEffect(() => {\n    return () => {\n      // flush on unmount. makes sure changes are saved\n      flush();\n    };\n  }, [flush]);\n\n  if (actions.length === 0) {\n    return (\n      <Flex align=\"center\" direction=\"column\">\n        <Divider flexItem />\n        <Text className={styles.noActionsText}>\n          {t('scenarioTable.noActionsLong')}\n        </Text>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex direction=\"column\">\n      <Divider />\n      {actions.map((action, index) => (\n        <Fragment key={`Action-${action.ID}-${index}`}>\n          <ActionRow\n            action={action}\n            index={index}\n            onRefreshActionStatus={onRefreshActionStatus}\n            onNewActionStatus={onNewActionStatus}\n            onDeleteAction={onDeleteAction}\n            onSaveAction={onSaveAction}\n            optimisticUpdatedStatus={\n              pendingActionUpdatesHistory.includes(action.ID)\n                ? UpdatedStatusEnum.UPDATED\n                : undefined\n            }\n            optimisticStatus={\n              pendingActionStatusUpdates[props.scenarioId]?.[action.ID]\n            }\n            allowDeletion={props.allowDeletion}\n            allowEdit={props.allowEdit}\n          />\n          <Divider />\n        </Fragment>\n      ))}\n    </Flex>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ActionRowList.esm.js","sources":["../../../src/components/action/ActionRowList.tsx"],"sourcesContent":["import { Action } from '../../utils/types.ts';\nimport { ActionRow } from './ActionRow.tsx';\nimport { Fragment, useCallback, useEffect, useState } from 'react';\nimport { isToday } from '../../utils/date.ts';\nimport { ActionStatusOptions } from '../../utils/constants.ts';\nimport { useScenario } from '../../contexts/ScenarioContext.tsx';\nimport { Flex, Text } from '@backstage/ui';\nimport Divider from '@mui/material/Divider';\nimport { useDebounce } from '../../utils/hooks.ts';\nimport { useBackstageContext } from '../../contexts/BackstageContext.tsx';\nimport { UpdatedStatusEnumType } from '../../utils/utilityfunctions.ts';\nimport { useRiScs } from '../../contexts/RiScContext.tsx';\nimport { getScenarioOfIdFromRiSc } from '../../utils/scenario.ts';\nimport styles from './ActionRowList.module.css';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport { getUpdatedStatus } from '../../utils/actions.ts';\n\ntype ActionRowListProps = {\n  scenarioId: string;\n  displayedActions?: Action[]; // Specify if not every action of scenario is to be displayed\n  allowDeletion?: boolean;\n  allowEdit?: boolean;\n};\n\nexport function ActionRowList(props: ActionRowListProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { selectedRiSc } = useRiScs();\n  const { submitEditedScenarioToRiSc } = useScenario();\n  const { profileInfo } = useBackstageContext();\n  const [pendingActionStatusUpdates, setPendingActionStatusUpdates] = useState<\n    Record<string, Record<string, ActionStatusOptions>>\n  >({});\n  const [pendingActionUpdatesHistory, setPendingActionUpdatesHistory] =\n    useState<string[]>([]);\n\n  const onRefreshActionStatus = (action: Action) => {\n    if (isToday(action.lastUpdated ?? null)) return;\n\n    setPendingActionStatusUpdates(prev => ({\n      ...prev,\n      [props.scenarioId]: {\n        ...prev[props.scenarioId],\n        [action.ID]: action.status as ActionStatusOptions,\n      },\n    }));\n  };\n\n  const onNewActionStatus = (\n    actionId: string,\n    newStatus: ActionStatusOptions,\n  ) => {\n    setPendingActionStatusUpdates(prev => ({\n      ...prev,\n      [props.scenarioId]: {\n        ...prev[props.scenarioId],\n        [actionId]: newStatus,\n      },\n    }));\n  };\n\n  const onDeleteAction = (actionId: string) => {\n    const oldScenario = getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc);\n    if (!oldScenario) return;\n    const newScenario = {\n      ...oldScenario,\n      actions: oldScenario.actions.filter(a => a.ID !== actionId),\n    };\n    submitEditedScenarioToRiSc(newScenario);\n  };\n\n  const onSaveAction = (\n    newAction: Action,\n    setIsEditing?: (isEditing: boolean) => void,\n  ) => {\n    const oldScenario = getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc);\n    if (!oldScenario) return;\n    submitEditedScenarioToRiSc(\n      {\n        ...oldScenario,\n        actions: oldScenario.actions.map(a =>\n          a.ID === newAction.ID ? newAction : a,\n        ),\n      },\n      {\n        profileInfo: profileInfo,\n        onSuccess: () => {\n          if (setIsEditing) {\n            setIsEditing(false);\n          }\n        },\n      },\n    );\n  };\n\n  const debounceCallback = useCallback(\n    (updates: Record<string, Record<string, ActionStatusOptions>>) => {\n      if (Object.keys(updates).length === 0) return;\n\n      Object.keys(updates).forEach(scenarioId => {\n        const oldScenario = getScenarioOfIdFromRiSc(scenarioId, selectedRiSc);\n        if (!oldScenario) return;\n        const newActionArray = oldScenario.actions.map(a =>\n          a.ID in updates[scenarioId]\n            ? {\n                ...a,\n                status: updates[scenarioId][a.ID] ?? a.status,\n              }\n            : a,\n        );\n\n        const updatedScenario = {\n          ...oldScenario,\n          actions: newActionArray,\n        };\n\n        submitEditedScenarioToRiSc(updatedScenario, {\n          idsOfActionsToForceUpdateLastUpdatedValue: Object.keys(\n            updates[scenarioId],\n          ),\n          profileInfo: profileInfo,\n          onSuccess: () => {\n            setPendingActionStatusUpdates(prevStatusUpdates => {\n              const scenarioUpdates = prevStatusUpdates[scenarioId];\n\n              if (scenarioUpdates) {\n                const actionIds = Object.keys(scenarioUpdates);\n\n                if (actionIds.length > 0) {\n                  setPendingActionUpdatesHistory(prevHistory => [\n                    ...prevHistory,\n                    ...actionIds,\n                  ]);\n                }\n              }\n\n              return {};\n            });\n          },\n          onError: () => {\n            // TODO: Should probably retry once before canceling updates\n            setPendingActionStatusUpdates({});\n          },\n        });\n      });\n    },\n    [submitEditedScenarioToRiSc, profileInfo, selectedRiSc],\n  );\n\n  const { flush } = useDebounce<\n    Record<string, Record<string, ActionStatusOptions>>\n  >(pendingActionStatusUpdates, 6000, debounceCallback);\n\n  const actions =\n    props.displayedActions ??\n    getScenarioOfIdFromRiSc(props.scenarioId, selectedRiSc)?.actions ??\n    [];\n\n  useEffect(() => {\n    return () => {\n      // flush on unmount. makes sure changes are saved\n      flush();\n    };\n  }, [flush]);\n\n  if (actions.length === 0) {\n    return (\n      <Flex align=\"center\" direction=\"column\">\n        <Divider flexItem />\n        <Text className={styles.noActionsText}>\n          {t('scenarioTable.noActionsLong')}\n        </Text>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex direction=\"column\">\n      <Divider />\n      {actions.map((action, index) => {\n        const updatedStatus = getUpdatedStatusOfAction(\n          props.scenarioId,\n          action,\n          pendingActionStatusUpdates,\n          pendingActionUpdatesHistory,\n        );\n        return (\n          <Fragment key={`Action-${action.ID}-${index}`}>\n            <ActionRow\n              action={action}\n              index={index}\n              onRefreshActionStatus={onRefreshActionStatus}\n              onNewActionStatus={onNewActionStatus}\n              onDeleteAction={onDeleteAction}\n              onSaveAction={onSaveAction}\n              updatedStatus={updatedStatus}\n              optimisticStatus={\n                pendingActionStatusUpdates[props.scenarioId]?.[action.ID]\n              }\n              allowDeletion={props.allowDeletion}\n              allowEdit={props.allowEdit}\n            />\n            <Divider />\n          </Fragment>\n        );\n      })}\n    </Flex>\n  );\n}\n\nfunction getUpdatedStatusOfAction(\n  scenarioId: string,\n  action: Action,\n  pendingActionStatusUpdates: Record<\n    string,\n    Record<string, ActionStatusOptions>\n  >,\n  pendingActionUpdatesHistory: string[],\n) {\n  const isActionUpdating =\n    !!pendingActionStatusUpdates[scenarioId]?.[action.ID];\n  let updatedStatus: UpdatedStatusEnumType | 'UPDATING' | 'NONE';\n  if (isActionUpdating) {\n    updatedStatus = 'UPDATING';\n  } else {\n    if (pendingActionUpdatesHistory.includes(action.ID)) {\n      updatedStatus = 'UPDATED';\n    } else {\n      const baseStatus = getUpdatedStatus(action);\n      updatedStatus = baseStatus === 'UPDATED' ? 'NONE' : baseStatus;\n    }\n  }\n  return updatedStatus;\n}\n"],"names":[],"mappings":"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"}

package/dist/components/action/ActionView.esm.js

@@ -1,7 +1,6 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { Flex, Text } from '@backstage/ui';
 import IconButton from '@mui/material/IconButton';
-import UpdatedStatusBadge from '../common/UpdatedStatusBadge.esm.js';
 import { DualButtonWithMenu } from '../common/DualButtonWithMenu.esm.js';
 import { getTranslatedActionStatus, actionStatusOptionsToTranslationKeys } from '../../utils/utilityfunctions.esm.js';
 import { ActionStatusOptions } from '../../utils/constants.esm.js';
@@ -13,9 +12,9 @@ import { Edit } from '@mui/icons-material';
 import { Markdown } from '../common/Markdown.esm.js';
 import { ActionURL } from './ActionURL.esm.js';
 import { useScenario } from '../../contexts/ScenarioContext.esm.js';
-import { getUpdatedStatus } from '../../utils/actions.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
+import { UpdatedStatusBadge } from '../common/UpdatedStatusBadge.esm.js';
 
 const getActionStatusButtonClass = (status) => {
   switch (status) {
@@ -31,7 +30,6 @@ function ActionView(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const { isActionExpanded, toggleActionExpanded } = useScenario();
   const isExpanded = isActionExpanded(props.action.ID);
-  const updatedStatus = getUpdatedStatus(props.action);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       "div",
@@ -70,13 +68,7 @@ function ActionView(props) {
               }
             ),
             /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", children: [
-              /* @__PURE__ */ jsx(
-                UpdatedStatusBadge,
-                {
-                  status: props.optimisticUpdatedStatus ?? updatedStatus,
-                  isPending: !!props.optimisticUpdatedStatus
-                }
-              ),
+              /* @__PURE__ */ jsx(UpdatedStatusBadge, { status: props.updatedStatus }),
               /* @__PURE__ */ jsx(Text, { variant: "body-large", children: props.action.title ?? `${t("dictionary.measure")} ${props.index ?? ""}` })
             ] })
           ] }),

package/dist/components/action/ActionView.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionView.esm.js","sources":["../../../src/components/action/ActionView.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport IconButton from '@mui/material/IconButton';\nimport UpdatedStatusBadge from '../common/UpdatedStatusBadge.tsx';\nimport { DualButtonWithMenu } from '../common/DualButtonWithMenu.tsx';\nimport {\n  actionStatusOptionsToTranslationKeys,\n  getTranslatedActionStatus,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions.ts';\nimport { ActionStatusOptions } from '../../utils/constants.ts';\nimport { ScenarioLastUpdatedLabel } from '../scenario/ScenarioLastUpdatedLabel.tsx';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport Collapse from '@mui/material/Collapse';\nimport Box from '@mui/material/Box';\nimport { Edit } from '@mui/icons-material';\nimport { Markdown } from '../common/Markdown.tsx';\nimport { ActionURL } from './ActionURL.tsx';\nimport { useScenario } from '../../contexts/ScenarioContext.tsx';\nimport { Action } from '../../utils/types.ts';\nimport { getUpdatedStatus } from '../../utils/actions.ts';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\n\ntype ActionViewProps = {\n  action: Action;\n  onRefreshActionStatus: (action: Action) => void;\n  onNewActionStatus: (actionId: string, newStatus: ActionStatusOptions) => void;\n  toggleEditMode: () => void;\n  openDeleteDialog: () => void;\n  allowDeletion?: boolean;\n  allowEdit?: boolean;\n  optimisticStatus?: ActionStatusOptions;\n  optimisticUpdatedStatus?: UpdatedStatusEnumType;\n  index?: number;\n};\n\nconst getActionStatusButtonClass = (status: string): string => {\n  switch (status) {\n    case ActionStatusOptions.OK:\n      return 'ros-button-green';\n    case ActionStatusOptions.NotOK:\n      return 'ros-button-red';\n    default:\n      return 'ros-button-gray';\n  }\n};\n\nexport function ActionView(props: ActionViewProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { isActionExpanded, toggleActionExpanded } = useScenario();\n  const isExpanded = isActionExpanded(props.action.ID);\n\n  const updatedStatus = getUpdatedStatus(props.action);\n\n  return (\n    <>\n      <div\n        role=\"button\"\n        tabIndex={0}\n        onClick={e => {\n          e.stopPropagation();\n\n          const target = e.target as HTMLElement | null;\n          if (target && target.closest('[data-no-row-toggle]')) return;\n\n          toggleActionExpanded(props.action.ID);\n        }}\n        onKeyDown={e => {\n          // Prevent keyboard event from bubbling up to parent(s)\n          e.stopPropagation();\n\n          if (e.key === 'Enter' || e.key === ' ') {\n            e.preventDefault();\n            toggleActionExpanded(props.action.ID);\n          }\n        }}\n        style={{ cursor: 'pointer' }}\n      >\n        <Flex align=\"center\" gap=\"1\" justify=\"between\">\n          <Flex align=\"center\" justify=\"start\" style={{ width: '40%' }}>\n            <IconButton\n              onClick={e => {\n                e.stopPropagation();\n                toggleActionExpanded(props.action.ID);\n              }}\n            >\n              <i\n                className={`ri-arrow-${isExpanded ? 'down' : 'right'}-s-line`}\n              />\n            </IconButton>\n            <Flex direction=\"column\" gap=\"1\">\n              <UpdatedStatusBadge\n                status={props.optimisticUpdatedStatus ?? updatedStatus}\n                isPending={!!props.optimisticUpdatedStatus}\n              />\n              <Text variant=\"body-large\">\n                {props.action.title ??\n                  `${t('dictionary.measure')} ${props.index ?? ''}`}\n              </Text>\n            </Flex>\n          </Flex>\n          <Flex align=\"center\" justify=\"end\">\n            <DualButtonWithMenu\n              propsCommon={{\n                className: getActionStatusButtonClass(\n                  props.optimisticStatus ?? props.action.status,\n                ),\n              }}\n              propsLeft={{\n                children: getTranslatedActionStatus(\n                  props.optimisticStatus ?? props.action.status,\n                  t,\n                ),\n              }}\n              propsRight={{\n                iconEnd: <i className=\"ri-loop-left-line\" />,\n                onClick: () => {\n                  props.onRefreshActionStatus(props.action);\n                },\n              }}\n              menuItems={Object.values(ActionStatusOptions).map(value => ({\n                key: value,\n                // @ts-ignore\n                label: t(\n                  actionStatusOptionsToTranslationKeys[\n                    value as ActionStatusOptions\n                  ],\n                ),\n                onClick: () => props.onNewActionStatus(props.action.ID, value),\n                selected: props.optimisticStatus\n                  ? value === props.optimisticStatus\n                  : value === props.action.status,\n              }))}\n            />\n            <ScenarioLastUpdatedLabel\n              lastUpdated={\n                !!props.optimisticStatus ? new Date() : props.action.lastUpdated\n              }\n              lastUpdatedBy={props.action.lastUpdatedBy}\n            />\n            {props.allowDeletion && (\n              <IconButton\n                onClick={e => {\n                  e.stopPropagation();\n                  props.openDeleteDialog();\n                }}\n              >\n                <DeleteIcon />\n              </IconButton>\n            )}\n          </Flex>\n        </Flex>\n      </div>\n      <Collapse\n        in={isExpanded}\n        sx={{ marginTop: 1 }}\n        timeout=\"auto\"\n        unmountOnExit\n      >\n        <Box ml=\"56px\" mt=\"4\" mb=\"2\">\n          <Flex justify=\"between\" mt=\"8px\" align=\"end\">\n            <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n              {t('dictionary.description')}\n            </Text>\n            {props.allowEdit && (\n              <IconButton\n                sx={{\n                  marginLeft: 'auto',\n                  transition: 'opacity 300ms ease-in',\n                }}\n                onClick={e => {\n                  e.stopPropagation();\n                  props.toggleEditMode();\n                }}\n              >\n                <Edit />\n              </IconButton>\n            )}\n          </Flex>\n          <Markdown description={props.action.description} />\n          <ActionURL url={props.action.url} />\n        </Box>\n      </Collapse>\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAoCA,MAAM,0BAAA,GAA6B,CAAC,MAAA,KAA2B;AAC7D,EAAA,QAAQ,MAAA;AAAQ,IACd,KAAK,mBAAA,CAAoB,EAAA;AACvB,MAAA,OAAO,kBAAA;AAAA,IACT,KAAK,mBAAA,CAAoB,KAAA;AACvB,MAAA,OAAO,gBAAA;AAAA,IACT;AACE,MAAA,OAAO,iBAAA;AAAA;AAEb,CAAA;AAEO,SAAS,WAAW,KAAA,EAAwB;AACjD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM,EAAE,gBAAA,EAAkB,oBAAA,EAAqB,GAAI,WAAA,EAAY;AAC/D,EAAA,MAAM,UAAA,GAAa,gBAAA,CAAiB,KAAA,CAAM,MAAA,CAAO,EAAE,CAAA;AAEnD,EAAA,MAAM,aAAA,GAAgB,gBAAA,CAAiB,KAAA,CAAM,MAAM,CAAA;AAEnD,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,QAAA,EAAU,CAAA;AAAA,QACV,SAAS,CAAA,CAAA,KAAK;AACZ,UAAA,CAAA,CAAE,eAAA,EAAgB;AAElB,UAAA,MAAM,SAAS,CAAA,CAAE,MAAA;AACjB,UAAA,IAAI,MAAA,IAAU,MAAA,CAAO,OAAA,CAAQ,sBAAsB,CAAA,EAAG;AAEtD,UAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,EAAE,CAAA;AAAA,QACtC,CAAA;AAAA,QACA,WAAW,CAAA,CAAA,KAAK;AAEd,UAAA,CAAA,CAAE,eAAA,EAAgB;AAElB,UAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,YAAA,CAAA,CAAE,cAAA,EAAe;AACjB,YAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,EAAE,CAAA;AAAA,UACtC;AAAA,QACF,CAAA;AAAA,QACA,KAAA,EAAO,EAAE,MAAA,EAAQ,SAAA,EAAU;AAAA,QAE3B,+BAAC,IAAA,EAAA,EAAK,KAAA,EAAM,UAAS,GAAA,EAAI,GAAA,EAAI,SAAQ,SAAA,EACnC,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,IAAA,EAAA,EAAK,OAAM,QAAA,EAAS,OAAA,EAAQ,SAAQ,KAAA,EAAO,EAAE,KAAA,EAAO,KAAA,EAAM,EACzD,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,SAAS,CAAA,CAAA,KAAK;AACZ,kBAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,kBAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,EAAE,CAAA;AAAA,gBACtC,CAAA;AAAA,gBAEA,QAAA,kBAAA,GAAA;AAAA,kBAAC,GAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,CAAA,SAAA,EAAY,UAAA,GAAa,MAAA,GAAS,OAAO,CAAA,OAAA;AAAA;AAAA;AACtD;AAAA,aACF;AAAA,4BACA,IAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,QAAA,EAAS,KAAI,GAAA,EAC3B,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,kBAAA;AAAA,gBAAA;AAAA,kBACC,MAAA,EAAQ,MAAM,uBAAA,IAA2B,aAAA;AAAA,kBACzC,SAAA,EAAW,CAAC,CAAC,KAAA,CAAM;AAAA;AAAA,eACrB;AAAA,8BACA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EACX,gBAAM,MAAA,CAAO,KAAA,IACZ,CAAA,EAAG,CAAA,CAAE,oBAAoB,CAAC,CAAA,CAAA,EAAI,KAAA,CAAM,KAAA,IAAS,EAAE,CAAA,CAAA,EACnD;AAAA,aAAA,EACF;AAAA,WAAA,EACF,CAAA;AAAA,0BACA,IAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAM,QAAA,EAAS,SAAQ,KAAA,EAC3B,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,kBAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EAAa;AAAA,kBACX,SAAA,EAAW,0BAAA;AAAA,oBACT,KAAA,CAAM,gBAAA,IAAoB,KAAA,CAAM,MAAA,CAAO;AAAA;AACzC,iBACF;AAAA,gBACA,SAAA,EAAW;AAAA,kBACT,QAAA,EAAU,yBAAA;AAAA,oBACR,KAAA,CAAM,gBAAA,IAAoB,KAAA,CAAM,MAAA,CAAO,MAAA;AAAA,oBACvC;AAAA;AACF,iBACF;AAAA,gBACA,UAAA,EAAY;AAAA,kBACV,OAAA,kBAAS,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,mBAAA,EAAoB,CAAA;AAAA,kBAC1C,SAAS,MAAM;AACb,oBAAA,KAAA,CAAM,qBAAA,CAAsB,MAAM,MAAM,CAAA;AAAA,kBAC1C;AAAA,iBACF;AAAA,gBACA,WAAW,MAAA,CAAO,MAAA,CAAO,mBAAmB,CAAA,CAAE,IAAI,CAAA,KAAA,MAAU;AAAA,kBAC1D,GAAA,EAAK,KAAA;AAAA;AAAA,kBAEL,KAAA,EAAO,CAAA;AAAA,oBACL,qCACE,KACF;AAAA,mBACF;AAAA,kBACA,SAAS,MAAM,KAAA,CAAM,kBAAkB,KAAA,CAAM,MAAA,CAAO,IAAI,KAAK,CAAA;AAAA,kBAC7D,QAAA,EAAU,MAAM,gBAAA,GACZ,KAAA,KAAU,MAAM,gBAAA,GAChB,KAAA,KAAU,MAAM,MAAA,CAAO;AAAA,iBAC7B,CAAE;AAAA;AAAA,aACJ;AAAA,4BACA,GAAA;AAAA,cAAC,wBAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EACE,CAAC,CAAC,KAAA,CAAM,mCAAmB,IAAI,IAAA,EAAK,GAAI,KAAA,CAAM,MAAA,CAAO,WAAA;AAAA,gBAEvD,aAAA,EAAe,MAAM,MAAA,CAAO;AAAA;AAAA,aAC9B;AAAA,YACC,MAAM,aAAA,oBACL,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,SAAS,CAAA,CAAA,KAAK;AACZ,kBAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,kBAAA,KAAA,CAAM,gBAAA,EAAiB;AAAA,gBACzB,CAAA;AAAA,gBAEA,8BAAC,UAAA,EAAA,EAAW;AAAA;AAAA;AACd,WAAA,EAEJ;AAAA,SAAA,EACF;AAAA;AAAA,KACF;AAAA,oBACA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,EAAA,EAAI,UAAA;AAAA,QACJ,EAAA,EAAI,EAAE,SAAA,EAAW,CAAA,EAAE;AAAA,QACnB,OAAA,EAAQ,MAAA;AAAA,QACR,aAAA,EAAa,IAAA;AAAA,QAEb,+BAAC,GAAA,EAAA,EAAI,EAAA,EAAG,QAAO,EAAA,EAAG,GAAA,EAAI,IAAG,GAAA,EACvB,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,QAAK,OAAA,EAAQ,SAAA,EAAU,EAAA,EAAG,KAAA,EAAM,OAAM,KAAA,EACrC,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAG,GAAA,EAAI,OAAA,EAAQ,cAAa,MAAA,EAAO,MAAA,EACtC,QAAA,EAAA,CAAA,CAAE,wBAAwB,CAAA,EAC7B,CAAA;AAAA,YACC,MAAM,SAAA,oBACL,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,EAAA,EAAI;AAAA,kBACF,UAAA,EAAY,MAAA;AAAA,kBACZ,UAAA,EAAY;AAAA,iBACd;AAAA,gBACA,SAAS,CAAA,CAAA,KAAK;AACZ,kBAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,kBAAA,KAAA,CAAM,cAAA,EAAe;AAAA,gBACvB,CAAA;AAAA,gBAEA,8BAAC,IAAA,EAAA,EAAK;AAAA;AAAA;AACR,WAAA,EAEJ,CAAA;AAAA,0BACA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAA,EAAa,KAAA,CAAM,OAAO,WAAA,EAAa,CAAA;AAAA,0BACjD,GAAA,CAAC,SAAA,EAAA,EAAU,GAAA,EAAK,KAAA,CAAM,OAAO,GAAA,EAAK;AAAA,SAAA,EACpC;AAAA;AAAA;AACF,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ActionView.esm.js","sources":["../../../src/components/action/ActionView.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport IconButton from '@mui/material/IconButton';\nimport { DualButtonWithMenu } from '../common/DualButtonWithMenu.tsx';\nimport {\n  actionStatusOptionsToTranslationKeys,\n  getTranslatedActionStatus,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions.ts';\nimport { ActionStatusOptions } from '../../utils/constants.ts';\nimport { ScenarioLastUpdatedLabel } from '../scenario/ScenarioLastUpdatedLabel.tsx';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport Collapse from '@mui/material/Collapse';\nimport Box from '@mui/material/Box';\nimport { Edit } from '@mui/icons-material';\nimport { Markdown } from '../common/Markdown.tsx';\nimport { ActionURL } from './ActionURL.tsx';\nimport { useScenario } from '../../contexts/ScenarioContext.tsx';\nimport { Action } from '../../utils/types.ts';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport { UpdatedStatusBadge } from '../common/UpdatedStatusBadge.tsx';\n\ntype ActionViewProps = {\n  action: Action;\n  onRefreshActionStatus: (action: Action) => void;\n  onNewActionStatus: (actionId: string, newStatus: ActionStatusOptions) => void;\n  toggleEditMode: () => void;\n  openDeleteDialog: () => void;\n  updatedStatus: UpdatedStatusEnumType | 'UPDATING' | 'NONE';\n  optimisticStatus?: ActionStatusOptions;\n  allowDeletion?: boolean;\n  allowEdit?: boolean;\n  index?: number;\n};\n\nconst getActionStatusButtonClass = (status: string): string => {\n  switch (status) {\n    case ActionStatusOptions.OK:\n      return 'ros-button-green';\n    case ActionStatusOptions.NotOK:\n      return 'ros-button-red';\n    default:\n      return 'ros-button-gray';\n  }\n};\n\nexport function ActionView(props: ActionViewProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { isActionExpanded, toggleActionExpanded } = useScenario();\n  const isExpanded = isActionExpanded(props.action.ID);\n\n  return (\n    <>\n      <div\n        role=\"button\"\n        tabIndex={0}\n        onClick={e => {\n          e.stopPropagation();\n\n          const target = e.target as HTMLElement | null;\n          if (target && target.closest('[data-no-row-toggle]')) return;\n\n          toggleActionExpanded(props.action.ID);\n        }}\n        onKeyDown={e => {\n          // Prevent keyboard event from bubbling up to parent(s)\n          e.stopPropagation();\n\n          if (e.key === 'Enter' || e.key === ' ') {\n            e.preventDefault();\n            toggleActionExpanded(props.action.ID);\n          }\n        }}\n        style={{ cursor: 'pointer' }}\n      >\n        <Flex align=\"center\" gap=\"1\" justify=\"between\">\n          <Flex align=\"center\" justify=\"start\" style={{ width: '40%' }}>\n            <IconButton\n              onClick={e => {\n                e.stopPropagation();\n                toggleActionExpanded(props.action.ID);\n              }}\n            >\n              <i\n                className={`ri-arrow-${isExpanded ? 'down' : 'right'}-s-line`}\n              />\n            </IconButton>\n            <Flex direction=\"column\" gap=\"1\">\n              <UpdatedStatusBadge status={props.updatedStatus} />\n              <Text variant=\"body-large\">\n                {props.action.title ??\n                  `${t('dictionary.measure')} ${props.index ?? ''}`}\n              </Text>\n            </Flex>\n          </Flex>\n          <Flex align=\"center\" justify=\"end\">\n            <DualButtonWithMenu\n              propsCommon={{\n                className: getActionStatusButtonClass(\n                  props.optimisticStatus ?? props.action.status,\n                ),\n              }}\n              propsLeft={{\n                children: getTranslatedActionStatus(\n                  props.optimisticStatus ?? props.action.status,\n                  t,\n                ),\n              }}\n              propsRight={{\n                iconEnd: <i className=\"ri-loop-left-line\" />,\n                onClick: () => {\n                  props.onRefreshActionStatus(props.action);\n                },\n              }}\n              menuItems={Object.values(ActionStatusOptions).map(value => ({\n                key: value,\n                // @ts-ignore\n                label: t(\n                  actionStatusOptionsToTranslationKeys[\n                    value as ActionStatusOptions\n                  ],\n                ),\n                onClick: () => props.onNewActionStatus(props.action.ID, value),\n                selected: props.optimisticStatus\n                  ? value === props.optimisticStatus\n                  : value === props.action.status,\n              }))}\n            />\n            <ScenarioLastUpdatedLabel\n              lastUpdated={\n                !!props.optimisticStatus ? new Date() : props.action.lastUpdated\n              }\n              lastUpdatedBy={props.action.lastUpdatedBy}\n            />\n            {props.allowDeletion && (\n              <IconButton\n                onClick={e => {\n                  e.stopPropagation();\n                  props.openDeleteDialog();\n                }}\n              >\n                <DeleteIcon />\n              </IconButton>\n            )}\n          </Flex>\n        </Flex>\n      </div>\n      <Collapse\n        in={isExpanded}\n        sx={{ marginTop: 1 }}\n        timeout=\"auto\"\n        unmountOnExit\n      >\n        <Box ml=\"56px\" mt=\"4\" mb=\"2\">\n          <Flex justify=\"between\" mt=\"8px\" align=\"end\">\n            <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n              {t('dictionary.description')}\n            </Text>\n            {props.allowEdit && (\n              <IconButton\n                sx={{\n                  marginLeft: 'auto',\n                  transition: 'opacity 300ms ease-in',\n                }}\n                onClick={e => {\n                  e.stopPropagation();\n                  props.toggleEditMode();\n                }}\n              >\n                <Edit />\n              </IconButton>\n            )}\n          </Flex>\n          <Markdown description={props.action.description} />\n          <ActionURL url={props.action.url} />\n        </Box>\n      </Collapse>\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAmCA,MAAM,0BAAA,GAA6B,CAAC,MAAA,KAA2B;AAC7D,EAAA,QAAQ,MAAA;AAAQ,IACd,KAAK,mBAAA,CAAoB,EAAA;AACvB,MAAA,OAAO,kBAAA;AAAA,IACT,KAAK,mBAAA,CAAoB,KAAA;AACvB,MAAA,OAAO,gBAAA;AAAA,IACT;AACE,MAAA,OAAO,iBAAA;AAAA;AAEb,CAAA;AAEO,SAAS,WAAW,KAAA,EAAwB;AACjD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM,EAAE,gBAAA,EAAkB,oBAAA,EAAqB,GAAI,WAAA,EAAY;AAC/D,EAAA,MAAM,UAAA,GAAa,gBAAA,CAAiB,KAAA,CAAM,MAAA,CAAO,EAAE,CAAA;AAEnD,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,QAAA,EAAU,CAAA;AAAA,QACV,SAAS,CAAA,CAAA,KAAK;AACZ,UAAA,CAAA,CAAE,eAAA,EAAgB;AAElB,UAAA,MAAM,SAAS,CAAA,CAAE,MAAA;AACjB,UAAA,IAAI,MAAA,IAAU,MAAA,CAAO,OAAA,CAAQ,sBAAsB,CAAA,EAAG;AAEtD,UAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,EAAE,CAAA;AAAA,QACtC,CAAA;AAAA,QACA,WAAW,CAAA,CAAA,KAAK;AAEd,UAAA,CAAA,CAAE,eAAA,EAAgB;AAElB,UAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,YAAA,CAAA,CAAE,cAAA,EAAe;AACjB,YAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,EAAE,CAAA;AAAA,UACtC;AAAA,QACF,CAAA;AAAA,QACA,KAAA,EAAO,EAAE,MAAA,EAAQ,SAAA,EAAU;AAAA,QAE3B,+BAAC,IAAA,EAAA,EAAK,KAAA,EAAM,UAAS,GAAA,EAAI,GAAA,EAAI,SAAQ,SAAA,EACnC,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,IAAA,EAAA,EAAK,OAAM,QAAA,EAAS,OAAA,EAAQ,SAAQ,KAAA,EAAO,EAAE,KAAA,EAAO,KAAA,EAAM,EACzD,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,SAAS,CAAA,CAAA,KAAK;AACZ,kBAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,kBAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,EAAE,CAAA;AAAA,gBACtC,CAAA;AAAA,gBAEA,QAAA,kBAAA,GAAA;AAAA,kBAAC,GAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,CAAA,SAAA,EAAY,UAAA,GAAa,MAAA,GAAS,OAAO,CAAA,OAAA;AAAA;AAAA;AACtD;AAAA,aACF;AAAA,4BACA,IAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,QAAA,EAAS,KAAI,GAAA,EAC3B,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,kBAAA,EAAA,EAAmB,MAAA,EAAQ,KAAA,CAAM,aAAA,EAAe,CAAA;AAAA,8BACjD,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EACX,gBAAM,MAAA,CAAO,KAAA,IACZ,CAAA,EAAG,CAAA,CAAE,oBAAoB,CAAC,CAAA,CAAA,EAAI,KAAA,CAAM,KAAA,IAAS,EAAE,CAAA,CAAA,EACnD;AAAA,aAAA,EACF;AAAA,WAAA,EACF,CAAA;AAAA,0BACA,IAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAM,QAAA,EAAS,SAAQ,KAAA,EAC3B,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,kBAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EAAa;AAAA,kBACX,SAAA,EAAW,0BAAA;AAAA,oBACT,KAAA,CAAM,gBAAA,IAAoB,KAAA,CAAM,MAAA,CAAO;AAAA;AACzC,iBACF;AAAA,gBACA,SAAA,EAAW;AAAA,kBACT,QAAA,EAAU,yBAAA;AAAA,oBACR,KAAA,CAAM,gBAAA,IAAoB,KAAA,CAAM,MAAA,CAAO,MAAA;AAAA,oBACvC;AAAA;AACF,iBACF;AAAA,gBACA,UAAA,EAAY;AAAA,kBACV,OAAA,kBAAS,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,mBAAA,EAAoB,CAAA;AAAA,kBAC1C,SAAS,MAAM;AACb,oBAAA,KAAA,CAAM,qBAAA,CAAsB,MAAM,MAAM,CAAA;AAAA,kBAC1C;AAAA,iBACF;AAAA,gBACA,WAAW,MAAA,CAAO,MAAA,CAAO,mBAAmB,CAAA,CAAE,IAAI,CAAA,KAAA,MAAU;AAAA,kBAC1D,GAAA,EAAK,KAAA;AAAA;AAAA,kBAEL,KAAA,EAAO,CAAA;AAAA,oBACL,qCACE,KACF;AAAA,mBACF;AAAA,kBACA,SAAS,MAAM,KAAA,CAAM,kBAAkB,KAAA,CAAM,MAAA,CAAO,IAAI,KAAK,CAAA;AAAA,kBAC7D,QAAA,EAAU,MAAM,gBAAA,GACZ,KAAA,KAAU,MAAM,gBAAA,GAChB,KAAA,KAAU,MAAM,MAAA,CAAO;AAAA,iBAC7B,CAAE;AAAA;AAAA,aACJ;AAAA,4BACA,GAAA;AAAA,cAAC,wBAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EACE,CAAC,CAAC,KAAA,CAAM,mCAAmB,IAAI,IAAA,EAAK,GAAI,KAAA,CAAM,MAAA,CAAO,WAAA;AAAA,gBAEvD,aAAA,EAAe,MAAM,MAAA,CAAO;AAAA;AAAA,aAC9B;AAAA,YACC,MAAM,aAAA,oBACL,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,SAAS,CAAA,CAAA,KAAK;AACZ,kBAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,kBAAA,KAAA,CAAM,gBAAA,EAAiB;AAAA,gBACzB,CAAA;AAAA,gBAEA,8BAAC,UAAA,EAAA,EAAW;AAAA;AAAA;AACd,WAAA,EAEJ;AAAA,SAAA,EACF;AAAA;AAAA,KACF;AAAA,oBACA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,EAAA,EAAI,UAAA;AAAA,QACJ,EAAA,EAAI,EAAE,SAAA,EAAW,CAAA,EAAE;AAAA,QACnB,OAAA,EAAQ,MAAA;AAAA,QACR,aAAA,EAAa,IAAA;AAAA,QAEb,+BAAC,GAAA,EAAA,EAAI,EAAA,EAAG,QAAO,EAAA,EAAG,GAAA,EAAI,IAAG,GAAA,EACvB,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,QAAK,OAAA,EAAQ,SAAA,EAAU,EAAA,EAAG,KAAA,EAAM,OAAM,KAAA,EACrC,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAG,GAAA,EAAI,OAAA,EAAQ,cAAa,MAAA,EAAO,MAAA,EACtC,QAAA,EAAA,CAAA,CAAE,wBAAwB,CAAA,EAC7B,CAAA;AAAA,YACC,MAAM,SAAA,oBACL,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,EAAA,EAAI;AAAA,kBACF,UAAA,EAAY,MAAA;AAAA,kBACZ,UAAA,EAAY;AAAA,iBACd;AAAA,gBACA,SAAS,CAAA,CAAA,KAAK;AACZ,kBAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,kBAAA,KAAA,CAAM,cAAA,EAAe;AAAA,gBACvB,CAAA;AAAA,gBAEA,8BAAC,IAAA,EAAA,EAAK;AAAA;AAAA;AACR,WAAA,EAEJ,CAAA;AAAA,0BACA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAA,EAAa,KAAA,CAAM,OAAO,WAAA,EAAa,CAAA;AAAA,0BACjD,GAAA,CAAC,SAAA,EAAA,EAAU,GAAA,EAAK,KAAA,CAAM,OAAO,GAAA,EAAK;AAAA,SAAA,EACpC;AAAA;AAAA;AACF,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/common/UpdatedStatusBadge.esm.js

@@ -1,52 +1,48 @@
 import { jsx } from 'react/jsx-runtime';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { Text } from '@backstage/ui';
+import { Text, Flex } from '@backstage/ui';
 import { Tooltip } from '@material-ui/core';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
-import { UpdatedStatusEnum } from '../../utils/utilityfunctions.esm.js';
 import styles from './UpdatedStatusBadge.module.css.esm.js';
 
-function UpdatedStatusBadge({
-  status,
-  isPending = false
-}) {
+function UpdatedStatusBadge(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
-  let ariaLabel;
-  if (isPending) {
-    ariaLabel = t("rosStatus.updated");
-  } else if (status === UpdatedStatusEnum.VERY_OUTDATED) {
-    ariaLabel = t("rosStatus.veryOutdated");
-  } else if (status === UpdatedStatusEnum.OUTDATED) {
-    ariaLabel = t("rosStatus.outdated");
-  } else {
-    ariaLabel = void 0;
-  }
-  if (isPending) {
+  if (props.status === "UPDATED") {
     return /* @__PURE__ */ jsx(
       "span",
       {
-        className: `${styles.badge} ${styles.pending}`,
-        "aria-label": ariaLabel,
+        className: `${styles.badge} ${styles.updated}`,
+        "aria-label": t("rosStatus.updated"),
         children: /* @__PURE__ */ jsx(Text, { as: "p", className: styles.text, children: t("rosStatus.updated") })
       }
     );
   }
-  if (status === UpdatedStatusEnum.VERY_OUTDATED) {
+  if (props.status === "UPDATING") {
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: `${styles.badge} ${styles.updating}`,
+        "aria-label": t("rosStatus.updating"),
+        children: /* @__PURE__ */ jsx(Flex, { direction: "row", gap: "4px", children: /* @__PURE__ */ jsx(Text, { as: "p", className: styles.text, children: t("rosStatus.updating") }) })
+      }
+    );
+  }
+  if (props.status === "VERY_OUTDATED") {
     return /* @__PURE__ */ jsx(Tooltip, { title: t("rosStatus.updatedStatus.tooltip.VERY_OUTDATED"), children: /* @__PURE__ */ jsx(
       "span",
       {
         className: `${styles.badge} ${styles.veryOutdated}`,
-        "aria-label": ariaLabel,
+        "aria-label": t("rosStatus.veryOutdated"),
         children: /* @__PURE__ */ jsx(Text, { as: "p", className: styles.text, children: t("rosStatus.veryOutdated") })
       }
     ) });
   }
-  if (status === UpdatedStatusEnum.OUTDATED) {
+  if (props.status === "OUTDATED") {
     return /* @__PURE__ */ jsx(Tooltip, { title: t("rosStatus.updatedStatus.tooltip.OUTDATED"), children: /* @__PURE__ */ jsx(
       "span",
       {
         className: `${styles.badge} ${styles.outdated}`,
-        "aria-label": ariaLabel,
+        "aria-label": t("rosStatus.outdated"),
         children: /* @__PURE__ */ jsx(Text, { as: "p", className: styles.text, children: t("rosStatus.outdated") })
       }
     ) });
@@ -54,5 +50,5 @@ function UpdatedStatusBadge({
   return null;
 }
 
-export { UpdatedStatusBadge as default };
+export { UpdatedStatusBadge };
 //# sourceMappingURL=UpdatedStatusBadge.esm.js.map

package/dist/components/common/UpdatedStatusBadge.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UpdatedStatusBadge.esm.js","sources":["../../../src/components/common/UpdatedStatusBadge.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { Text } from '@backstage/ui';\nimport { Tooltip } from '@material-ui/core';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport {\n  UpdatedStatusEnum,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions';\nimport styles from './UpdatedStatusBadge.module.css';\n\ntype Props = {\n  status?: UpdatedStatusEnumType | null;\n  isPending?: boolean;\n};\n\nexport default function UpdatedStatusBadge({\n  status,\n  isPending = false,\n}: Props) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  let ariaLabel: string | undefined;\n  if (isPending) {\n    ariaLabel = t('rosStatus.updated');\n  } else if (status === UpdatedStatusEnum.VERY_OUTDATED) {\n    ariaLabel = t('rosStatus.veryOutdated');\n  } else if (status === UpdatedStatusEnum.OUTDATED) {\n    ariaLabel = t('rosStatus.outdated');\n  } else {\n    ariaLabel = undefined;\n  }\n\n  if (isPending) {\n    return (\n      <span\n        className={`${styles.badge} ${styles.pending}`}\n        aria-label={ariaLabel}\n      >\n        <Text as=\"p\" className={styles.text}>\n          {t('rosStatus.updated')}\n        </Text>\n      </span>\n    );\n  }\n\n  if (status === UpdatedStatusEnum.VERY_OUTDATED) {\n    return (\n      <Tooltip title={t('rosStatus.updatedStatus.tooltip.VERY_OUTDATED')}>\n        <span\n          className={`${styles.badge} ${styles.veryOutdated}`}\n          aria-label={ariaLabel}\n        >\n          <Text as=\"p\" className={styles.text}>\n            {t('rosStatus.veryOutdated')}\n          </Text>\n        </span>\n      </Tooltip>\n    );\n  }\n\n  if (status === UpdatedStatusEnum.OUTDATED) {\n    return (\n      <Tooltip title={t('rosStatus.updatedStatus.tooltip.OUTDATED')}>\n        <span\n          className={`${styles.badge} ${styles.outdated}`}\n          aria-label={ariaLabel}\n        >\n          <Text as=\"p\" className={styles.text}>\n            {t('rosStatus.outdated')}\n          </Text>\n        </span>\n      </Tooltip>\n    );\n  }\n  return null;\n}\n"],"names":[],"mappings":";;;;;;;;AAeA,SAAwB,kBAAA,CAAmB;AAAA,EACzC,MAAA;AAAA,EACA,SAAA,GAAY;AACd,CAAA,EAAU;AACR,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,IAAI,SAAA;AACJ,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,SAAA,GAAY,EAAE,mBAAmB,CAAA;AAAA,EACnC,CAAA,MAAA,IAAW,MAAA,KAAW,iBAAA,CAAkB,aAAA,EAAe;AACrD,IAAA,SAAA,GAAY,EAAE,wBAAwB,CAAA;AAAA,EACxC,CAAA,MAAA,IAAW,MAAA,KAAW,iBAAA,CAAkB,QAAA,EAAU;AAChD,IAAA,SAAA,GAAY,EAAE,oBAAoB,CAAA;AAAA,EACpC,CAAA,MAAO;AACL,IAAA,SAAA,GAAY,MAAA;AAAA,EACd;AAEA,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,OAAO,CAAA,CAAA;AAAA,QAC5C,YAAA,EAAY,SAAA;AAAA,QAEZ,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,mBAAmB,CAAA,EACxB;AAAA;AAAA,KACF;AAAA,EAEJ;AAEA,EAAA,IAAI,MAAA,KAAW,kBAAkB,aAAA,EAAe;AAC9C,IAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAO,CAAA,CAAE,+CAA+C,CAAA,EAC/D,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,YAAY,CAAA,CAAA;AAAA,QACjD,YAAA,EAAY,SAAA;AAAA,QAEZ,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,wBAAwB,CAAA,EAC7B;AAAA;AAAA,KACF,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,MAAA,KAAW,kBAAkB,QAAA,EAAU;AACzC,IAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAO,CAAA,CAAE,0CAA0C,CAAA,EAC1D,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,QAAQ,CAAA,CAAA;AAAA,QAC7C,YAAA,EAAY,SAAA;AAAA,QAEZ,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,oBAAoB,CAAA,EACzB;AAAA;AAAA,KACF,EACF,CAAA;AAAA,EAEJ;AACA,EAAA,OAAO,IAAA;AACT;;;;"}
+{"version":3,"file":"UpdatedStatusBadge.esm.js","sources":["../../../src/components/common/UpdatedStatusBadge.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { Flex, Text } from '@backstage/ui';\nimport { Tooltip } from '@material-ui/core';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { UpdatedStatusEnumType } from '../../utils/utilityfunctions';\nimport styles from './UpdatedStatusBadge.module.css';\n\ntype UpdatedStatusBadgeProps = {\n  status?: UpdatedStatusEnumType | 'UPDATING' | 'NONE';\n};\n\nexport function UpdatedStatusBadge(props: UpdatedStatusBadgeProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  if (props.status === 'UPDATED') {\n    return (\n      <span\n        className={`${styles.badge} ${styles.updated}`}\n        aria-label={t('rosStatus.updated')}\n      >\n        <Text as=\"p\" className={styles.text}>\n          {t('rosStatus.updated')}\n        </Text>\n      </span>\n    );\n  }\n\n  if (props.status === 'UPDATING') {\n    return (\n      <span\n        className={`${styles.badge} ${styles.updating}`}\n        aria-label={t('rosStatus.updating')}\n      >\n        <Flex direction=\"row\" gap=\"4px\">\n          <Text as=\"p\" className={styles.text}>\n            {t('rosStatus.updating')}\n          </Text>\n        </Flex>\n      </span>\n    );\n  }\n\n  if (props.status === 'VERY_OUTDATED') {\n    return (\n      <Tooltip title={t('rosStatus.updatedStatus.tooltip.VERY_OUTDATED')}>\n        <span\n          className={`${styles.badge} ${styles.veryOutdated}`}\n          aria-label={t('rosStatus.veryOutdated')}\n        >\n          <Text as=\"p\" className={styles.text}>\n            {t('rosStatus.veryOutdated')}\n          </Text>\n        </span>\n      </Tooltip>\n    );\n  }\n\n  if (props.status === 'OUTDATED') {\n    return (\n      <Tooltip title={t('rosStatus.updatedStatus.tooltip.OUTDATED')}>\n        <span\n          className={`${styles.badge} ${styles.outdated}`}\n          aria-label={t('rosStatus.outdated')}\n        >\n          <Text as=\"p\" className={styles.text}>\n            {t('rosStatus.outdated')}\n          </Text>\n        </span>\n      </Tooltip>\n    );\n  }\n  return null;\n}\n"],"names":[],"mappings":";;;;;;;AAWO,SAAS,mBAAmB,KAAA,EAAgC;AACjE,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,IAAI,KAAA,CAAM,WAAW,SAAA,EAAW;AAC9B,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,OAAO,CAAA,CAAA;AAAA,QAC5C,YAAA,EAAY,EAAE,mBAAmB,CAAA;AAAA,QAEjC,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,mBAAmB,CAAA,EACxB;AAAA;AAAA,KACF;AAAA,EAEJ;AAEA,EAAA,IAAI,KAAA,CAAM,WAAW,UAAA,EAAY;AAC/B,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,QAAQ,CAAA,CAAA;AAAA,QAC7C,YAAA,EAAY,EAAE,oBAAoB,CAAA;AAAA,QAElC,8BAAC,IAAA,EAAA,EAAK,SAAA,EAAU,KAAA,EAAM,GAAA,EAAI,OACxB,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,oBAAoB,GACzB,CAAA,EACF;AAAA;AAAA,KACF;AAAA,EAEJ;AAEA,EAAA,IAAI,KAAA,CAAM,WAAW,eAAA,EAAiB;AACpC,IAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAO,CAAA,CAAE,+CAA+C,CAAA,EAC/D,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,YAAY,CAAA,CAAA;AAAA,QACjD,YAAA,EAAY,EAAE,wBAAwB,CAAA;AAAA,QAEtC,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,wBAAwB,CAAA,EAC7B;AAAA;AAAA,KACF,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,KAAA,CAAM,WAAW,UAAA,EAAY;AAC/B,IAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAO,CAAA,CAAE,0CAA0C,CAAA,EAC1D,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,CAAA,EAAG,MAAA,CAAO,KAAK,CAAA,CAAA,EAAI,OAAO,QAAQ,CAAA,CAAA;AAAA,QAC7C,YAAA,EAAY,EAAE,oBAAoB,CAAA;AAAA,QAElC,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,WAAW,MAAA,CAAO,IAAA,EAC5B,QAAA,EAAA,CAAA,CAAE,oBAAoB,CAAA,EACzB;AAAA;AAAA,KACF,EACF,CAAA;AAAA,EAEJ;AACA,EAAA,OAAO,IAAA;AACT;;;;"}

package/dist/components/common/UpdatedStatusBadge.module.css.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = ".UpdatedStatusBadge-module_badge__L8lzQ {\n  display: flex;\n  align-items: center;\n  padding: 4px 8px;\n  border-radius: 24px;\n  text-align: center;\n  font-size: 12px;\n  width: fit-content;\n}\n.UpdatedStatusBadge-module_text__1DPQ3 {\n  color: var(--ros-gray-900, #000);\n}\n\n.UpdatedStatusBadge-module_pending__9XU9w {\n  background: var(--ros-green-100);\n  border: 1px solid var(--ros-green-500);\n}\n\n.UpdatedStatusBadge-module_veryOutdated__tCijL {\n  background: var(--ros-red-200);\n  border: 1px solid var(--ros-red-400);\n}\n\n.UpdatedStatusBadge-module_outdated__5H9Uw {\n  background: var(--ros-orange-100);\n  border: 1px solid var(--ros-orange-300);\n}\n";
-var styles = {"badge":"UpdatedStatusBadge-module_badge__L8lzQ","text":"UpdatedStatusBadge-module_text__1DPQ3","pending":"UpdatedStatusBadge-module_pending__9XU9w","veryOutdated":"UpdatedStatusBadge-module_veryOutdated__tCijL","outdated":"UpdatedStatusBadge-module_outdated__5H9Uw"};
+var css_248z = ".UpdatedStatusBadge-module_badge__L8lzQ {\n  display: flex;\n  align-items: center;\n  padding: 4px 8px;\n  border-radius: 24px;\n  text-align: center;\n  font-size: 12px;\n  width: fit-content;\n}\n.UpdatedStatusBadge-module_text__1DPQ3 {\n  color: var(--ros-gray-900, #000);\n}\n\n.UpdatedStatusBadge-module_updated__KmG3B {\n  background: var(--ros-green-100);\n  border: 1px solid var(--ros-green-500);\n}\n\n.UpdatedStatusBadge-module_veryOutdated__tCijL {\n  background: var(--ros-red-200);\n  border: 1px solid var(--ros-red-400);\n}\n\n.UpdatedStatusBadge-module_outdated__5H9Uw {\n  background: var(--ros-orange-100);\n  border: 1px solid var(--ros-orange-300);\n}\n\n.UpdatedStatusBadge-module_updating__5Fz9u {\n  background-color: #eaf6ff;\n  border: 1px solid #439ccd;\n}\n";
+var styles = {"badge":"UpdatedStatusBadge-module_badge__L8lzQ","text":"UpdatedStatusBadge-module_text__1DPQ3","updated":"UpdatedStatusBadge-module_updated__KmG3B","veryOutdated":"UpdatedStatusBadge-module_veryOutdated__tCijL","outdated":"UpdatedStatusBadge-module_outdated__5H9Uw","updating":"UpdatedStatusBadge-module_updating__5Fz9u"};
 styleInject(css_248z);
 
 export { styles as default };

package/dist/components/common/typography.esm.js

@@ -1,7 +1,7 @@
 const formLabel = {
   fontSize: "0.875rem",
   fontWeight: 700,
-  textTransform: "uppercase",
+  textTransform: "none",
   color: "inherit"
 };
 const formHelperText = {

package/dist/components/common/typography.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"typography.esm.js","sources":["../../../src/components/common/typography.ts"],"sourcesContent":["import { SxProps, Theme } from '@mui/material/styles';\n\nexport const formLabel: SxProps<Theme> = {\n  fontSize: '0.875rem',\n  fontWeight: 700,\n  textTransform: 'uppercase',\n  color: 'inherit',\n};\n\nexport const formHelperText: SxProps<Theme> = {\n  fontSize: '0.875rem',\n  fontWeight: 400,\n  color: 'inherit',\n  margin: 0,\n};\n"],"names":[],"mappings":"AAEO,MAAM,SAAA,GAA4B;AAAA,EACvC,QAAA,EAAU,UAAA;AAAA,EACV,UAAA,EAAY,GAAA;AAAA,EACZ,aAAA,EAAe,WAAA;AAAA,EACf,KAAA,EAAO;AACT;AAEO,MAAM,cAAA,GAAiC;AAAA,EAC5C,QAAA,EAAU,UAAA;AAAA,EACV,UAAA,EAAY,GAAA;AAAA,EACZ,KAAA,EAAO,SAAA;AAAA,EACP,MAAA,EAAQ;AACV;;;;"}
+{"version":3,"file":"typography.esm.js","sources":["../../../src/components/common/typography.ts"],"sourcesContent":["import { SxProps, Theme } from '@mui/material/styles';\n\nexport const formLabel: SxProps<Theme> = {\n  fontSize: '0.875rem',\n  fontWeight: 700,\n  textTransform: 'none',\n  color: 'inherit',\n};\n\nexport const formHelperText: SxProps<Theme> = {\n  fontSize: '0.875rem',\n  fontWeight: 400,\n  color: 'inherit',\n  margin: 0,\n};\n"],"names":[],"mappings":"AAEO,MAAM,SAAA,GAA4B;AAAA,EACvC,QAAA,EAAU,UAAA;AAAA,EACV,UAAA,EAAY,GAAA;AAAA,EACZ,aAAA,EAAe,MAAA;AAAA,EACf,KAAA,EAAO;AACT;AAEO,MAAM,cAAA,GAAiC;AAAA,EAC5C,QAAA,EAAU,UAAA;AAAA,EACV,UAAA,EAAY,GAAA;AAAA,EACZ,KAAA,EAAO,SAAA;AAAA,EACP,MAAA,EAAQ;AACV;;;;"}

package/dist/components/riScInfo/PublishDialog.esm.js

@@ -1,13 +1,12 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import Alert from '@mui/material/Alert';
-import Button from '@mui/material/Button';
+import { Flex, Button } from '@backstage/ui';
 import Checkbox from '@mui/material/Checkbox';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
 import { RiScDifferenceDialog } from './riScStatus/RiScDifferenceDialog.esm.js';
-import { Flex } from '@backstage/ui';
 import styles from './RiScSelectionCard.module.css.esm.js';
 import DialogComponent from '../dialog/DialogComponent.esm.js';
 
@@ -49,14 +48,14 @@ const RiScPublishDialog = ({
           ) })
         ] }),
         /* @__PURE__ */ jsxs(Flex, { justify: "between", pt: "24px", children: [
-          /* @__PURE__ */ jsx(Button, { variant: "outlined", color: "primary", onClick: handleCancel, children: t("dictionary.cancel") }),
+          /* @__PURE__ */ jsx(Button, { size: "medium", variant: "secondary", onClick: handleCancel, children: t("dictionary.cancel") }),
           /* @__PURE__ */ jsx(
             Button,
             {
-              variant: "contained",
-              color: "primary",
+              size: "medium",
+              variant: "primary",
               onClick: handlePublish,
-              disabled: !riskOwnerApproves,
+              isDisabled: !riskOwnerApproves,
               children: t("dictionary.confirm")
             }
           )

package/dist/components/riScInfo/PublishDialog.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PublishDialog.esm.js","sources":["../../../src/components/riScInfo/PublishDialog.tsx"],"sourcesContent":["import { ReactComponentElement, useState } from 'react';\nimport Alert from '@mui/material/Alert';\nimport Button from '@mui/material/Button';\n\nimport Checkbox from '@mui/material/Checkbox';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport FormControlLabel from '@mui/material/FormControlLabel';\nimport { DifferenceFetchState } from '../../utils/types';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { RiScDifferenceDialog } from './riScStatus/RiScDifferenceDialog';\nimport { Flex } from '@backstage/ui';\nimport styles from './RiScSelectionCard.module.css';\nimport DialogComponent from '../dialog/DialogComponent';\n\ninterface RiScPublishDialogProps {\n  openDialog: boolean;\n  isDeletion: boolean;\n  handleCancel: () => void;\n  handlePublish: () => void;\n  differenceFetchState: DifferenceFetchState;\n}\n\nexport const RiScPublishDialog = ({\n  openDialog,\n  isDeletion,\n  handleCancel,\n  handlePublish,\n  differenceFetchState,\n}: RiScPublishDialogProps): ReactComponentElement<any> => {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const [riskOwnerApproves, setRiskOwnerApproves] = useState<boolean>(false);\n\n  function handleCheckboxInput(event: React.ChangeEvent<HTMLInputElement>) {\n    setRiskOwnerApproves(event.target.checked);\n  }\n\n  return (\n    <DialogComponent\n      isOpen={openDialog}\n      onClick={handleCancel}\n      header={\n        isDeletion\n          ? t('publishDialog.titleDelete')\n          : t('publishDialog.titleUpdate')\n      }\n      className={styles.riScInfoDialog}\n    >\n      <>\n        {!isDeletion && (\n          <RiScDifferenceDialog differenceFetchState={differenceFetchState} />\n        )}\n        <Alert severity=\"info\" icon={false}>\n          <FormControlLabel\n            control={\n              <Checkbox\n                color=\"primary\"\n                checked={riskOwnerApproves}\n                onChange={handleCheckboxInput}\n              />\n            }\n            label={\n              isDeletion\n                ? t('publishDialog.checkboxLabelDelete')\n                : t('publishDialog.checkboxLabelUpdate')\n            }\n          />\n        </Alert>\n      </>\n      <Flex justify=\"between\" pt=\"24px\">\n        <Button variant=\"outlined\" color=\"primary\" onClick={handleCancel}>\n          {t('dictionary.cancel')}\n        </Button>\n        <Button\n          variant=\"contained\"\n          color=\"primary\"\n          onClick={handlePublish}\n          disabled={!riskOwnerApproves}\n        >\n          {t('dictionary.confirm')}\n        </Button>\n      </Flex>\n    </DialogComponent>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AAsBO,MAAM,oBAAoB,CAAC;AAAA,EAChC,UAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF,CAAA,KAA0D;AACxD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAkB,KAAK,CAAA;AAEzE,EAAA,SAAS,oBAAoB,KAAA,EAA4C;AACvE,IAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,OAAO,CAAA;AAAA,EAC3C;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,MAAA,EAAQ,UAAA;AAAA,MACR,OAAA,EAAS,YAAA;AAAA,MACT,QACE,UAAA,GACI,CAAA,CAAE,2BAA2B,CAAA,GAC7B,EAAE,2BAA2B,CAAA;AAAA,MAEnC,WAAW,MAAA,CAAO,cAAA;AAAA,MAElB,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,UAAA,CAAC,UAAA,oBACA,GAAA,CAAC,oBAAA,EAAA,EAAqB,oBAAA,EAA4C,CAAA;AAAA,0BAEpE,GAAA,CAAC,KAAA,EAAA,EAAM,QAAA,EAAS,MAAA,EAAO,MAAM,KAAA,EAC3B,QAAA,kBAAA,GAAA;AAAA,YAAC,gBAAA;AAAA,YAAA;AAAA,cACC,OAAA,kBACE,GAAA;AAAA,gBAAC,QAAA;AAAA,gBAAA;AAAA,kBACC,KAAA,EAAM,SAAA;AAAA,kBACN,OAAA,EAAS,iBAAA;AAAA,kBACT,QAAA,EAAU;AAAA;AAAA,eACZ;AAAA,cAEF,OACE,UAAA,GACI,CAAA,CAAE,mCAAmC,CAAA,GACrC,EAAE,mCAAmC;AAAA;AAAA,WAE7C,EACF;AAAA,SAAA,EACF,CAAA;AAAA,wBACA,IAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,IAAG,MAAA,EACzB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,MAAA,EAAA,EAAO,SAAQ,UAAA,EAAW,KAAA,EAAM,WAAU,OAAA,EAAS,YAAA,EACjD,QAAA,EAAA,CAAA,CAAE,mBAAmB,CAAA,EACxB,CAAA;AAAA,0BACA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,OAAA,EAAQ,WAAA;AAAA,cACR,KAAA,EAAM,SAAA;AAAA,cACN,OAAA,EAAS,aAAA;AAAA,cACT,UAAU,CAAC,iBAAA;AAAA,cAEV,YAAE,oBAAoB;AAAA;AAAA;AACzB,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"PublishDialog.esm.js","sources":["../../../src/components/riScInfo/PublishDialog.tsx"],"sourcesContent":["import { ReactComponentElement, useState } from 'react';\nimport Alert from '@mui/material/Alert';\nimport { Button } from '@backstage/ui';\n\nimport Checkbox from '@mui/material/Checkbox';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport FormControlLabel from '@mui/material/FormControlLabel';\nimport { DifferenceFetchState } from '../../utils/types';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { RiScDifferenceDialog } from './riScStatus/RiScDifferenceDialog';\nimport { Flex } from '@backstage/ui';\nimport styles from './RiScSelectionCard.module.css';\nimport DialogComponent from '../dialog/DialogComponent';\n\ninterface RiScPublishDialogProps {\n  openDialog: boolean;\n  isDeletion: boolean;\n  handleCancel: () => void;\n  handlePublish: () => void;\n  differenceFetchState: DifferenceFetchState;\n}\n\nexport const RiScPublishDialog = ({\n  openDialog,\n  isDeletion,\n  handleCancel,\n  handlePublish,\n  differenceFetchState,\n}: RiScPublishDialogProps): ReactComponentElement<any> => {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const [riskOwnerApproves, setRiskOwnerApproves] = useState<boolean>(false);\n\n  function handleCheckboxInput(event: React.ChangeEvent<HTMLInputElement>) {\n    setRiskOwnerApproves(event.target.checked);\n  }\n\n  return (\n    <DialogComponent\n      isOpen={openDialog}\n      onClick={handleCancel}\n      header={\n        isDeletion\n          ? t('publishDialog.titleDelete')\n          : t('publishDialog.titleUpdate')\n      }\n      className={styles.riScInfoDialog}\n    >\n      <>\n        {!isDeletion && (\n          <RiScDifferenceDialog differenceFetchState={differenceFetchState} />\n        )}\n        <Alert severity=\"info\" icon={false}>\n          <FormControlLabel\n            control={\n              <Checkbox\n                color=\"primary\"\n                checked={riskOwnerApproves}\n                onChange={handleCheckboxInput}\n              />\n            }\n            label={\n              isDeletion\n                ? t('publishDialog.checkboxLabelDelete')\n                : t('publishDialog.checkboxLabelUpdate')\n            }\n          />\n        </Alert>\n      </>\n      <Flex justify=\"between\" pt=\"24px\">\n        <Button size=\"medium\" variant=\"secondary\" onClick={handleCancel}>\n          {t('dictionary.cancel')}\n        </Button>\n        <Button\n          size=\"medium\"\n          variant=\"primary\"\n          onClick={handlePublish}\n          isDisabled={!riskOwnerApproves}\n        >\n          {t('dictionary.confirm')}\n        </Button>\n      </Flex>\n    </DialogComponent>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;AAsBO,MAAM,oBAAoB,CAAC;AAAA,EAChC,UAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF,CAAA,KAA0D;AACxD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAkB,KAAK,CAAA;AAEzE,EAAA,SAAS,oBAAoB,KAAA,EAA4C;AACvE,IAAA,oBAAA,CAAqB,KAAA,CAAM,OAAO,OAAO,CAAA;AAAA,EAC3C;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,MAAA,EAAQ,UAAA;AAAA,MACR,OAAA,EAAS,YAAA;AAAA,MACT,QACE,UAAA,GACI,CAAA,CAAE,2BAA2B,CAAA,GAC7B,EAAE,2BAA2B,CAAA;AAAA,MAEnC,WAAW,MAAA,CAAO,cAAA;AAAA,MAElB,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,UAAA,CAAC,UAAA,oBACA,GAAA,CAAC,oBAAA,EAAA,EAAqB,oBAAA,EAA4C,CAAA;AAAA,0BAEpE,GAAA,CAAC,KAAA,EAAA,EAAM,QAAA,EAAS,MAAA,EAAO,MAAM,KAAA,EAC3B,QAAA,kBAAA,GAAA;AAAA,YAAC,gBAAA;AAAA,YAAA;AAAA,cACC,OAAA,kBACE,GAAA;AAAA,gBAAC,QAAA;AAAA,gBAAA;AAAA,kBACC,KAAA,EAAM,SAAA;AAAA,kBACN,OAAA,EAAS,iBAAA;AAAA,kBACT,QAAA,EAAU;AAAA;AAAA,eACZ;AAAA,cAEF,OACE,UAAA,GACI,CAAA,CAAE,mCAAmC,CAAA,GACrC,EAAE,mCAAmC;AAAA;AAAA,WAE7C,EACF;AAAA,SAAA,EACF,CAAA;AAAA,wBACA,IAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,IAAG,MAAA,EACzB,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,MAAA,EAAA,EAAO,MAAK,QAAA,EAAS,OAAA,EAAQ,aAAY,OAAA,EAAS,YAAA,EAChD,QAAA,EAAA,CAAA,CAAE,mBAAmB,CAAA,EACxB,CAAA;AAAA,0BACA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAQ,SAAA;AAAA,cACR,OAAA,EAAS,aAAA;AAAA,cACT,YAAY,CAAC,iBAAA;AAAA,cAEZ,YAAE,oBAAoB;AAAA;AAAA;AACzB,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/components/scenarioDrawer/ScenarioDrawer.esm.js

@@ -4,7 +4,7 @@ import DeleteIcon from '@mui/icons-material/Delete';
 import { AlertTitle } from '@mui/material';
 import AlertBar from '../common/AlertBar/AlertBar.esm.js';
 import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
+import { Button, Flex, Text } from '@backstage/ui';
 import CircularProgress from '@mui/material/CircularProgress';
 import Drawer from '@mui/material/Drawer';
 import { useState, useRef, useEffect } from 'react';
@@ -20,7 +20,6 @@ import { ActionsSection } from './components/ActionsSection.esm.js';
 import { DeleteScenarioConfirmation } from './components/DeleteConfirmation.esm.js';
 import ScenarioForm from './components/RiskFormSection.esm.js';
 import ScopeFormSection from './components/ScopeFormSection.esm.js';
-import { Flex, Text } from '@backstage/ui';
 import { useBackstageContext } from '../../contexts/BackstageContext.esm.js';
 import styles from '../common/alertBar.module.css.esm.js';
 import { ScopeSection } from './components/ScopeSection.esm.js';
@@ -123,8 +122,8 @@ function ScenarioDrawer() {
               !isEditing && isEditingAllowed && /* @__PURE__ */ jsx(
                 Button,
                 {
-                  color: "primary",
-                  variant: "contained",
+                  size: "medium",
+                  variant: "primary",
                   onClick: () => setIsEditing(true),
                   children: t("dictionary.edit")
                 }
@@ -132,8 +131,8 @@ function ScenarioDrawer() {
               /* @__PURE__ */ jsx(
                 Button,
                 {
-                  variant: "outlined",
-                  color: "primary",
+                  size: "medium",
+                  variant: "secondary",
                   onClick: isEditing ? onCancel : onClose,
                   children: t(isEditing ? "dictionary.cancel" : "dictionary.close")
                 }
@@ -188,10 +187,10 @@ function ScenarioDrawer() {
               isEditing && /* @__PURE__ */ jsxs(
                 Button,
                 {
-                  color: "primary",
-                  variant: "contained",
+                  size: "medium",
+                  variant: "primary",
                   onClick: onSubmit,
-                  disabled: !formMethods.formState.isDirty || updateStatus.isLoading,
+                  isDisabled: !formMethods.formState.isDirty || updateStatus.isLoading,
                   children: [
                     t("dictionary.save"),
                     updateStatus.isLoading && /* @__PURE__ */ jsx(
@@ -207,11 +206,10 @@ function ScenarioDrawer() {
               isEditingAllowed && /* @__PURE__ */ jsx("div", { ref: deleteScenarioRef, children: /* @__PURE__ */ jsx(
                 Button,
                 {
-                  startIcon: /* @__PURE__ */ jsx(DeleteIcon, {}),
-                  variant: "text",
-                  color: "primary",
+                  iconStart: /* @__PURE__ */ jsx(DeleteIcon, {}),
+                  size: "medium",
+                  variant: "tertiary",
                   onClick: () => setDeleteConfirmationIsOpen(true),
-                  sx: { marginLeft: "auto" },
                   children: t("scenarioDrawer.deleteScenarioButton")
                 }
               ) })