Merge pull request #745 from osmlab/prerelease

v3.3.1 release
maproulette · May 10, 2019 · 48c2350 · 48c2350
2 parents b3f2451 + e7b5cca
commit 48c2350
Show file tree

Hide file tree

Showing 66 changed files with 1,953 additions and 531 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,32 @@ The format is based on
 This project adheres to
 [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
+## [v3.3.1] - 2019-05-10
+### Added
+- Status-specific metrics in Completion Progress widget
+- Updated Korean translation by @depth221
+- Project filter on Review page
+- Favorite Challenges filter on Review page
+- Converted Review page to a widget workspace
+- Review Metrics widget for Review page workspace
+- Geographic filtering map widget for Review page workspace
+- Preserve filters on Review page
+
+### Fixed
+- Do not apply date offset to attic query for task-start entry
+- Ensure task gets properly locked when navigated to directly in browser
+- Inconsistent user score in top nav vs. all-time leaderboard score
+- Error when trying to review a task immediately after status change
+- Lost challenge-name filter when consecutively reviewing a series of tasks
+- Don't leave project leaderboard when changing timeframes (#743)
+- Ensure task review data is reset if task status is reset back to created
+- Orphaned task history when challenge moved to another project
+- Old colorscheme on map controls
+
+### Changed
+- Map layers dropdown now activated/deactivated on click instead of hover
+
+
 ## [v3.3] - 2019-04-16
 ### Added
 - Task reviews

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "maproulette3",
-  "version": "3.3",
+  "version": "3.3.1",
   "private": true,
   "dependencies": {
     "@mapbox/geojsonhint": "^2.0.1",

diff --git a/src/components/AdminPane/Manage/ChallengeDashboard/ChallengeDashboard.js b/src/components/AdminPane/Manage/ChallengeDashboard/ChallengeDashboard.js
@@ -192,6 +192,7 @@ export class ChallengeDashboard extends Component {
       <div className="admin__manage challenge-dashboard">
         <WidgetWorkspace
           {...this.props}
+          lightMode
           className="mr-mt-4"
           workspaceEyebrow={pageHeader}
         />

diff --git a/src/components/AdminPane/Manage/ChallengeTaskMap/ChallengeTaskMap.js b/src/components/AdminPane/Manage/ChallengeTaskMap/ChallengeTaskMap.js
@@ -327,7 +327,7 @@ export class ChallengeTaskMap extends Component {
           }
         </EnhancedMap>
 
-        {loadingClusteredTasks && <BusySpinner />}
+        {loadingClusteredTasks && <BusySpinner mapMode />}
       </div>
     )
   }

diff --git a/src/components/AdminPane/Manage/ProjectDashboard/ProjectDashboard.js b/src/components/AdminPane/Manage/ProjectDashboard/ProjectDashboard.js
@@ -117,6 +117,7 @@ export class ProjectDashboard extends Component {
       <div className="admin__manage project-dashboard">
         <WidgetWorkspace
           {...this.props}
+          lightMode
           className="mr-mt-4"
           workspaceEyebrow={pageHeader}
           filterComponent={ChallengeFilterGroup}

diff --git a/src/components/AdminPane/Manage/ProjectsDashboard/ProjectsDashboard.js b/src/components/AdminPane/Manage/ProjectsDashboard/ProjectsDashboard.js
@@ -77,6 +77,7 @@ export class ProjectsDashboard extends Component {
          </div> :
          <WidgetWorkspace
            {...this.props}
+           lightMode
            className="mr-mt-4"
            workspaceEyebrow={pageHeader}
            filterComponent={ProjectFilterGroup}

diff --git a/src/components/AdminPane/Manage/Widgets/CommentsWidget/CommentsWidget.js b/src/components/AdminPane/Manage/Widgets/CommentsWidget/CommentsWidget.js
@@ -51,7 +51,7 @@ export default class CommentsWidget extends Component {
                   headerControls={exportControl}>
         <CommentList includeChallengeNames={_get(this.props, 'challenges.length', 0) > 1}
                      includeTaskLinks
-                     lightMode
+                     lightMode={this.props.lightMode}
                      comments={comments} />
       </QuickWidget>
     )

diff --git a/src/components/BusySpinner/BusySpinner.js b/src/components/BusySpinner/BusySpinner.js
@@ -20,8 +20,9 @@ export default class BusySpinner extends Component {
         <SvgSymbol
           sym="spinner-icon"
           className={classNames("mr-w-5 mr-h-5",
-                                {"mr-fill-green-lighter": !this.props.lightMode,
-                                 "mr-fill-green-light": this.props.lightMode})}
+                                {"mr-fill-green-lighter": !this.props.lightMode && !this.props.mapMode,
+                                 "mr-fill-green-light": this.props.lightMode,
+                                 "mr-fill-grey": this.props.mapMode})}
           viewBox="0 0 20 20"
         />
       </div>

diff --git a/src/components/ChallengeBrowseMap/ChallengeBrowseMap.js b/src/components/ChallengeBrowseMap/ChallengeBrowseMap.js
@@ -156,7 +156,7 @@ export class ChallengeBrowseMap extends Component {
           }
         </EnhancedMap>
 
-        {!!this.props.tasksLoading && <BusySpinner />}
+        {!!this.props.tasksLoading && <BusySpinner mapMode />}
       </div>
     )
   }

diff --git a/src/components/ChallengeDetail/ChallengeDetail.js b/src/components/ChallengeDetail/ChallengeDetail.js
@@ -124,7 +124,7 @@ export class ChallengeDetail extends Component {
             <div className="mr-max-w-md mr-mx-auto">
               <div className="mr-py-12 mr-px-8">
                 {_get(this.props, 'history.location.state.fromSearch') && (
-                  <div class="mr-mb-4">
+                  <div className="mr-mb-4">
                     <button
                       className="mr-text-green-lighter mr-text-sm hover:mr-text-white"
                       onClick={() => this.props.history.goBack()}
@@ -214,7 +214,7 @@ export class ChallengeDetail extends Component {
                   </div>
 
                   <ChallengeProgress
-                    className="mr-mt-4 mr-mb-12"
+                    className="mr-my-4"
                     challenge={challenge}
                   />
 

diff --git a/src/components/ChallengeProgress/ChallengeProgress.js b/src/components/ChallengeProgress/ChallengeProgress.js
@@ -7,6 +7,7 @@ import _isObject from 'lodash/isObject'
 import _get from 'lodash/get'
 import _map from 'lodash/map'
 import _each from 'lodash/each'
+import _chunk from 'lodash/chunk'
 import _isEqual from 'lodash/isEqual'
 import { TaskStatus, keysByStatus, statusLabels }
        from '../../services/Task/TaskStatus/TaskStatus'
@@ -16,7 +17,6 @@ import './ChallengeProgress.scss'
 import { colors } from '../../tailwind'
 
 const theme = {
-  // background: "#222222",
   axis: {
     fontSize: ".75rem",
     tickColor: colors.white,
@@ -107,39 +107,77 @@ export class ChallengeProgress extends Component {
       localizedStatuses[keysByStatus[status]]
     ).concat([availableLabel])
 
+    let challengeStats = {}
+
+    _each(orderedStatuses, status => {
+      challengeStats[localizedStatuses[keysByStatus[status]]] = {
+        count: taskActions[keysByStatus[status]],
+        percent: this.percent(taskActions[keysByStatus[status]], taskActions.total),
+      }
+    })
+
+    const challengeStatsColumns = _chunk(Object.entries(challengeStats), 3)
     return (
-      <div className={classNames("challenge-task-progress", this.props.className)}>
-        <ResponsiveBar data={[completionData]}
-                       keys={orderedKeys}
-                       indexBy="label"
-                       minValue={0}
-                       maxValue={100}
-                       margin={{
-                         top: 5,
-                         right: 15,
-                         bottom: 25,
-                         left: 7,
-                       }}
-                       layout="horizontal"
-                       colorBy={item => statusColors[item.id]}
-                       borderColor="inherit:darker(1.6)"
-                       enableGridY={false}
-                       enableLabel={false}
-                       enableAxisLeft={false}
-                       animate={true}
-                       motionStiffness={90}
-                       motionDamping={15}
-                       axisLeft={{tickCount: 0, tickValues: []}}
-                       axisBottom={{format: v => `${v}%`, tickCount: 5}}
-                       tooltipFormat={v => `${v}%`}
-                       theme={theme}
-        />
-        {taskActions.total > 0 && taskActions.available === 0 &&
-          <SvgSymbol sym='check-icon' viewBox='0 0 20 20'
-                     className="challenge-task-progress__completed-indicator" />
-        }
-        {taskActions.total > 0 && taskActions.available !== 0 &&
-          <div className="challenge-task-progress__tasks-remaining">
+      <React.Fragment>
+        <div className="mr-text-sm mr-grid mr-grid-columns-2 mr-grid-gap-4">
+          {_map(challengeStatsColumns, (stats, index1) => (
+            <ul key={index1}>
+                {_map(stats, (stat, index2) => (
+                  <li className="mr-flex mr-items-center" key={index1 + "-" + index2}>
+                    <span
+                      className={classNames("mr-text-lg",
+                                            this.props.lightMode ? "mr-text-pink" : "mr-text-yellow")}
+                    >
+                      {isNaN(stat[1].percent) ? '--' :
+                       /* eslint-disable-next-line react/style-prop-object */
+                       <FormattedNumber style="percent" value={stat[1].percent / 100} />
+                      }
+                    </span>
+                    <span className="mr-ml-2 mr-uppercase">
+                      {stat[0]}{' '}
+                      <span className="mr-text-xs">
+                        ({stat[1].count >= 0 ? stat[1].count : '--'}/{taskActions.total >= 0 ? taskActions.total : '--'})
+                      </span>
+                    </span>
+                  </li>
+                ))}
+            </ul>
+          ))}
+        </div>
+        <div className={classNames("challenge-task-progress", this.props.className)}>
+
+          <ResponsiveBar data={[completionData]}
+                        keys={orderedKeys}
+                        indexBy="label"
+                        minValue={0}
+                        maxValue={100}
+                        margin={{
+                          top: 5,
+                          right: 15,
+                          bottom: 25,
+                          left: 7,
+                        }}
+                        layout="horizontal"
+                        colorBy={item => statusColors[item.id]}
+                        borderColor="inherit:darker(1.6)"
+                        enableGridY={false}
+                        enableLabel={false}
+                        enableAxisLeft={false}
+                        animate={true}
+                        motionStiffness={90}
+                        motionDamping={15}
+                        axisLeft={{tickCount: 0, tickValues: []}}
+                        axisBottom={{format: v => `${v}%`, tickCount: 5}}
+                        tooltipFormat={v => `${v}%`}
+                        theme={theme}
+          />
+          {taskActions.total > 0 && taskActions.available && taskActions.available === 0 &&
+            <SvgSymbol sym='check-icon' viewBox='0 0 20 20'
+                      className="challenge-task-progress__completed-indicator" />
+          }
+        </div>
+        {taskActions.total > 0 && taskActions.available && taskActions.available !== 0 &&
+          <p className="mr-my-4">
             <FormattedMessage
               {...messages.tasksRemaining}
               values={{taskCount: taskActions.available}}
@@ -151,15 +189,15 @@ export class ChallengeProgress extends Component {
               {...messages.outOfTotal}
               values={{totalCount: taskActions.total}}
             />
-          </div>
+          </p>
         }
-      </div>
+      </React.Fragment>
     )
   }
 }
 
 ChallengeProgress.propTypes = {
-  challenge: PropTypes.object,
+  taskMetrics: PropTypes.object,
 }
 
 export default injectIntl(ChallengeProgress)
diff --git a/src/components/ChallengeProgress/ChallengeProgress.scss b/src/components/ChallengeProgress/ChallengeProgress.scss
@@ -1,7 +1,7 @@
 @import '../../variables.scss';
 
 .challenge-task-progress {
-  margin-bottom: 30px;
+  // margin-bottom: 30px;
   font-size: $size-9;
   height: 55px;
   position: relative;
@@ -15,8 +15,4 @@
     height: 20px;
     width: auto;
   }
-
-  &__tasks-remaining {
-    margin-top: 5px;
-  }
 }
diff --git a/src/components/ChallengeSearchMap/ChallengeSearchMap.js b/src/components/ChallengeSearchMap/ChallengeSearchMap.js
@@ -175,7 +175,7 @@ export class ChallengeSearchMap extends Component {
           }
         </EnhancedMap>
 
-        {!!this.props.tasksLoading && <BusySpinner />}
+        {!!this.props.tasksLoading && <BusySpinner mapMode />}
       </div>
     )
   }

diff --git a/src/components/CommentList/CommentList.js b/src/components/CommentList/CommentList.js
@@ -54,8 +54,7 @@ export default class CommentList extends Component {
             </span> &mdash; {comment.osm_username}
           </div>
           <div className={classNames("mr-text-sm mr-rounded-sm mr-p-2",
-                                     {"mr-bg-grey-lighter": this.props.lightMode,
-                                      "mr-bg-grey-lighter-10": !this.props.lightMode})}>
+                                     this.props.lightMode ? "mr-bg-grey-lighter" : "mr-bg-grey-lighter-10")}>
             <MarkdownContent markdown={comment.comment} />
           </div>
 

diff --git a/src/components/EnhancedMap/FitBoundsControl/FitBoundsControl.js b/src/components/EnhancedMap/FitBoundsControl/FitBoundsControl.js
@@ -56,14 +56,9 @@ const FitBoundsLeafletControl = Control.extend({
 
     // build the control button, render it, and return it
     const controlContent = (
-      // eslint-disable-next-line jsx-a11y/anchor-is-valid
-      <a className="fit-bounds-control button"
-         title={this.options.intl.formatMessage(messages.tooltip)}
-         onClick={() => this.fitFeatures(map)}>
-        <span className="icon is-small">
-          <SvgSymbol sym="target-icon" viewBox="0 0 20 20" />
-        </span>
-      </a>
+      <button onClick={() => this.fitFeatures(map)} className="mr-leading-none mr-p-2 mr-bg-black-50 mr-text-white mr-w-8 mr-h-8 mr-flex mr-items-center mr-shadow mr-rounded-sm mr-transition-normal-in-out-quad hover:mr-text-green-lighter">
+        <SvgSymbol title={this.options.intl.formatMessage(messages.tooltip)} sym="target-icon" className="mr-w-4 mr-h-4 mr-fill-current" viewBox="0 0 20 20" />
+      </button>
     )
 
     const controlContainer = DomUtil.create('div')
-Original file line number
+Diff line change
@@ Expand Up / @@ -327,7 +327,7 @@ export class ChallengeTaskMap extends Component { @@
               }
             </EnhancedMap>
-            {loadingClusteredTasks && <BusySpinner />}
+            {loadingClusteredTasks && <BusySpinner mapMode />}
           </div>
         )
       }
@@ Expand Down @@