@pega/cosmos-react-work 9.0.0-build.12.0 → 9.0.0-build.12.2

package/lib/components/GenAICoach/ToolDetails.js

@@ -0,0 +1,91 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { Button, Flex, FormField, Grid, Input, Modal, MultiStepForm, RadioButton, RadioButtonGroup, Text, useI18n, useModalContext, useUID } from '@pega/cosmos-react-core';
+import { StyledConfirmationMsg } from './GenAICoach.styles';
+const CurrentToolContent = ({ tool, baseToolDetails, onDecisionChange, onParameterChange, setHasError, toolsConfirmed }) => {
+    const t = useI18n();
+    const { decision = 'approve' } = tool;
+    useEffect(() => {
+        if (tool.decision === 'modify' && tool.parameters) {
+            const hasEmptyParam = tool.parameters.some(param => !param.value);
+            setHasError?.(hasEmptyParam);
+        }
+    }, [tool.parameters, tool.decision]);
+    const id = useUID();
+    const accept = 'accept';
+    const modify = 'modify';
+    const reject = 'reject';
+    return (_jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [_jsx(FormField, { label: t('current_action'), readOnly: true, children: _jsx(StyledConfirmationMsg, { content: tool.message, type: 'markdown' }) }), _jsxs(RadioButtonGroup, { name: 'decision', label: t('tool_decision'), required: true, inline: true, onChange: (e) => {
+                    if (e.target.checked) {
+                        const value = e.target.value;
+                        if (value === accept || value === modify || value === reject) {
+                            onDecisionChange?.(tool.id, value);
+                        }
+                    }
+                }, readOnly: toolsConfirmed, children: [_jsx(RadioButton, { label: t('accept'), checked: decision === 'accept', id: `${id}-${accept}-${tool.id}`, value: accept }), _jsx(RadioButton, { label: t('modify'), checked: decision === 'modify', id: `${id}-${modify}-${tool.id}`, value: modify }), _jsx(RadioButton, { label: t('reject'), checked: decision === 'reject', id: `${id}-${reject}-${tool.id}`, value: reject })] }), tool.decision === modify && tool.parameters && (_jsxs(Flex, { container: { direction: 'column' }, children: [_jsx(Text, { variant: 'h2', children: t('modify_details') }), _jsx(Grid, { container: { gap: 1, cols: 'repeat(2, minmax(0, 1fr))' }, children: tool.parameters.map(param => {
+                            const baseParamInfo = baseToolDetails?.parameters?.find(currentParam => currentParam.id === param.id);
+                            const info = baseParamInfo ? t('current_details', [baseParamInfo.value]) : undefined;
+                            if (param.type === 'text' || param.type === 'number') {
+                                return (_jsx(Input, { required: true, label: param.label, defaultValue: param.value, readOnly: toolsConfirmed, type: param.type, status: !param.value ? 'error' : undefined, info: !param.value ? t('value_cannot_be_blank') : info, onChange: e => {
+                                        onParameterChange?.(tool.id, param.id, e.target.value);
+                                    } }, param.id));
+                            }
+                            if (param.type === 'boolean') {
+                                return (_jsxs(RadioButtonGroup, { name: param.label, label: param.label, required: true, inline: true, onChange: (e) => {
+                                        if (e.target.checked) {
+                                            onParameterChange?.(tool.id, param.id, e.target.value);
+                                        }
+                                    }, readOnly: toolsConfirmed, info: !toolsConfirmed ? info : undefined, children: [_jsx(RadioButton, { label: t('true'), checked: param.value === 'true', id: `${id}-true`, value: 'true' }), _jsx(RadioButton, { label: t('false'), checked: param.value === 'false', id: `${id}-false`, value: 'false' })] }));
+                            }
+                            return null;
+                        }) })] }))] }));
+};
+const ToolDetails = ({ tools: toolProps, onSubmit, onCancel, toolsConfirmed }) => {
+    const t = useI18n();
+    const { dismiss } = useModalContext();
+    const [currentStepIndex, setCurrentStepIndex] = useState(0);
+    const finalStep = currentStepIndex === (toolProps ? toolProps.length - 1 : 0);
+    const [tools, setTools] = useState(toolProps || []);
+    const [hasError, setHasError] = useState(false);
+    const handleDecisionChange = (toolId, currentDecision) => {
+        setTools(prevTools => prevTools.map(tool => (tool.id === toolId ? { ...tool, decision: currentDecision } : tool)));
+    };
+    const handleParameterChange = (toolId, parameterId, currentVal) => {
+        setTools(prevTools => prevTools.map(tool => {
+            if (tool.id === toolId && tool.parameters) {
+                const updatedParameters = tool.parameters.map(param => param.id === parameterId ? { ...param, value: currentVal } : param);
+                return { ...tool, parameters: updatedParameters };
+            }
+            return tool;
+        }));
+    };
+    const stepActions = useMemo(() => {
+        return (_jsxs(_Fragment, { children: [_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => {
+                                if (!toolsConfirmed)
+                                    onCancel?.();
+                                dismiss();
+                            }, children: toolsConfirmed ? t('close') : t('cancel') }), currentStepIndex > 0 && (_jsx(Button, { onClick: () => {
+                                if (!hasError)
+                                    setCurrentStepIndex(currentStepIndex - 1);
+                            }, children: t('previous') }))] }), _jsxs(_Fragment, { children: [!finalStep && (_jsx(Button, { variant: 'primary', onClick: () => {
+                                if (!hasError)
+                                    setCurrentStepIndex(currentStepIndex + 1);
+                            }, children: t('pagination_next') })), finalStep && !toolsConfirmed && (_jsx(Button, { type: 'submit', variant: 'primary', onClick: () => {
+                                if (!hasError) {
+                                    if (tools)
+                                        onSubmit?.(tools);
+                                    dismiss();
+                                }
+                            }, children: t('submit') }))] })] }));
+    }, [currentStepIndex, hasError, tools]);
+    const stepData = useMemo(() => {
+        return tools.map(tool => ({
+            id: tool.id,
+            name: tool.name,
+            content: (_jsx(CurrentToolContent, { tool: tool, baseToolDetails: toolProps?.find(toolVal => toolVal.id === tool.id), setHasError: setHasError, toolsConfirmed: toolsConfirmed, onDecisionChange: handleDecisionChange, onParameterChange: handleParameterChange }))
+        }));
+    }, [tools]);
+    return (_jsx(Modal, { heading: t('confirm_details'), actions: stepActions, children: _jsx(MultiStepForm, { steps: stepData, currentStepId: stepData[currentStepIndex].id, stepIndicator: 'horizontal' }) }));
+};
+export default ToolDetails;
+//# sourceMappingURL=ToolDetails.js.map

package/lib/components/GenAICoach/ToolDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolDetails.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/ToolDetails.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport type { ChangeEvent, Dispatch, SetStateAction } from 'react';\n\nimport {\n  Button,\n  Flex,\n  FormField,\n  Grid,\n  Input,\n  Modal,\n  MultiStepForm,\n  RadioButton,\n  RadioButtonGroup,\n  Text,\n  useI18n,\n  useModalContext,\n  useUID\n} from '@pega/cosmos-react-core';\nimport type { OmitStrict } from '@pega/cosmos-react-core';\n\nimport type { Tool, ToolDetailsProps, ToolParameters } from './GenAICoach.types';\nimport { StyledConfirmationMsg } from './GenAICoach.styles';\n\nconst CurrentToolContent = ({\n  tool,\n  baseToolDetails,\n  onDecisionChange,\n  onParameterChange,\n  setHasError,\n  toolsConfirmed\n}: {\n  tool: Tool;\n  baseToolDetails?: Tool;\n  toolsConfirmed?: boolean;\n  setHasError?: Dispatch<SetStateAction<boolean>>;\n  onDecisionChange: (toolId: Tool['id'], currentDecision: Tool['decision']) => void;\n  onParameterChange?: (\n    toolId: Tool['id'],\n    parameterId: ToolParameters['id'],\n    currentVal: ToolParameters['value']\n  ) => void;\n}) => {\n  const t = useI18n();\n  const { decision = 'approve' } = tool;\n\n  useEffect(() => {\n    if (tool.decision === 'modify' && tool.parameters) {\n      const hasEmptyParam = tool.parameters.some(param => !param.value);\n\n      setHasError?.(hasEmptyParam);\n    }\n  }, [tool.parameters, tool.decision]);\n\n  const id = useUID();\n  const accept = 'accept';\n  const modify = 'modify';\n  const reject = 'reject';\n  return (\n    <Flex container={{ direction: 'column', gap: 1 }}>\n      <FormField label={t('current_action')} readOnly>\n        <StyledConfirmationMsg content={tool.message} type='markdown' />\n      </FormField>\n\n      <RadioButtonGroup\n        name='decision'\n        label={t('tool_decision')}\n        required\n        inline\n        onChange={(e: ChangeEvent<HTMLInputElement>) => {\n          if (e.target.checked) {\n            const value = e.target.value;\n            if (value === accept || value === modify || value === reject) {\n              onDecisionChange?.(tool.id, value);\n            }\n          }\n        }}\n        readOnly={toolsConfirmed}\n      >\n        <RadioButton\n          label={t('accept')}\n          checked={decision === 'accept'}\n          id={`${id}-${accept}-${tool.id}`}\n          value={accept}\n        />\n        <RadioButton\n          label={t('modify')}\n          checked={decision === 'modify'}\n          id={`${id}-${modify}-${tool.id}`}\n          value={modify}\n        />\n        <RadioButton\n          label={t('reject')}\n          checked={decision === 'reject'}\n          id={`${id}-${reject}-${tool.id}`}\n          value={reject}\n        />\n      </RadioButtonGroup>\n\n      {tool.decision === modify && tool.parameters && (\n        <Flex container={{ direction: 'column' }}>\n          <Text variant='h2'>{t('modify_details')}</Text>\n          <Grid container={{ gap: 1, cols: 'repeat(2, minmax(0, 1fr))' }}>\n            {tool.parameters.map(param => {\n              const baseParamInfo = baseToolDetails?.parameters?.find(\n                currentParam => currentParam.id === param.id\n              );\n              const info = baseParamInfo ? t('current_details', [baseParamInfo.value]) : undefined;\n              if (param.type === 'text' || param.type === 'number') {\n                return (\n                  <Input\n                    key={param.id}\n                    required\n                    label={param.label}\n                    defaultValue={param.value}\n                    readOnly={toolsConfirmed}\n                    type={param.type}\n                    status={!param.value ? 'error' : undefined}\n                    info={!param.value ? t('value_cannot_be_blank') : info}\n                    onChange={e => {\n                      onParameterChange?.(tool.id, param.id, e.target.value);\n                    }}\n                  />\n                );\n              }\n              if (param.type === 'boolean') {\n                return (\n                  <RadioButtonGroup\n                    name={param.label}\n                    label={param.label}\n                    required\n                    inline\n                    onChange={(e: ChangeEvent<HTMLInputElement>) => {\n                      if (e.target.checked) {\n                        onParameterChange?.(tool.id, param.id, e.target.value);\n                      }\n                    }}\n                    readOnly={toolsConfirmed}\n                    info={!toolsConfirmed ? info : undefined}\n                  >\n                    <RadioButton\n                      label={t('true')}\n                      checked={param.value === 'true'}\n                      id={`${id}-true`}\n                      value='true'\n                    />\n                    <RadioButton\n                      label={t('false')}\n                      checked={param.value === 'false'}\n                      id={`${id}-false`}\n                      value='false'\n                    />\n                  </RadioButtonGroup>\n                );\n              }\n              return null;\n            })}\n          </Grid>\n        </Flex>\n      )}\n    </Flex>\n  );\n};\n\nconst ToolDetails = ({\n  tools: toolProps,\n  onSubmit,\n  onCancel,\n  toolsConfirmed\n}: OmitStrict<ToolDetailsProps, 'isToolConfirmation'>) => {\n  const t = useI18n();\n  const { dismiss } = useModalContext();\n  const [currentStepIndex, setCurrentStepIndex] = useState(0);\n  const finalStep = currentStepIndex === (toolProps ? toolProps.length - 1 : 0);\n\n  const [tools, setTools] = useState<Tool[]>(toolProps || []);\n  const [hasError, setHasError] = useState(false);\n\n  const handleDecisionChange = (toolId: Tool['id'], currentDecision: Tool['decision']) => {\n    setTools(prevTools =>\n      prevTools.map(tool => (tool.id === toolId ? { ...tool, decision: currentDecision } : tool))\n    );\n  };\n\n  const handleParameterChange = (\n    toolId: Tool['id'],\n    parameterId: ToolParameters['id'],\n    currentVal: ToolParameters['value']\n  ) => {\n    setTools(prevTools =>\n      prevTools.map(tool => {\n        if (tool.id === toolId && tool.parameters) {\n          const updatedParameters = tool.parameters.map(param =>\n            param.id === parameterId ? { ...param, value: currentVal } : param\n          );\n          return { ...tool, parameters: updatedParameters };\n        }\n        return tool;\n      })\n    );\n  };\n\n  const stepActions = useMemo(() => {\n    return (\n      <>\n        <>\n          <Button\n            onClick={() => {\n              if (!toolsConfirmed) onCancel?.();\n              dismiss();\n            }}\n          >\n            {toolsConfirmed ? t('close') : t('cancel')}\n          </Button>\n          {currentStepIndex > 0 && (\n            <Button\n              onClick={() => {\n                if (!hasError) setCurrentStepIndex(currentStepIndex - 1);\n              }}\n            >\n              {t('previous')}\n            </Button>\n          )}\n        </>\n\n        <>\n          {!finalStep && (\n            <Button\n              variant='primary'\n              onClick={() => {\n                if (!hasError) setCurrentStepIndex(currentStepIndex + 1);\n              }}\n            >\n              {t('pagination_next')}\n            </Button>\n          )}\n          {finalStep && !toolsConfirmed && (\n            <Button\n              type='submit'\n              variant='primary'\n              onClick={() => {\n                if (!hasError) {\n                  if (tools) onSubmit?.(tools);\n                  dismiss();\n                }\n              }}\n            >\n              {t('submit')}\n            </Button>\n          )}\n        </>\n      </>\n    );\n  }, [currentStepIndex, hasError, tools]);\n\n  const stepData = useMemo(() => {\n    return tools.map(tool => ({\n      id: tool.id,\n      name: tool.name,\n      content: (\n        <CurrentToolContent\n          tool={tool}\n          baseToolDetails={toolProps?.find(toolVal => toolVal.id === tool.id)}\n          setHasError={setHasError}\n          toolsConfirmed={toolsConfirmed}\n          onDecisionChange={handleDecisionChange}\n          onParameterChange={handleParameterChange}\n        />\n      )\n    }));\n  }, [tools]);\n\n  return (\n    <Modal heading={t('confirm_details')} actions={stepActions}>\n      <MultiStepForm\n        steps={stepData}\n        currentStepId={stepData[currentStepIndex].id}\n        stepIndicator='horizontal'\n      />\n    </Modal>\n  );\n};\n\nexport default ToolDetails;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-work",
-  "version": "9.0.0-build.12.0",
+  "version": "9.0.0-build.12.2",
   "license": "SEE LICENSE IN LICENSE",
   "author": "Pegasystems",
   "sideEffects": false,
@@ -14,8 +14,8 @@
     "build": "tsc -b tsconfig.build.json"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "9.0.0-build.12.0",
-    "@pega/cosmos-react-rte": "9.0.0-build.12.0",
+    "@pega/cosmos-react-core": "9.0.0-build.12.2",
+    "@pega/cosmos-react-rte": "9.0.0-build.12.2",
     "@types/react": "^17.0.62 || ^18.3.3",
     "@types/react-dom": "^17.0.20 || ^18.3.0",
     "@types/styled-components": "^5.1.26",