Changeset description mustache tags (#2093)

* changed task controls in review, inspect and active contexts to replace mustache tagged properties in osm changeset comments, added HOC for property hooks and parameter for edit service for external editors to populate replaced comment

src/components/HOCs/WithTaskFeatureProperties/WithTaskFeatureProperties.js

@@ -0,0 +1,22 @@
+import React from 'react'
+import useMRProperties from '../../../hooks/UseMRProperties/UseMRProperties'
+import AsMappableTask from '../../../interactions/Task/AsMappableTask'
+
+/**
+ * WithTaskFeatureProperties provides task feature properties derived
+ * from the useMRProperties hook and the AsMappableTask interaction.
+ * Both property sets are combined and passed as props to wrapped components.
+ */
+
+
+const WithTaskFeatureProperties = (Component) => {
+  return function(props) {
+    const allFeatureProperties = AsMappableTask(props.task).allFeatureProperties()
+    const mrProperties = useMRProperties(props.workspaceContext)
+    const allProperties = Object.assign({}, mrProperties, allFeatureProperties)
+
+    return (<Component {...props} taskFeatureProperties={allProperties}/>)
+  }
+}
+
+export default WithTaskFeatureProperties

src/components/InspectTaskControls/InspectTaskControls.js

@@ -8,13 +8,15 @@ import _get from 'lodash/get'
 import _isEmpty from 'lodash/isEmpty'
 import BusySpinner from '../BusySpinner/BusySpinner'
 import { OPEN_STREET_MAP } from '../../services/VisibleLayer/LayerSources'
+import { replacePropertyTags } from '../../hooks/UsePropertyReplacement/UsePropertyReplacement'
 import AsManager from '../../interactions/User/AsManager'
 import WithSearch from '../HOCs/WithSearch/WithSearch'
 import WithChallengePreferences
        from '../HOCs/WithChallengePreferences/WithChallengePreferences'
 import WithVisibleLayer from '../HOCs/WithVisibleLayer/WithVisibleLayer'
 import WithKeyboardShortcuts
        from '../HOCs/WithKeyboardShortcuts/WithKeyboardShortcuts'
+import WithTaskFeatureProperties from '../HOCs/WithTaskFeatureProperties/WithTaskFeatureProperties'
 import TaskEditControl
        from '../TaskPane/ActiveTaskDetails/ActiveTaskControls/TaskEditControl/TaskEditControl'
 import UserEditorSelector
@@ -70,6 +72,10 @@ export class InspectTaskControls extends Component {
 
   /** Open the task in an editor */
   pickEditor = ({ value }) => {
+    const {task, taskFeatureProperties} = this.props
+    const comment = task.parent.checkinComment
+    const replacedComment = replacePropertyTags(comment, taskFeatureProperties, false)
+
     this.props.editTask(
       value,
       this.props.task,
@@ -78,7 +84,8 @@ export class InspectTaskControls extends Component {
         imagery: this.props.source.id !== OPEN_STREET_MAP ? this.props.source : undefined,
         photoOverlay: this.props.showMapillaryLayer ? 'mapillary' : null,
       },
-      this.props.taskBundle
+      this.props.taskBundle,
+      replacedComment
     )
   }
 
@@ -160,7 +167,9 @@ export default WithSearch(
   WithChallengePreferences(
     WithVisibleLayer(
       WithKeyboardShortcuts(
-        InspectTaskControls
+        WithTaskFeatureProperties(
+          InspectTaskControls
+        )
       )
     )
   ),

src/components/ReviewTaskControls/ReviewTaskControls.js

@@ -16,6 +16,8 @@ import WithTaskTags from '../HOCs/WithTaskTags/WithTaskTags'
 import WithSearch from '../HOCs/WithSearch/WithSearch'
 import WithKeyboardShortcuts from '../HOCs/WithKeyboardShortcuts/WithKeyboardShortcuts'
 import WithEditor from '../HOCs/WithEditor/WithEditor'
+import WithTaskFeatureProperties from '../HOCs/WithTaskFeatureProperties/WithTaskFeatureProperties'
+import { replacePropertyTags } from '../../hooks/UsePropertyReplacement/UsePropertyReplacement'
 import TaskEditControl from '../TaskPane/ActiveTaskDetails/ActiveTaskControls/TaskEditControl/TaskEditControl'
 import UserEditorSelector
        from '../UserEditorSelector/UserEditorSelector'
@@ -110,8 +112,12 @@ export class ReviewTaskControls extends Component {
 
   /** Choose which editor to launch for fixing a task */
   pickEditor = ({ value }) => {
+    const {task, taskFeatureProperties} = this.props
+    const comment = task.parent.checkinComment
+    const replacedComment = replacePropertyTags(comment, taskFeatureProperties, false)
+
     this.setState({taskBeingCompleted: this.props.task.id})
-    this.props.editTask(value, this.props.task, this.props.mapBounds, null, this.props.taskBundle)
+    this.props.editTask(value, this.props.task, this.props.mapBounds, null, this.props.taskBundle, replacedComment)
   }
 
   componentDidUpdate(prevProps) {
@@ -338,7 +344,9 @@ export default
   WithSearch(
     WithTaskTags(
       WithEditor(
-        WithKeyboardShortcuts(ReviewTaskControls)
+        WithKeyboardShortcuts(
+          WithTaskFeatureProperties(ReviewTaskControls)
+        )
       )
     ),
     'task'

src/components/TaskPane/ActiveTaskDetails/ActiveTaskControls/ActiveTaskControls.js

@@ -27,6 +27,7 @@ import WithTaskReview from '../../../HOCs/WithTaskReview/WithTaskReview'
 import WithTaskTags from '../../../HOCs/WithTaskTags/WithTaskTags'
 import WithKeyboardShortcuts
        from '../../../HOCs/WithKeyboardShortcuts/WithKeyboardShortcuts'
+import WithTaskFeatureProperties from '../../../HOCs/WithTaskFeatureProperties/WithTaskFeatureProperties'
 import BusySpinner from '../../../BusySpinner/BusySpinner'
 import TaskCompletionStep1 from './TaskCompletionStep1/TaskCompletionStep1'
 import TaskCompletionStep2 from './TaskCompletionStep2/TaskCompletionStep2'
@@ -37,6 +38,7 @@ import TaskConfirmationModal
 import TaskTags from '../../../TaskTags/TaskTags'
 import messages from './Messages'
 import { constructChangesetUrl } from '../../../../utils/constructChangesetUrl'
+import { replacePropertyTags } from '../../../../hooks/UsePropertyReplacement/UsePropertyReplacement'
 import './ActiveTaskControls.scss'
 
 
@@ -84,14 +86,20 @@ export class ActiveTaskControls extends Component {
       null
   }
 
+
+
   /** Choose which editor to launch for fixing a task */
   pickEditor = ({ value }) => {
+    const {task, taskFeatureProperties} = this.props
     const allowed = this.allowedEditors()
     // If the given editor isn't allowed, default to first allowed editor
     if (allowed && allowed.indexOf(value) === -1) {
       value = allowed[0]
     }
 
+    const comment = task.parent.checkinComment
+    const replacedComment = replacePropertyTags(comment, taskFeatureProperties, false)
+
     this.setState({taskBeingCompleted: this.props.task.id})
     this.props.editTask(
       value,
@@ -101,7 +109,8 @@ export class ActiveTaskControls extends Component {
         imagery: this.props.source.id !== OPEN_STREET_MAP ? this.props.source : undefined,
         photoOverlay: this.props.showMapillaryLayer ? 'mapillary' : null,
       },
-      this.props.taskBundle
+      this.props.taskBundle,
+      replacedComment
     )
   }
 
@@ -404,7 +413,9 @@ export default WithSearch(
       WithTaskTags(
         WithTaskReview(
           WithKeyboardShortcuts(
-            injectIntl(ActiveTaskControls)
+            WithTaskFeatureProperties(
+              injectIntl(ActiveTaskControls)
+            )
           )
         )
       )

src/services/Editor/Editor.js

@@ -78,7 +78,8 @@ export const editTask = function (
   task,
   mapBounds,
   options,
-  taskBundle
+  taskBundle,
+  replacedComment = null
 ) {
   return function (dispatch) {
     if (options && process.env.REACT_APP_FEATURE_EDITOR_IMAGERY !== "enabled") {
@@ -95,15 +96,15 @@ export const editTask = function (
 
       if (editor === ID) {
         editorWindowReference = window.open(
-          constructIdURI(task, mapBounds, options, taskBundle)
+          constructIdURI(task, mapBounds, options, taskBundle, replacedComment)
         );
       } else if (editor === LEVEL0) {
         editorWindowReference = window.open(
-          constructLevel0URI(task, mapBounds, options, taskBundle)
+          constructLevel0URI(task, mapBounds, options, taskBundle, replacedComment)
         );
       } else if (editor === RAPID) {
         editorWindowReference = window.open(
-          constructRapidURI(task, mapBounds, options)
+          constructRapidURI(task, mapBounds, options, replacedComment)
         );
       }
 
@@ -256,7 +257,7 @@ export const taskCenterPoint = function (mapBounds, task, taskBundle) {
 /**
  * Builds a Id editor URI for editing of the given task
  */
-export const constructIdURI = function (task, mapBounds, options, taskBundle) {
+export const constructIdURI = function (task, mapBounds, options, taskBundle, replacedComment) {
   const baseUriComponent = `${process.env.REACT_APP_ID_EDITOR_SERVER_URL}?editor=id`;
 
   const centerPoint = taskCenterPoint(mapBounds, task, taskBundle);
@@ -272,10 +273,14 @@ export const constructIdURI = function (task, mapBounds, options, taskBundle) {
     options
   );
 
-  const commentUriComponent =
+  const commentUriComponent = replacedComment ?
+    "comment=" +
+    encodeURIComponent(replacedComment) +
+    constructChangesetUrl(task) :
     "comment=" +
     encodeURIComponent(task.parent.checkinComment) +
     constructChangesetUrl(task);
+
   const sourceComponent =
     "source=" + encodeURIComponent(task.parent.checkinSource);
 
@@ -316,18 +321,23 @@ export const constructIdURI = function (task, mapBounds, options, taskBundle) {
 /**
  * Builds a RapiD editor URI for editing of the given task
  */
-export const constructRapidURI = function (task, mapBounds, options) {
+export const constructRapidURI = function (task, mapBounds, options, replacedComment) {
   const baseUriComponent = `${process.env.REACT_APP_RAPID_EDITOR_SERVER_URL}#`;
 
   const centerPoint = taskCenterPoint(mapBounds, task);
   const mapUriComponent =
     "map=" + [mapBounds.zoom, centerPoint.lat, centerPoint.lng].join("/");
 
   const selectedEntityComponent = "id=" + osmObjectParams(task, true);
-  const commentUriComponent =
+
+  const commentUriComponent = replacedComment ?
+    "comment=" +
+    encodeURIComponent(replacedComment) +
+    constructChangesetUrl(task) :
     "comment=" +
     encodeURIComponent(task.parent.checkinComment) +
     constructChangesetUrl(task);
+
   const sourceComponent =
     "source=" + encodeURIComponent(task.parent.checkinSource);
 
@@ -368,15 +378,19 @@ export const constructLevel0URI = function (
   task,
   mapBounds,
   options,
-  taskBundle
+  taskBundle,
+  replacedComment
 ) {
   const baseUriComponent = `${process.env.REACT_APP_LEVEL0_EDITOR_SERVER_URL}?`;
 
   const centerPoint = taskCenterPoint(mapBounds, task, taskBundle);
   const mapCenterComponent =
     "center=" + [centerPoint.lat, centerPoint.lng].join(",");
 
-  const commentComponent =
+    const commentComponent = replacedComment ?
+    "comment=" +
+    encodeURIComponent(replacedComment) +
+    constructChangesetUrl(task) :
     "comment=" +
     encodeURIComponent(task.parent.checkinComment) +
     constructChangesetUrl(task);