diff --git a/src/ProgressWorkflow.jsx b/src/ProgressWorkflow.jsx index 3082371..6380404 100644 --- a/src/ProgressWorkflow.jsx +++ b/src/ProgressWorkflow.jsx @@ -1,3 +1,4 @@ +import { Pluggable } from '@plone/volto/components/manage/Pluggable'; import PropTypes from 'prop-types'; import React, { useEffect, useRef, useState } from 'react'; import { Portal } from 'react-portal'; @@ -5,7 +6,6 @@ import { useDispatch, useSelector } from 'react-redux'; import { doesNodeContainClick } from 'semantic-ui-react/dist/commonjs/lib'; import { getWorkflowProgress } from './actions'; import './less/editor.less'; -import { Pluggable } from '@plone/volto/components/manage/Pluggable'; /** * @summary The React component that shows progress tracking of selected content. @@ -13,12 +13,12 @@ import { Pluggable } from '@plone/volto/components/manage/Pluggable'; const ProgressWorkflow = (props) => { const { content, pathname } = props; const currentStateKey = content?.review_state; - const contentId = content?.['@id'] || ''; const dispatch = useDispatch(); const [visible, setVisible] = useState(false); const [isToolbarOpen, setIsToolbarOpen] = useState(false); const [workflowProgressSteps, setWorkflowProgressSteps] = useState([]); const [currentState, setCurrentState] = useState(null); + const token = useSelector((state) => state?.userSession?.token); const workflowProgress = useSelector((state) => state?.workflowProgress); const pusherRef = useRef(null); @@ -31,6 +31,7 @@ const ProgressWorkflow = (props) => { setVisible(!visible); }; + // apply all computing when the workflowProgress results come from the api useEffect(() => { const findCurrentState = (steps, done) => { const arrayContainingCurrentState = steps.find( @@ -50,29 +51,45 @@ const ProgressWorkflow = (props) => { }; const hasToolbar = document.querySelector('#toolbar .toolbar-actions'); + /** + * remove states that are 0% unless if it is current state + * @param {Object[]} states - array of arrays + * @param {Object[]} states[0][0] - array of state keys (ex: [private, published]) + * @param {number} states[0][1] - percent + * @param {Object[]} states[0][2] - array of state titles (ex: [Private, Published]) + * @param {Object[]} states[0][3] - array of state descriptions + * @returns {Object[]} result - array of arrays, same structure but filtered + */ const filterOutZeroStatesNotCurrent = (states) => { - const firstFilter = states.filter( - (state) => state[1] > 0 || state[0].indexOf(currentStateKey) > -1, - ); - const result = firstFilter.map((state) => { - const percent = state[1]; - if (percent === 0) { - const indexOfCurrentSateKey = state[0].indexOf(currentStateKey); - const keys = [state[0][indexOfCurrentSateKey]]; - const titles = [state[3][indexOfCurrentSateKey]]; - const nextState = [state[2][indexOfCurrentSateKey]]; - - return [keys, percent, nextState, titles]; - } - return state; - }); + const [firstState, ...rest] = states; + + const result = + firstState[1] > 0 // there aren't any 0% states + ? states // return all states + : (() => { + // there are 0% states + const indexOfCurrentSateKey = firstState[0].indexOf( + currentStateKey, + ); + if (indexOfCurrentSateKey > -1) { + const keys = [firstState[0][indexOfCurrentSateKey]]; + const titles = [firstState[2][indexOfCurrentSateKey]]; + const description = [firstState[3][indexOfCurrentSateKey]]; + + return [[keys, 0, titles, description], ...rest]; // return only the current 0% state and test + } + return rest; // if current state in not a 0% return all rest + })(); + return result; }; setIsToolbarOpen(!!hasToolbar); + const contentId = content?.['@id']; // filter out paths that don't have workflow (home, login, dexterity even if the content obj stays the same etc) if ( + contentId && contentId.indexOf(pathname) >= 0 && pathname !== '/' && // wihout this there will be a flicker for going back to home ('/' in included in all api paths) workflowProgress?.result && @@ -92,9 +109,14 @@ const ProgressWorkflow = (props) => { } }, [workflowProgress?.result]); // eslint-disable-line + // get progress again if path or content changes useEffect(() => { - dispatch(getWorkflowProgress(contentId)); // the are paths that don't have workflow (home, login etc) - }, [dispatch, pathname, contentId]); + const contentId = content?.['@id']; + + if (contentId && token) { + dispatch(getWorkflowProgress(contentId)); + } // the are paths that don't have workflow (home, login etc) only if logged in + }, [dispatch, pathname, content, token]); // on mount subscribe to mousedown to be able to close on click outside useEffect(() => { @@ -112,6 +134,7 @@ const ProgressWorkflow = (props) => { const tracker_key_array = tracker[0]; const is_active = tracker_key_array.indexOf(currentStateKey) > -1; const pluggable_params = { id: tracker_key_array[0] }; + return (