From 15c19cae99e483a69d2aabd08866a3b83d1e91df Mon Sep 17 00:00:00 2001 From: Jean Aurambault Date: Thu, 13 Jul 2023 13:10:24 -0700 Subject: [PATCH] Translation history modal to show leveraging and integrity check messages This helps to bring visibility to the translation status by showing the root cause of a "rejected" string or a "need translation" string due to leveraging or integrity checks. If there are "comments" on a text unit variant then an accordion will be display. Expanding the accordion will show log style information, typically leveraging and integrity checks messages --- webapp/package-lock.json | 90 ++++++------ .../workbench/TranslationHistoryActions.js | 3 +- .../js/components/widgets/StatusGlyph.js | 5 +- .../workbench/TranslationHistoryModal.js | 129 ++++++++++++------ .../js/components/workbench/Workbench.js | 3 +- .../workbench/TranslationHistoryStore.js | 5 + 6 files changed, 144 insertions(+), 91 deletions(-) diff --git a/webapp/package-lock.json b/webapp/package-lock.json index eb7ce5dcd7..e77401c3f2 100644 --- a/webapp/package-lock.json +++ b/webapp/package-lock.json @@ -1044,9 +1044,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==" + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==" }, "mkdirp": { "version": "0.5.5", @@ -1058,9 +1058,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true } } @@ -1719,9 +1719,9 @@ "dev": true }, "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==" + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==" }, "mkdirp": { "version": "0.5.5", @@ -1733,9 +1733,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true } } @@ -2691,9 +2691,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==" + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==" }, "mkdirp": { "version": "0.5.0", @@ -2704,9 +2704,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==" + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==" } } } @@ -4446,9 +4446,9 @@ } }, "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==" + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==" }, "minipass": { "version": "2.9.0", @@ -4479,9 +4479,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true, "optional": true } @@ -4645,9 +4645,9 @@ "optional": true }, "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true, "optional": true } @@ -6047,9 +6047,9 @@ }, "dependencies": { "node-fetch": { - "version": "2.6.7", - "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz", - "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==", + "version": "2.6.12", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.12.tgz", + "integrity": "sha512-C/fGU2E8ToujUivIO0H+tpQ6HWo4eEmchoPIoXtxCrVghxdKq+QOHqEZW7tuP3KlV3bC8FRMO5nMCC7Zm1VP6g==", "requires": { "whatwg-url": "^5.0.0" } @@ -6260,17 +6260,17 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true } } }, "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==" + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==" } } }, @@ -6479,9 +6479,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true } } @@ -6559,9 +6559,9 @@ } }, "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true }, "mixin-deep": { @@ -6613,9 +6613,9 @@ }, "dependencies": { "minimist": { - "version": "0.2.2", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.2.tgz", - "integrity": "sha512-g92kDfAOAszDRtHNagjZPPI/9lfOFaRBL/Ud6Z0RKZua/x+49awTydZLh5Gkhb80Xy5hmcvZNLGzscW5n5yd0g==", + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.4.tgz", + "integrity": "sha512-Pkrrm8NjyQ8yVt8Am9M+yUt74zE3iokhzbG1bFVNjLB92vwM71hf40RkEsryg98BujhVOncKm/C1xROxZ030LQ==", "dev": true } } diff --git a/webapp/src/main/resources/public/js/actions/workbench/TranslationHistoryActions.js b/webapp/src/main/resources/public/js/actions/workbench/TranslationHistoryActions.js index 2bd02493e4..db410bdb9b 100644 --- a/webapp/src/main/resources/public/js/actions/workbench/TranslationHistoryActions.js +++ b/webapp/src/main/resources/public/js/actions/workbench/TranslationHistoryActions.js @@ -7,7 +7,8 @@ class TranslationHistoryActions { "openWithTextUnit", "getTranslationHistorySuccess", "getTranslationHistoryError", - "close" + "close", + "changeOpenTmTextUnitVariant" ); } } diff --git a/webapp/src/main/resources/public/js/components/widgets/StatusGlyph.js b/webapp/src/main/resources/public/js/components/widgets/StatusGlyph.js index 5d2774133c..8c129f4e40 100644 --- a/webapp/src/main/resources/public/js/components/widgets/StatusGlyph.js +++ b/webapp/src/main/resources/public/js/components/widgets/StatusGlyph.js @@ -15,7 +15,8 @@ class StatusGlyph extends React.Component { TextUnitSDK.STATUS.REVIEW_NEEDED, TextUnitSDK.STATUS.TRANSLATION_NEEDED, TextUnitSDK.STATUS.REJECTED]).isRequired, - "onClick": PropTypes.func.isRequired + "onClick": PropTypes.func.isRequired, + "noButton" : PropTypes.bool, }; getGlyphTypeAndTitle = (type) => { @@ -49,7 +50,7 @@ class StatusGlyph extends React.Component { glyph={glyph.type} title={glyph.title} onClick={this.props.onClick} - className="btn" + className={this.props.noButton ? "" : "btn"} />); } } diff --git a/webapp/src/main/resources/public/js/components/workbench/TranslationHistoryModal.js b/webapp/src/main/resources/public/js/components/workbench/TranslationHistoryModal.js index 2895688ff8..425e664620 100644 --- a/webapp/src/main/resources/public/js/components/workbench/TranslationHistoryModal.js +++ b/webapp/src/main/resources/public/js/components/workbench/TranslationHistoryModal.js @@ -1,7 +1,7 @@ import PropTypes from "prop-types"; import React from "react"; import { FormattedMessage, injectIntl } from "react-intl"; -import { Button, Modal } from "react-bootstrap"; +import { Button, Glyphicon, Modal } from "react-bootstrap"; import { Table } from "react-bootstrap"; import StatusGlyph from "../widgets/StatusGlyph"; import TextUnitSDK from "../../sdk/TextUnit"; @@ -12,29 +12,74 @@ class translationHistoryModal extends React.Component { show: PropTypes.bool.isRequired, textUnit: PropTypes.object.isRequired, translationHistory: PropTypes.object.isRequired, + onChangeOpenTmTextUnitVariant: PropTypes.func.isRequired, }; } renderHistoryItem = (item) => { - const { textUnit } = this.props; + const { textUnit, openTmTextUnitVariantId } = this.props; const rowClass = textUnit.getTmTextUnitVariantId() === item.id ? "history-current-variant" : ""; const status = item.id && !item.includedInLocalizedFile ? TextUnitSDK.STATUS.REJECTED : item.status; + const isOpenTmTextUnitVariant = openTmTextUnitVariantId === item.id; return item ? ( - - - {item.createdByUser === null ? ( - - ) : ( - item.createdByUser.username - )} - - {item.content} - {this.convertDateTime(item.createdDate)} - - ""} /> - - + + + + {item.tmTextUnitVariantComments.length == 0 ? ( + "" + ) : ( + + )} + + + {item.createdByUser === null ? ( + + ) : ( + item.createdByUser.username + )} + + {item.content} + {this.convertDateTime(item.createdDate)} + + ""} /> + + + {isOpenTmTextUnitVariant ? ( + + + + + + + + + + + + {item.tmTextUnitVariantComments.map((tmTextUnitVariantComment) => ( + + + + + + ))} + +
typeseveritycontent
{tmTextUnitVariantComment.type}{tmTextUnitVariantComment.severity}{tmTextUnitVariantComment.content}
+ + + ) : ( + "" + )} + ) : ( "" ); @@ -44,40 +89,40 @@ class translationHistoryModal extends React.Component { * @returns {*} Generated content for the git blame information section */ rendertranslationHistory = () => { - const { translationHistory, textUnit, intl } = this.props; + const { translationHistory, textUnit, intl, openTmTextUnitVariantId } = this.props; return ( - - - - - - + + + + + + + - {translationHistory && translationHistory.length ? translationHistory.map(this.renderHistoryItem.bind(this)) : ""} - {this.renderHistoryItem({ - createdByUser: { - username: "mojito", - }, - content: ( - + {translationHistory && translationHistory.length ? translationHistory.map(this.renderHistoryItem.bind(this)) : ""} + + + + + + +
- - - - - - - -
+ + + + + + + +
- + - ), - createdDate: textUnit.getTmTextUnitCreatedDate(), - status: TextUnitSDK.STATUS.TRANSLATION_NEEDED, - })} + {this.convertDateTime(textUnit.getCreatedDate())}
); diff --git a/webapp/src/main/resources/public/js/components/workbench/Workbench.js b/webapp/src/main/resources/public/js/components/workbench/Workbench.js index af4355b970..e2c1af384a 100644 --- a/webapp/src/main/resources/public/js/components/workbench/Workbench.js +++ b/webapp/src/main/resources/public/js/components/workbench/Workbench.js @@ -121,7 +121,8 @@ let Workbench = createReactClass({ /> - + ); diff --git a/webapp/src/main/resources/public/js/stores/workbench/TranslationHistoryStore.js b/webapp/src/main/resources/public/js/stores/workbench/TranslationHistoryStore.js index 0d0f81cbec..4426ccb9d3 100644 --- a/webapp/src/main/resources/public/js/stores/workbench/TranslationHistoryStore.js +++ b/webapp/src/main/resources/public/js/stores/workbench/TranslationHistoryStore.js @@ -20,6 +20,7 @@ class TranslationHistoryStore { this.textUnit = null; this.translationHistory = null; this.loading = false; + this.openTmTextUnitVariantId = null; } close() { @@ -42,6 +43,10 @@ class TranslationHistoryStore { onGetTranslationHistoryError(errorResponse) { this.loading = false; } + + changeOpenTmTextUnitVariant(tmTextUnitVariantId) { + this.openTmTextUnitVariantId = tmTextUnitVariantId; + } } export default alt.createStore(TranslationHistoryStore, 'TranslationHistoryStore');