ui: use workflow.viewDetail endpoint

openkfw · Aug 25, 2021 · 5c90108 · 5c90108
1 parent 60112e6
commit 5c90108
Show file tree

Hide file tree

Showing 14 changed files with 267 additions and 233 deletions.
diff --git a/frontend/src/api.js b/frontend/src/api.js
@@ -513,6 +513,14 @@ class Api {
     return instance.get(path);
   };
 
+  getWorkflowItem = (projectId, subprojectId, workflowitemId) => {
+    return instance.get(
+      removeEmptyQueryParams(
+        `/workflowitem.viewDetails?projectId=${projectId}&subprojectId=${subprojectId}&workflowitemId=${workflowitemId}`
+      )
+    );
+  };
+
   downloadDocument = (projectId, subprojectId, workflowitemId, documentId) =>
     instance
       .get(

diff --git a/frontend/src/languages/english.js b/frontend/src/languages/english.js
@@ -186,7 +186,8 @@ const en = {
     declined_by: "Declined by",
     connection_status: "Connection status",
     last_seen: "Last seen",
-    admin_description: "The admin node is the initial node of the network and has additional 'mine' and 'admin' permissions"
+    admin_description:
+      "The admin node is the initial node of the network and has additional 'mine' and 'admin' permissions"
   },
 
   login: {
@@ -278,6 +279,7 @@ const en = {
     workflow_disable_sort: "Save",
     workflow_document_changed: "Changed",
     workflow_document_description: "Add name of document",
+    workflow_document_not_available: "Document is not available",
     workflow_document_name: "Document Name",
     workflow_document_validate: "Validate",
     workflow_document_validated: "Validated",

diff --git a/frontend/src/languages/french.js b/frontend/src/languages/french.js
@@ -224,7 +224,7 @@ const fr = {
     workflow_enable_sort: "Trier",
     workflow_fingerprint: "Empreinte digitale",
     workflow_name: "Nom de l’étape de workflow",
-    workflow_next_step: "Prochaine étape",
+    workflow_document_not_available: "Document non disponible",
     workflow_no_actions: "Pas d'action",
     workflow_no_documents: "Pas de document",
     workflow_none: "blub",
@@ -320,8 +320,8 @@ const fr = {
     declined_by: "Refusé par",
     connection_status: "Statut de connexion",
     last_seen: "Vu pour la dernière fois",
-    admin_description: "Le nœud d'administration est le nœud initial du réseau et dispose d'autorisations supplémentaires 'mine' et 'admin'"
-
+    admin_description:
+      "Le nœud d'administration est le nœud initial du réseau et dispose d'autorisations supplémentaires 'mine' et 'admin'"
   },
 
   preview: {

diff --git a/frontend/src/languages/georgian.js b/frontend/src/languages/georgian.js
@@ -187,7 +187,8 @@ const ka = {
     declined_by: "უარი თქვა",
     connection_status: "კავშირის სტატუსი",
     last_seen: "ბოლო ნახვა",
-    admin_description: "ადმინისტრატორის კვანძი არის ქსელის საწყისი კვანძი და აქვს დამატებითი 'ჩემი' და 'ადმინისტრატორის' ნებართვები"
+    admin_description:
+      "ადმინისტრატორის კვანძი არის ქსელის საწყისი კვანძი და აქვს დამატებითი 'ჩემი' და 'ადმინისტრატორის' ნებართვები"
   },
 
   login: {
@@ -288,6 +289,7 @@ const ka = {
     workflow_documents: "დოკუმენტები",
     workflow_enable_sort: "Sort",
     workflow_fingerprint: "Fingerprint",
+    workflow_document_not_available: "დოკუმენტი მიუწვდომელია",
     workflow_name: "დასახელება",
     workflow_next_step: "შემდეგი ნაბიჯი",
     workflow_no_actions: "ქმედების განხორციელება არ არის საჭირო",

diff --git a/frontend/src/languages/german.js b/frontend/src/languages/german.js
@@ -221,6 +221,7 @@ const de = {
     workflow_documents: "Documents",
     workflow_enable_sort: "Sort",
     workflow_fingerprint: "German: Fingerprint",
+    workflow_document_not_available: "Dokument ist nicht verfügbar",
     workflow_name: "Name",
     workflow_next_step: "Next step",
     workflow_no_actions: "No actions required",

diff --git a/frontend/src/languages/portuguese.js b/frontend/src/languages/portuguese.js
@@ -289,6 +289,7 @@ const pt = {
     workflow_documents: "Documentos",
     workflow_enable_sort: "Ordenar",
     workflow_fingerprint: "Miniatura",
+    workflow_document_not_available: "Documento não disponível",
     workflow_name: "Nome",
     workflow_next_step: "Próxima etapa",
     workflow_no_actions: "Nenhuma ação necessária",

diff --git a/frontend/src/pages/Documents/DocumentOverview.js b/frontend/src/pages/Documents/DocumentOverview.js
@@ -20,10 +20,10 @@ import { withStyles } from "@material-ui/core";
 import OverflowTooltip from "../Common/OverflowTooltip";
 
 const styles = {
-  uploadButtonNotValidated: {
+  validationButtonNotValidated: {
     whiteSpace: "nowrap"
   },
-  uploadInput: {
+  validationInput: {
     position: "absolute",
     top: 0,
     bottom: 0,
@@ -50,10 +50,11 @@ class DocumentOverview extends Component {
     super();
     this.input = {};
   }
-  getPropsForUploadButton = validated => {
+  getPropsForValidationButton = (validated, available) => {
     let style = {};
     let label = "";
     let color = "default";
+    const disabled = !available;
     if (_isUndefined(validated)) {
       label = strings.workflow.workflow_document_validate;
     } else if (validated === true) {
@@ -62,12 +63,12 @@ class DocumentOverview extends Component {
     } else {
       label = strings.workflow.workflow_document_changed + "!";
       style = {
-        ...styles.uploadButtonNotValidated
+        ...styles.validationButtonNotValidated
       };
       color = "secondary";
     }
 
-    return { style, label, color };
+    return { style, label, color, disabled };
   };
 
   getValidationText = validated => {
@@ -80,30 +81,34 @@ class DocumentOverview extends Component {
     }
   };
 
-  generateUploadButton = (hash, validated, id, projectId, subprojectId, workflowitemId) => (
-    <Button {...this.getPropsForUploadButton(validated)}>
-      <ValidationIcon />
-      {this.getValidationText(validated)}
-      <Input
-        id="docvalidation"
-        type="file"
-        style={styles.uploadInput}
-        onChange={event => {
-          if (event.target.files[0]) {
-            const file = event.target.files[0];
-            const reader = new FileReader();
-            reader.onloadend = e => {
-              if (e.target.result !== undefined) {
-                const dataUrl = e.target.result.split(";base64,")[1];
-                this.props.validateDocument(hash, dataUrl, id, projectId, subprojectId, workflowitemId);
-              }
-            };
-            reader.readAsDataURL(file);
-          }
-        }}
-      />
-    </Button>
-  );
+  generateValidationButton = (validated, projectId, subprojectId, workflowitemId, document) => {
+    const { hash, id, available } = document;
+
+    return (
+      <Button {...this.getPropsForValidationButton(validated, available)}>
+        <ValidationIcon />
+        {this.getValidationText(validated)}
+        <Input
+          id="docvalidation"
+          type="file"
+          style={styles.validationInput}
+          onChange={event => {
+            if (event.target.files[0]) {
+              const file = event.target.files[0];
+              const reader = new FileReader();
+              reader.onloadend = e => {
+                if (e.target.result !== undefined) {
+                  const dataUrl = e.target.result.split(";base64,")[1];
+                  this.props.validateDocument(hash, dataUrl, id, projectId, subprojectId, workflowitemId);
+                }
+              };
+              reader.readAsDataURL(file);
+            }
+          }}
+        />
+      </Button>
+    );
+  };
 
   generateDocumentList = props => {
     const {
@@ -131,7 +136,11 @@ class DocumentOverview extends Component {
             </TableCell>
           ) : null}
           <TableCell data-test="workflowitemDocumentId" className={classes.noHorizontalPadding}>
-            {fileName ? <OverflowTooltip text={fileName} maxWidth="200px" /> : null}
+            {fileName ? (
+              <OverflowTooltip text={fileName} maxWidth="200px" />
+            ) : (
+              strings.workflow.workflow_document_not_available
+            )}
           </TableCell>
           {validationActive && hash ? (
             <TableCell>
@@ -141,7 +150,7 @@ class DocumentOverview extends Component {
           {validationActive ? (
             <TableCell className={classes.noHorizontalPadding}>
               <div className={classes.actionContainer}>
-                {this.generateUploadButton(hash, validated, id, projectId, subprojectId, workflowitemId)}
+                {this.generateValidationButton(validated, projectId, subprojectId, workflowitemId, document)}
                 {document.id
                   ? this.generateDownloadButton(downloadDocument, projectId, subprojectId, workflowitemId, document)
                   : null}
@@ -201,14 +210,14 @@ class DocumentOverview extends Component {
         {_isEmpty(documents)
           ? this.generateEmptyList()
           : this.generateDocumentList({
-            workflowitemId,
-            projectId,
-            subprojectId,
-            documents,
-            validationActive,
-            validatedDocuments,
-            downloadDocument
-          })}
+              workflowitemId,
+              projectId,
+              subprojectId,
+              documents,
+              validationActive,
+              validatedDocuments,
+              downloadDocument
+            })}
       </Table>
     );
   };
@@ -217,9 +226,10 @@ class DocumentOverview extends Component {
     return (
       <Button
         color="default"
-        aria-label="upload picture"
+        aria-label="Validation picture"
         data-test="download-document"
         component="span"
+        disabled={!document.available}
         onClick={() => downloadDocument(projectId, subprojectId, workflowitemId, document.id)}
       >
         <DownloadIcon />

diff --git a/frontend/src/pages/Workflows/WorkflowContainer.js b/frontend/src/pages/Workflows/WorkflowContainer.js
@@ -23,6 +23,7 @@ import {
   enableWorkflowEdit,
   fetchAllSubprojectDetails,
   hideReasonDialog,
+  fetchWorkflowitem,
   hideWorkflowDetails,
   hideWorkflowDialog,
   hideWorkflowitemAdditionalData,
@@ -35,7 +36,6 @@ import {
   showEditDialog,
   showReasonDialog,
   showSubProjectAssignee,
-  showWorkflowDetails,
   showWorkflowitemAdditionalData,
   showWorkflowItemPermissions,
   storeWorkflowItemsSelected,
@@ -157,7 +157,7 @@ const mapDispatchToProps = (dispatch, ownProps) => {
     openHistory: () => {
       dispatch(openHistory());
     },
-    openWorkflowDetails: id => dispatch(showWorkflowDetails(id)),
+    openWorkflowDetails: (pId, sId, id) => dispatch(fetchWorkflowitem(pId, sId, id)),
     hideWorkflowDetails: () => dispatch(hideWorkflowDetails()),
     closeWorkflowitemDetailsDialog: () => dispatch(closeWorkflowitemDetailsDialog()),
     closeSubproject: (pId, sId) => dispatch(closeSubproject(pId, sId, true)),
@@ -234,7 +234,7 @@ const mapStateToProps = state => {
     parentProject: state.getIn(["workflow", "parentProject"]),
     subProjectDetails: state.getIn(["workflow", "subProjectDetails"]),
     showWorkflowDetails: state.getIn(["workflow", "showDetails"]),
-    showDetailsItemId: state.getIn(["workflow", "showDetailsItemId"]),
+    showDetailsItem: state.getIn(["workflow", "showDetailsItem"]),
     subProjects: state.getIn(["detailview", "subProjects"]),
     workflowSortEnabled: state.getIn(["workflow", "workflowSortEnabled"]),
     budgetEditEnabled: state.getIn(["workflow", "subProjectBudgetEditEnabled"]),

diff --git a/frontend/src/pages/Workflows/WorkflowDetails.js b/frontend/src/pages/Workflows/WorkflowDetails.js
@@ -63,18 +63,6 @@ const styles = theme => {
   };
 };
 
-const getWorkflowItem = (workflowItems, showWorkflowDetails, showDetailsItemId) => {
-  let workflowItem = {
-    key: "",
-    data: []
-  };
-
-  if (showWorkflowDetails) {
-    workflowItem = workflowItems.find(workflow => workflow.data.id === showDetailsItemId);
-  }
-
-  return workflowItem;
-};
 const removeNewLines = text => {
   let formattedText = "";
   if (!_isEmpty(text)) {
@@ -195,9 +183,8 @@ function Documents({
 
 function WorkflowDetails({
   classes,
-  workflowItems,
+  workflowitem,
   showWorkflowDetails,
-  showDetailsItemId,
   hideWorkflowDetails,
   closeWorkflowitemDetailsDialog,
   users,
@@ -213,9 +200,8 @@ function WorkflowDetails({
     }
   }, [showWorkflowDetails]);
 
-  const workflowitem = getWorkflowItem(workflowItems, showWorkflowDetails, showDetailsItemId);
-
   let content;
+
   if (selectedTab === 0) {
     content = <Overview {...{ classes, users, workflowitem }} />;
   } else if (selectedTab === 1) {