diff --git a/designer/client/cypress/support/process.ts b/designer/client/cypress/support/process.ts index 4aa5fdfdc71..b493106f56a 100644 --- a/designer/client/cypress/support/process.ts +++ b/designer/client/cypress/support/process.ts @@ -310,12 +310,13 @@ function layoutScenario(waitTime = 600) { function deployScenario(comment = "issues/123", withScreenshot?: boolean) { cy.contains(/^deploy$/i).click(); cy.intercept("POST", "/api/processManagement/deploy/*").as("deploy"); + cy.intercept("GET", "/api/processes/*/activity/activities").as("activities"); if (withScreenshot) { cy.get("[data-testid=window]").matchImage(); } cy.get("[data-testid=window] textarea").click().type(comment); cy.contains(/^ok$/i).should("be.enabled").click(); - cy.wait(["@deploy", "@fetch"], { + cy.wait(["@deploy", "@activities"], { timeout: 20000, log: true, }).each((res) => { diff --git a/designer/client/src/actions/actionTypes.ts b/designer/client/src/actions/actionTypes.ts index a6cae1509af..98eb8dc62f9 100644 --- a/designer/client/src/actions/actionTypes.ts +++ b/designer/client/src/actions/actionTypes.ts @@ -26,7 +26,6 @@ export type ActionTypes = | "UPDATE_TEST_CAPABILITIES" | "UPDATE_TEST_FORM_PARAMETERS" | "DISPLAY_PROCESS" - | "DISPLAY_PROCESS_ACTIVITY" | "GET_SCENARIO_ACTIVITIES" | "UPDATE_SCENARIO_ACTIVITIES" | "PROCESS_FETCH" diff --git a/designer/client/src/actions/nk/comment.ts b/designer/client/src/actions/nk/comment.ts deleted file mode 100644 index 9b1d4302c70..00000000000 --- a/designer/client/src/actions/nk/comment.ts +++ /dev/null @@ -1,20 +0,0 @@ -import HttpService from "../../http/HttpService"; -import { displayProcessActivity } from "./displayProcessActivity"; -import { ThunkAction } from "../reduxTypes"; -import { ProcessName } from "../../components/Process/types"; - -export function addComment(processName: ProcessName, processVersionId, comment): ThunkAction { - return (dispatch) => { - return HttpService.addComment(processName, processVersionId, comment).then(() => { - return dispatch(displayProcessActivity(processName)); - }); - }; -} - -export function deleteComment(processName: ProcessName, commentId): ThunkAction { - return (dispatch) => { - return HttpService.deleteComment(processName, commentId).then(() => { - return dispatch(displayProcessActivity(processName)); - }); - }; -} diff --git a/designer/client/src/actions/nk/displayProcessActivity.ts b/designer/client/src/actions/nk/displayProcessActivity.ts deleted file mode 100644 index 60c2ad06ac4..00000000000 --- a/designer/client/src/actions/nk/displayProcessActivity.ts +++ /dev/null @@ -1,21 +0,0 @@ -import HttpService from "../../http/HttpService"; -import { Attachment } from "../../reducers/processActivity"; -import { ThunkAction } from "../reduxTypes"; - -export type DisplayProcessActivityAction = { - type: "DISPLAY_PROCESS_ACTIVITY"; - comments: Comment[]; - attachments: Attachment[]; -}; - -export function displayProcessActivity(processName: string): ThunkAction { - return (dispatch) => { - return HttpService.fetchProcessActivity(processName).then((response) => { - return dispatch({ - type: "DISPLAY_PROCESS_ACTIVITY", - comments: response.data.comments, - attachments: response.data.attachments, - }); - }); - }; -} diff --git a/designer/client/src/actions/nk/fetchVisualizationData.ts b/designer/client/src/actions/nk/fetchVisualizationData.ts index b7da8b8df03..c73139b8d16 100644 --- a/designer/client/src/actions/nk/fetchVisualizationData.ts +++ b/designer/client/src/actions/nk/fetchVisualizationData.ts @@ -1,6 +1,5 @@ import { ThunkAction } from "../reduxTypes"; import { displayCurrentProcessVersion } from "./process"; -import { displayProcessActivity } from "./displayProcessActivity"; import { fetchProcessDefinition } from "./processDefinitionData"; import { loadProcessToolbarsConfiguration } from "./loadProcessToolbarsConfiguration"; import { ProcessName } from "../../components/Process/types"; @@ -11,7 +10,6 @@ export function fetchVisualizationData(processName: ProcessName, onSuccess: () = const scenario = await dispatch(displayCurrentProcessVersion(processName)); const { name, isFragment, processingType } = scenario; await dispatch(loadProcessToolbarsConfiguration(name)); - dispatch(displayProcessActivity(name)); const processDefinitionData = await dispatch(fetchProcessDefinition(processingType, isFragment)); dispatch({ type: "CORRECT_INVALID_SCENARIO", processDefinitionData }); onSuccess(); diff --git a/designer/client/src/actions/nk/index.ts b/designer/client/src/actions/nk/index.ts index 9815a32b9c6..a4d340942a7 100644 --- a/designer/client/src/actions/nk/index.ts +++ b/designer/client/src/actions/nk/index.ts @@ -1,7 +1,5 @@ export * from "./assignSettings"; export * from "./assignUser"; -export * from "./comment"; -export * from "./displayProcessActivity"; export * from "./displayProcessCounts"; export * from "./editNode"; export * from "./importExport"; diff --git a/designer/client/src/actions/nk/loadProcessVersions.ts b/designer/client/src/actions/nk/loadProcessVersions.ts deleted file mode 100644 index cb487858120..00000000000 --- a/designer/client/src/actions/nk/loadProcessVersions.ts +++ /dev/null @@ -1,22 +0,0 @@ -import HttpService from "../../http/HttpService"; -import { ProcessActionType, ProcessName, ProcessVersionType } from "../../components/Process/types"; -import { ThunkAction } from "../reduxTypes"; - -export type LoadProcessVersionsAction = { - type: "PROCESS_VERSIONS_LOADED"; - history: ProcessVersionType[]; - lastAction: ProcessActionType; - lastDeployedAction: ProcessActionType; -}; - -export function loadProcessVersions(processName: ProcessName): ThunkAction> { - return (dispatch) => - HttpService.fetchProcessDetails(processName).then((response) => { - return dispatch({ - type: "PROCESS_VERSIONS_LOADED", - history: response.data.history, - lastDeployedAction: response.data.lastDeployedAction, - lastAction: response.data.lastAction, - }); - }); -} diff --git a/designer/client/src/actions/nk/process.ts b/designer/client/src/actions/nk/process.ts index 6ac7d7e5b67..8c6572086b9 100644 --- a/designer/client/src/actions/nk/process.ts +++ b/designer/client/src/actions/nk/process.ts @@ -6,7 +6,6 @@ import { getProcessDefinitionData } from "../../reducers/selectors/settings"; import { ProcessDefinitionData, ScenarioGraph } from "../../types"; import { ThunkAction } from "../reduxTypes"; import HttpService from "./../../http/HttpService"; -import { displayProcessActivity } from "./displayProcessActivity"; export type ScenarioActions = | { type: "CORRECT_INVALID_SCENARIO"; processDefinitionData: ProcessDefinitionData } @@ -80,8 +79,3 @@ export function hideRunProcessDetails() { replaceSearchQuery(omit(["from", "to", "refresh"])); return { type: "HIDE_RUN_PROCESS_DETAILS" }; } - -export function addAttachment(processName: ProcessName, processVersionId: ProcessVersionId, file: File) { - return (dispatch) => - HttpService.addAttachment(processName, processVersionId, file).then(() => dispatch(displayProcessActivity(processName))); -} diff --git a/designer/client/src/actions/reduxTypes.ts b/designer/client/src/actions/reduxTypes.ts index dd5108f511a..070a73798fc 100644 --- a/designer/client/src/actions/reduxTypes.ts +++ b/designer/client/src/actions/reduxTypes.ts @@ -2,22 +2,19 @@ import { AnyAction, Reducer as ReduxReducer } from "redux"; import { ThunkAction as TA, ThunkDispatch as TD } from "redux-thunk"; import { ActionTypes } from "./actionTypes"; -import { CountsActions, DisplayProcessActivityAction, NodeActions, ScenarioActions, SelectionActions } from "./nk"; +import { CountsActions, NodeActions, ScenarioActions, SelectionActions, NodeDetailsActions } from "./nk"; import { UserSettingsActions } from "./nk/userSettings"; import { UiActions } from "./nk/ui/uiActions"; import { SettingsActions } from "./settingsActions"; import { ToolbarActions } from "./nk/toolbars"; import { RootState } from "../reducers"; -import { NodeDetailsActions } from "./nk/nodeDetails"; import { NotificationActions } from "./nk/notifications"; import { DisplayTestResultsDetailsAction } from "./nk/displayTestResults"; -import { LoadProcessVersionsAction } from "./nk/loadProcessVersions"; import { GetScenarioActivitiesAction, UpdateScenarioActivitiesAction } from "./nk/scenarioActivities"; type TypedAction = | UiActions | SettingsActions - | DisplayProcessActivityAction | GetScenarioActivitiesAction | UpdateScenarioActivitiesAction | NodeActions @@ -28,7 +25,6 @@ type TypedAction = | NotificationActions | DisplayTestResultsDetailsAction | CountsActions - | LoadProcessVersionsAction | ScenarioActions; interface UntypedAction extends AnyAction { diff --git a/designer/client/src/components/button/NkButton.tsx b/designer/client/src/components/button/NkButton.tsx deleted file mode 100644 index 316374860e6..00000000000 --- a/designer/client/src/components/button/NkButton.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from "react"; -import { ButtonProps, Button } from "../FormElements"; -import { styled } from "@mui/material"; -import { buttonBaseStyle } from "./ButtonBaseStyle"; - -const NkButtonStyled = styled(Button)(({ theme }) => ({ - ...buttonBaseStyle(theme), - width: "180px", - height: "44px", - fontWeight: 600, - fontSize: "18px", -})); - -export function NkButton({ ...props }: ButtonProps) { - return ; -} diff --git a/designer/client/src/components/comment/CommentsList.tsx b/designer/client/src/components/comment/CommentsList.tsx deleted file mode 100644 index 1e72192921c..00000000000 --- a/designer/client/src/components/comment/CommentsList.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import React, { useCallback } from "react"; -import { createSelector } from "reselect"; -import { useSelector } from "react-redux"; -import CommentContent from "./CommentContent"; -import Date from "../common/Date"; -import { ProcessCommentsList, RemoveButton } from "./StyledComment"; -import { getFeatureSettings, getLoggedUser } from "../../reducers/selectors/settings"; -import { Divider, Typography } from "@mui/material"; - -const getComments = (state) => state.processActivity?.comments || []; -const getCommentSettings = createSelector(getFeatureSettings, (f) => f.commentSettings || {}); - -interface CommentsListProps { - deleteComment: (comment) => void; -} - -export default function CommentsList({ deleteComment }: CommentsListProps) { - const loggedUser = useSelector(getLoggedUser); - const comments = useSelector(getComments); - const commentSettings = useSelector(getCommentSettings); - - const isLastComment = useCallback((index) => index + 1 === comments.length, [comments.length]); - - return ( - - {comments.map((comment, index) => ( -
-
- - {`| v${comment.processVersionId} | ${comment.user}`} - {comment.user != loggedUser.id ? null : deleteComment(comment)} />} -
- - {!isLastComment(index) && } -
- ))} -
- ); -} diff --git a/designer/client/src/components/comment/CommentsPanel.tsx b/designer/client/src/components/comment/CommentsPanel.tsx deleted file mode 100644 index db15c12f533..00000000000 --- a/designer/client/src/components/comment/CommentsPanel.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; -import { useTranslation } from "react-i18next"; -import { ToolbarPanelProps } from "../toolbarComponents/DefaultToolbarPanel"; -import { ToolbarWrapper } from "../toolbarComponents/toolbarWrapper/ToolbarWrapper"; -import ProcessComments from "./ProcessComments"; - -export function CommentsPanel(props: ToolbarPanelProps) { - const { t } = useTranslation(); - - return ( - - - - ); -} diff --git a/designer/client/src/components/comment/ProcessComments.tsx b/designer/client/src/components/comment/ProcessComments.tsx deleted file mode 100644 index cbca4be89e8..00000000000 --- a/designer/client/src/components/comment/ProcessComments.tsx +++ /dev/null @@ -1,64 +0,0 @@ -import React, { useCallback, useState } from "react"; -import { useDispatch, useSelector } from "react-redux"; -import { addComment, deleteComment } from "../../actions/nk"; -import { getProcessName, getProcessVersionId } from "../../reducers/selectors/graph"; -import CommentInput from "./CommentInput"; -import { useWindows } from "../../windowManager"; -import * as DialogMessages from "../../common/DialogMessages"; -import { getCapabilities } from "../../reducers/selectors/other"; -import { AddCommentPanel, CommentButton, ProcessCommentsWrapper } from "./StyledComment"; -import CommentsList from "./CommentsList"; - -function ProcessComments(): JSX.Element { - const [comment, setComment] = useState(""); - const [pending, setPending] = useState(false); - const dispatch = useDispatch(); - const { confirm } = useWindows(); - - const processName = useSelector(getProcessName); - const processVersionId = useSelector(getProcessVersionId); - const capabilities = useSelector(getCapabilities); - - const _deleteComment = useCallback( - (comment) => { - setPending(true); - confirm({ - text: DialogMessages.deleteComment(), - confirmText: "DELETE", - denyText: "NO", - onConfirmCallback: async (confirmed) => { - if (confirmed) { - await dispatch(deleteComment(processName, comment.id)); - } - setPending(false); - }, - }); - }, - [confirm, dispatch, processName], - ); - - const _addComment = useCallback(async () => { - setPending(true); - await dispatch(addComment(processName, processVersionId, comment)); - setPending(false); - setComment(""); - }, [dispatch, processName, processVersionId, comment]); - - const onInputChange = useCallback((e) => setComment(e.target.value), []); - - return ( - - - {capabilities.write ? ( - - - - Add - - - ) : null} - - ); -} - -export default ProcessComments; diff --git a/designer/client/src/components/comment/StyledComment.tsx b/designer/client/src/components/comment/StyledComment.tsx index 2affaa3bae9..fddf6b9128e 100644 --- a/designer/client/src/components/comment/StyledComment.tsx +++ b/designer/client/src/components/comment/StyledComment.tsx @@ -1,61 +1,4 @@ -import { lighten, styled } from "@mui/material"; -import { NkButton } from "../button/NkButton"; -import { StyledCloseIcon } from "../toolbarComponents/toolbarWrapper/ToolbarStyled"; - -export const ProcessCommentsWrapper = styled("div")` - padding: 0 13px 10px; -`; - -export const ProcessCommentsList = styled("div")` - font-size: 10px; - margin: 15px 0; - padding: 0; -`; - -export const RemoveButton = styled(StyledCloseIcon)` - float: right; - &:hover { - cursor: pointer; - opacity: 0.5; - } -`; - -export const AddCommentPanel = styled("div")( - ({ theme }) => ` - font-size: 12px !important; - display: flex; - flex-direction: column !important; - textarea { - width: 100% !important; - height: ${theme.custom.spacing.controlHeight} !important; - font-size: 12px; - font-weight: 400; - border-radius: 3px; - border: none; - background-color: ${lighten(theme.palette.background.paper, 0.1)}; - padding: 4px 6px; - resize: none; - } -`, -); - -export const CommentButton = styled(NkButton)( - ({ theme }) => ` - font-size: 12px !important; - background-color: ${lighten(theme.palette.background.paper, 0.2)} !important; - border: none !important; - width: 20% !important; - height: 30px !important; - align-self: flex-end !important; - margin: 5px 0 10px !important; - padding: 3px 0 !important; - border-radius: 3px !important; - cursor: pointer; - &:hover { - background-color: ${theme.palette.action.hover} !important; - } -`, -); +import { styled } from "@mui/material"; export const PanelComment = styled("div")(({ theme }) => ({ marginTop: "1px", diff --git a/designer/client/src/components/history/HistoryItem.tsx b/designer/client/src/components/history/HistoryItem.tsx deleted file mode 100644 index ad0175379d4..00000000000 --- a/designer/client/src/components/history/HistoryItem.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import React from "react"; -import { useTranslation } from "react-i18next"; -import Date from "../common/Date"; -import { PredefinedActionName, ProcessVersionType } from "../Process/types"; -import { HistoryItemStyled, StyledBadge } from "./StyledHistory"; -import WarningAmber from "@mui/icons-material/WarningAmber"; -import { Box, Typography } from "@mui/material"; - -type HistoryItemProps = { - isLatest?: boolean; - isDeployed?: boolean; - version: ProcessVersionType; - onClick: (version: ProcessVersionType) => void; - type: VersionType; -}; - -export enum VersionType { - current, - past, - future, -} - -const mapVersionToClassName = (v: VersionType): string => { - switch (v) { - case VersionType.current: - return "current"; - case VersionType.past: - return "past"; - case VersionType.future: - return "future"; - } -}; - -const HDate = ({ date }: { date: string }) => ( - - - - - -); - -export function HistoryItem({ onClick, version, type, isLatest, isDeployed }: HistoryItemProps): JSX.Element { - const { t } = useTranslation(); - const { user, createDate, processVersionId, actions } = version; - - return ( - onClick(version)}> - - {`v${processVersionId}`} | {user} - {isLatest && !isDeployed && ( - - - - )} -
- -
- {isDeployed && a.actionName === PredefinedActionName.Deploy)?.performedAt} />} -
- {isDeployed && } -
- ); -} diff --git a/designer/client/src/components/history/ProcessHistory.tsx b/designer/client/src/components/history/ProcessHistory.tsx deleted file mode 100644 index e07a771f8c7..00000000000 --- a/designer/client/src/components/history/ProcessHistory.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import React, { useCallback, useMemo } from "react"; -import { Scrollbars } from "react-custom-scrollbars"; -import { useDispatch, useSelector } from "react-redux"; -import { displayScenarioVersion } from "../../actions/nk"; -import { unsavedProcessChanges } from "../../common/DialogMessages"; -import { getScenario, isSaveDisabled } from "../../reducers/selectors/graph"; -import { useWindows } from "../../windowManager"; -import { HistoryItem, VersionType } from "./HistoryItem"; -import { ProcessVersionType } from "../Process/types"; -import { ProcessHistoryWrapper, TrackVertical } from "./StyledHistory"; -import { EventTrackingSelector, getEventTrackingProps } from "../../containers/event-tracking"; - -export function ProcessHistoryComponent(props: { isReadOnly?: boolean }): JSX.Element { - const scenario = useSelector(getScenario); - const { history = [], lastDeployedAction, name, processVersionId } = scenario || {}; - const nothingToSave = useSelector(isSaveDisabled); - const selectedVersion = useMemo(() => history.find((v) => v.processVersionId === processVersionId), [history, processVersionId]); - - const dispatch = useDispatch(); - - const doChangeVersion = useCallback( - (version: ProcessVersionType) => { - dispatch(displayScenarioVersion(name, version.processVersionId)); - }, - [dispatch, name], - ); - - const { confirm } = useWindows(); - - const changeVersion = useCallback( - (version: ProcessVersionType) => - props.isReadOnly || nothingToSave - ? doChangeVersion(version) - : confirm({ - text: unsavedProcessChanges(), - onConfirmCallback: (confirmed) => confirmed && doChangeVersion(version), - confirmText: "DISCARD", - denyText: "CANCEL", - }), - [confirm, doChangeVersion, nothingToSave, props.isReadOnly], - ); - - return ( - } - renderTrackHorizontal={() =>
} - autoHeight - autoHeightMax={300} - hideTracksWhenNotNeeded={true} - > - - {history.map((version, index) => { - const isLatest = index === 0; - const { createDate, processVersionId } = version; - const type = - selectedVersion?.createDate < createDate - ? VersionType.future - : selectedVersion?.createDate === createDate || isLatest - ? VersionType.current - : VersionType.past; - - return ( - - ); - })} - - - ); -} - -export default ProcessHistoryComponent; diff --git a/designer/client/src/components/history/StyledHistory.tsx b/designer/client/src/components/history/StyledHistory.tsx deleted file mode 100644 index 9ebd741108f..00000000000 --- a/designer/client/src/components/history/StyledHistory.tsx +++ /dev/null @@ -1,85 +0,0 @@ -import { styled } from "@mui/material"; -import { VersionType } from "./HistoryItem"; -import Badge from "../deployed.svg"; -import { blendDarken, blendLighten } from "../../containers/theme/helpers"; - -export const HistoryItemStyled = styled("li")<{ type: VersionType }>(({ theme, type }) => ({ - cursor: "pointer", - overflow: "hidden", - position: "relative", - padding: "5px 0 5px 42px", - display: "flex", - justifyContent: "space-between", - alignItems: "flex-start", - ".date": { - pointerEvents: "none", - }, - "&::before": { - content: "''", - position: "absolute", - left: "20px", - top: 0, - width: "20px", - height: "999px", - border: `1px solid ${theme.palette.primary.main}`, - borderWidth: "0px 0 0 1px", - paddingLeft: "10px", - "&:last-of-type::before": { - height: "14px", - }, - }, - "&:first-of-type::before": { - top: "14px", - }, - "&:last-of-type::before": { - height: "14px", - }, - "&::after": { - content: "''", - position: "absolute", - left: "13px", - top: "14px", - width: "16px", - height: "16px", - background: type === VersionType.current ? theme.palette.primary.main : theme.palette.background.paper, - border: `2px solid ${theme.palette.primary.main}`, - borderRadius: "50%", - paddingLeft: "10px", - }, - "&:hover::after": { - backgroundColor: type === VersionType.current ? blendLighten(theme.palette.primary.main, 0.05) : "none", - }, - "&:hover": { - backgroundColor: theme.palette.action.hover, - boxSizing: "border-box", - "&::after": { - backgroundColor: blendDarken(theme.palette.primary.main, 0.2), - }, - }, -})); - -export const TrackVertical = styled("div")` - width: 8px !important; - position: absolute; - right: 2px; - bottom: 2px; - top: 2px; - border-radius: 6px !important; - visibility: visible; -`; - -export const ProcessHistoryWrapper = styled("ul")` - font-size: 12px; - padding: 5px 0; - list-style: none; - margin: 0; -`; - -export const StyledBadge = styled(Badge)(({ theme }) => ({ - color: theme.palette.getContrastText(theme.palette.primary.main), - height: "1.2em", - margin: "0 1.2em", - "path:first-of-type": { - fill: theme.palette.primary.main, - }, -})); diff --git a/designer/client/src/components/modals/SaveProcessDialog.tsx b/designer/client/src/components/modals/SaveProcessDialog.tsx index e281d3a2b76..de9299dd49e 100644 --- a/designer/client/src/components/modals/SaveProcessDialog.tsx +++ b/designer/client/src/components/modals/SaveProcessDialog.tsx @@ -3,7 +3,7 @@ import { WindowButtonProps, WindowContentProps } from "@touk/window-manager"; import React, { useCallback, useMemo, useState } from "react"; import { useTranslation } from "react-i18next"; import { useDispatch } from "react-redux"; -import { displayCurrentProcessVersion, displayProcessActivity, loadProcessToolbarsConfiguration } from "../../actions/nk"; +import { displayCurrentProcessVersion, loadProcessToolbarsConfiguration } from "../../actions/nk"; import { PromptContent } from "../../windowManager"; import { CommentInput } from "../comment/CommentInput"; import { ThunkAction } from "../../actions/reduxTypes"; @@ -42,7 +42,6 @@ export function SaveProcessDialog(props: WindowContentProps): JSX.Element { await dispatch(UndoActionCreators.clearHistory()); await dispatch(displayCurrentProcessVersion(processName)); - await dispatch(displayProcessActivity(processName)); await dispatch(await getScenarioActivities(processName)); if (isRenamed) { diff --git a/designer/client/src/components/processAttach/AddAttachment_deprecated.tsx b/designer/client/src/components/processAttach/AddAttachment_deprecated.tsx deleted file mode 100644 index 1c3dda5abe2..00000000000 --- a/designer/client/src/components/processAttach/AddAttachment_deprecated.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import React, { useCallback } from "react"; -import Dropzone from "react-dropzone"; -import { useTranslation } from "react-i18next"; -import { addAttachment } from "../../actions/nk"; -import { useDispatch, useSelector } from "react-redux"; -import { getProcessName, getProcessVersionId } from "../../reducers/selectors/graph"; -import ButtonUpload from "../../assets/img/icons/buttonUpload.svg"; -import { NodeInput } from "../FormElements"; -import { AddAttachmentsWrapper, AttachmentButton, AttachmentDropZone, AttachmentsContainer } from "./StyledAttach"; -import { Typography } from "@mui/material"; - -export function AddAttachment() { - const { t } = useTranslation(); - const dispatch = useDispatch(); - const processName = useSelector(getProcessName); - const processVersionId = useSelector(getProcessVersionId); - - const addFiles = useCallback( - (files) => files.forEach((file) => dispatch(addAttachment(processName, processVersionId, file))), - [dispatch, processName, processVersionId], - ); - - return ( - - - {({ getRootProps, getInputProps }) => ( - - - - - - {t("attachments.buttonText", "drop or choose a file")} - - - - )} - - - ); -} diff --git a/designer/client/src/components/processAttach/AttachmentEl_deprecated.tsx b/designer/client/src/components/processAttach/AttachmentEl_deprecated.tsx deleted file mode 100644 index 5196c23b272..00000000000 --- a/designer/client/src/components/processAttach/AttachmentEl_deprecated.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import React from "react"; -import DownloadIcon from "@mui/icons-material/Download"; -import { Attachment } from "../../reducers/processActivity"; -import HttpService from "../../http/HttpService"; -import Date from "../common/Date"; -import { AttachmentDetails, DownloadAttachment, DownloadButton, AttachHeader } from "./StyledAttach"; -import { ProcessName } from "../Process/types"; -import { Typography } from "@mui/material"; - -export function AttachmentEl({ data, processName }: { data: Attachment; processName: ProcessName }) { - return ( -
  • - - HttpService.downloadAttachment(processName, data.id, data.fileName)}> - - - - - - - {` | v${data.processVersionId} | ${data.user}`} - - {data.fileName} - -
  • - ); -} diff --git a/designer/client/src/components/processAttach/ProcessAttachments.tsx b/designer/client/src/components/processAttach/ProcessAttachments.tsx deleted file mode 100644 index fff13feadbc..00000000000 --- a/designer/client/src/components/processAttach/ProcessAttachments.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import React from "react"; -import { useSelector } from "react-redux"; -import { RootState } from "../../reducers"; -import { getCapabilities } from "../../reducers/selectors/other"; -import { AttachmentEl } from "./AttachmentEl_deprecated"; -import { AddAttachment } from "./AddAttachment_deprecated"; -import { ProcessAttachmentsList, ProcessAttachmentsStyled } from "./StyledAttach"; -import { getProcessName } from "../../reducers/selectors/graph"; - -export function ProcessAttachments() { - const { write } = useSelector(getCapabilities); - const processName = useSelector(getProcessName); - const attachments = useSelector((s: RootState) => s.processActivity.attachments); - - return ( - - - {attachments.map((a) => ( - - ))} - - {write && } - - ); -} - -export default ProcessAttachments; diff --git a/designer/client/src/components/processAttach/StyledAttach.tsx b/designer/client/src/components/processAttach/StyledAttach.tsx index 3b0af0d5e0c..206ae524942 100644 --- a/designer/client/src/components/processAttach/StyledAttach.tsx +++ b/designer/client/src/components/processAttach/StyledAttach.tsx @@ -1,5 +1,4 @@ import { lighten, styled } from "@mui/material"; -import { NkButton } from "../button/NkButton"; export const AddAttachmentsWrapper = styled("div")` font-size: 12px; @@ -48,22 +47,6 @@ export const AttachmentDetails = styled("div")` word-break: break-word; `; -export const DownloadAttachment = styled("div")({ - display: "flex", - alignItems: "center", - marginRight: "5px", - cursor: "pointer", - fontSize: "25px", -}); - -export const DownloadButton = styled(NkButton)(() => ({ - display: "flex", - alignItems: "center", - justifyContent: "center", - width: "27px !important", - height: "27px !important", -})); - export const AttachHeader = styled("div")( () => ` span { @@ -76,24 +59,3 @@ export const AttachHeader = styled("div")( } `, ); - -export const ProcessAttachmentsStyled = styled("div")` - cursor: default; - padding: 0 13px; - display: grid; -`; - -export const ProcessAttachmentsList = styled("div")` - font-size: 10px; - margin: 15px 0; - padding: 0; - .footer { - font-style: italic; - p { - margin-bottom: 0; - } - } - p { - font-size: 12px; - } -`; diff --git a/designer/client/src/components/toolbarSettings/TOOLBAR_COMPONENTS_MAP.ts b/designer/client/src/components/toolbarSettings/TOOLBAR_COMPONENTS_MAP.ts index b6b326342db..7353cf8ab68 100644 --- a/designer/client/src/components/toolbarSettings/TOOLBAR_COMPONENTS_MAP.ts +++ b/designer/client/src/components/toolbarSettings/TOOLBAR_COMPONENTS_MAP.ts @@ -1,13 +1,10 @@ /* eslint-disable quote-props */ import { ComponentType, lazy } from "react"; import TipsPanel from "../tips/Tips"; -import { AttachmentsPanel } from "../toolbars/AttachmentsPanel"; -import { CommentsPanel } from "../comment/CommentsPanel"; import { CreatorPanel } from "../toolbars/creator/CreatorPanel"; import { DefaultToolbarPanel, ToolbarPanelProps } from "../toolbarComponents/DefaultToolbarPanel"; import ScenarioDetails from "../toolbars/scenarioDetails/ScenarioDetails"; import { UserSettingsPanel } from "../toolbars/UserSettingsPanel"; -import { VersionsPanel } from "../toolbars/VersionsPanel"; import ProcessActions from "../toolbars/scenarioActions/ProcessActions"; import { SearchPanel } from "../toolbars/search/SearchPanel"; import { ActivitiesPanel } from "../toolbars/activities"; @@ -22,9 +19,6 @@ export const TOOLBAR_COMPONENTS_MAP: Record import("../toolbars/Survey")), "activities-panel": ActivitiesPanel, diff --git a/designer/client/src/components/toolbarSettings/defaultToolbarsConfig.ts b/designer/client/src/components/toolbarSettings/defaultToolbarsConfig.ts index e25c39d1111..b608cd27836 100644 --- a/designer/client/src/components/toolbarSettings/defaultToolbarsConfig.ts +++ b/designer/client/src/components/toolbarSettings/defaultToolbarsConfig.ts @@ -71,14 +71,7 @@ export function defaultToolbarsConfig(isFragment: boolean, isArchived: boolean): ], }, ], - [ToolbarsSide.TopLeft]: [ - { id: "survey-panel" }, - { id: "tips-panel" }, - { id: "creator-panel" }, - { id: "versions-panel" }, - { id: "comments-panel" }, - { id: "attachments-panel" }, - ], + [ToolbarsSide.TopLeft]: [{ id: "survey-panel" }, { id: "tips-panel" }, { id: "creator-panel" }, { id: "activities-panel" }], [ToolbarsSide.BottomRight]: DEV_TOOLBARS, }; } diff --git a/designer/client/src/components/toolbars/AttachmentsPanel.tsx b/designer/client/src/components/toolbars/AttachmentsPanel.tsx deleted file mode 100644 index 2a78860001c..00000000000 --- a/designer/client/src/components/toolbars/AttachmentsPanel.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; -import { useTranslation } from "react-i18next"; -import ProcessAttachments from "../processAttach/ProcessAttachments"; -import { ToolbarPanelProps } from "../toolbarComponents/DefaultToolbarPanel"; -import { ToolbarWrapper } from "../toolbarComponents/toolbarWrapper/ToolbarWrapper"; - -export function AttachmentsPanel(props: ToolbarPanelProps) { - const { t } = useTranslation(); - - return ( - - - - ); -} diff --git a/designer/client/src/components/toolbars/VersionsPanel.tsx b/designer/client/src/components/toolbars/VersionsPanel.tsx deleted file mode 100644 index 4ee20c94dbb..00000000000 --- a/designer/client/src/components/toolbars/VersionsPanel.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from "react"; -import { useTranslation } from "react-i18next"; -import { useSelector } from "react-redux"; -import { getCapabilities } from "../../reducers/selectors/other"; -import ProcessHistory from "../history/ProcessHistory"; -import { ToolbarPanelProps } from "../toolbarComponents/DefaultToolbarPanel"; -import { ToolbarWrapper } from "../toolbarComponents/toolbarWrapper/ToolbarWrapper"; - -export function VersionsPanel(props: ToolbarPanelProps): JSX.Element { - const { t } = useTranslation(); - const capabilities = useSelector(getCapabilities); - - return ( - - - - ); -} diff --git a/designer/client/src/components/toolbars/activities/ActivitiesPanelFooter.tsx b/designer/client/src/components/toolbars/activities/ActivitiesPanelFooter.tsx index 8fa759011ed..a866851536a 100644 --- a/designer/client/src/components/toolbars/activities/ActivitiesPanelFooter.tsx +++ b/designer/client/src/components/toolbars/activities/ActivitiesPanelFooter.tsx @@ -3,6 +3,8 @@ import { Box, Button, lighten, styled } from "@mui/material"; import { useWindows, WindowKind } from "../../../windowManager"; import { useTranslation } from "react-i18next"; import { EventTrackingSelector, getEventTrackingProps } from "../../../containers/event-tracking"; +import { useSelector } from "react-redux"; +import { getCapabilities } from "../../../reducers/selectors/other"; const StyledFooterButton = styled(Button)(({ theme }) => ({ textTransform: "none", @@ -19,6 +21,7 @@ const StyledFooterButton = styled(Button)(({ theme }) => ({ export const ActivitiesPanelFooter = () => { const { t } = useTranslation(); const { open } = useWindows(); + const { write } = useSelector(getCapabilities); const handleOpenAddComment = useCallback(() => { open({ @@ -40,20 +43,24 @@ export const ActivitiesPanelFooter = () => { return ( - - {t("activities.footer.addComment", "Add comment")} - - - {t("activities.footer.addAttachment", "Add attachment")} - + {write && ( + <> + + {t("activities.footer.addComment", "Add comment")} + + + {t("activities.footer.addAttachment", "Add attachment")} + + + )} ); }; diff --git a/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemComment.tsx b/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemComment.tsx index 3b37c9d7662..3d65c1006e9 100644 --- a/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemComment.tsx +++ b/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemComment.tsx @@ -15,6 +15,7 @@ import { getProcessName } from "../../../../reducers/selectors/graph"; import { getScenarioActivities } from "../../../../actions/nk/scenarioActivities"; import { ActivityItemCommentModify } from "./ActivityItemCommentModify"; import { EventTrackingSelector, getEventTrackingProps } from "../../../../containers/event-tracking"; +import { getCapabilities } from "../../../../reducers/selectors/other"; const getCommentSettings = createSelector(getFeatureSettings, (f) => f.commentSettings || {}); @@ -34,10 +35,11 @@ const CommentActivity = ({ const processName = useSelector(getProcessName); const dispatch = useDispatch(); const loggedUser = useSelector(getLoggedUser); + const { write } = useSelector(getCapabilities); switch (activityAction.id) { case "delete_comment": { - if (activityComment.lastModifiedBy !== loggedUser.id) { + if (activityComment.lastModifiedBy !== loggedUser.id || !write) { return null; } @@ -67,7 +69,7 @@ const CommentActivity = ({ ); } case "edit_comment": { - if (activityComment.lastModifiedBy !== loggedUser.id) { + if (activityComment.lastModifiedBy !== loggedUser.id || !write) { return null; } diff --git a/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemHeader.tsx b/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemHeader.tsx index a74a5162690..48601aec898 100644 --- a/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemHeader.tsx +++ b/designer/client/src/components/toolbars/activities/ActivityPanelRowItem/ActivityItemHeader.tsx @@ -18,6 +18,7 @@ import { StyledActionIcon } from "./StyledActionIcon"; import { getScenarioActivities } from "../../../../actions/nk/scenarioActivities"; import { ActivityItemCommentModify } from "./ActivityItemCommentModify"; import { getLoggedUser } from "../../../../reducers/selectors/settings"; +import { getCapabilities } from "../../../../reducers/selectors/other"; import { EventTrackingSelector, getEventTrackingProps } from "../../../../containers/event-tracking"; const StyledHeaderIcon = styled(UrlIcon)(({ theme }) => ({ @@ -63,6 +64,7 @@ const HeaderActivity = ({ const { t } = useTranslation(); const dispatch = useDispatch(); const loggedUser = useSelector(getLoggedUser); + const { write } = useSelector(getCapabilities); switch (activityAction.id) { case "compare": { @@ -106,7 +108,7 @@ const HeaderActivity = ({ case "delete_attachment": { const attachmentStatus = activityAttachment.file.status; - if (attachmentStatus === "DELETED" || activityAttachment.lastModifiedBy !== loggedUser.id) { + if (attachmentStatus === "DELETED" || activityAttachment.lastModifiedBy !== loggedUser.id || !write) { return null; } @@ -137,7 +139,7 @@ const HeaderActivity = ({ } case "add_comment": { - if (activityComment.content.status === "AVAILABLE" || activityComment.lastModifiedBy !== loggedUser.id) { + if (activityComment.content.status === "AVAILABLE" || activityComment.lastModifiedBy !== loggedUser.id || !write) { return null; } diff --git a/designer/client/src/containers/Notifications.tsx b/designer/client/src/containers/Notifications.tsx index 9e4719527de..da56f81c8ad 100644 --- a/designer/client/src/containers/Notifications.tsx +++ b/designer/client/src/containers/Notifications.tsx @@ -10,9 +10,8 @@ import Notification from "../components/notifications/Notification"; import CheckCircleOutlinedIcon from "@mui/icons-material/CheckCircleOutlined"; import DangerousOutlinedIcon from "@mui/icons-material/DangerousOutlined"; import { markBackendNotificationRead, updateBackendNotifications } from "../actions/nk/notifications"; -import { displayProcessActivity, loadProcessState } from "../actions/nk"; +import { loadProcessState } from "../actions/nk"; import { getProcessName } from "../reducers/selectors/graph"; -import { loadProcessVersions } from "../actions/nk/loadProcessVersions"; import { useChangeConnectionError } from "./connectionErrorProvider"; import i18next from "i18next"; import { ThunkAction } from "../actions/reduxTypes"; @@ -53,10 +52,9 @@ const handleRefresh = toRefresh.forEach((data) => { switch (data) { case "versions": - return dispatch(loadProcessVersions(scenarioName)); + return dispatch(getScenarioActivities(scenarioName)); case "activity": - dispatch(getScenarioActivities(scenarioName)); - return dispatch(displayProcessActivity(scenarioName)); + return dispatch(getScenarioActivities(scenarioName)); case "state": return dispatch(loadProcessState(scenarioName)); } diff --git a/designer/client/src/http/HttpService.ts b/designer/client/src/http/HttpService.ts index 399789dae45..bf18bb82174 100644 --- a/designer/client/src/http/HttpService.ts +++ b/designer/client/src/http/HttpService.ts @@ -371,10 +371,6 @@ class HttpService { }); } - fetchProcessActivity(processName) { - return api.get(`/processes/${encodeURIComponent(processName)}/activity`); - } - async addComment(processName: string, versionId: number, comment: string): Promise { try { await api.post(`/processes/${encodeURIComponent(processName)}/${versionId}/activity/comment`, comment); @@ -399,16 +395,6 @@ class HttpService { } } - /** - * @deprecated The method will be deleted - */ - deleteComment(processName, commentId) { - return api - .delete(`/processes/${encodeURIComponent(processName)}/activity/comments/${commentId}`) - .then(() => this.#addInfo(i18next.t("notification.info.commendDeleted", "Comment deleted"))) - .catch((error) => this.#addError(i18next.t("notification.error.failedToDeleteComment", "Failed to delete comment"), error)); - } - async deleteActivityComment(processName: string, scenarioActivityId: string): Promise { try { await api.delete(`/processes/${encodeURIComponent(processName)}/activity/comment/${scenarioActivityId}`); diff --git a/designer/client/src/reducers/graph/reducer.ts b/designer/client/src/reducers/graph/reducer.ts index 3f3d28aad87..0e9e1de8aa5 100644 --- a/designer/client/src/reducers/graph/reducer.ts +++ b/designer/client/src/reducers/graph/reducer.ts @@ -356,7 +356,7 @@ const undoableReducer = undoable(reducer, { groupBy: batchGroupBy.init(), filter: combineFilters((action, nextState, prevState) => { return !isEqual(getUndoableState(nextState), getUndoableState(prevState._latestUnfiltered)); - }, excludeAction(["VALIDATION_RESULT", "UPDATE_IMPORTED_PROCESS", "PROCESS_STATE_LOADED", "UPDATE_TEST_CAPABILITIES", "UPDATE_BACKEND_NOTIFICATIONS", "PROCESS_DEFINITION_DATA", "PROCESS_TOOLBARS_CONFIGURATION_LOADED", "CORRECT_INVALID_SCENARIO", "DISPLAY_PROCESS_ACTIVITY", "LOGGED_USER", "REGISTER_TOOLBARS", "UI_SETTINGS"])), + }, excludeAction(["VALIDATION_RESULT", "UPDATE_IMPORTED_PROCESS", "PROCESS_STATE_LOADED", "UPDATE_TEST_CAPABILITIES", "UPDATE_BACKEND_NOTIFICATIONS", "PROCESS_DEFINITION_DATA", "PROCESS_TOOLBARS_CONFIGURATION_LOADED", "CORRECT_INVALID_SCENARIO", "GET_SCENARIO_ACTIVITIES", "LOGGED_USER", "REGISTER_TOOLBARS", "UI_SETTINGS"])), }); // apply only undoable changes for undo actions diff --git a/designer/client/src/reducers/processActivity.ts b/designer/client/src/reducers/processActivity.ts index 5a48155210a..ea6d14a2392 100644 --- a/designer/client/src/reducers/processActivity.ts +++ b/designer/client/src/reducers/processActivity.ts @@ -22,26 +22,15 @@ export type Comment = { }; export type ProcessActivityState = { - comments: $TodoType[]; - attachments: Attachment[]; activities: UIActivity[]; }; const emptyProcessActivity: ProcessActivityState = { - comments: [], - attachments: [], activities: [], }; export function reducer(state: ProcessActivityState = emptyProcessActivity, action: Action): ProcessActivityState { switch (action.type) { - case "DISPLAY_PROCESS_ACTIVITY": { - return { - ...state, - comments: action.comments, - attachments: action.attachments || [], - }; - } case "GET_SCENARIO_ACTIVITIES": { return { ...state, diff --git a/designer/client/test/ProcessAttachments-test.js b/designer/client/test/ProcessAttachments-test.js deleted file mode 100644 index 3f33b9c0367..00000000000 --- a/designer/client/test/ProcessAttachments-test.js +++ /dev/null @@ -1,48 +0,0 @@ -import React from "react"; -import { ProcessAttachments } from "../src/components/processAttach/ProcessAttachments"; //import redux-independent component -import configureMockStore from "redux-mock-store"; -import thunk from "redux-thunk"; -import { Provider } from "react-redux"; -import * as selectors from "../src/reducers/selectors/other"; -import { render } from "@testing-library/react"; -import { NuThemeProvider } from "../src/containers/theme/nuThemeProvider"; - -const mockStore = configureMockStore([thunk]); - -jest.spyOn(selectors, "getCapabilities").mockReturnValue({ write: true }); - -jest.mock("react-i18next", () => ({ - useTranslation: () => ({ - t: (key) => key, - i18n: { - changeLanguage: () => {}, - }, - }), -})); - -const processAttachment = (id) => ({ - id: `${id}`, - processVersionId: 1, - createDate: "2016-10-10T12:39:44.092", - user: "TouK", - fileName: `file ${id}`, -}); - -describe("ProcessAttachments suite", () => { - it("should render with no problems", () => { - const store = mockStore({ - graphReducer: { history: { present: { scenario: { name: "proc1", processVersionId: 1 } } } }, - processActivity: { attachments: [processAttachment(3), processAttachment(2), processAttachment(1)] }, - }); - - const { container } = render( - - - - - , - ); - - expect(container.getElementsByClassName("download-attachment").length).toBe(3); - }); -}); diff --git a/designer/client/test/ProcessHistory-test.js b/designer/client/test/ProcessHistory-test.js deleted file mode 100644 index 71903f8db6e..00000000000 --- a/designer/client/test/ProcessHistory-test.js +++ /dev/null @@ -1,69 +0,0 @@ -import React from "react"; -import { Provider } from "react-redux"; -import configureMockStore from "redux-mock-store"; -import { ProcessHistoryComponent } from "../src/components/history/ProcessHistory"; -import { render, within } from "@testing-library/react"; -import { NuThemeProvider } from "../src/containers/theme/nuThemeProvider"; - -const mockStore = configureMockStore(); -jest.mock("../src/windowManager", () => ({ - useWindows: jest.fn(() => ({ - confirm: jest.fn(), - })), -})); - -jest.mock("react-i18next", () => ({ - useTranslation: () => ({ - t: (key) => key, - i18n: { changeLanguage: () => {} }, - }), -})); - -describe("ProcessHistory suite", () => { - it("should mark latest history entry as current and other as past", () => { - //given - const store = mockStore({ - graphReducer: { - history: { - past: { - scenario: { - scenarioGraph: {}, - history: [processEntry(3), processEntry(2), processEntry(1)], - }, - }, - present: { - scenario: { - scenarioGraph: {}, - history: [processEntry(3), processEntry(2), processEntry(1)], - }, - }, - }, - }, - }); - //when - const { container } = render( - - - , - - , - ); - //then - const currentProcessHistoryEntry = container.getElementsByClassName("current"); - const pastHistoryEntries = container.getElementsByClassName("past"); - expect(currentProcessHistoryEntry.length).toBe(1); - expect(pastHistoryEntries.length).toBe(2); - expect(within(currentProcessHistoryEntry[0]).getByText(/v3/)).toBeInTheDocument(); - expect(within(pastHistoryEntries[0]).getByText(/v2/)).toBeInTheDocument(); - expect(within(pastHistoryEntries[1]).getByText(/v1/)).toBeInTheDocument(); - }); - - const processEntry = (processVersionId) => { - return { - processVersionId: processVersionId, - createDate: "2016-10-10T12:39:44.092", - user: "TouK", - actions: [], - }; - }; -});