@kartverket/backstage-plugin-risk-scorecard 3.10.3 → 3.10.4

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

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useState, useEffect } from 'react';
+import { forwardRef, useState, useRef, useEffect } from 'react';
 import FormControl from '@mui/material/FormControl';
 import FormHelperText from '@mui/material/FormHelperText';
 import FormLabel from '@mui/material/FormLabel';
@@ -23,9 +23,36 @@ const MarkdownInput = forwardRef(
     const [markdownContent, setMarkdownContent] = useState(
       value
     );
+    const wrapperRef = useRef(null);
     useEffect(() => {
       setMarkdownContent(value);
     }, [value]);
+    useEffect(() => {
+      const root = wrapperRef.current;
+      if (!root) return () => {
+      };
+      const handleKeyDown = (e) => {
+        if (e.key !== "Tab") return;
+        const active = document.activeElement;
+        if (!active || !root.contains(active)) return;
+        e.preventDefault();
+        e.stopPropagation();
+        const focusable = Array.from(
+          document.querySelectorAll(
+            'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+          )
+        ).filter((el) => !el.hasAttribute("disabled"));
+        const index = focusable.indexOf(active);
+        const direction = e.shiftKey ? -1 : 1;
+        const nextIndex = index + direction;
+        const next = focusable[nextIndex] ?? (direction === 1 ? focusable[0] : focusable[focusable.length - 1]);
+        next?.focus();
+      };
+      root.addEventListener("keydown", handleKeyDown, true);
+      return () => {
+        root.removeEventListener("keydown", handleKeyDown, true);
+      };
+    }, [wrapperRef]);
     const handleMarkdownChange = (newValue) => {
       setMarkdownContent(newValue || "");
       onMarkdownChange?.(newValue || "");
@@ -50,6 +77,7 @@ const MarkdownInput = forwardRef(
       /* @__PURE__ */ jsx(
         "div",
         {
+          ref: wrapperRef,
           onFocusCapture,
           "data-color-mode": getActiveTheme(),
           className: styles.MarkDownInputWrapper,

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

@@ -1 +1 @@
-{"version":3,"file":"MarkdownInput.esm.js","sources":["../../../../src/components/common/MarkdownInput/MarkdownInput.tsx"],"sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport FormControl from '@mui/material/FormControl';\nimport FormHelperText from '@mui/material/FormHelperText';\nimport FormLabel from '@mui/material/FormLabel';\nimport MDEditor from '@uiw/react-md-editor';\nimport { formHelperText, formLabel } from '../typography';\nimport { TextFieldProps } from '@material-ui/core';\nimport classNames from 'classnames';\nimport { getActiveTheme } from '../../../utils/utilityfunctions';\nimport styles from './MarkdownInput.module.css';\n\ntype Props = TextFieldProps & {\n  sublabel?: string;\n  value?: string;\n  onMarkdownChange?: (markdown: string) => void;\n  minRows?: number;\n};\n\nexport const MarkdownInput = forwardRef<HTMLDivElement, Props>(\n  (\n    {\n      label,\n      sublabel,\n      error,\n      helperText,\n      minRows,\n      value,\n      onMarkdownChange,\n      disabled = false,\n    },\n    ref,\n  ) => {\n    const [markdownContent, setMarkdownContent] = useState<string | undefined>(\n      value,\n    );\n\n    useEffect(() => {\n      setMarkdownContent(value);\n    }, [value]);\n\n    const handleMarkdownChange = (newValue: string | undefined) => {\n      setMarkdownContent(newValue || '');\n      onMarkdownChange?.(newValue || '');\n    };\n\n    const onFocusCapture = (event: React.FocusEvent<HTMLDivElement>) => {\n      if (event.relatedTarget) {\n        const root = event.currentTarget as HTMLDivElement;\n        const target = root.querySelector(\n          'textarea, [contenteditable=\"true\"]',\n        ) as HTMLElement | null;\n        if (target) {\n          setTimeout(() => target.focus());\n        }\n      }\n    };\n    const editorClassName = classNames(styles.MarkDownInput, {\n      [styles['MarkDownInput--disabled']]: disabled,\n    });\n\n    return (\n      <FormControl className={styles.MarkDownInputFormControl} error={error}>\n        {label && <FormLabel sx={formLabel}>{label}</FormLabel>}\n        {sublabel && (\n          <FormHelperText sx={formHelperText}>{sublabel}</FormHelperText>\n        )}\n        <div\n          onFocusCapture={onFocusCapture}\n          data-color-mode={getActiveTheme()}\n          className={styles.MarkDownInputWrapper}\n        >\n          <MDEditor\n            ref={ref}\n            value={markdownContent}\n            onChange={handleMarkdownChange}\n            preview=\"edit\"\n            height={minRows ? minRows * 24 : 64}\n            className={editorClassName}\n          />\n        </div>\n        {helperText && <FormHelperText>{helperText}</FormHelperText>}\n      </FormControl>\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;;;;;;AAkBO,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CACE;AAAA,IACE,KAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,gBAAA;AAAA,IACA,QAAA,GAAW;AAAA,KAEb,GAAA,KACG;AACH,IAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,QAAA;AAAA,MAC5C;AAAA,KACF;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,kBAAA,CAAmB,KAAK,CAAA;AAAA,IAC1B,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,IAAA,MAAM,oBAAA,GAAuB,CAAC,QAAA,KAAiC;AAC7D,MAAA,kBAAA,CAAmB,YAAY,EAAE,CAAA;AACjC,MAAA,gBAAA,GAAmB,YAAY,EAAE,CAAA;AAAA,IACnC,CAAA;AAEA,IAAA,MAAM,cAAA,GAAiB,CAAC,KAAA,KAA4C;AAClE,MAAA,IAAI,MAAM,aAAA,EAAe;AACvB,QAAA,MAAM,OAAO,KAAA,CAAM,aAAA;AACnB,QAAA,MAAM,SAAS,IAAA,CAAK,aAAA;AAAA,UAClB;AAAA,SACF;AACA,QAAA,IAAI,MAAA,EAAQ;AACV,UAAA,UAAA,CAAW,MAAM,MAAA,CAAO,KAAA,EAAO,CAAA;AAAA,QACjC;AAAA,MACF;AAAA,IACF,CAAA;AACA,IAAA,MAAM,eAAA,GAAkB,UAAA,CAAW,MAAA,CAAO,aAAA,EAAe;AAAA,MACvD,CAAC,MAAA,CAAO,yBAAyB,CAAC,GAAG;AAAA,KACtC,CAAA;AAED,IAAA,uBACE,IAAA,CAAC,WAAA,EAAA,EAAY,SAAA,EAAW,MAAA,CAAO,0BAA0B,KAAA,EACtD,QAAA,EAAA;AAAA,MAAA,KAAA,oBAAS,GAAA,CAAC,SAAA,EAAA,EAAU,EAAA,EAAI,SAAA,EAAY,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,MAC1C,QAAA,oBACC,GAAA,CAAC,cAAA,EAAA,EAAe,EAAA,EAAI,gBAAiB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,sBAEhD,GAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,mBAAiB,cAAA,EAAe;AAAA,UAChC,WAAW,MAAA,CAAO,oBAAA;AAAA,UAElB,QAAA,kBAAA,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,GAAA;AAAA,cACA,KAAA,EAAO,eAAA;AAAA,cACP,QAAA,EAAU,oBAAA;AAAA,cACV,OAAA,EAAQ,MAAA;AAAA,cACR,MAAA,EAAQ,OAAA,GAAU,OAAA,GAAU,EAAA,GAAK,EAAA;AAAA,cACjC,SAAA,EAAW;AAAA;AAAA;AACb;AAAA,OACF;AAAA,MACC,UAAA,oBAAc,GAAA,CAAC,cAAA,EAAA,EAAgB,QAAA,EAAA,UAAA,EAAW;AAAA,KAAA,EAC7C,CAAA;AAAA,EAEJ;AACF;;;;"}
+{"version":3,"file":"MarkdownInput.esm.js","sources":["../../../../src/components/common/MarkdownInput/MarkdownInput.tsx"],"sourcesContent":["import { forwardRef, useState, useEffect, useRef } from 'react';\nimport FormControl from '@mui/material/FormControl';\nimport FormHelperText from '@mui/material/FormHelperText';\nimport FormLabel from '@mui/material/FormLabel';\nimport MDEditor from '@uiw/react-md-editor';\nimport { formHelperText, formLabel } from '../typography';\nimport { TextFieldProps } from '@material-ui/core';\nimport classNames from 'classnames';\nimport { getActiveTheme } from '../../../utils/utilityfunctions';\nimport styles from './MarkdownInput.module.css';\n\ntype Props = TextFieldProps & {\n  sublabel?: string;\n  value?: string;\n  onMarkdownChange?: (markdown: string) => void;\n  minRows?: number;\n};\n\nexport const MarkdownInput = forwardRef<HTMLDivElement, Props>(\n  (\n    {\n      label,\n      sublabel,\n      error,\n      helperText,\n      minRows,\n      value,\n      onMarkdownChange,\n      disabled = false,\n    },\n    ref,\n  ) => {\n    const [markdownContent, setMarkdownContent] = useState<string | undefined>(\n      value,\n    );\n\n    const wrapperRef = useRef<HTMLDivElement | null>(null);\n\n    useEffect(() => {\n      setMarkdownContent(value);\n    }, [value]);\n\n    useEffect(() => {\n      const root = wrapperRef.current;\n      if (!root) return () => {};\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        if (e.key !== 'Tab') return;\n        const active = document.activeElement as HTMLElement | null;\n        if (!active || !root.contains(active)) return;\n        e.preventDefault();\n        e.stopPropagation();\n\n        const focusable = Array.from(\n          document.querySelectorAll<HTMLElement>(\n            'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n          ),\n        ).filter(el => !el.hasAttribute('disabled'));\n\n        const index = focusable.indexOf(active);\n        const direction = e.shiftKey ? -1 : 1;\n        const nextIndex = index + direction;\n        const next =\n          focusable[nextIndex] ??\n          (direction === 1 ? focusable[0] : focusable[focusable.length - 1]);\n        next?.focus();\n      };\n\n      root.addEventListener('keydown', handleKeyDown, true);\n\n      return () => {\n        root.removeEventListener('keydown', handleKeyDown, true);\n      };\n    }, [wrapperRef]);\n\n    const handleMarkdownChange = (newValue: string | undefined) => {\n      setMarkdownContent(newValue || '');\n      onMarkdownChange?.(newValue || '');\n    };\n\n    const onFocusCapture = (event: React.FocusEvent<HTMLDivElement>) => {\n      if (event.relatedTarget) {\n        const root = event.currentTarget as HTMLDivElement;\n        const target = root.querySelector(\n          'textarea, [contenteditable=\"true\"]',\n        ) as HTMLElement | null;\n        if (target) {\n          setTimeout(() => target.focus());\n        }\n      }\n    };\n    const editorClassName = classNames(styles.MarkDownInput, {\n      [styles['MarkDownInput--disabled']]: disabled,\n    });\n\n    return (\n      <FormControl className={styles.MarkDownInputFormControl} error={error}>\n        {label && <FormLabel sx={formLabel}>{label}</FormLabel>}\n        {sublabel && (\n          <FormHelperText sx={formHelperText}>{sublabel}</FormHelperText>\n        )}\n        <div\n          ref={wrapperRef}\n          onFocusCapture={onFocusCapture}\n          data-color-mode={getActiveTheme()}\n          className={styles.MarkDownInputWrapper}\n        >\n          <MDEditor\n            ref={ref}\n            value={markdownContent}\n            onChange={handleMarkdownChange}\n            preview=\"edit\"\n            height={minRows ? minRows * 24 : 64}\n            className={editorClassName}\n          />\n        </div>\n        {helperText && <FormHelperText>{helperText}</FormHelperText>}\n      </FormControl>\n    );\n  },\n);\n"],"names":[],"mappings":"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"}

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

@@ -86,7 +86,7 @@ function ActionFormItem({
                 value,
                 onMarkdownChange: onChange,
                 error: !!error,
-                minRows: 4
+                minRows: 8
               }
             )
           }

package/dist/components/scenarioDrawer/components/ActionFormItem.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionFormItem.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ActionFormItem.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport Box from '@mui/material/Box';\nimport IconButton from '@mui/material/IconButton';\nimport {\n  Controller,\n  UseFieldArrayRemove,\n  UseFormReturn,\n} from 'react-hook-form';\nimport {\n  ActionStatusOptions,\n  urlRegExpPattern,\n} from '../../../utils/constants';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { FormScenario } from '../../../utils/types';\nimport { actionStatusOptionsToTranslationKeys } from '../../../utils/utilityfunctions';\nimport { Input } from '../../common/Input';\nimport { MarkdownInput } from '../../common/MarkdownInput';\nimport { Select } from '../../common/Select';\nimport HelpIcon from '@mui/icons-material/Help';\nimport { Tooltip } from '@material-ui/core';\nimport { Text } from '@backstage/ui';\n\ntype ActionFormItemProps = {\n  formMethods: UseFormReturn<FormScenario>;\n  index: number;\n  remove: UseFieldArrayRemove;\n  showTitleNumber?: boolean;\n  handleDelete?: () => void;\n};\n\nexport function ActionFormItem({\n  formMethods,\n  index,\n  remove,\n  showTitleNumber = true,\n  handleDelete,\n}: ActionFormItemProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const { control, register, formState } = formMethods;\n\n  const actionStatusOptions = Object.values(ActionStatusOptions).map(\n    actionStatus => ({\n      value: actionStatus,\n      /* @ts-ignore Because ts can't typecheck strings against our keys */\n      renderedValue: t(actionStatusOptionsToTranslationKeys[actionStatus]),\n    }),\n  );\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'grid',\n          gap: '24px',\n          padding: 0,\n        }}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            alignItems: 'center',\n          }}\n        >\n          {showTitleNumber ? (\n            <Text variant=\"title-x-small\" weight=\"bold\">\n              {t('dictionary.measure')} {index + 1}\n            </Text>\n          ) : (\n            <Text variant=\"title-x-small\" weight=\"bold\">\n              {t('dictionary.edit')}\n            </Text>\n          )}\n          <IconButton\n            onClick={() => (handleDelete ? handleDelete() : remove(index))}\n            color=\"primary\"\n          >\n            <DeleteIcon aria-label=\"Delete\" />\n          </IconButton>\n        </Box>\n        <Input\n          required\n          {...register(`actions.${index}.title`, { required: true })}\n          error={formState.errors?.actions?.[index]?.title !== undefined}\n          label={t('dictionary.title')}\n          helperText={\n            formState.errors?.actions?.[index]?.title &&\n            t('scenarioDrawer.measureTab.addMeasureTitleError')\n          }\n        />\n        <Controller\n          control={control}\n          name={`actions.${index}.description`}\n          render={({ field: { onChange, value }, fieldState: { error } }) => (\n            <MarkdownInput\n              label={t('dictionary.description')}\n              value={value}\n              onMarkdownChange={onChange}\n              error={!!error}\n              minRows={4}\n            />\n          )}\n        />\n        <Box\n          sx={{\n            display: 'grid',\n            gridTemplateColumns: '2fr 1fr',\n            gap: '24px',\n          }}\n        >\n          <Input\n            {...register(`actions.${index}.url`, {\n              pattern: {\n                value: urlRegExpPattern,\n                message: t('scenarioDrawer.action.urlError'),\n              },\n            })}\n            label={<UrlLabel />}\n            helperText={formState.errors.actions?.[index]?.url?.message}\n            error={!!formState.errors.actions?.[index]?.url?.message}\n          />\n          <Select<FormScenario>\n            required\n            control={control}\n            name={`actions.${index}.status`}\n            label={t('dictionary.status')}\n            options={actionStatusOptions}\n          />\n        </Box>\n      </Box>\n    </>\n  );\n}\n\nexport function UrlLabel(): JSX.Element {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        gap: 1,\n        alignItems: 'center',\n      }}\n    >\n      {t('dictionary.url')}\n      <Tooltip\n        title={\n          <Text variant=\"body-large\" style={{ color: 'white' }}>\n            {t('scenarioDrawer.measureTab.urlDescription')}\n          </Text>\n        }\n        arrow\n      >\n        <HelpIcon color=\"primary\" />\n      </Tooltip>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA+BO,SAAS,cAAA,CAAe;AAAA,EAC7B,WAAA;AAAA,EACA,KAAA;AAAA,EACA,MAAA;AAAA,EACA,eAAA,GAAkB,IAAA;AAAA,EAClB;AACF,CAAA,EAAwB;AACtB,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,SAAA,EAAU,GAAI,WAAA;AAEzC,EAAA,MAAM,mBAAA,GAAsB,MAAA,CAAO,MAAA,CAAO,mBAAmB,CAAA,CAAE,GAAA;AAAA,IAC7D,CAAA,YAAA,MAAiB;AAAA,MACf,KAAA,EAAO,YAAA;AAAA;AAAA,MAEP,aAAA,EAAe,CAAA,CAAE,oCAAA,CAAqC,YAAY,CAAC;AAAA,KACrE;AAAA,GACF;AAEA,EAAA,uBACE,GAAA,CAAA,QAAA,EAAA,EACE,QAAA,kBAAA,IAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,EAAA,EAAI;AAAA,QACF,OAAA,EAAS,MAAA;AAAA,QACT,GAAA,EAAK,MAAA;AAAA,QACL,OAAA,EAAS;AAAA,OACX;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,GAAA;AAAA,UAAA;AAAA,YACC,EAAA,EAAI;AAAA,cACF,OAAA,EAAS,MAAA;AAAA,cACT,cAAA,EAAgB,eAAA;AAAA,cAChB,UAAA,EAAY;AAAA,aACd;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,eAAA,mBACC,IAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,eAAA,EAAgB,QAAO,MAAA,EAClC,QAAA,EAAA;AAAA,gBAAA,CAAA,CAAE,oBAAoB,CAAA;AAAA,gBAAE,GAAA;AAAA,gBAAE,KAAA,GAAQ;AAAA,eAAA,EACrC,CAAA,uBAEC,IAAA,EAAA,EAAK,OAAA,EAAQ,iBAAgB,MAAA,EAAO,MAAA,EAClC,QAAA,EAAA,CAAA,CAAE,iBAAiB,CAAA,EACtB,CAAA;AAAA,8BAEF,GAAA;AAAA,gBAAC,UAAA;AAAA,gBAAA;AAAA,kBACC,SAAS,MAAO,YAAA,GAAe,YAAA,EAAa,GAAI,OAAO,KAAK,CAAA;AAAA,kBAC5D,KAAA,EAAM,SAAA;AAAA,kBAEN,QAAA,kBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,YAAA,EAAW,QAAA,EAAS;AAAA;AAAA;AAClC;AAAA;AAAA,SACF;AAAA,wBACA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,QAAA,EAAQ,IAAA;AAAA,YACP,GAAG,SAAS,CAAA,QAAA,EAAW,KAAK,UAAU,EAAE,QAAA,EAAU,MAAM,CAAA;AAAA,YACzD,OAAO,SAAA,CAAU,MAAA,EAAQ,OAAA,GAAU,KAAK,GAAG,KAAA,KAAU,MAAA;AAAA,YACrD,KAAA,EAAO,EAAE,kBAAkB,CAAA;AAAA,YAC3B,UAAA,EACE,UAAU,MAAA,EAAQ,OAAA,GAAU,KAAK,CAAA,EAAG,KAAA,IACpC,EAAE,gDAAgD;AAAA;AAAA,SAEtD;AAAA,wBACA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,OAAA;AAAA,YACA,IAAA,EAAM,WAAW,KAAK,CAAA,YAAA,CAAA;AAAA,YACtB,MAAA,EAAQ,CAAC,EAAE,KAAA,EAAO,EAAE,QAAA,EAAU,KAAA,EAAM,EAAG,UAAA,EAAY,EAAE,KAAA,EAAM,EAAE,qBAC3D,GAAA;AAAA,cAAC,aAAA;AAAA,cAAA;AAAA,gBACC,KAAA,EAAO,EAAE,wBAAwB,CAAA;AAAA,gBACjC,KAAA;AAAA,gBACA,gBAAA,EAAkB,QAAA;AAAA,gBAClB,KAAA,EAAO,CAAC,CAAC,KAAA;AAAA,gBACT,OAAA,EAAS;AAAA;AAAA;AACX;AAAA,SAEJ;AAAA,wBACA,IAAA;AAAA,UAAC,GAAA;AAAA,UAAA;AAAA,YACC,EAAA,EAAI;AAAA,cACF,OAAA,EAAS,MAAA;AAAA,cACT,mBAAA,EAAqB,SAAA;AAAA,cACrB,GAAA,EAAK;AAAA,aACP;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,KAAA;AAAA,gBAAA;AAAA,kBACE,GAAG,QAAA,CAAS,CAAA,QAAA,EAAW,KAAK,CAAA,IAAA,CAAA,EAAQ;AAAA,oBACnC,OAAA,EAAS;AAAA,sBACP,KAAA,EAAO,gBAAA;AAAA,sBACP,OAAA,EAAS,EAAE,gCAAgC;AAAA;AAC7C,mBACD,CAAA;AAAA,kBACD,KAAA,sBAAQ,QAAA,EAAA,EAAS,CAAA;AAAA,kBACjB,YAAY,SAAA,CAAU,MAAA,CAAO,OAAA,GAAU,KAAK,GAAG,GAAA,EAAK,OAAA;AAAA,kBACpD,KAAA,EAAO,CAAC,CAAC,SAAA,CAAU,OAAO,OAAA,GAAU,KAAK,GAAG,GAAA,EAAK;AAAA;AAAA,eACnD;AAAA,8BACA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,QAAA,EAAQ,IAAA;AAAA,kBACR,OAAA;AAAA,kBACA,IAAA,EAAM,WAAW,KAAK,CAAA,OAAA,CAAA;AAAA,kBACtB,KAAA,EAAO,EAAE,mBAAmB,CAAA;AAAA,kBAC5B,OAAA,EAAS;AAAA;AAAA;AACX;AAAA;AAAA;AACF;AAAA;AAAA,GACF,EACF,CAAA;AAEJ;AAEO,SAAS,QAAA,GAAwB;AACtC,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,uBACE,IAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,EAAA,EAAI;AAAA,QACF,OAAA,EAAS,MAAA;AAAA,QACT,GAAA,EAAK,CAAA;AAAA,QACL,UAAA,EAAY;AAAA,OACd;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,CAAA,CAAE,gBAAgB,CAAA;AAAA,wBACnB,GAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,KAAA,kBACE,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EAAa,KAAA,EAAO,EAAE,KAAA,EAAO,OAAA,EAAQ,EAChD,QAAA,EAAA,CAAA,CAAE,0CAA0C,CAAA,EAC/C,CAAA;AAAA,YAEF,KAAA,EAAK,IAAA;AAAA,YAEL,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,SAAA,EAAU;AAAA;AAAA;AAC5B;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"ActionFormItem.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ActionFormItem.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport Box from '@mui/material/Box';\nimport IconButton from '@mui/material/IconButton';\nimport {\n  Controller,\n  UseFieldArrayRemove,\n  UseFormReturn,\n} from 'react-hook-form';\nimport {\n  ActionStatusOptions,\n  urlRegExpPattern,\n} from '../../../utils/constants';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { FormScenario } from '../../../utils/types';\nimport { actionStatusOptionsToTranslationKeys } from '../../../utils/utilityfunctions';\nimport { Input } from '../../common/Input';\nimport { MarkdownInput } from '../../common/MarkdownInput';\nimport { Select } from '../../common/Select';\nimport HelpIcon from '@mui/icons-material/Help';\nimport { Tooltip } from '@material-ui/core';\nimport { Text } from '@backstage/ui';\n\ntype ActionFormItemProps = {\n  formMethods: UseFormReturn<FormScenario>;\n  index: number;\n  remove: UseFieldArrayRemove;\n  showTitleNumber?: boolean;\n  handleDelete?: () => void;\n};\n\nexport function ActionFormItem({\n  formMethods,\n  index,\n  remove,\n  showTitleNumber = true,\n  handleDelete,\n}: ActionFormItemProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const { control, register, formState } = formMethods;\n\n  const actionStatusOptions = Object.values(ActionStatusOptions).map(\n    actionStatus => ({\n      value: actionStatus,\n      /* @ts-ignore Because ts can't typecheck strings against our keys */\n      renderedValue: t(actionStatusOptionsToTranslationKeys[actionStatus]),\n    }),\n  );\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'grid',\n          gap: '24px',\n          padding: 0,\n        }}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            alignItems: 'center',\n          }}\n        >\n          {showTitleNumber ? (\n            <Text variant=\"title-x-small\" weight=\"bold\">\n              {t('dictionary.measure')} {index + 1}\n            </Text>\n          ) : (\n            <Text variant=\"title-x-small\" weight=\"bold\">\n              {t('dictionary.edit')}\n            </Text>\n          )}\n          <IconButton\n            onClick={() => (handleDelete ? handleDelete() : remove(index))}\n            color=\"primary\"\n          >\n            <DeleteIcon aria-label=\"Delete\" />\n          </IconButton>\n        </Box>\n        <Input\n          required\n          {...register(`actions.${index}.title`, { required: true })}\n          error={formState.errors?.actions?.[index]?.title !== undefined}\n          label={t('dictionary.title')}\n          helperText={\n            formState.errors?.actions?.[index]?.title &&\n            t('scenarioDrawer.measureTab.addMeasureTitleError')\n          }\n        />\n        <Controller\n          control={control}\n          name={`actions.${index}.description`}\n          render={({ field: { onChange, value }, fieldState: { error } }) => (\n            <MarkdownInput\n              label={t('dictionary.description')}\n              value={value}\n              onMarkdownChange={onChange}\n              error={!!error}\n              minRows={8}\n            />\n          )}\n        />\n        <Box\n          sx={{\n            display: 'grid',\n            gridTemplateColumns: '2fr 1fr',\n            gap: '24px',\n          }}\n        >\n          <Input\n            {...register(`actions.${index}.url`, {\n              pattern: {\n                value: urlRegExpPattern,\n                message: t('scenarioDrawer.action.urlError'),\n              },\n            })}\n            label={<UrlLabel />}\n            helperText={formState.errors.actions?.[index]?.url?.message}\n            error={!!formState.errors.actions?.[index]?.url?.message}\n          />\n          <Select<FormScenario>\n            required\n            control={control}\n            name={`actions.${index}.status`}\n            label={t('dictionary.status')}\n            options={actionStatusOptions}\n          />\n        </Box>\n      </Box>\n    </>\n  );\n}\n\nexport function UrlLabel(): JSX.Element {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        gap: 1,\n        alignItems: 'center',\n      }}\n    >\n      {t('dictionary.url')}\n      <Tooltip\n        title={\n          <Text variant=\"body-large\" style={{ color: 'white' }}>\n            {t('scenarioDrawer.measureTab.urlDescription')}\n          </Text>\n        }\n        arrow\n      >\n        <HelpIcon color=\"primary\" />\n      </Tooltip>\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/scenarioTable/ActionsCard.esm.js

@@ -21,7 +21,7 @@ import UpdatedStatusBadge from '../common/UpdatedStatusBadge.esm.js';
 function ActionsCard(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const { profileInfo } = useBackstageContext();
-  const { filteredData, scenario, showUpdatedBadge } = props;
+  const { filteredData, scenario } = props;
   const [pendingUpdatedIDs, setPendingUpdatedIDs] = useState([]);
   const [pendingStatusById, setPendingStatusById] = useState({});
   const { isActionExpanded, toggleActionExpanded, submitEditedScenarioToRiSc } = useScenario();
@@ -95,23 +95,24 @@ function ActionsCard(props) {
                 /* @__PURE__ */ jsx(
                   IconButton,
                   {
+                    size: "small",
                     onClick: (e) => {
                       e.stopPropagation();
                       toggleActionExpanded(action.ID);
                     },
-                    children: isExpanded ? /* @__PURE__ */ jsx("i", { className: "ri-arrow-up-s-line" }) : /* @__PURE__ */ jsx("i", { className: "ri-arrow-down-s-line" })
+                    children: isExpanded ? /* @__PURE__ */ jsx("i", { className: "ri-arrow-down-s-line" }) : /* @__PURE__ */ jsx("i", { className: "ri-arrow-right-s-line" })
                   }
                 ),
                 /* @__PURE__ */ jsxs(Flex, { direction: "column", align: "start", gap: "1", children: [
                   (() => {
                     if (isPending) {
-                      return showUpdatedBadge ? /* @__PURE__ */ jsx(
+                      return /* @__PURE__ */ jsx(
                         UpdatedStatusBadge,
                         {
                           status: action.updatedStatus,
                           isPending: true
                         }
-                      ) : null;
+                      );
                     }
                     return /* @__PURE__ */ jsx(UpdatedStatusBadge, { status: action.updatedStatus });
                   })(),

package/dist/components/scenarioTable/ActionsCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsCard.esm.js","sources":["../../../src/components/scenarioTable/ActionsCard.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { Box, Flex, Text } from '@backstage/ui';\nimport { Divider } from '@mui/material';\nimport Collapse from '@mui/material/Collapse';\nimport IconButton from '@mui/material/IconButton';\nimport Link from '@mui/material/Link';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  KeyboardEvent,\n  MouseEvent,\n} from 'react';\nimport { DualButtonWithMenu } from '../../components/common/DualButtonWithMenu';\nimport { useScenario } from '../../contexts/ScenarioContext';\nimport { ActionStatusOptions } from '../../utils/constants';\nimport { useDebounce } from '../../utils/hooks';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { Action, Scenario } from '../../utils/types';\nimport {\n  actionStatusOptionsToTranslationKeys,\n  getActionStatusButtonClass,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions';\nimport { Markdown } from '../common/Markdown';\nimport { body2 } from '../common/typography';\nimport { useBackstageContext } from '../../contexts/BackstageContext.tsx';\nimport { ScenarioLastUpdatedLabel } from '../scenario/ScenarioLastUpdatedLabel.tsx';\nimport UpdatedStatusBadge from '../../components/common/UpdatedStatusBadge';\n\ntype ActionsCardProps = {\n  filteredData: (Action & { updatedStatus: UpdatedStatusEnumType })[];\n  scenario: Scenario;\n  showUpdatedBadge?: boolean;\n};\n\nexport function ActionsCard(props: ActionsCardProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { profileInfo } = useBackstageContext();\n\n  const { filteredData, scenario, showUpdatedBadge } = props;\n\n  const [pendingUpdatedIDs, setPendingUpdatedIDs] = useState<string[]>([]);\n  const [pendingStatusById, setPendingStatusById] = useState<\n    Record<string, ActionStatusOptions>\n  >({});\n\n  const { isActionExpanded, toggleActionExpanded, submitEditedScenarioToRiSc } =\n    useScenario();\n\n  const debounceCallback = useCallback(\n    (updatedIDs: string[]) => {\n      if (updatedIDs.length === 0) return;\n\n      const updatedScenario = {\n        ...scenario,\n        actions: scenario.actions.map(a =>\n          updatedIDs.includes(a.ID)\n            ? {\n                ...a,\n                status: pendingStatusById[a.ID] ?? a.status,\n              }\n            : a,\n        ),\n      };\n\n      submitEditedScenarioToRiSc(updatedScenario, {\n        idsOfActionsToForceUpdateLastUpdatedValue: updatedIDs,\n        profileInfo: profileInfo,\n      });\n      setPendingUpdatedIDs([]);\n    },\n    [scenario, submitEditedScenarioToRiSc, pendingStatusById, profileInfo],\n  );\n\n  const { flush } = useDebounce(pendingUpdatedIDs, 6000, debounceCallback);\n\n  useEffect(() => {\n    return () => flush();\n  }, [flush]);\n\n  function handleStatusChange(\n    actionID: string,\n    newStatus: ActionStatusOptions,\n  ) {\n    setPendingStatusById(prev => ({ ...prev, [actionID]: newStatus }));\n    setPendingUpdatedIDs(prev =>\n      prev.includes(actionID) ? prev : [...prev, actionID],\n    );\n  }\n\n  function getLastUpdatedDateToDisplay(action: Action) {\n    let lastUpdated: Date | undefined = undefined;\n    if (action.ID in pendingStatusById) {\n      lastUpdated = new Date();\n    } else if (action.lastUpdated) {\n      lastUpdated = new Date(action.lastUpdated);\n    }\n    return lastUpdated;\n  }\n\n  return (\n    <>\n      <Divider sx={{ marginBottom: '16px' }} />\n      {filteredData.map((action, idx) => {\n        const isPending = pendingStatusById[action.ID] !== undefined;\n        const isExpanded = isActionExpanded(action.ID);\n        const isLast = idx === filteredData.length - 1;\n\n        return (\n          <div key={action.ID}>\n            <div\n              role=\"button\"\n              tabIndex={0}\n              onClick={(e: MouseEvent<HTMLDivElement>) => {\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(action.ID);\n              }}\n              onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\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(action.ID);\n                }\n              }}\n              style={{ cursor: 'pointer' }}\n            >\n              <Flex align=\"center\" justify=\"between\" gap=\"1\">\n                <Flex align=\"center\">\n                  <IconButton\n                    onClick={e => {\n                      e.stopPropagation();\n                      toggleActionExpanded(action.ID);\n                    }}\n                  >\n                    {isExpanded ? (\n                      <i className=\"ri-arrow-up-s-line\" />\n                    ) : (\n                      <i className=\"ri-arrow-down-s-line\" />\n                    )}\n                  </IconButton>\n                  <Flex direction=\"column\" align=\"start\" gap=\"1\">\n                    {(() => {\n                      if (isPending) {\n                        return showUpdatedBadge ? (\n                          <UpdatedStatusBadge\n                            status={action.updatedStatus}\n                            isPending={true}\n                          />\n                        ) : null;\n                      }\n                      return (\n                        <UpdatedStatusBadge status={action.updatedStatus} />\n                      );\n                    })()}\n                    <Text as=\"p\" variant=\"body-large\">\n                      {action.title}\n                    </Text>\n                  </Flex>\n                </Flex>\n                <Flex align=\"center\">\n                  <span\n                    data-no-row-toggle\n                    role=\"button\"\n                    tabIndex={0}\n                    style={{ display: 'inline-block' }}\n                    onClick={(e: MouseEvent<HTMLSpanElement>) =>\n                      e.stopPropagation()\n                    }\n                    onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n                      e.stopPropagation();\n                      if (e.key === 'Enter' || e.key === ' ') {\n                        e.preventDefault();\n                      }\n                    }}\n                  >\n                    <DualButtonWithMenu\n                      propsCommon={{\n                        className: getActionStatusButtonClass(\n                          (pendingStatusById[action.ID] ??\n                            action.status) as any,\n                        ),\n                      }}\n                      propsLeft={{\n                        // @ts-ignore: mapping dynamic keys for translations\n                        children: t(\n                          actionStatusOptionsToTranslationKeys[\n                            (pendingStatusById[action.ID] ??\n                              action.status) as ActionStatusOptions\n                          ],\n                        ),\n                      }}\n                      propsRight={{\n                        iconEnd: <i className=\"ri-loop-left-line\" />,\n                        onClick: () => {\n                          handleStatusChange(\n                            action.ID,\n                            action.status as ActionStatusOptions,\n                          );\n                        },\n                      }}\n                      menuItems={Object.values(ActionStatusOptions).map(\n                        value => ({\n                          key: value,\n                          // @ts-ignore: mapping dynamic keys for translations\n                          label: t(\n                            actionStatusOptionsToTranslationKeys[\n                              value as ActionStatusOptions\n                            ],\n                          ),\n                          onClick: () =>\n                            handleStatusChange(\n                              action.ID,\n                              value as ActionStatusOptions,\n                            ),\n                          selected:\n                            value ===\n                            (pendingStatusById[action.ID] ?? action.status),\n                        }),\n                      )}\n                    />\n                  </span>\n                  <ScenarioLastUpdatedLabel\n                    lastUpdated={getLastUpdatedDateToDisplay(action)}\n                    lastUpdatedBy={action.lastUpdatedBy}\n                  />\n                </Flex>\n              </Flex>\n            </div>\n            <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n              <div\n                data-action-collapse\n                role=\"presentation\"\n                onClick={(e: MouseEvent<HTMLDivElement>) => e.stopPropagation()}\n                onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n                  e.stopPropagation();\n                  if (e.key === 'Enter' || e.key === ' ') {\n                    e.preventDefault();\n                  }\n                }}\n              >\n                <Box ml=\"48px\" mt=\"4\" mb=\"2\">\n                  <Text\n                    as=\"p\"\n                    variant=\"body-large\"\n                    style={{ marginTop: 1, fontWeight: 700 }}\n                  >\n                    {t('dictionary.description')}\n                  </Text>\n                  <Markdown description={action.description} />\n\n                  <Box mt=\"16px\">\n                    <Text\n                      style={{\n                        fontWeight: 700,\n                        fontSize: '14px',\n                        lineHeight: '20px',\n                      }}\n                    >\n                      {t('dictionary.url')}\n                    </Text>\n                    {action.url ? (\n                      <Link\n                        sx={{ ...body2, marginTop: 0 }}\n                        target=\"_blank\"\n                        rel=\"noreferrer\"\n                        href={\n                          action.url.startsWith('http')\n                            ? action.url\n                            : `//${action.url}`\n                        }\n                      >\n                        {action.url}\n                      </Link>\n                    ) : (\n                      <Text\n                        as=\"p\"\n                        variant=\"body-large\"\n                        style={{ fontStyle: 'italic' }}\n                      >\n                        {t('dictionary.emptyField', {\n                          field: t('dictionary.url').toLowerCase(),\n                        })}\n                      </Text>\n                    )}\n                  </Box>\n                </Box>\n              </div>\n            </Collapse>\n            {!isLast && <Divider sx={{ my: 2 }} />}\n          </div>\n        );\n      })}\n    </>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ActionsCard.esm.js","sources":["../../../src/components/scenarioTable/ActionsCard.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { Box, Flex, Text } from '@backstage/ui';\nimport { Divider } from '@mui/material';\nimport Collapse from '@mui/material/Collapse';\nimport IconButton from '@mui/material/IconButton';\nimport Link from '@mui/material/Link';\nimport {\n  useCallback,\n  useEffect,\n  useState,\n  KeyboardEvent,\n  MouseEvent,\n} from 'react';\nimport { DualButtonWithMenu } from '../../components/common/DualButtonWithMenu';\nimport { useScenario } from '../../contexts/ScenarioContext';\nimport { ActionStatusOptions } from '../../utils/constants';\nimport { useDebounce } from '../../utils/hooks';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { Action, Scenario } from '../../utils/types';\nimport {\n  actionStatusOptionsToTranslationKeys,\n  getActionStatusButtonClass,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions';\nimport { Markdown } from '../common/Markdown';\nimport { body2 } from '../common/typography';\nimport { useBackstageContext } from '../../contexts/BackstageContext.tsx';\nimport { ScenarioLastUpdatedLabel } from '../scenario/ScenarioLastUpdatedLabel.tsx';\nimport UpdatedStatusBadge from '../../components/common/UpdatedStatusBadge';\n\ntype ActionsCardProps = {\n  filteredData: (Action & { updatedStatus: UpdatedStatusEnumType })[];\n  scenario: Scenario;\n  showUpdatedBadge?: boolean;\n};\n\nexport function ActionsCard(props: ActionsCardProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { profileInfo } = useBackstageContext();\n\n  const { filteredData, scenario } = props;\n\n  const [pendingUpdatedIDs, setPendingUpdatedIDs] = useState<string[]>([]);\n  const [pendingStatusById, setPendingStatusById] = useState<\n    Record<string, ActionStatusOptions>\n  >({});\n\n  const { isActionExpanded, toggleActionExpanded, submitEditedScenarioToRiSc } =\n    useScenario();\n\n  const debounceCallback = useCallback(\n    (updatedIDs: string[]) => {\n      if (updatedIDs.length === 0) return;\n\n      const updatedScenario = {\n        ...scenario,\n        actions: scenario.actions.map(a =>\n          updatedIDs.includes(a.ID)\n            ? {\n                ...a,\n                status: pendingStatusById[a.ID] ?? a.status,\n              }\n            : a,\n        ),\n      };\n\n      submitEditedScenarioToRiSc(updatedScenario, {\n        idsOfActionsToForceUpdateLastUpdatedValue: updatedIDs,\n        profileInfo: profileInfo,\n      });\n      setPendingUpdatedIDs([]);\n    },\n    [scenario, submitEditedScenarioToRiSc, pendingStatusById, profileInfo],\n  );\n\n  const { flush } = useDebounce(pendingUpdatedIDs, 6000, debounceCallback);\n\n  useEffect(() => {\n    return () => flush();\n  }, [flush]);\n\n  function handleStatusChange(\n    actionID: string,\n    newStatus: ActionStatusOptions,\n  ) {\n    setPendingStatusById(prev => ({ ...prev, [actionID]: newStatus }));\n    setPendingUpdatedIDs(prev =>\n      prev.includes(actionID) ? prev : [...prev, actionID],\n    );\n  }\n\n  function getLastUpdatedDateToDisplay(action: Action) {\n    let lastUpdated: Date | undefined = undefined;\n    if (action.ID in pendingStatusById) {\n      lastUpdated = new Date();\n    } else if (action.lastUpdated) {\n      lastUpdated = new Date(action.lastUpdated);\n    }\n    return lastUpdated;\n  }\n\n  return (\n    <>\n      <Divider sx={{ marginBottom: '16px' }} />\n      {filteredData.map((action, idx) => {\n        const isPending = pendingStatusById[action.ID] !== undefined;\n        const isExpanded = isActionExpanded(action.ID);\n        const isLast = idx === filteredData.length - 1;\n\n        return (\n          <div key={action.ID}>\n            <div\n              role=\"button\"\n              tabIndex={0}\n              onClick={(e: MouseEvent<HTMLDivElement>) => {\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(action.ID);\n              }}\n              onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\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(action.ID);\n                }\n              }}\n              style={{ cursor: 'pointer' }}\n            >\n              <Flex align=\"center\" justify=\"between\" gap=\"1\">\n                <Flex align=\"center\">\n                  <IconButton\n                    size=\"small\"\n                    onClick={e => {\n                      e.stopPropagation();\n                      toggleActionExpanded(action.ID);\n                    }}\n                  >\n                    {isExpanded ? (\n                      <i className=\"ri-arrow-down-s-line\" />\n                    ) : (\n                      <i className=\"ri-arrow-right-s-line\" />\n                    )}\n                  </IconButton>\n                  <Flex direction=\"column\" align=\"start\" gap=\"1\">\n                    {(() => {\n                      if (isPending) {\n                        return (\n                          <UpdatedStatusBadge\n                            status={action.updatedStatus}\n                            isPending={true}\n                          />\n                        );\n                      }\n                      return (\n                        <UpdatedStatusBadge status={action.updatedStatus} />\n                      );\n                    })()}\n                    <Text as=\"p\" variant=\"body-large\">\n                      {action.title}\n                    </Text>\n                  </Flex>\n                </Flex>\n                <Flex align=\"center\">\n                  <span\n                    data-no-row-toggle\n                    role=\"button\"\n                    tabIndex={0}\n                    style={{ display: 'inline-block' }}\n                    onClick={(e: MouseEvent<HTMLSpanElement>) =>\n                      e.stopPropagation()\n                    }\n                    onKeyDown={(e: KeyboardEvent<HTMLSpanElement>) => {\n                      e.stopPropagation();\n                      if (e.key === 'Enter' || e.key === ' ') {\n                        e.preventDefault();\n                      }\n                    }}\n                  >\n                    <DualButtonWithMenu\n                      propsCommon={{\n                        className: getActionStatusButtonClass(\n                          (pendingStatusById[action.ID] ??\n                            action.status) as any,\n                        ),\n                      }}\n                      propsLeft={{\n                        // @ts-ignore: mapping dynamic keys for translations\n                        children: t(\n                          actionStatusOptionsToTranslationKeys[\n                            (pendingStatusById[action.ID] ??\n                              action.status) as ActionStatusOptions\n                          ],\n                        ),\n                      }}\n                      propsRight={{\n                        iconEnd: <i className=\"ri-loop-left-line\" />,\n                        onClick: () => {\n                          handleStatusChange(\n                            action.ID,\n                            action.status as ActionStatusOptions,\n                          );\n                        },\n                      }}\n                      menuItems={Object.values(ActionStatusOptions).map(\n                        value => ({\n                          key: value,\n                          // @ts-ignore: mapping dynamic keys for translations\n                          label: t(\n                            actionStatusOptionsToTranslationKeys[\n                              value as ActionStatusOptions\n                            ],\n                          ),\n                          onClick: () =>\n                            handleStatusChange(\n                              action.ID,\n                              value as ActionStatusOptions,\n                            ),\n                          selected:\n                            value ===\n                            (pendingStatusById[action.ID] ?? action.status),\n                        }),\n                      )}\n                    />\n                  </span>\n                  <ScenarioLastUpdatedLabel\n                    lastUpdated={getLastUpdatedDateToDisplay(action)}\n                    lastUpdatedBy={action.lastUpdatedBy}\n                  />\n                </Flex>\n              </Flex>\n            </div>\n            <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n              <div\n                data-action-collapse\n                role=\"presentation\"\n                onClick={(e: MouseEvent<HTMLDivElement>) => e.stopPropagation()}\n                onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n                  e.stopPropagation();\n                  if (e.key === 'Enter' || e.key === ' ') {\n                    e.preventDefault();\n                  }\n                }}\n              >\n                <Box ml=\"48px\" mt=\"4\" mb=\"2\">\n                  <Text\n                    as=\"p\"\n                    variant=\"body-large\"\n                    style={{ marginTop: 1, fontWeight: 700 }}\n                  >\n                    {t('dictionary.description')}\n                  </Text>\n                  <Markdown description={action.description} />\n\n                  <Box mt=\"16px\">\n                    <Text\n                      style={{\n                        fontWeight: 700,\n                        fontSize: '14px',\n                        lineHeight: '20px',\n                      }}\n                    >\n                      {t('dictionary.url')}\n                    </Text>\n                    {action.url ? (\n                      <Link\n                        sx={{ ...body2, marginTop: 0 }}\n                        target=\"_blank\"\n                        rel=\"noreferrer\"\n                        href={\n                          action.url.startsWith('http')\n                            ? action.url\n                            : `//${action.url}`\n                        }\n                      >\n                        {action.url}\n                      </Link>\n                    ) : (\n                      <Text\n                        as=\"p\"\n                        variant=\"body-large\"\n                        style={{ fontStyle: 'italic' }}\n                      >\n                        {t('dictionary.emptyField', {\n                          field: t('dictionary.url').toLowerCase(),\n                        })}\n                      </Text>\n                    )}\n                  </Box>\n                </Box>\n              </div>\n            </Collapse>\n            {!isLast && <Divider sx={{ my: 2 }} />}\n          </div>\n        );\n      })}\n    </>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/scenarioTable/ScenarioTableRow.esm.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { IconButton, Paper } from '@material-ui/core';
+import { IconButton, Paper, Collapse } from '@material-ui/core';
 import DeleteIcon from '@mui/icons-material/Delete';
 import DragIndicatorIcon from '@mui/icons-material/DragIndicator';
 import { useState, useRef, useEffect } from 'react';
@@ -37,6 +37,7 @@ function ScenarioTableRow({
   const { hoveredScenarios, setHoveredScenarios } = useScenario();
   const [isScenarioDeletionDialogOpen, setScenarioDeletionDialogOpen] = useState(false);
   const [actionIdsOfVisibleType, setActionIdsOfVisibleType] = useState([]);
+  const [isExpanded, setIsExpanded] = useState(false);
   const ref = useRef(null);
   const [, drop] = useDrop({
     accept: "row",
@@ -84,6 +85,11 @@ function ScenarioTableRow({
     actionIdsOfVisibleType,
     visibleType
   );
+  useEffect(() => {
+    if (visibleType || isExpanded) {
+      setHoveredScenarios((prev) => prev.filter((s) => s.ID !== scenario.ID));
+    }
+  }, [visibleType, isExpanded]);
   useEffect(() => {
     const actions = actionsWithUpdatedStatus.filter(
       (a) => a.updatedStatus === visibleType
@@ -102,13 +108,13 @@ function ScenarioTableRow({
     Card,
     {
       onMouseEnter: () => {
-        if (visibleType) return;
+        if (visibleType || isExpanded) return;
         setHoveredScenarios(
           (prev) => prev.some((s) => s.ID === scenario.ID) ? prev : [...prev, scenario]
         );
       },
       onMouseLeave: () => {
-        if (visibleType) return;
+        if (visibleType || isExpanded) return;
         setHoveredScenarios((prev) => prev.filter((s) => s.ID !== scenario.ID));
       },
       ref,
@@ -119,7 +125,7 @@ function ScenarioTableRow({
         }
         viewRow(scenario.ID);
       },
-      className: `${tableCard} ${visibleType ? tableCardNoHover : ""}`,
+      className: `${tableCard} ${visibleType || isExpanded ? tableCardNoHover : ""}`,
       style: {
         opacity: isDragging ? 0.3 : 1,
         transition: isDragging ? "none" : void 0,
@@ -127,6 +133,19 @@ function ScenarioTableRow({
       },
       children: [
         /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              size: "medium",
+              "data-action-root": true,
+              onClick: (e) => {
+                e.stopPropagation();
+                setIsExpanded((prev) => !prev);
+              },
+              style: { padding: 0 },
+              children: isExpanded ? /* @__PURE__ */ jsx("i", { className: "ri-arrow-down-s-line" }) : /* @__PURE__ */ jsx("i", { className: "ri-arrow-right-s-line" })
+            }
+          ),
           isEditing && allowDrag && /* @__PURE__ */ jsx(IconButton, { size: "small", ref: drag, children: /* @__PURE__ */ jsx(
             DragIndicatorIcon,
             {
@@ -229,14 +248,22 @@ function ScenarioTableRow({
             )
           ] })
         ] }),
-        filteredActions.length > 0 && /* @__PURE__ */ jsx(
+        filteredActions.length > 0 && !isExpanded && /* @__PURE__ */ jsx("div", { "data-action-root": true, children: /* @__PURE__ */ jsx(
           ActionsCard,
           {
             filteredData: filteredActions,
             scenario,
             showUpdatedBadge: !!visibleType
           }
-        )
+        ) }),
+        isExpanded && /* @__PURE__ */ jsx(Collapse, { in: isExpanded, timeout: "auto", unmountOnExit: true, children: /* @__PURE__ */ jsx("div", { "data-action-root": true, children: /* @__PURE__ */ jsx(
+          ActionsCard,
+          {
+            filteredData: actionsWithUpdatedStatus,
+            scenario,
+            showUpdatedBadge: !!visibleType
+          }
+        ) }) })
       ]
     }
   );

package/dist/components/scenarioTable/ScenarioTableRow.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScenarioTableRow.esm.js","sources":["../../../src/components/scenarioTable/ScenarioTableRow.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { IconButton, Paper } from '@material-ui/core';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport DragIndicatorIcon from '@mui/icons-material/DragIndicator';\nimport { useState, useRef, useEffect, MouseEvent } from 'react';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { Scenario } from '../../utils/types';\nimport { useRiScs } from '../../contexts/RiScContext';\nimport {\n  deleteScenario,\n  getConsequenceLevel,\n  getProbabilityLevel,\n  getRiskMatrixColor,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions';\nimport { ScenarioTableProgressBar } from './ScenarioTableProgressBar';\nimport { useTableStyles } from './ScenarioTableStyles';\nimport { Text, Flex, Card } from '@backstage/ui';\nimport { DeleteScenarioConfirmation } from '../scenarioDrawer/components/DeleteConfirmation.tsx';\nimport { ActionStatusOptions } from '../../utils/constants';\nimport { useDrag, useDrop } from 'react-dnd';\nimport { ActionsCard } from './ActionsCard.tsx';\nimport { useScenario } from '../../contexts/ScenarioContext.tsx';\nimport { useTheme } from '@mui/material/styles';\nimport {\n  getActionsWithUpdatedStatus,\n  getFilteredActions,\n} from '../../utils/actions.ts';\n\ninterface ScenarioTableRowProps {\n  scenario: Scenario;\n  viewRow: (id: string) => void;\n  id: string;\n  index: number;\n  moveRowFinal: (dragId: string, dropId: string) => void;\n  moveRowLocal: (dragId: string, hoverId: string) => void;\n  isEditing: boolean;\n  visibleType: UpdatedStatusEnumType | null;\n  allowDrag?: boolean;\n  searchMatches?: Scenario['actions'];\n}\n\nexport function ScenarioTableRow({\n  scenario,\n  viewRow,\n  id,\n  index,\n  moveRowFinal,\n  moveRowLocal,\n  isEditing,\n  visibleType,\n  allowDrag = true,\n  searchMatches,\n}: ScenarioTableRowProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const theme = useTheme();\n  const { tableCard, tableCardNoHover, riskColor } = useTableStyles();\n\n  const { selectedRiSc: riSc, updateRiSc } = useRiScs();\n  const { hoveredScenarios, setHoveredScenarios } = useScenario();\n  const [isScenarioDeletionDialogOpen, setScenarioDeletionDialogOpen] =\n    useState(false);\n\n  const [actionIdsOfVisibleType, setActionIdsOfVisibleType] = useState<\n    string[]\n  >([]);\n\n  const ref = useRef<HTMLDivElement>(null);\n\n  const [, drop] = useDrop({\n    accept: 'row',\n    hover(item: { id: string; index: number }, monitor) {\n      if (!ref.current) return;\n\n      const dragId = item.id;\n      const hoverId = id;\n\n      if (dragId === hoverId) return;\n\n      const hoverBoundingRect = ref.current?.getBoundingClientRect();\n      const hoverMiddleY =\n        (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;\n\n      const clientOffset = monitor.getClientOffset();\n      const hoverClientY = clientOffset!.y - hoverBoundingRect.top;\n\n      const buffer = hoverBoundingRect.height * 0.05;\n      if (item.index < index && hoverClientY < hoverMiddleY - buffer) return;\n      if (item.index > index && hoverClientY > hoverMiddleY + buffer) return;\n\n      moveRowLocal(dragId, hoverId!);\n\n      item.index = index;\n    },\n    drop() {\n      return { moved: true };\n    },\n  });\n\n  const [{ isDragging }, drag, preview] = useDrag(() => ({\n    type: 'row',\n    item: { id, index },\n\n    end: (item, monitor) => {\n      if (monitor.didDrop()) {\n        const dropResult = monitor.getDropResult() as {\n          moved?: boolean;\n        } | null;\n        if (dropResult?.moved && item.id && id) {\n          moveRowFinal(item.id, id);\n        }\n      }\n    },\n\n    collect: monitor => ({\n      isDragging: monitor.isDragging(),\n    }),\n  }));\n\n  const actionsWithUpdatedStatus = getActionsWithUpdatedStatus(\n    scenario.actions,\n    riSc?.lastPublished?.numberOfCommits || null,\n  );\n  const filteredActions = getFilteredActions(\n    actionsWithUpdatedStatus,\n    searchMatches,\n    actionIdsOfVisibleType,\n    visibleType,\n  );\n\n  useEffect(() => {\n    const actions = actionsWithUpdatedStatus.filter(\n      a => a.updatedStatus === visibleType,\n    );\n    const actionIds = actions.map(a => a.ID);\n    setActionIdsOfVisibleType(actionIds);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visibleType]);\n\n  preview(drop(ref));\n\n  const isScenarioHoveredFromRiskMatrix = hoveredScenarios.some(\n    s => s.ID === scenario.ID,\n  );\n  const highlightColor = theme.palette.mode === 'dark' ? '#A2A0A0' : '#FFDD9D';\n  const isTextColorBlack =\n    theme.palette.mode === 'dark'\n      ? isScenarioHoveredFromRiskMatrix && !visibleType\n      : true;\n  const textColorAsBuiVariable = isTextColorBlack\n    ? 'var(--bui-black)'\n    : 'var(--bui-white)';\n\n  return (\n    <Card\n      onMouseEnter={() => {\n        if (visibleType) return;\n        setHoveredScenarios(prev =>\n          prev.some(s => s.ID === scenario.ID) ? prev : [...prev, scenario],\n        );\n      }}\n      onMouseLeave={() => {\n        if (visibleType) return;\n        setHoveredScenarios(prev => prev.filter(s => s.ID !== scenario.ID));\n      }}\n      ref={ref}\n      onClick={(e: MouseEvent<HTMLDivElement>) => {\n        const target = e.target as HTMLElement | null;\n        if (\n          target &&\n          (target.closest('[data-action-root]') ||\n            target.closest('[data-action-collapse]') ||\n            target.closest('[data-no-row-toggle]'))\n        ) {\n          return;\n        }\n        viewRow(scenario.ID);\n      }}\n      className={`${tableCard} ${visibleType ? tableCardNoHover : ''}`}\n      style={{\n        opacity: isDragging ? 0.3 : 1,\n        transition: isDragging ? 'none' : undefined,\n        backgroundColor:\n          isScenarioHoveredFromRiskMatrix && !visibleType\n            ? highlightColor\n            : undefined,\n      }}\n    >\n      <Flex align=\"center\">\n        {isEditing && allowDrag && (\n          <IconButton size=\"small\" ref={drag}>\n            <DragIndicatorIcon\n              sx={{ cursor: isDragging ? 'grabbing' : 'grab' }}\n            />\n          </IconButton>\n        )}\n        <Text\n          as=\"p\"\n          variant=\"body-large\"\n          weight=\"bold\"\n          style={{ width: '35%', color: textColorAsBuiVariable }}\n        >\n          {scenario.title}\n        </Text>\n        <Flex align=\"center\" justify=\"start\" style={{ width: '15%' }}>\n          <Paper\n            className={riskColor}\n            style={{\n              backgroundColor: getRiskMatrixColor(scenario.risk),\n            }}\n          />\n          <Text variant=\"body-medium\" style={{ color: textColorAsBuiVariable }}>\n            {t('scenarioTable.columns.probabilityChar')}:\n            {`${getProbabilityLevel(\n              scenario.risk,\n            )} ${t('scenarioTable.columns.consequenceChar')}:${getConsequenceLevel(scenario.risk)}`}\n          </Text>\n        </Flex>\n\n        <Flex\n          align=\"center\"\n          justify=\"start\"\n          style={{ width: isEditing ? '30%' : '35%' }}\n        >\n          {(() => {\n            if (scenario.actions.length > 0) {\n              return (\n                <ScenarioTableProgressBar\n                  completedCount={\n                    scenario.actions.filter(\n                      a => a.status === ActionStatusOptions.OK,\n                    ).length\n                  }\n                  totalCount={\n                    scenario.actions.filter(\n                      a => a.status !== ActionStatusOptions.NotRelevant,\n                    ).length\n                  }\n                  textColor={textColorAsBuiVariable}\n                />\n              );\n            }\n            return (\n              <Text style={{ color: textColorAsBuiVariable }}>\n                {t('scenarioTable.noActions')}\n              </Text>\n            );\n          })()}\n        </Flex>\n        <Flex align=\"center\" style={{ width: '15%' }}>\n          <Paper\n            className={riskColor}\n            style={{\n              backgroundColor: getRiskMatrixColor(scenario.remainingRisk),\n            }}\n          />\n          <Text\n            variant=\"body-medium\"\n            style={{ color: textColorAsBuiVariable }}\n          >{`${t('scenarioTable.columns.probabilityChar')}:${getProbabilityLevel(\n            scenario.remainingRisk,\n          )} ${t('scenarioTable.columns.consequenceChar')}:${getConsequenceLevel(scenario.remainingRisk)}`}</Text>\n        </Flex>\n\n        {isEditing && (\n          <Flex align=\"center\" justify=\"end\">\n            <IconButton\n              size=\"small\"\n              onClick={event => {\n                event.stopPropagation();\n                setScenarioDeletionDialogOpen(true);\n              }}\n            >\n              <DeleteIcon />\n            </IconButton>\n            <DeleteScenarioConfirmation\n              isOpen={isScenarioDeletionDialogOpen}\n              setIsOpen={setScenarioDeletionDialogOpen}\n              onConfirm={() => deleteScenario(riSc, updateRiSc, scenario)}\n            />\n          </Flex>\n        )}\n      </Flex>\n      {filteredActions.length > 0 && (\n        <ActionsCard\n          filteredData={filteredActions}\n          scenario={scenario}\n          showUpdatedBadge={!!visibleType}\n        />\n      )}\n    </Card>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ScenarioTableRow.esm.js","sources":["../../../src/components/scenarioTable/ScenarioTableRow.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { Collapse, IconButton, Paper } from '@material-ui/core';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport DragIndicatorIcon from '@mui/icons-material/DragIndicator';\nimport { useState, useRef, useEffect, MouseEvent } from 'react';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { Scenario } from '../../utils/types';\nimport { useRiScs } from '../../contexts/RiScContext';\nimport {\n  deleteScenario,\n  getConsequenceLevel,\n  getProbabilityLevel,\n  getRiskMatrixColor,\n  UpdatedStatusEnumType,\n} from '../../utils/utilityfunctions';\nimport { ScenarioTableProgressBar } from './ScenarioTableProgressBar';\nimport { useTableStyles } from './ScenarioTableStyles';\nimport { Text, Flex, Card } from '@backstage/ui';\nimport { DeleteScenarioConfirmation } from '../scenarioDrawer/components/DeleteConfirmation.tsx';\nimport { ActionStatusOptions } from '../../utils/constants';\nimport { useDrag, useDrop } from 'react-dnd';\nimport { ActionsCard } from './ActionsCard.tsx';\nimport { useScenario } from '../../contexts/ScenarioContext.tsx';\nimport { useTheme } from '@mui/material/styles';\nimport {\n  getActionsWithUpdatedStatus,\n  getFilteredActions,\n} from '../../utils/actions.ts';\n\ninterface ScenarioTableRowProps {\n  scenario: Scenario;\n  viewRow: (id: string) => void;\n  id: string;\n  index: number;\n  moveRowFinal: (dragId: string, dropId: string) => void;\n  moveRowLocal: (dragId: string, hoverId: string) => void;\n  isEditing: boolean;\n  visibleType: UpdatedStatusEnumType | null;\n  allowDrag?: boolean;\n  searchMatches?: Scenario['actions'];\n}\n\nexport function ScenarioTableRow({\n  scenario,\n  viewRow,\n  id,\n  index,\n  moveRowFinal,\n  moveRowLocal,\n  isEditing,\n  visibleType,\n  allowDrag = true,\n  searchMatches,\n}: ScenarioTableRowProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const theme = useTheme();\n  const { tableCard, tableCardNoHover, riskColor } = useTableStyles();\n\n  const { selectedRiSc: riSc, updateRiSc } = useRiScs();\n  const { hoveredScenarios, setHoveredScenarios } = useScenario();\n  const [isScenarioDeletionDialogOpen, setScenarioDeletionDialogOpen] =\n    useState(false);\n\n  const [actionIdsOfVisibleType, setActionIdsOfVisibleType] = useState<\n    string[]\n  >([]);\n\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  const ref = useRef<HTMLDivElement>(null);\n\n  const [, drop] = useDrop({\n    accept: 'row',\n    hover(item: { id: string; index: number }, monitor) {\n      if (!ref.current) return;\n\n      const dragId = item.id;\n      const hoverId = id;\n\n      if (dragId === hoverId) return;\n\n      const hoverBoundingRect = ref.current?.getBoundingClientRect();\n      const hoverMiddleY =\n        (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2;\n\n      const clientOffset = monitor.getClientOffset();\n      const hoverClientY = clientOffset!.y - hoverBoundingRect.top;\n\n      const buffer = hoverBoundingRect.height * 0.05;\n      if (item.index < index && hoverClientY < hoverMiddleY - buffer) return;\n      if (item.index > index && hoverClientY > hoverMiddleY + buffer) return;\n\n      moveRowLocal(dragId, hoverId!);\n\n      item.index = index;\n    },\n    drop() {\n      return { moved: true };\n    },\n  });\n\n  const [{ isDragging }, drag, preview] = useDrag(() => ({\n    type: 'row',\n    item: { id, index },\n\n    end: (item, monitor) => {\n      if (monitor.didDrop()) {\n        const dropResult = monitor.getDropResult() as {\n          moved?: boolean;\n        } | null;\n        if (dropResult?.moved && item.id && id) {\n          moveRowFinal(item.id, id);\n        }\n      }\n    },\n\n    collect: monitor => ({\n      isDragging: monitor.isDragging(),\n    }),\n  }));\n\n  const actionsWithUpdatedStatus = getActionsWithUpdatedStatus(\n    scenario.actions,\n    riSc?.lastPublished?.numberOfCommits || null,\n  );\n  const filteredActions = getFilteredActions(\n    actionsWithUpdatedStatus,\n    searchMatches,\n    actionIdsOfVisibleType,\n    visibleType,\n  );\n\n  useEffect(() => {\n    if (visibleType || isExpanded) {\n      setHoveredScenarios(prev => prev.filter(s => s.ID !== scenario.ID));\n    }\n    // only run when visibleType or expansion changes for this scenario\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visibleType, isExpanded]);\n\n  useEffect(() => {\n    const actions = actionsWithUpdatedStatus.filter(\n      a => a.updatedStatus === visibleType,\n    );\n    const actionIds = actions.map(a => a.ID);\n    setActionIdsOfVisibleType(actionIds);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [visibleType]);\n\n  preview(drop(ref));\n\n  const isScenarioHoveredFromRiskMatrix = hoveredScenarios.some(\n    s => s.ID === scenario.ID,\n  );\n  const highlightColor = theme.palette.mode === 'dark' ? '#A2A0A0' : '#FFDD9D';\n  const isTextColorBlack =\n    theme.palette.mode === 'dark'\n      ? isScenarioHoveredFromRiskMatrix && !visibleType\n      : true;\n  const textColorAsBuiVariable = isTextColorBlack\n    ? 'var(--bui-black)'\n    : 'var(--bui-white)';\n\n  return (\n    <Card\n      onMouseEnter={() => {\n        if (visibleType || isExpanded) return;\n        setHoveredScenarios(prev =>\n          prev.some(s => s.ID === scenario.ID) ? prev : [...prev, scenario],\n        );\n      }}\n      onMouseLeave={() => {\n        if (visibleType || isExpanded) return;\n        setHoveredScenarios(prev => prev.filter(s => s.ID !== scenario.ID));\n      }}\n      ref={ref}\n      onClick={(e: MouseEvent<HTMLDivElement>) => {\n        const target = e.target as HTMLElement | null;\n        if (\n          target &&\n          (target.closest('[data-action-root]') ||\n            target.closest('[data-action-collapse]') ||\n            target.closest('[data-no-row-toggle]'))\n        ) {\n          return;\n        }\n        viewRow(scenario.ID);\n      }}\n      className={`${tableCard} ${visibleType || isExpanded ? tableCardNoHover : ''}`}\n      style={{\n        opacity: isDragging ? 0.3 : 1,\n        transition: isDragging ? 'none' : undefined,\n        backgroundColor:\n          isScenarioHoveredFromRiskMatrix && !visibleType\n            ? highlightColor\n            : undefined,\n      }}\n    >\n      <Flex align=\"center\">\n        <IconButton\n          size=\"medium\"\n          data-action-root\n          onClick={e => {\n            e.stopPropagation();\n            setIsExpanded(prev => !prev);\n          }}\n          style={{ padding: 0 }}\n        >\n          {isExpanded ? (\n            <i className=\"ri-arrow-down-s-line\" />\n          ) : (\n            <i className=\"ri-arrow-right-s-line\" />\n          )}\n        </IconButton>\n        {isEditing && allowDrag && (\n          <IconButton size=\"small\" ref={drag}>\n            <DragIndicatorIcon\n              sx={{ cursor: isDragging ? 'grabbing' : 'grab' }}\n            />\n          </IconButton>\n        )}\n        <Text\n          as=\"p\"\n          variant=\"body-large\"\n          weight=\"bold\"\n          style={{ width: '35%', color: textColorAsBuiVariable }}\n        >\n          {scenario.title}\n        </Text>\n        <Flex align=\"center\" justify=\"start\" style={{ width: '15%' }}>\n          <Paper\n            className={riskColor}\n            style={{\n              backgroundColor: getRiskMatrixColor(scenario.risk),\n            }}\n          />\n          <Text variant=\"body-medium\" style={{ color: textColorAsBuiVariable }}>\n            {t('scenarioTable.columns.probabilityChar')}:\n            {`${getProbabilityLevel(\n              scenario.risk,\n            )} ${t('scenarioTable.columns.consequenceChar')}:${getConsequenceLevel(scenario.risk)}`}\n          </Text>\n        </Flex>\n\n        <Flex\n          align=\"center\"\n          justify=\"start\"\n          style={{ width: isEditing ? '30%' : '35%' }}\n        >\n          {(() => {\n            if (scenario.actions.length > 0) {\n              return (\n                <ScenarioTableProgressBar\n                  completedCount={\n                    scenario.actions.filter(\n                      a => a.status === ActionStatusOptions.OK,\n                    ).length\n                  }\n                  totalCount={\n                    scenario.actions.filter(\n                      a => a.status !== ActionStatusOptions.NotRelevant,\n                    ).length\n                  }\n                  textColor={textColorAsBuiVariable}\n                />\n              );\n            }\n            return (\n              <Text style={{ color: textColorAsBuiVariable }}>\n                {t('scenarioTable.noActions')}\n              </Text>\n            );\n          })()}\n        </Flex>\n        <Flex align=\"center\" style={{ width: '15%' }}>\n          <Paper\n            className={riskColor}\n            style={{\n              backgroundColor: getRiskMatrixColor(scenario.remainingRisk),\n            }}\n          />\n          <Text\n            variant=\"body-medium\"\n            style={{ color: textColorAsBuiVariable }}\n          >{`${t('scenarioTable.columns.probabilityChar')}:${getProbabilityLevel(\n            scenario.remainingRisk,\n          )} ${t('scenarioTable.columns.consequenceChar')}:${getConsequenceLevel(scenario.remainingRisk)}`}</Text>\n        </Flex>\n\n        {isEditing && (\n          <Flex align=\"center\" justify=\"end\">\n            <IconButton\n              size=\"small\"\n              onClick={event => {\n                event.stopPropagation();\n                setScenarioDeletionDialogOpen(true);\n              }}\n            >\n              <DeleteIcon />\n            </IconButton>\n            <DeleteScenarioConfirmation\n              isOpen={isScenarioDeletionDialogOpen}\n              setIsOpen={setScenarioDeletionDialogOpen}\n              onConfirm={() => deleteScenario(riSc, updateRiSc, scenario)}\n            />\n          </Flex>\n        )}\n      </Flex>\n      {/* If there are filtered actions (search or updated badge), show them as before.\n          If the user expands the row, show all actions for the scenario regardless\n          of the current filters. */}\n      {filteredActions.length > 0 && !isExpanded && (\n        <div data-action-root>\n          <ActionsCard\n            filteredData={filteredActions}\n            scenario={scenario}\n            showUpdatedBadge={!!visibleType}\n          />\n        </div>\n      )}\n\n      {isExpanded && (\n        <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n          <div data-action-root>\n            <ActionsCard\n              filteredData={actionsWithUpdatedStatus}\n              scenario={scenario}\n              showUpdatedBadge={!!visibleType}\n            />\n          </div>\n        </Collapse>\n      )}\n    </Card>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/sopsConfigDialog/GcpCryptoKeyMenu.esm.js

@@ -92,6 +92,7 @@ function GcpCryptoKeyMenu({
         /* @__PURE__ */ jsx(
           Menu,
           {
+            disablePortal: true,
             anchorEl,
             open,
             onClose: () => setAnchorEl(null),

package/dist/components/sopsConfigDialog/GcpCryptoKeyMenu.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"GcpCryptoKeyMenu.esm.js","sources":["../../../src/components/sopsConfigDialog/GcpCryptoKeyMenu.tsx"],"sourcesContent":["import { Avatar, ListItemButton, ListSubheader, Menu } from '@mui/material';\nimport { GcpCryptoKeyObject } from '../../utils/DTOs';\nimport { GcpCryptoKeyMenuItem } from './GcpCryptoKeyMenuItem';\nimport Box from '@mui/material/Box';\nimport ListItemAvatar from '@mui/material/ListItemAvatar';\nimport { VpnKey } from '@mui/icons-material';\nimport ListItemText from '@mui/material/ListItemText';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport AddIcon from '@mui/icons-material/Add';\nimport WarningAmberIcon from '@mui/icons-material/WarningAmber';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport { useState, MouseEvent } from 'react';\n\ninterface GcpCryptoKeyMenuProps {\n  chosenGcpCryptoKey: GcpCryptoKeyObject;\n  onChange: (gcpCryptoKey: GcpCryptoKeyObject) => void;\n  gcpCryptoKeys: GcpCryptoKeyObject[];\n}\n\nexport function GcpCryptoKeyMenu({\n  chosenGcpCryptoKey,\n  onChange,\n  gcpCryptoKeys,\n}: GcpCryptoKeyMenuProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const open = Boolean(anchorEl);\n\n  function handleClick(event: MouseEvent<HTMLElement>) {\n    setAnchorEl(event.currentTarget);\n  }\n\n  function handleClickMenuItem(gcpCryptoKey: GcpCryptoKeyObject) {\n    onChange(gcpCryptoKey);\n    setAnchorEl(null);\n  }\n\n  const gcpCryptoKeysGroupedByAccess = gcpCryptoKeys.reduce<\n    Record<string, GcpCryptoKeyObject[]>\n  >((acc, gcpCryptoKey) => {\n    const key = (gcpCryptoKey.hasEncryptDecryptAccess ?? false).toString();\n    if (!acc[key]) {\n      acc[key] = [];\n    }\n    acc[key].push(gcpCryptoKey);\n    return acc;\n  }, {});\n\n  return (\n    <Box\n      sx={{\n        position: 'relative',\n        left: 0,\n        marginTop: 1,\n        border: '1px solid',\n        borderColor: theme =>\n          theme.palette.mode === 'dark' ? 'white' : 'grey.300',\n        borderRadius: '4px',\n      }}\n    >\n      <ListItemButton\n        onClick={handleClick}\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          alignItems: 'center',\n          gap: 1,\n        }}\n      >\n        {chosenGcpCryptoKey.projectId === '' ? (\n          <>\n            <ListItemAvatar>\n              <Avatar>\n                <AddIcon />\n              </Avatar>\n            </ListItemAvatar>\n            <ListItemText primary={t('sopsConfigDialog.chooseGcpCryptoKey')} />\n          </>\n        ) : (\n          <>\n            <ListItemAvatar>\n              <Avatar\n                sx={{\n                  backgroundColor:\n                    chosenGcpCryptoKey.projectId !== ''\n                      ? 'primary.main'\n                      : 'default',\n                  color:\n                    chosenGcpCryptoKey.projectId !== '' ? 'white' : 'inherit',\n                }}\n              >\n                <VpnKey />\n              </Avatar>\n            </ListItemAvatar>\n\n            <ListItemText\n              primary={chosenGcpCryptoKey.keyName}\n              secondary={<>Project ID: {chosenGcpCryptoKey.projectId}</>}\n            />\n            <ExpandMoreIcon sx={{ marginLeft: 'auto' }} />\n            {!chosenGcpCryptoKey.hasEncryptDecryptAccess && (\n              <>\n                <WarningAmberIcon sx={{ color: 'red' }} />\n                {t('dictionary.noAccess')}\n              </>\n            )}\n          </>\n        )}\n      </ListItemButton>\n      <Menu\n        anchorEl={anchorEl}\n        open={open}\n        onClose={() => setAnchorEl(null)}\n        transformOrigin={{ horizontal: 'left', vertical: 'top' }}\n        anchorOrigin={{ horizontal: 'left', vertical: 'bottom' }}\n        slotProps={{\n          paper: {\n            style: {\n              maxHeight: 500,\n              width: 500,\n            },\n          },\n        }}\n      >\n        {Object.keys(gcpCryptoKeysGroupedByAccess).map(hasAccess => (\n          <li key={`access-group-${hasAccess}`}>\n            <ul style={{ paddingLeft: 0, marginLeft: 0 }}>\n              <ListSubheader>\n                {hasAccess === 'true'\n                  ? t('sopsConfigDialog.gcpKeyHaveAccess')\n                  : t('sopsConfigDialog.gcpKeyDoNotHaveAccess')}\n              </ListSubheader>\n              {gcpCryptoKeysGroupedByAccess[hasAccess].map(gcpCryptoKey => (\n                <GcpCryptoKeyMenuItem\n                  key={`${gcpCryptoKey.projectId}-${gcpCryptoKey.keyRing}-${gcpCryptoKey.keyName}`}\n                  value={JSON.stringify(gcpCryptoKey)}\n                  gcpCryptoKey={gcpCryptoKey}\n                  handleClick={handleClickMenuItem}\n                  hasAccess={hasAccess === 'true'}\n                  isSelected={\n                    gcpCryptoKey.projectId === chosenGcpCryptoKey.projectId &&\n                    gcpCryptoKey.keyRing === chosenGcpCryptoKey.keyRing &&\n                    gcpCryptoKey.keyName === chosenGcpCryptoKey.keyName\n                  }\n                />\n              ))}\n            </ul>\n          </li>\n        ))}\n      </Menu>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAoBO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,kBAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,EAA0B;AACxB,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAA6B,IAAI,CAAA;AACjE,EAAA,MAAM,IAAA,GAAO,QAAQ,QAAQ,CAAA;AAE7B,EAAA,SAAS,YAAY,KAAA,EAAgC;AACnD,IAAA,WAAA,CAAY,MAAM,aAAa,CAAA;AAAA,EACjC;AAEA,EAAA,SAAS,oBAAoB,YAAA,EAAkC;AAC7D,IAAA,QAAA,CAAS,YAAY,CAAA;AACrB,IAAA,WAAA,CAAY,IAAI,CAAA;AAAA,EAClB;AAEA,EAAA,MAAM,4BAAA,GAA+B,aAAA,CAAc,MAAA,CAEjD,CAAC,KAAK,YAAA,KAAiB;AACvB,IAAA,MAAM,GAAA,GAAA,CAAO,YAAA,CAAa,uBAAA,IAA2B,KAAA,EAAO,QAAA,EAAS;AACrE,IAAA,IAAI,CAAC,GAAA,CAAI,GAAG,CAAA,EAAG;AACb,MAAA,GAAA,CAAI,GAAG,IAAI,EAAC;AAAA,IACd;AACA,IAAA,GAAA,CAAI,GAAG,CAAA,CAAE,IAAA,CAAK,YAAY,CAAA;AAC1B,IAAA,OAAO,GAAA;AAAA,EACT,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,uBACE,IAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,EAAA,EAAI;AAAA,QACF,QAAA,EAAU,UAAA;AAAA,QACV,IAAA,EAAM,CAAA;AAAA,QACN,SAAA,EAAW,CAAA;AAAA,QACX,MAAA,EAAQ,WAAA;AAAA,QACR,aAAa,CAAA,KAAA,KACX,KAAA,CAAM,OAAA,CAAQ,IAAA,KAAS,SAAS,OAAA,GAAU,UAAA;AAAA,QAC5C,YAAA,EAAc;AAAA,OAChB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,cAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,WAAA;AAAA,YACT,EAAA,EAAI;AAAA,cACF,OAAA,EAAS,MAAA;AAAA,cACT,aAAA,EAAe,KAAA;AAAA,cACf,UAAA,EAAY,QAAA;AAAA,cACZ,GAAA,EAAK;AAAA,aACP;AAAA,YAEC,QAAA,EAAA,kBAAA,CAAmB,SAAA,KAAc,EAAA,mBAChC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,kBACC,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,GACX,CAAA,EACF,CAAA;AAAA,8BACA,GAAA,CAAC,YAAA,EAAA,EAAa,OAAA,EAAS,CAAA,CAAE,qCAAqC,CAAA,EAAG;AAAA,aAAA,EACnE,oBAEA,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,cAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,EAAA,EAAI;AAAA,oBACF,eAAA,EACE,kBAAA,CAAmB,SAAA,KAAc,EAAA,GAC7B,cAAA,GACA,SAAA;AAAA,oBACN,KAAA,EACE,kBAAA,CAAmB,SAAA,KAAc,EAAA,GAAK,OAAA,GAAU;AAAA,mBACpD;AAAA,kBAEA,8BAAC,MAAA,EAAA,EAAO;AAAA;AAAA,eACV,EACF,CAAA;AAAA,8BAEA,GAAA;AAAA,gBAAC,YAAA;AAAA,gBAAA;AAAA,kBACC,SAAS,kBAAA,CAAmB,OAAA;AAAA,kBAC5B,2BAAW,IAAA,CAAA,QAAA,EAAA,EAAE,QAAA,EAAA;AAAA,oBAAA,cAAA;AAAA,oBAAa,kBAAA,CAAmB;AAAA,mBAAA,EAAU;AAAA;AAAA,eACzD;AAAA,kCACC,cAAA,EAAA,EAAe,EAAA,EAAI,EAAE,UAAA,EAAY,QAAO,EAAG,CAAA;AAAA,cAC3C,CAAC,kBAAA,CAAmB,uBAAA,oBACnB,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,gBAAA,EAAA,EAAiB,EAAA,EAAI,EAAE,KAAA,EAAO,OAAM,EAAG,CAAA;AAAA,gBACvC,EAAE,qBAAqB;AAAA,eAAA,EAC1B;AAAA,aAAA,EAEJ;AAAA;AAAA,SAEJ;AAAA,wBACA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACC,QAAA;AAAA,YACA,IAAA;AAAA,YACA,OAAA,EAAS,MAAM,WAAA,CAAY,IAAI,CAAA;AAAA,YAC/B,eAAA,EAAiB,EAAE,UAAA,EAAY,MAAA,EAAQ,UAAU,KAAA,EAAM;AAAA,YACvD,YAAA,EAAc,EAAE,UAAA,EAAY,MAAA,EAAQ,UAAU,QAAA,EAAS;AAAA,YACvD,SAAA,EAAW;AAAA,cACT,KAAA,EAAO;AAAA,gBACL,KAAA,EAAO;AAAA,kBACL,SAAA,EAAW,GAAA;AAAA,kBACX,KAAA,EAAO;AAAA;AACT;AACF,aACF;AAAA,YAEC,iBAAO,IAAA,CAAK,4BAA4B,CAAA,CAAE,GAAA,CAAI,+BAC7C,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,IAAA,EAAA,EAAG,OAAO,EAAE,WAAA,EAAa,CAAA,EAAG,UAAA,EAAY,GAAE,EACzC,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,aAAA,EAAA,EACE,wBAAc,MAAA,GACX,CAAA,CAAE,mCAAmC,CAAA,GACrC,CAAA,CAAE,wCAAwC,CAAA,EAChD,CAAA;AAAA,cACC,4BAAA,CAA6B,SAAS,CAAA,CAAE,GAAA,CAAI,CAAA,YAAA,qBAC3C,GAAA;AAAA,gBAAC,oBAAA;AAAA,gBAAA;AAAA,kBAEC,KAAA,EAAO,IAAA,CAAK,SAAA,CAAU,YAAY,CAAA;AAAA,kBAClC,YAAA;AAAA,kBACA,WAAA,EAAa,mBAAA;AAAA,kBACb,WAAW,SAAA,KAAc,MAAA;AAAA,kBACzB,UAAA,EACE,YAAA,CAAa,SAAA,KAAc,kBAAA,CAAmB,SAAA,IAC9C,YAAA,CAAa,OAAA,KAAY,kBAAA,CAAmB,OAAA,IAC5C,YAAA,CAAa,OAAA,KAAY,kBAAA,CAAmB;AAAA,iBAAA;AAAA,gBARzC,CAAA,EAAG,aAAa,SAAS,CAAA,CAAA,EAAI,aAAa,OAAO,CAAA,CAAA,EAAI,aAAa,OAAO,CAAA;AAAA,eAWjF;AAAA,aAAA,EACH,CAAA,EAAA,EArBO,CAAA,aAAA,EAAgB,SAAS,CAAA,CAsBlC,CACD;AAAA;AAAA;AACH;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"GcpCryptoKeyMenu.esm.js","sources":["../../../src/components/sopsConfigDialog/GcpCryptoKeyMenu.tsx"],"sourcesContent":["import { Avatar, ListItemButton, ListSubheader, Menu } from '@mui/material';\nimport { GcpCryptoKeyObject } from '../../utils/DTOs';\nimport { GcpCryptoKeyMenuItem } from './GcpCryptoKeyMenuItem';\nimport Box from '@mui/material/Box';\nimport ListItemAvatar from '@mui/material/ListItemAvatar';\nimport { VpnKey } from '@mui/icons-material';\nimport ListItemText from '@mui/material/ListItemText';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport AddIcon from '@mui/icons-material/Add';\nimport WarningAmberIcon from '@mui/icons-material/WarningAmber';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport { useState, MouseEvent } from 'react';\n\ninterface GcpCryptoKeyMenuProps {\n  chosenGcpCryptoKey: GcpCryptoKeyObject;\n  onChange: (gcpCryptoKey: GcpCryptoKeyObject) => void;\n  gcpCryptoKeys: GcpCryptoKeyObject[];\n}\n\nexport function GcpCryptoKeyMenu({\n  chosenGcpCryptoKey,\n  onChange,\n  gcpCryptoKeys,\n}: GcpCryptoKeyMenuProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const open = Boolean(anchorEl);\n\n  function handleClick(event: MouseEvent<HTMLElement>) {\n    setAnchorEl(event.currentTarget);\n  }\n\n  function handleClickMenuItem(gcpCryptoKey: GcpCryptoKeyObject) {\n    onChange(gcpCryptoKey);\n    setAnchorEl(null);\n  }\n\n  const gcpCryptoKeysGroupedByAccess = gcpCryptoKeys.reduce<\n    Record<string, GcpCryptoKeyObject[]>\n  >((acc, gcpCryptoKey) => {\n    const key = (gcpCryptoKey.hasEncryptDecryptAccess ?? false).toString();\n    if (!acc[key]) {\n      acc[key] = [];\n    }\n    acc[key].push(gcpCryptoKey);\n    return acc;\n  }, {});\n\n  return (\n    <Box\n      sx={{\n        position: 'relative',\n        left: 0,\n        marginTop: 1,\n        border: '1px solid',\n        borderColor: theme =>\n          theme.palette.mode === 'dark' ? 'white' : 'grey.300',\n        borderRadius: '4px',\n      }}\n    >\n      <ListItemButton\n        onClick={handleClick}\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          alignItems: 'center',\n          gap: 1,\n        }}\n      >\n        {chosenGcpCryptoKey.projectId === '' ? (\n          <>\n            <ListItemAvatar>\n              <Avatar>\n                <AddIcon />\n              </Avatar>\n            </ListItemAvatar>\n            <ListItemText primary={t('sopsConfigDialog.chooseGcpCryptoKey')} />\n          </>\n        ) : (\n          <>\n            <ListItemAvatar>\n              <Avatar\n                sx={{\n                  backgroundColor:\n                    chosenGcpCryptoKey.projectId !== ''\n                      ? 'primary.main'\n                      : 'default',\n                  color:\n                    chosenGcpCryptoKey.projectId !== '' ? 'white' : 'inherit',\n                }}\n              >\n                <VpnKey />\n              </Avatar>\n            </ListItemAvatar>\n\n            <ListItemText\n              primary={chosenGcpCryptoKey.keyName}\n              secondary={<>Project ID: {chosenGcpCryptoKey.projectId}</>}\n            />\n            <ExpandMoreIcon sx={{ marginLeft: 'auto' }} />\n            {!chosenGcpCryptoKey.hasEncryptDecryptAccess && (\n              <>\n                <WarningAmberIcon sx={{ color: 'red' }} />\n                {t('dictionary.noAccess')}\n              </>\n            )}\n          </>\n        )}\n      </ListItemButton>\n      <Menu\n        disablePortal\n        anchorEl={anchorEl}\n        open={open}\n        onClose={() => setAnchorEl(null)}\n        transformOrigin={{ horizontal: 'left', vertical: 'top' }}\n        anchorOrigin={{ horizontal: 'left', vertical: 'bottom' }}\n        slotProps={{\n          paper: {\n            style: {\n              maxHeight: 500,\n              width: 500,\n            },\n          },\n        }}\n      >\n        {Object.keys(gcpCryptoKeysGroupedByAccess).map(hasAccess => (\n          <li key={`access-group-${hasAccess}`}>\n            <ul style={{ paddingLeft: 0, marginLeft: 0 }}>\n              <ListSubheader>\n                {hasAccess === 'true'\n                  ? t('sopsConfigDialog.gcpKeyHaveAccess')\n                  : t('sopsConfigDialog.gcpKeyDoNotHaveAccess')}\n              </ListSubheader>\n              {gcpCryptoKeysGroupedByAccess[hasAccess].map(gcpCryptoKey => (\n                <GcpCryptoKeyMenuItem\n                  key={`${gcpCryptoKey.projectId}-${gcpCryptoKey.keyRing}-${gcpCryptoKey.keyName}`}\n                  value={JSON.stringify(gcpCryptoKey)}\n                  gcpCryptoKey={gcpCryptoKey}\n                  handleClick={handleClickMenuItem}\n                  hasAccess={hasAccess === 'true'}\n                  isSelected={\n                    gcpCryptoKey.projectId === chosenGcpCryptoKey.projectId &&\n                    gcpCryptoKey.keyRing === chosenGcpCryptoKey.keyRing &&\n                    gcpCryptoKey.keyName === chosenGcpCryptoKey.keyName\n                  }\n                />\n              ))}\n            </ul>\n          </li>\n        ))}\n      </Menu>\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kartverket/backstage-plugin-risk-scorecard",
-  "version": "3.10.3",
+  "version": "3.10.4",
   "main": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "license": "MIT",