@@ -136,17 +131,15 @@ export class RebuildTasksControl extends Component {
-
@@ -190,17 +183,11 @@ export class RebuildTasksControl extends Component {
-
+
- this.proceed()}
- >
+ this.proceed()}>
@@ -221,6 +208,6 @@ RebuildTasksControl.propTypes = {
refreshChallenge: PropTypes.func.isRequired,
controlClassName: PropTypes.string,
intl: PropTypes.object.isRequired,
-}
+};
-export default injectIntl(RebuildTasksControl)
+export default injectIntl(RebuildTasksControl);
diff --git a/src/components/AdminPane/Manage/RebuildTasksControl/RebuildTasksControl.test.jsx b/src/components/AdminPane/Manage/RebuildTasksControl/RebuildTasksControl.test.jsx
index b619b763c..1f62ae3cb 100644
--- a/src/components/AdminPane/Manage/RebuildTasksControl/RebuildTasksControl.test.jsx
+++ b/src/components/AdminPane/Manage/RebuildTasksControl/RebuildTasksControl.test.jsx
@@ -1,26 +1,26 @@
-import { describe, it, expect, vi } from "vitest";
-import React from 'react'
-import { render, fireEvent, screen, waitFor } from '@testing-library/react'
-import { IntlProvider } from 'react-intl'
-import { RebuildTasksControl } from './RebuildTasksControl'
-import { act } from 'react-dom/test-utils'
-
-vi.mock('../../../../interactions/Challenge/AsManageableChallenge', () => ({
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import React from "react";
+import { act } from "react-dom/test-utils";
+import { IntlProvider } from "react-intl";
+import { describe, expect, it, vi } from "vitest";
+import { RebuildTasksControl } from "./RebuildTasksControl";
+
+vi.mock("../../../../interactions/Challenge/AsManageableChallenge", () => ({
__esModule: true,
default: vi.fn().mockImplementation((challenge) => ({
...challenge,
- dataSource: () => 'local',
+ dataSource: () => "local",
})),
-}))
+}));
-describe('RebuildTasksControl', () => {
- let props
+describe("RebuildTasksControl", () => {
+ let props;
beforeEach(() => {
props = {
challenge: {
id: 1,
- dataOriginDate: '2024-01-01',
+ dataOriginDate: "2024-01-01",
},
recordSnapshot: vi.fn(),
deleteIncompleteTasks: vi.fn(),
@@ -30,134 +30,134 @@ describe('RebuildTasksControl', () => {
formatMessage: vi.fn().mockImplementation(({ id }) => id),
formatDate: vi.fn(),
},
- }
- })
+ };
+ });
const renderComponent = (additionalProps = {}) => {
return render(
Test Passes
-
- )
- }
+ ,
+ );
+ };
it("doesn't break if only required props are provided", () => {
- renderComponent()
- expect(screen.getByText("Test Passes")).toBeInTheDocument()
- })
-
- it('shows the modal when the control is clicked', () => {
- renderComponent()
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
- expect(screen.getByText(/Rebuild Challenge Tasks/i)).toBeInTheDocument()
- })
-
- it('hides the modal when cancel button is clicked', async () => {
- renderComponent()
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
- fireEvent.click(screen.getByText(/Cancel/i))
+ renderComponent();
+ expect(screen.getByText("Test Passes")).toBeInTheDocument();
+ });
+
+ it("shows the modal when the control is clicked", () => {
+ renderComponent();
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
+ expect(screen.getByText(/Rebuild Challenge Tasks/i)).toBeInTheDocument();
+ });
+
+ it("hides the modal when cancel button is clicked", async () => {
+ renderComponent();
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
+ fireEvent.click(screen.getByText(/Cancel/i));
await waitFor(() => {
- expect(screen.queryByText(/Rebuild Challenge Tasks/i)).not.toBeInTheDocument()
- })
- })
+ expect(screen.queryByText(/Rebuild Challenge Tasks/i)).not.toBeInTheDocument();
+ });
+ });
- it('handles file upload correctly', async () => {
- const { container } = renderComponent()
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
+ it("handles file upload correctly", async () => {
+ const { container } = renderComponent();
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
await act(async () => {
- const fileInput = container.querySelector('input[type="file"]')
+ const fileInput = container.querySelector('input[type="file"]');
if (fileInput) {
- const file = new File(['test content'], 'test.geojson', { type: 'application/geojson' })
- Object.defineProperty(fileInput, 'files', {
+ const file = new File(["test content"], "test.geojson", { type: "application/geojson" });
+ Object.defineProperty(fileInput, "files", {
value: [file],
configurable: true,
- })
- fireEvent.change(fileInput)
+ });
+ fireEvent.change(fileInput);
}
- })
+ });
await waitFor(() => {
- expect(screen.getByText('test.geojson')).toBeInTheDocument()
- })
- })
+ expect(screen.getByText("test.geojson")).toBeInTheDocument();
+ });
+ });
- it('handles checkbox change correctly and calls proceed function when checked', async () => {
- const { rebuildChallenge, deleteIncompleteTasks, recordSnapshot, refreshChallenge } = props
- renderComponent()
+ it("handles checkbox change correctly and calls proceed function when checked", async () => {
+ const { rebuildChallenge, deleteIncompleteTasks, recordSnapshot, refreshChallenge } = props;
+ renderComponent();
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
- const checkbox = screen.getByLabelText(/First remove incomplete tasks/i)
- expect(checkbox.checked).toBe(false)
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
+ const checkbox = screen.getByLabelText(/First remove incomplete tasks/i);
+ expect(checkbox.checked).toBe(false);
- fireEvent.click(checkbox)
- expect(checkbox.checked).toBe(true)
+ fireEvent.click(checkbox);
+ expect(checkbox.checked).toBe(true);
await act(async () => {
- fireEvent.click(screen.getByText(/Proceed/i))
- })
+ fireEvent.click(screen.getByText(/Proceed/i));
+ });
await waitFor(() => {
- expect(recordSnapshot).toHaveBeenCalledWith(props.challenge.id)
- expect(rebuildChallenge).toHaveBeenCalledWith(props.challenge, null, '2024-01-01')
- expect(deleteIncompleteTasks).toHaveBeenCalledWith(props.challenge)
- expect(refreshChallenge).toHaveBeenCalled()
- })
- })
+ expect(recordSnapshot).toHaveBeenCalledWith(props.challenge.id);
+ expect(rebuildChallenge).toHaveBeenCalledWith(props.challenge, null, "2024-01-01");
+ expect(deleteIncompleteTasks).toHaveBeenCalledWith(props.challenge);
+ expect(refreshChallenge).toHaveBeenCalled();
+ });
+ });
- it('handles checkbox change correctly and calls proceed function when not checked', async () => {
- const { rebuildChallenge, deleteIncompleteTasks, recordSnapshot, refreshChallenge } = props
- renderComponent()
+ it("handles checkbox change correctly and calls proceed function when not checked", async () => {
+ const { rebuildChallenge, deleteIncompleteTasks, recordSnapshot, refreshChallenge } = props;
+ renderComponent();
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
- const checkbox = screen.getByLabelText(/First remove incomplete tasks/i)
- expect(checkbox.checked).toBe(false)
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
+ const checkbox = screen.getByLabelText(/First remove incomplete tasks/i);
+ expect(checkbox.checked).toBe(false);
await act(async () => {
- fireEvent.click(screen.getByText(/Proceed/i))
- })
+ fireEvent.click(screen.getByText(/Proceed/i));
+ });
await waitFor(() => {
- expect(recordSnapshot).toHaveBeenCalledWith(props.challenge.id)
- expect(rebuildChallenge).toHaveBeenCalledWith(props.challenge, null, '2024-01-01')
- expect(deleteIncompleteTasks).not.toHaveBeenCalled()
- expect(refreshChallenge).toHaveBeenCalled()
- })
- })
-
- it('logs an error during proceed if an error occurs', async () => {
- const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {})
+ expect(recordSnapshot).toHaveBeenCalledWith(props.challenge.id);
+ expect(rebuildChallenge).toHaveBeenCalledWith(props.challenge, null, "2024-01-01");
+ expect(deleteIncompleteTasks).not.toHaveBeenCalled();
+ expect(refreshChallenge).toHaveBeenCalled();
+ });
+ });
+
+ it("logs an error during proceed if an error occurs", async () => {
+ const consoleError = vi.spyOn(console, "error").mockImplementation(() => {});
props.rebuildChallenge = vi.fn().mockImplementation(() => {
- throw new Error('Simulated error')
- })
+ throw new Error("Simulated error");
+ });
- renderComponent()
+ renderComponent();
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
await act(async () => {
- fireEvent.click(screen.getByText(/Proceed/i))
- })
+ fireEvent.click(screen.getByText(/Proceed/i));
+ });
await waitFor(() => {
- expect(consoleError).toHaveBeenCalledWith('Error during proceed:', expect.any(Error))
- })
+ expect(consoleError).toHaveBeenCalledWith("Error during proceed:", expect.any(Error));
+ });
- consoleError.mockRestore()
- })
+ consoleError.mockRestore();
+ });
- it('updates state when input value changes', async () => {
- renderComponent()
+ it("updates state when input value changes", async () => {
+ renderComponent();
- fireEvent.click(screen.getByText(/Rebuild Tasks/i))
+ fireEvent.click(screen.getByText(/Rebuild Tasks/i));
- const inputField = screen.getByLabelText(/Date data was sourced/i)
+ const inputField = screen.getByLabelText(/Date data was sourced/i);
- fireEvent.change(inputField, { target: { value: '2024-12-31' } })
+ fireEvent.change(inputField, { target: { value: "2024-12-31" } });
- await screen.findByDisplayValue('2024-12-31')
+ await screen.findByDisplayValue("2024-12-31");
- expect(inputField.value).toBe('2024-12-31')
- })
-})
+ expect(inputField.value).toBe("2024-12-31");
+ });
+});
diff --git a/src/components/AdminPane/Manage/StepNavigation/Messages.js b/src/components/AdminPane/Manage/StepNavigation/Messages.js
index a86689212..b95dd68ac 100644
--- a/src/components/AdminPane/Manage/StepNavigation/Messages.js
+++ b/src/components/AdminPane/Manage/StepNavigation/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with StepNavigation
@@ -18,5 +18,4 @@ export default defineMessages({
id: "StepNavigation.controls.finish.label",
defaultMessage: "Finish",
},
-})
-
+});
diff --git a/src/components/AdminPane/Manage/StepNavigation/StepNavigation.jsx b/src/components/AdminPane/Manage/StepNavigation/StepNavigation.jsx
index 289bfcfb1..95133cbdd 100644
--- a/src/components/AdminPane/Manage/StepNavigation/StepNavigation.jsx
+++ b/src/components/AdminPane/Manage/StepNavigation/StepNavigation.jsx
@@ -1,10 +1,10 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import _isString from 'lodash/isString'
-import _isEmpty from 'lodash/isEmpty'
-import SvgSymbol from '../../../SvgSymbol/SvgSymbol'
-import messages from './Messages'
+import _isEmpty from "lodash/isEmpty";
+import _isString from "lodash/isString";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import SvgSymbol from "../../../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
/**
* StepNavigation renders prev, next, and finish controls, as appropriate, for
@@ -15,59 +15,56 @@ import messages from './Messages'
export default class StepNavigation extends Component {
render() {
return (
-
+
- {_isString(this.props.activeStep.previous) &&
- this.props.prevStep()}
- >
-
- }
+ {_isString(this.props.activeStep.previous) && (
+ this.props.prevStep()}
+ >
+
+ )}
- {_isString(this.props.activeStep.next) &&
-
-
- }
+ {_isString(this.props.activeStep.next) && (
+
+
+ )}
- {(_isEmpty(this.props.activeStep.next) || this.props.activeStep.canFinish) &&
+ {(_isEmpty(this.props.activeStep.next) || this.props.activeStep.canFinish) && (
this.props.finish && this.props.finish()}
>
- }
+ )}
- )
+ );
}
}
@@ -78,4 +75,4 @@ StepNavigation.propTypes = {
prevStep: PropTypes.func.isRequired,
/** Invoked, if provided, when user finishes workflow */
finish: PropTypes.func,
-}
+};
diff --git a/src/components/AdminPane/Manage/TaskDeletingProgress/Messages.js b/src/components/AdminPane/Manage/TaskDeletingProgress/Messages.js
index a33228519..85bc648d8 100644
--- a/src/components/AdminPane/Manage/TaskDeletingProgress/Messages.js
+++ b/src/components/AdminPane/Manage/TaskDeletingProgress/Messages.js
@@ -1,16 +1,16 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with TaskDeletingProgress
*/
export default defineMessages({
deletingTasks: {
- id: 'Admin.TaskDeletingProgress.deletingTasks.header',
+ id: "Admin.TaskDeletingProgress.deletingTasks.header",
defaultMessage: "Deleting Tasks",
},
tasksDeleted: {
- id: 'Admin.TaskDeletingProgress.tasksDeleting.label',
+ id: "Admin.TaskDeletingProgress.tasksDeleting.label",
defaultMessage: "tasks deleted",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/TaskDeletingProgress/TaskDeletingProgress.jsx b/src/components/AdminPane/Manage/TaskDeletingProgress/TaskDeletingProgress.jsx
index 1ee849ab5..877ea03e9 100644
--- a/src/components/AdminPane/Manage/TaskDeletingProgress/TaskDeletingProgress.jsx
+++ b/src/components/AdminPane/Manage/TaskDeletingProgress/TaskDeletingProgress.jsx
@@ -1,5 +1,5 @@
-import ProgressStatus from '../ProgressStatus/ProgressStatus'
-import messages from './Messages'
+import ProgressStatus from "../ProgressStatus/ProgressStatus";
+import messages from "./Messages";
/**
* TaskDeletingProgress displays a full-page busy spinner and shows
@@ -7,7 +7,7 @@ import messages from './Messages'
*
* @author [Neil Rotstan](https://github.com/nrotstan)
*/
-export default function(props) {
+export default function (props) {
return (
-
- ].concat(_map(supportedSimplestyles, (style) =>
+ const styleNameOptions = [
{style}
- ))
+ )),
+ );
const buildStyleNameAndValues = (rule, index) => {
- return _map(rule.styles, (style, position) =>
+ return _map(rule.styles, (style, position) => (
this.props.setStyleName(e.target.value, index, position)}
+ onChange={(e) => this.props.setStyleName(e.target.value, index, position)}
value={style.styleName}
>
{styleNameOptions}
@@ -61,7 +58,7 @@ export default class TaskPropertyStyleRules extends Component {
onChange={(e) => this.props.setStyleValue(e.target.value, index, position)}
/>
- { rule.styles.length > 1 &&
+ {rule.styles.length > 1 && (
- }
+ )}
- )
- }
+ ));
+ };
const styleForms = _map(this.props.taskPropertyStyleRules, (rule, index) => {
- const formSearch =
+ const formSearch = (
this.props.removeStyleRule(index)}
- updateTaskPropertyQuery={(data, errors) => this.props.updateStyleRule(data, index, errors)}
+ updateTaskPropertyQuery={(data, errors) =>
+ this.props.updateStyleRule(data, index, errors)
+ }
/>
+ );
return (
@@ -116,22 +116,24 @@ export default class TaskPropertyStyleRules extends Component {
{buildStyleNameAndValues(rule, index)}
- this.props.addNewStyle(index)}
- className="mr-button mr-button--small mr-button--green-lighter mr-mt-4 mr-mb-2"
- title={this.props.intl.formatMessage(messages.addNewStyleTooltip)}
- >
+ this.props.addNewStyle(index)}
+ className="mr-button mr-button--small mr-button--green-lighter mr-mt-4 mr-mb-2"
+ title={this.props.intl.formatMessage(messages.addNewStyleTooltip)}
+ >
{formSearch}
- {!_isEmpty(this.props.styleRuleErrors[index]) &&
+ {!_isEmpty(this.props.styleRuleErrors[index]) && (
- {this.props.intl.formatMessage(errorMessages[_head(this.props.styleRuleErrors[index])])}
+ {this.props.intl.formatMessage(
+ errorMessages[_head(this.props.styleRuleErrors[index])],
+ )}
- }
+ )}
- )
- })
+ );
+ });
return (
@@ -161,6 +163,6 @@ export default class TaskPropertyStyleRules extends Component {
{this.props.children}
- )
+ );
}
}
diff --git a/src/components/AdminPane/Manage/TaskUploadingProgress/Messages.js b/src/components/AdminPane/Manage/TaskUploadingProgress/Messages.js
index bf043ffae..61ae2fd9a 100644
--- a/src/components/AdminPane/Manage/TaskUploadingProgress/Messages.js
+++ b/src/components/AdminPane/Manage/TaskUploadingProgress/Messages.js
@@ -1,16 +1,16 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with TaskUploadingProgress
*/
export default defineMessages({
creatingTasks: {
- id: 'Admin.TaskUploadProgress.uploadingTasks.header',
+ id: "Admin.TaskUploadProgress.uploadingTasks.header",
defaultMessage: "Building Tasks",
},
tasksCreated: {
- id: 'Admin.TaskUploadProgress.tasksUploaded.label',
+ id: "Admin.TaskUploadProgress.tasksUploaded.label",
defaultMessage: "tasks uploaded",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/TaskUploadingProgress/TaskUploadingProgress.jsx b/src/components/AdminPane/Manage/TaskUploadingProgress/TaskUploadingProgress.jsx
index 89a584269..3d62ea78e 100644
--- a/src/components/AdminPane/Manage/TaskUploadingProgress/TaskUploadingProgress.jsx
+++ b/src/components/AdminPane/Manage/TaskUploadingProgress/TaskUploadingProgress.jsx
@@ -1,5 +1,5 @@
-import ProgressStatus from '../ProgressStatus/ProgressStatus'
-import messages from './Messages'
+import ProgressStatus from "../ProgressStatus/ProgressStatus";
+import messages from "./Messages";
/**
* TaskUploadingProgress displays a full-page busy spinner and shows
@@ -7,7 +7,7 @@ import messages from './Messages'
*
* @author [Neil Rotstan](https://github.com/nrotstan)
*/
-export default function(props) {
+export default function (props) {
return (
{
const environment = window.env.REACT_APP_ENVIRONMENT;
-
- if(environment === 'production'){
+
+ if (environment === "production") {
return (
-
+
diff --git a/src/components/AdminPane/Manage/ViewChallengeTasks/GeographicIndexingNotice.jsx b/src/components/AdminPane/Manage/ViewChallengeTasks/GeographicIndexingNotice.jsx
index e63199262..a6fee15c6 100644
--- a/src/components/AdminPane/Manage/ViewChallengeTasks/GeographicIndexingNotice.jsx
+++ b/src/components/AdminPane/Manage/ViewChallengeTasks/GeographicIndexingNotice.jsx
@@ -1,9 +1,9 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import { differenceInHours } from 'date-fns'
-import SvgSymbol from '../../../SvgSymbol/SvgSymbol'
-import messages from './Messages'
+import { differenceInHours } from "date-fns";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import SvgSymbol from "../../../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
/**
* GeographicIndexingNotice display a notice to the challenge owner letting
@@ -14,13 +14,13 @@ import messages from './Messages'
*/
export default class GeographicIndexingNotice extends Component {
render() {
- const reindexingDelay =
- window.env?.REACT_APP_GEOGRAPHIC_INDEXING_DELAY ?? 0
+ const reindexingDelay = window.env?.REACT_APP_GEOGRAPHIC_INDEXING_DELAY ?? 0;
// If enough time has passed, nothing to show
- if (differenceInHours(Date.now(), this.props.challenge?.lastTaskRefresh ?? 0) >
- reindexingDelay) {
- return null
+ if (
+ differenceInHours(Date.now(), this.props.challenge?.lastTaskRefresh ?? 0) > reindexingDelay
+ ) {
+ return null;
}
return (
@@ -32,13 +32,13 @@ export default class GeographicIndexingNotice extends Component {
/>
- )
+ );
}
}
GeographicIndexingNotice.propTypes = {
challenge: PropTypes.object,
-}
+};
diff --git a/src/components/AdminPane/Manage/ViewChallengeTasks/Messages.js b/src/components/AdminPane/Manage/ViewChallengeTasks/Messages.js
index 275171fde..b814a6cce 100644
--- a/src/components/AdminPane/Manage/ViewChallengeTasks/Messages.js
+++ b/src/components/AdminPane/Manage/ViewChallengeTasks/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ViewChallengeTasks.
@@ -46,12 +46,13 @@ export default defineMessages({
geographicIndexingNotice: {
id: "Admin.ManageTasks.geographicIndexingNotice",
- defaultMessage: "Please note that it can take up to {delay} hours " +
- "to geographically index new or modified challenges. " +
- "Your challenge (and tasks) may not appear as " +
- "expected in location-specific browsing or " +
- "searches until indexing is complete, nor " +
- "when browsing map to choose location-based priority rules."
+ defaultMessage:
+ "Please note that it can take up to {delay} hours " +
+ "to geographically index new or modified challenges. " +
+ "Your challenge (and tasks) may not appear as " +
+ "expected in location-specific browsing or " +
+ "searches until indexing is complete, nor " +
+ "when browsing map to choose location-based priority rules.",
},
changePriorityLabel: {
@@ -66,7 +67,7 @@ export default defineMessages({
filterListLabel: {
id: "Admin.manageTasks.controls.filterList.label",
- defaultMessage: "Filter By:"
+ defaultMessage: "Filter By:",
},
clearFiltersLabel: {
@@ -127,5 +128,5 @@ export default defineMessages({
actionDisabled: {
id: "Admin.Task.fields.actions.disabled",
defaultMessage: "Disabled",
- }
-})
+ },
+});
diff --git a/src/components/AdminPane/Manage/ViewChallengeTasks/TaskBuildProgress.jsx b/src/components/AdminPane/Manage/ViewChallengeTasks/TaskBuildProgress.jsx
index acc06b7c1..3c0c9b361 100644
--- a/src/components/AdminPane/Manage/ViewChallengeTasks/TaskBuildProgress.jsx
+++ b/src/components/AdminPane/Manage/ViewChallengeTasks/TaskBuildProgress.jsx
@@ -1,28 +1,41 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import FormattedDuration, { TIMER_FORMAT } from 'react-intl-formatted-duration'
-import { ChallengeStatus }
- from '../../../../services/Challenge/ChallengeStatus/ChallengeStatus'
-import BusySpinner from '../../../BusySpinner/BusySpinner'
-import messages from './Messages'
-
-const TIMER_INTERVAL = 10000 // 10 seconds
-const TASKS_UPDATING_MESSAGE = "Updating Task Statuses"
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import FormattedDuration, { TIMER_FORMAT } from "react-intl-formatted-duration";
+import { ChallengeStatus } from "../../../../services/Challenge/ChallengeStatus/ChallengeStatus";
+import BusySpinner from "../../../BusySpinner/BusySpinner";
+import messages from "./Messages";
+
+const TIMER_INTERVAL = 10000; // 10 seconds
+const TASKS_UPDATING_MESSAGE = "Updating Task Statuses";
const TaskStatusOverview = ({ actions }) => {
return (
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
- )
-}
+ );
+};
/**
* TaskBuildProgress displays the current number of tasks built so far
@@ -31,60 +44,59 @@ const TaskStatusOverview = ({ actions }) => {
* @author [Neil Rotstan](https://github.com/nrotstan)
*/
export default class TaskBuildProgress extends Component {
- timerHandle = null
+ timerHandle = null;
state = {
startTime: Date.now(),
lastTimerRun: Date.now(),
- }
+ };
clearTimer = () => {
if (this.timerHandle !== null) {
- clearInterval(this.timerHandle)
- this.timerHandle = null
+ clearInterval(this.timerHandle);
+ this.timerHandle = null;
}
- }
+ };
/**
* Returns the total elapsed seconds since the initial start time
*/
totalElapsedSeconds = () => {
- return (Date.now() - this.state.startTime) / 1000
- }
+ return (Date.now() - this.state.startTime) / 1000;
+ };
/**
* Returns the number of seconds until the next status update
*/
nextUpdateSeconds = () => {
- const secondsRemaining = (
- new Date(this.state.lastTimerRun + TIMER_INTERVAL).getTime() - Date.now()
- ) / 1000
+ const secondsRemaining =
+ (new Date(this.state.lastTimerRun + TIMER_INTERVAL).getTime() - Date.now()) / 1000;
- return secondsRemaining
- }
+ return secondsRemaining;
+ };
refresh = () => {
- this.props.refreshChallenge()
- this.props.refreshTasks()
- this.setState({lastTimerRun: Date.now()})
- }
+ this.props.refreshChallenge();
+ this.props.refreshTasks();
+ this.setState({ lastTimerRun: Date.now() });
+ };
componentDidMount() {
- this.clearTimer()
- this.timerHandle = setInterval(this.refresh, TIMER_INTERVAL)
- this.setState({startTime: Date.now(), lastTimerRun: Date.now()})
+ this.clearTimer();
+ this.timerHandle = setInterval(this.refresh, TIMER_INTERVAL);
+ this.setState({ startTime: Date.now(), lastTimerRun: Date.now() });
}
componentWillUnmount() {
- this.clearTimer()
+ this.clearTimer();
}
render() {
if (this.props.challenge.status !== ChallengeStatus.building) {
- return null
+ return null;
}
- const taskCount = this.props.challenge?.actions?.total ?? 0
+ const taskCount = this.props.challenge?.actions?.total ?? 0;
if (this.props.challenge.statusMessage === TASKS_UPDATING_MESSAGE) {
return (
@@ -92,26 +104,20 @@ export default class TaskBuildProgress extends Component {
-
+
@@ -127,35 +133,26 @@ export default class TaskBuildProgress extends Component {
-
- {taskCount}
-
- {taskCount} {" "}
+
+
- )
+ );
}
}
@@ -163,4 +160,4 @@ TaskBuildProgress.propTypes = {
challenge: PropTypes.object.isRequired,
refreshChallenge: PropTypes.func.isRequired,
refreshTasks: PropTypes.func.isRequired,
-}
+};
diff --git a/src/components/AdminPane/Manage/ViewChallengeTasks/ViewChallengeTasks.jsx b/src/components/AdminPane/Manage/ViewChallengeTasks/ViewChallengeTasks.jsx
index 81131e724..e2e5eeee5 100644
--- a/src/components/AdminPane/Manage/ViewChallengeTasks/ViewChallengeTasks.jsx
+++ b/src/components/AdminPane/Manage/ViewChallengeTasks/ViewChallengeTasks.jsx
@@ -1,44 +1,38 @@
-import { Fragment, Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import { Popup } from 'react-leaflet'
-import { ChallengeStatus }
- from '../../../../services/Challenge/ChallengeStatus/ChallengeStatus'
-import { TaskStatus,
- messagesByStatus }
- from '../../../../services/Task/TaskStatus/TaskStatus'
-import { messagesByPriority, TaskPriority }
- from '../../../../services/Task/TaskPriority/TaskPriority'
-import { toLatLngBounds } from '../../../../services/MapBounds/MapBounds'
-import AsManager from '../../../../interactions/User/AsManager'
-import WithBoundedTasks
- from '../../../HOCs/WithBoundedTasks/WithBoundedTasks'
-import WithFilterCriteria
- from '../../../HOCs/WithFilterCriteria/WithFilterCriteria'
-import WithTaskPropertyKeys
- from '../../../HOCs/WithTaskPropertyKeys/WithTaskPropertyKeys'
-import WithChallengeTaskClusters
- from '../../../HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters'
-import WithTaskClusterMarkers
- from '../../../HOCs/WithTaskClusterMarkers/WithTaskClusterMarkers'
-import WithLoadedTask
- from '../../../HOCs/WithLoadedTask/WithLoadedTask'
-import TaskClusterMap from '../../../TaskClusterMap/TaskClusterMap'
-import MapPane from '../../../EnhancedMap/MapPane/MapPane'
-import SvgSymbol from '../../../SvgSymbol/SvgSymbol'
-import BusySpinner from '../../../BusySpinner/BusySpinner'
-import IntervalRender from '../../../IntervalRender/IntervalRender'
-import TaskAnalysisTable from '../../../TaskAnalysisTable/TaskAnalysisTable'
-import TaskPriorityFilter from '../../../TaskFilters/TaskPriorityFilter'
-import TaskStatusFilter from '../../../TaskFilters/TaskStatusFilter'
-import TaskReviewStatusFilter from '../../../TaskFilters/TaskReviewStatusFilter'
-import TaskPropertyFilter from '../../../TaskFilters/TaskPropertyFilter'
-import TaskBuildProgress from './TaskBuildProgress'
-import GeographicIndexingNotice from './GeographicIndexingNotice'
-import messages from './Messages'
+import PropTypes from "prop-types";
+import { Component, Fragment } from "react";
+import { FormattedMessage } from "react-intl";
+import { Popup } from "react-leaflet";
+import AsManager from "../../../../interactions/User/AsManager";
+import { ChallengeStatus } from "../../../../services/Challenge/ChallengeStatus/ChallengeStatus";
+import { toLatLngBounds } from "../../../../services/MapBounds/MapBounds";
+import {
+ TaskPriority,
+ messagesByPriority,
+} from "../../../../services/Task/TaskPriority/TaskPriority";
+import { TaskStatus, messagesByStatus } from "../../../../services/Task/TaskStatus/TaskStatus";
+import BusySpinner from "../../../BusySpinner/BusySpinner";
+import MapPane from "../../../EnhancedMap/MapPane/MapPane";
+import WithBoundedTasks from "../../../HOCs/WithBoundedTasks/WithBoundedTasks";
+import WithChallengeTaskClusters from "../../../HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters";
+import WithFilterCriteria from "../../../HOCs/WithFilterCriteria/WithFilterCriteria";
+import WithLoadedTask from "../../../HOCs/WithLoadedTask/WithLoadedTask";
+import WithTaskClusterMarkers from "../../../HOCs/WithTaskClusterMarkers/WithTaskClusterMarkers";
+import WithTaskPropertyKeys from "../../../HOCs/WithTaskPropertyKeys/WithTaskPropertyKeys";
+import IntervalRender from "../../../IntervalRender/IntervalRender";
+import SvgSymbol from "../../../SvgSymbol/SvgSymbol";
+import TaskAnalysisTable from "../../../TaskAnalysisTable/TaskAnalysisTable";
+import TaskClusterMap from "../../../TaskClusterMap/TaskClusterMap";
+import TaskPriorityFilter from "../../../TaskFilters/TaskPriorityFilter";
+import TaskPropertyFilter from "../../../TaskFilters/TaskPropertyFilter";
+import TaskReviewStatusFilter from "../../../TaskFilters/TaskReviewStatusFilter";
+import TaskStatusFilter from "../../../TaskFilters/TaskStatusFilter";
+import GeographicIndexingNotice from "./GeographicIndexingNotice";
+import messages from "./Messages";
+import TaskBuildProgress from "./TaskBuildProgress";
const ClusterMap = WithChallengeTaskClusters(
- WithTaskClusterMarkers(TaskClusterMap('challengeOwner')))
+ WithTaskClusterMarkers(TaskClusterMap("challengeOwner")),
+);
/**
* ViewChallengeTasks displays challenge tasks as both a map and a table,
@@ -51,127 +45,141 @@ export class ViewChallengeTasks extends Component {
bulkUpdating: false,
boundsReset: false,
showPriorityBounds: false,
- }
+ };
changeStatus = (selectedTasks, newStatus = TaskStatus.created) => {
if (!selectedTasks.allSelected && selectedTasks.selected.size === 0) {
- return // Nothing to do
+ return; // Nothing to do
}
- this.setState({bulkUpdating: true})
+ this.setState({ bulkUpdating: true });
// If all tasks are selected (so beyond what is being viewed on current page)
if (selectedTasks.allSelected) {
- this.props.applyBulkTaskStatusChange(
- parseInt(newStatus),
- this.props.challenge.id,
- this.props.criteria,
- [...selectedTasks.deselected.keys()]
- ).then(() => {
- this.props.refreshChallenge()
- this.props.refreshTasks()
- this.setState({bulkUpdating: false})
- })
+ this.props
+ .applyBulkTaskStatusChange(
+ parseInt(newStatus),
+ this.props.challenge.id,
+ this.props.criteria,
+ [...selectedTasks.deselected.keys()],
+ )
+ .then(() => {
+ this.props.refreshChallenge();
+ this.props.refreshTasks();
+ this.setState({ bulkUpdating: false });
+ });
+ } else {
+ // Otherwise only apply to selected tasks
+ this.props
+ .applyBulkTaskChanges([...this.props.selectedTasks.selected.values()], {
+ status: parseInt(newStatus),
+ mappedOn: null,
+ reviewStatus: null,
+ reviewRequestedBy: null,
+ reviewedBy: null,
+ reviewedAt: null,
+ })
+ .then(() => {
+ this.props.refreshChallenge();
+ this.props.refreshTasks();
+ this.setState({ bulkUpdating: false });
+ });
}
- else { // Otherwise only apply to selected tasks
- this.props.applyBulkTaskChanges([...this.props.selectedTasks.selected.values()], {
- status: parseInt(newStatus),
- mappedOn: null,
- reviewStatus: null,
- reviewRequestedBy: null,
- reviewedBy: null,
- reviewedAt: null
- }).then(() => {
- this.props.refreshChallenge()
- this.props.refreshTasks()
- this.setState({bulkUpdating: false})
- })
- }
- }
+ };
- removeReviewRequests = selectedTasks => {
+ removeReviewRequests = (selectedTasks) => {
if (!selectedTasks.allSelected && selectedTasks.selected.size === 0) {
- return // Nothing to do
+ return; // Nothing to do
}
- this.setState({bulkUpdating: true})
- this.props.removeReviewRequest(
- this.props.challenge.id,
- selectedTasks.allSelected ? null : [...selectedTasks.selected.keys()],
- this.props.criteria,
- selectedTasks.allSelected ? [...selectedTasks.deselected.keys()] : null,
- false
- ).then(() => {
- this.props.refreshChallenge()
- this.props.refreshTasks()
- this.setState({bulkUpdating: false})
- })
- }
-
- removeMetaReviewRequests = selectedTasks => {
+ this.setState({ bulkUpdating: true });
+ this.props
+ .removeReviewRequest(
+ this.props.challenge.id,
+ selectedTasks.allSelected ? null : [...selectedTasks.selected.keys()],
+ this.props.criteria,
+ selectedTasks.allSelected ? [...selectedTasks.deselected.keys()] : null,
+ false,
+ )
+ .then(() => {
+ this.props.refreshChallenge();
+ this.props.refreshTasks();
+ this.setState({ bulkUpdating: false });
+ });
+ };
+
+ removeMetaReviewRequests = (selectedTasks) => {
if (!selectedTasks.allSelected && selectedTasks.selected.size === 0) {
- return // Nothing to do
+ return; // Nothing to do
}
- this.setState({bulkUpdating: true})
- this.props.removeReviewRequest(
- this.props.challenge.id,
- selectedTasks.allSelected ? null : [...selectedTasks.selected.keys()],
- this.props.criteria,
- selectedTasks.allSelected ? [...selectedTasks.deselected.keys()] : null,
- true
- ).then(() => {
- this.props.refreshChallenge()
- this.props.refreshTasks()
- this.setState({bulkUpdating: false})
- })
- }
+ this.setState({ bulkUpdating: true });
+ this.props
+ .removeReviewRequest(
+ this.props.challenge.id,
+ selectedTasks.allSelected ? null : [...selectedTasks.selected.keys()],
+ this.props.criteria,
+ selectedTasks.allSelected ? [...selectedTasks.deselected.keys()] : null,
+ true,
+ )
+ .then(() => {
+ this.props.refreshChallenge();
+ this.props.refreshTasks();
+ this.setState({ bulkUpdating: false });
+ });
+ };
resetMapBounds = () => {
- this.setState({boundsReset: true})
- this.props.clearMapBounds(this.props.searchGroup)
- }
+ this.setState({ boundsReset: true });
+ this.props.clearMapBounds(this.props.searchGroup);
+ };
mapBoundsUpdated = (challengeId, bounds, zoom) => {
- this.props.setChallengeOwnerMapBounds(challengeId, bounds, zoom)
- this.props.updateTaskFilterBounds(bounds, zoom)
- this.setState({boundsReset: false})
- }
+ this.props.setChallengeOwnerMapBounds(challengeId, bounds, zoom);
+ this.props.updateTaskFilterBounds(bounds, zoom);
+ this.setState({ boundsReset: false });
+ };
- showMarkerPopup = markerData => {
- const TaskData = WithLoadedTask(TaskMarkerContent)
+ showMarkerPopup = (markerData) => {
+ const TaskData = WithLoadedTask(TaskMarkerContent);
return (
- )
- }
+ );
+ };
// Finds all the 'bounds' type rules on the challenge to show as
// bounding box overlays on the map.
- findPriorityBounds = challenge => {
+ findPriorityBounds = (challenge) => {
const parseBoundsRule = (rule, priorityLevel, priorityBounds) => {
if (rule.rules) {
- return rule.rules.map((r) => parseBoundsRule(r, priorityLevel, priorityBounds))
+ return rule.rules.map((r) => parseBoundsRule(r, priorityLevel, priorityBounds));
}
if (rule.type === "bounds") {
- return priorityBounds.push(
- {boundingBox: rule.value.replace("location.", ""), priorityLevel})
+ return priorityBounds.push({
+ boundingBox: rule.value.replace("location.", ""),
+ priorityLevel,
+ });
}
- }
+ };
- let priorityBounds = []
- parseBoundsRule(challenge.highPriorityRule, TaskPriority.high, priorityBounds)
- parseBoundsRule(challenge.mediumPriorityRule, TaskPriority.medium, priorityBounds)
- parseBoundsRule(challenge.lowPriorityRule, TaskPriority.low, priorityBounds)
+ let priorityBounds = [];
+ parseBoundsRule(challenge.highPriorityRule, TaskPriority.high, priorityBounds);
+ parseBoundsRule(challenge.mediumPriorityRule, TaskPriority.medium, priorityBounds);
+ parseBoundsRule(challenge.lowPriorityRule, TaskPriority.low, priorityBounds);
- return priorityBounds
- }
+ return priorityBounds;
+ };
render() {
if (this.props.challenge.status === ChallengeStatus.building) {
- return
+ return (
+
+
+ );
}
if (this.props.challenge.status === ChallengeStatus.failed) {
@@ -181,11 +189,9 @@ export class ViewChallengeTasks extends Component {
-
- {this.props.challenge.statusMessage}
-
+
{this.props.challenge.statusMessage}
- )
+ );
}
if ((this.props.challenge?.actions?.total ?? 0) === 0) {
@@ -195,7 +201,7 @@ export class ViewChallengeTasks extends Component {
- )
+ );
}
if (this.state.bulkUpdating) {
@@ -203,55 +209,61 @@ export class ViewChallengeTasks extends Component {
- )
+ );
}
const clearFiltersControl = (
- {
- this.props.clearAllFilters()
- this.resetMapBounds()
- }}>
-
-
-
- )
-
- const map =
- this.setState({showPriorityBounds: !this.state.showPriorityBounds})}
- showPriorityBounds={this.state.showPriorityBounds}
- priorityBounds={this.findPriorityBounds(this.props.challenge)}
- initialBounds={this.state.boundsReset ?
- toLatLngBounds(this.props.criteria?.boundingBox) : null}
- {...this.props}
+ this.props.clearAllFilters();
+ this.resetMapBounds();
+ }}
+ >
+
+
+
+ );
- this.boundsReset = false
+ const map = (
+
+ this.setState({ showPriorityBounds: !this.state.showPriorityBounds })
+ }
+ showPriorityBounds={this.state.showPriorityBounds}
+ priorityBounds={this.findPriorityBounds(this.props.challenge)}
+ initialBounds={
+ this.state.boundsReset ? toLatLngBounds(this.props.criteria?.boundingBox) : null
+ }
+ {...this.props}
+ />
+ );
+
+ this.boundsReset = false;
return (
-
+
-
- {map}
-
+ {map}
-
-
+
+
@@ -270,96 +282,93 @@ export class ViewChallengeTasks extends Component {
-
- {clearFiltersControl}
-
+
{clearFiltersControl}
-
+
);
}
}
-const calculateTasksInChallenge = props => {
- const actions = props.challenge?.actions
+const calculateTasksInChallenge = (props) => {
+ const actions = props.challenge?.actions;
if (!actions) {
return props.taskInfo?.totalCount;
}
- return actions.total
-}
+ return actions.total;
+};
-const TaskMarkerContent = props => {
- const manager = AsManager(props.user)
+const TaskMarkerContent = (props) => {
+ const manager = AsManager(props.user);
const taskBaseRoute =
`/admin/project/${props.challenge.parent.id}` +
- `/challenge/${props.challenge?.id}/task/${props.marker.options.taskId}`
+ `/challenge/${props.challenge?.id}/task/${props.marker.options.taskId}`;
return (
- {
- props.intl.formatMessage(messages.nameLabel)
- } {
- (props.marker.options.name || (props.task?.name) || (props.task?.title))
- }
+ {props.intl.formatMessage(messages.nameLabel)}{" "}
+ {props.marker.options.name || props.task?.name || props.task?.title}
- {
- props.intl.formatMessage(messages.statusLabel)
- } {
- props.intl.formatMessage(messagesByStatus[props.marker.options.taskStatus])
- }
+ {props.intl.formatMessage(messages.statusLabel)}{" "}
+ {props.intl.formatMessage(messagesByStatus[props.marker.options.taskStatus])}
- {
- props.intl.formatMessage(messages.priorityLabel)
- }: {
- props.intl.formatMessage(messagesByPriority[props.marker.options.taskPriority])
- }
+ {props.intl.formatMessage(messages.priorityLabel)}:{" "}
+ {props.intl.formatMessage(messagesByPriority[props.marker.options.taskPriority])}
- {props.loading &&
+ {props.loading && (
- }
+ )}
- {manager.canWriteProject(props.challenge.parent) &&
+ {manager.canWriteProject(props.challenge.parent) && (
- }
+ )}
);
-}
+};
ViewChallengeTasks.propTypes = {
/** The tasks to display */
@@ -392,17 +401,14 @@ ViewChallengeTasks.propTypes = {
setChallengeOwnerMapBounds: PropTypes.func.isRequired,
/** Clears any applied filters */
clearAllFilters: PropTypes.func.isRequired,
-}
+};
ViewChallengeTasks.defaultProps = {
loadingChallenge: false,
-}
+};
-export default
-WithBoundedTasks(
- WithTaskPropertyKeys(
- WithFilterCriteria(ViewChallengeTasks, false)
- ),
- 'filteredClusteredTasks',
- 'taskInfo'
-)
+export default WithBoundedTasks(
+ WithTaskPropertyKeys(WithFilterCriteria(ViewChallengeTasks, false)),
+ "filteredClusteredTasks",
+ "taskInfo",
+);
diff --git a/src/components/AdminPane/Manage/VirtualProjects/AssociatedChallengeList.jsx b/src/components/AdminPane/Manage/VirtualProjects/AssociatedChallengeList.jsx
index 0357f1ad9..4fd418a06 100644
--- a/src/components/AdminPane/Manage/VirtualProjects/AssociatedChallengeList.jsx
+++ b/src/components/AdminPane/Manage/VirtualProjects/AssociatedChallengeList.jsx
@@ -1,10 +1,10 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import _map from 'lodash/map'
-import SvgSymbol from '../../../SvgSymbol/SvgSymbol'
-import PageResultsButton from '../../../LoadMoreButton/PageResultsButton'
-import messages from './Messages'
+import _map from "lodash/map";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import PageResultsButton from "../../../LoadMoreButton/PageResultsButton";
+import SvgSymbol from "../../../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
/**
* AssociatedChallengeList renders the given challenges as two lists with add/remove
@@ -14,56 +14,53 @@ import messages from './Messages'
*/
export default class AssociatedChallengeList extends Component {
render() {
- const challengeCards =
- _map(this.props.challenges, challenge => (
-
-
-
-
- {this.props.includeId && `(id: ${challenge.id})`}{" "}{challenge.name}
-
{challenge.parent?.displayName}
-
+ const challengeCards = _map(this.props.challenges, (challenge) => (
+
+
+
+
+ {this.props.includeId && `(id: ${challenge.id})`} {challenge.name}
+
{challenge.parent?.displayName}
+
-
- {this.props.toBeAdded ?
- this.props.addChallenge(challenge.id, this.props.project.id)}
- >
- :
- this.props.removeChallenge(challenge.id, this.props.project.id)}
- >
-
- }
-
+
+ {this.props.toBeAdded ? (
+ this.props.addChallenge(challenge.id, this.props.project.id)}
+ >
+
+ ) : (
+ this.props.removeChallenge(challenge.id, this.props.project.id)}
+ >
+
+ )}
- ))
+
+ ));
return (
-
- {!this.props.loadingChallenges && challengeCards.length === 0
- ? null
- : challengeCards
- }
- {this.props.setSearchPage &&
+
+ {!this.props.loadingChallenges && challengeCards.length === 0 ? null : challengeCards}
+ {this.props.setSearchPage && (
- }
+ )}
- )
+ );
}
}
AssociatedChallengeList.propTypes = {
challenges: PropTypes.array.isRequired,
-}
+};
diff --git a/src/components/AdminPane/Manage/VirtualProjects/ChallengeIdResult.jsx b/src/components/AdminPane/Manage/VirtualProjects/ChallengeIdResult.jsx
index 7d5d78f32..58856742d 100644
--- a/src/components/AdminPane/Manage/VirtualProjects/ChallengeIdResult.jsx
+++ b/src/components/AdminPane/Manage/VirtualProjects/ChallengeIdResult.jsx
@@ -1,16 +1,19 @@
-import { useEffect, useState } from 'react'
-import { connect } from 'react-redux'
-import { defaultRoutes as api } from "../../../../services/Server/Server";
-import Endpoint from "../../../../services/Server/Endpoint";
+import _omit from "lodash/omit";
+import { useEffect, useState } from "react";
+import { connect } from "react-redux";
import { challengeSchema } from "../../../../services/Challenge/Challenge";
-import _omit from 'lodash/omit'
-import AssociatedChallengeList from './AssociatedChallengeList';
+import Endpoint from "../../../../services/Server/Endpoint";
+import { defaultRoutes as api } from "../../../../services/Server/Server";
+import AssociatedChallengeList from "./AssociatedChallengeList";
const getChallengeById = async (id) => {
- const result = await new Endpoint(api.challenge.single, { variables: { id }, schema: challengeSchema() }).execute()
+ const result = await new Endpoint(api.challenge.single, {
+ variables: { id },
+ schema: challengeSchema(),
+ }).execute();
- return result
-}
+ return result;
+};
const ChallengeIdResult = (props) => {
const [challenge, setChallenge] = useState();
@@ -18,17 +21,17 @@ const ChallengeIdResult = (props) => {
useEffect(() => {
if (Number.isInteger(Number(props.query)) && props.query > 0) {
getChallengeById(props.query).then((data) => {
- setChallenge(data.entities?.challenges?.[props.query])
- })
+ setChallenge(data.entities?.challenges?.[props.query]);
+ });
} else {
- setChallenge(undefined)
+ setChallenge(undefined);
}
- }, [props.query])
+ }, [props.query]);
- if (challenge && !props.excludeChallenges.find(c => c.id === challenge.id)) {
+ if (challenge && !props.excludeChallenges.find((c) => c.id === challenge.id)) {
return (
{
}
return null;
-}
+};
export const mapStateToProps = (state) => {
- return { query: state.currentSearch?.adminChallengeList?.query ?? '' };
-}
+ return { query: state.currentSearch?.adminChallengeList?.query ?? "" };
+};
-export default connect(mapStateToProps)(ChallengeIdResult)
+export default connect(mapStateToProps)(ChallengeIdResult);
diff --git a/src/components/AdminPane/Manage/VirtualProjects/ManageChallengeList.jsx b/src/components/AdminPane/Manage/VirtualProjects/ManageChallengeList.jsx
index 3a76c9ef0..fca646f21 100644
--- a/src/components/AdminPane/Manage/VirtualProjects/ManageChallengeList.jsx
+++ b/src/components/AdminPane/Manage/VirtualProjects/ManageChallengeList.jsx
@@ -1,44 +1,40 @@
-import { Component } from 'react'
-import _isObject from 'lodash/isObject'
-import _omit from 'lodash/omit'
-import _isEmpty from 'lodash/isEmpty'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import { Link } from 'react-router-dom'
-import WithManageableProjects
- from '../../HOCs/WithManageableProjects/WithManageableProjects'
-import WithCurrentProject from '../../HOCs/WithCurrentProject/WithCurrentProject'
-import WithSearch from '../../../HOCs/WithSearch/WithSearch'
-import WithSearchResults from '../../../HOCs/WithSearchResults/WithSearchResults'
-import WithCommandInterpreter from '../../../HOCs/WithCommandInterpreter/WithCommandInterpreter'
-import WithPermittedChallenges from '../../HOCs/WithPermittedChallenges/WithPermittedChallenges'
-import WithPagedChallenges from '../../../HOCs/WithPagedChallenges/WithPagedChallenges'
-import { extendedFind } from '../../../../services/Challenge/Challenge'
-import SearchBox from '../../../SearchBox/SearchBox'
-import AssociatedChallengeList from './AssociatedChallengeList'
-import QuickWidget from '../../../QuickWidget/QuickWidget'
-import Header from '../../../Header/Header'
-import Button from '../../../Button/Button'
+import _isEmpty from "lodash/isEmpty";
+import _isObject from "lodash/isObject";
+import _omit from "lodash/omit";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import { Link } from "react-router-dom";
+import { extendedFind } from "../../../../services/Challenge/Challenge";
+import Button from "../../../Button/Button";
+import WithCommandInterpreter from "../../../HOCs/WithCommandInterpreter/WithCommandInterpreter";
+import WithPagedChallenges from "../../../HOCs/WithPagedChallenges/WithPagedChallenges";
+import WithSearch from "../../../HOCs/WithSearch/WithSearch";
+import WithSearchResults from "../../../HOCs/WithSearchResults/WithSearchResults";
+import Header from "../../../Header/Header";
+import QuickWidget from "../../../QuickWidget/QuickWidget";
+import SearchBox from "../../../SearchBox/SearchBox";
+import WithCurrentProject from "../../HOCs/WithCurrentProject/WithCurrentProject";
+import WithManageableProjects from "../../HOCs/WithManageableProjects/WithManageableProjects";
+import WithPermittedChallenges from "../../HOCs/WithPermittedChallenges/WithPermittedChallenges";
+import AssociatedChallengeList from "./AssociatedChallengeList";
import ChallengeIdResult from "./ChallengeIdResult";
-import BusySpinner from '../../../BusySpinner/BusySpinner'
-import manageMessages from '../Messages'
-import messages from './Messages'
+import BusySpinner from "../../../BusySpinner/BusySpinner";
+import manageMessages from "../Messages";
+import messages from "./Messages";
// Setup child components with needed HOCs.
const ChallengeSearch = WithSearch(
- WithCommandInterpreter(SearchBox, ['p', 'i']),
- 'adminChallengeList',
- searchCriteria => {
+ WithCommandInterpreter(SearchBox, ["p", "i"]),
+ "adminChallengeList",
+ (searchCriteria) => {
if (!_isEmpty(searchCriteria?.filters)) {
- return extendedFind({filters: searchCriteria?.filters ?? {},
- onlyEnabled: false}, 1000);
- }
- else {
- return extendedFind({searchQuery: searchCriteria.query,
- onlyEnabled: false}, 1000)
+ return extendedFind({ filters: searchCriteria?.filters ?? {}, onlyEnabled: false }, 1000);
+ } else {
+ return extendedFind({ searchQuery: searchCriteria.query, onlyEnabled: false }, 1000);
}
},
-)
+);
const SearchResults = (props) => {
return (
@@ -46,15 +42,16 @@ const SearchResults = (props) => {
this.done(this.props)}>
+ );
- const breadcrumbs =
+ const breadcrumbs = (
+ );
return (
-
+
@@ -132,7 +124,7 @@ export class manageChallengeList extends Component {
rightHeaderControls={searchControl}
>
-
- )
+ );
}
}
export default WithManageableProjects(
- WithCurrentProject(injectIntl(manageChallengeList), {includeChallenges: true}),
- 'adminChallengeList',
- 'challenges',
- 'resultChallenges',
- )
+ WithCurrentProject(injectIntl(manageChallengeList), { includeChallenges: true }),
+ "adminChallengeList",
+ "challenges",
+ "resultChallenges",
+);
diff --git a/src/components/AdminPane/Manage/VirtualProjects/Messages.js b/src/components/AdminPane/Manage/VirtualProjects/Messages.js
index 15ef5201e..fd9fa1a16 100644
--- a/src/components/AdminPane/Manage/VirtualProjects/Messages.js
+++ b/src/components/AdminPane/Manage/VirtualProjects/Messages.js
@@ -1,21 +1,21 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeList
*/
export default defineMessages({
manageChallengesLabel: {
- id: 'Admin.VirtualProject.manageChallenge.label',
+ id: "Admin.VirtualProject.manageChallenge.label",
defaultMessage: "Manage Challenges",
},
doneLabel: {
- id: 'Admin.VirtualProject.controls.done.label',
+ id: "Admin.VirtualProject.controls.done.label",
defaultMessage: "Done",
},
addChallengeLabel: {
- id: 'Admin.VirtualProject.controls.addChallenge.label',
+ id: "Admin.VirtualProject.controls.addChallenge.label",
defaultMessage: "Add Challenge",
},
@@ -25,27 +25,27 @@ export default defineMessages({
},
searchPlaceholder: {
- id: 'Admin.VirtualProject.ChallengeList.search.placeholder',
+ id: "Admin.VirtualProject.ChallengeList.search.placeholder",
defaultMessage: "Search",
},
currentChallengesLabel: {
- id: 'Admin.VirtualProject.currentChallenges.label',
+ id: "Admin.VirtualProject.currentChallenges.label",
defaultMessage: "Challenges in ",
},
findChallengesLabel: {
- id: 'Admin.VirtualProject.findChallenges.label',
+ id: "Admin.VirtualProject.findChallenges.label",
defaultMessage: "Find Challenges",
},
addLabel: {
- id: 'Admin.VirtualProject.controls.add.label',
+ id: "Admin.VirtualProject.controls.add.label",
defaultMessage: "Add",
},
removeLabel: {
- id: 'Admin.VirtualProject.controls.remove.label',
+ id: "Admin.VirtualProject.controls.remove.label",
defaultMessage: "Remove",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.jsx b/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.jsx
index c6d6d1629..d1cfa837f 100644
--- a/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.jsx
+++ b/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.jsx
@@ -1,9 +1,7 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import _isEmpty from 'lodash/isEmpty'
-import WithChallengeManagement
- from '../../HOCs/WithChallengeManagement/WithChallengeManagement'
-
+import _isEmpty from "lodash/isEmpty";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import WithChallengeManagement from "../../HOCs/WithChallengeManagement/WithChallengeManagement";
/**
* VisibilitySwitch renders a simple switch, with optional label, that
@@ -14,34 +12,33 @@ import WithChallengeManagement
*/
export class VisibilitySwitch extends Component {
toggleVisible = () => {
- this.props.updateEnabled(this.props.challenge.id,
- !this.props.challenge.enabled)
- }
+ this.props.updateEnabled(this.props.challenge.id, !this.props.challenge.enabled);
+ };
render() {
if (_isEmpty(this.props.challenge)) {
- return null
+ return null;
}
return (
-
- )
+ );
}
}
VisibilitySwitch.propTypes = {
challenge: PropTypes.object,
- updateEnabled: PropTypes.func.isRequired
-}
+ updateEnabled: PropTypes.func.isRequired,
+};
-export default WithChallengeManagement(VisibilitySwitch)
+export default WithChallengeManagement(VisibilitySwitch);
diff --git a/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.test.jsx b/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.test.jsx
index 8200951e4..7491a27e1 100644
--- a/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.test.jsx
+++ b/src/components/AdminPane/Manage/VisibilitySwitch/VisibilitySwitch.test.jsx
@@ -1,4 +1,4 @@
-import { describe, it, expect, vi } from "vitest";
+import { describe, expect, it, vi } from "vitest";
import "@testing-library/jest-dom";
import { fireEvent } from "@testing-library/react";
import { VisibilitySwitch } from "./VisibilitySwitch";
@@ -6,7 +6,7 @@ import { VisibilitySwitch } from "./VisibilitySwitch";
describe("Visibility Switch", () => {
it("renders Visibility Switch if a challenge object is provided", () => {
const { container } = global.withProvider(
-
updateEnabled()} challenge={{ enabled: false }} />
+ updateEnabled()} challenge={{ enabled: false }} />,
);
expect(container.firstChild.classList["0"]).toBe("mr-flex");
@@ -15,13 +15,13 @@ describe("Visibility Switch", () => {
it("input onClick event does not call updateEnabled", () => {
const updateEnabled = vi.fn();
const { container } = global.withProvider(
- updateEnabled()} challenge={{ enabled: false }} />
+ updateEnabled()} challenge={{ enabled: false }} />,
);
- const element = container.querySelector('input[type=checkbox]');
+ const element = container.querySelector("input[type=checkbox]");
fireEvent.click(element);
expect(updateEnabled).toHaveBeenCalledTimes(0);
});
-});
\ No newline at end of file
+});
diff --git a/src/components/AdminPane/Manage/Widgets/BurndownChartWidget/BurndownChartWidget.jsx b/src/components/AdminPane/Manage/Widgets/BurndownChartWidget/BurndownChartWidget.jsx
index 2a342fe16..e5ed32f94 100644
--- a/src/components/AdminPane/Manage/Widgets/BurndownChartWidget/BurndownChartWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/BurndownChartWidget/BurndownChartWidget.jsx
@@ -1,36 +1,37 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import BurndownChart from '../../BurndownChart/BurndownChart'
-import BusySpinner from '../../../../BusySpinner/BusySpinner'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import WithChallengeMetrics
- from '../../../HOCs/WithChallengeMetrics/WithChallengeMetrics'
-import messages from './Messages'
-import './BurndownChartWidget.scss'
-import { PROJECT_CHALLENGE_LIMIT } from '../../../../../services/Project/Project'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import BusySpinner from "../../../../BusySpinner/BusySpinner";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import WithChallengeMetrics from "../../../HOCs/WithChallengeMetrics/WithChallengeMetrics";
+import BurndownChart from "../../BurndownChart/BurndownChart";
+import messages from "./Messages";
+import "./BurndownChartWidget.scss";
+import { PROJECT_CHALLENGE_LIMIT } from "../../../../../services/Project/Project";
const descriptor = {
- widgetKey: 'BurndownChartWidget',
+ widgetKey: "BurndownChartWidget",
label: messages.label,
targets: [WidgetDataTarget.challenges, WidgetDataTarget.challenge],
minWidth: 3,
defaultWidth: 4,
defaultHeight: 12,
-}
+};
export default class BurndownChartWidget extends Component {
render() {
- let content = null
+ let content = null;
if (this.props.singleProject) {
if (!this.props.project) {
- content = Sorry, project statistics are not available for projects with more than {PROJECT_CHALLENGE_LIMIT} challenges.
- }
- else if (!this.props.challengeStatsAvailable) {
+ content =
+ Sorry, project statistics are not available for projects with more than{" "}
+ {PROJECT_CHALLENGE_LIMIT} challenges.
+
+ );
+ } else if (!this.props.challengeStatsAvailable) {
content = (
- )
- }
- else if (this.props.loadingChallengeStats) {
- content = {selector}
this.setState({ pickingProject: true })}
>
-
- {archivedOn ?
@@ -158,114 +165,123 @@ export default class ChallengeListWidget extends Component {
this.deleteChallenges(tallied)}
>
-
- )
- }
+ );
+ };
render() {
- const tallied = this.props.talliedChallenges(this.props.project.id) || []
- const allEnabled = _difference(_map(this.props.challenges, c => c.id), tallied).length === 0
- const someEnabled = tallied.length !== 0
+ const tallied = this.props.talliedChallenges(this.props.project.id) || [];
+ const allEnabled =
+ _difference(
+ _map(this.props.challenges, (c) => c.id),
+ tallied,
+ ).length === 0;
+ const someEnabled = tallied.length !== 0;
- const selectedChallengeIds = _join(this.props.talliedChallenges(this.props.project.id), ',')
+ const selectedChallengeIds = _join(this.props.talliedChallenges(this.props.project.id), ",");
// project export CSV needs 'cId' (with capital I)
- const cId = _isEmpty(selectedChallengeIds) ? "" : `cId=${selectedChallengeIds}`
+ const cId = _isEmpty(selectedChallengeIds) ? "" : `cId=${selectedChallengeIds}`;
// export mapper review CSV needs 'cid'
- const cIdReview = _isEmpty(selectedChallengeIds) ? "" : `cid=${selectedChallengeIds}`
- const pIdReview = _isEmpty(selectedChallengeIds) ? `pid=${this.props.project.id}` : ""
+ const cIdReview = _isEmpty(selectedChallengeIds) ? "" : `cid=${selectedChallengeIds}`;
+ const pIdReview = _isEmpty(selectedChallengeIds) ? `pid=${this.props.project.id}` : "";
- const rightHeaderControls = this.props.projects.length === 0 ? null : (
-
-
-
+
+
-
-
(
-
-
- )}
- dropdownContent={() =>
-
- {someEnabled && this.renderSelectCommands(tallied)}
-
-
-
-
-
- {}} talliedChallenges={() => null} projects={[]} intl={{ formatMessage: () => null }} />
+ {}}
+ talliedChallenges={() => null}
+ projects={[]}
+ intl={{ formatMessage: () => null }}
+ />,
);
const text = getByText("No Challenges");
expect(text).toBeInTheDocument();
});
-});
\ No newline at end of file
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ChallengeListWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/ChallengeListWidget/Messages.js
index 1fed52191..b21736e29 100644
--- a/src/components/AdminPane/Manage/Widgets/ChallengeListWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/ChallengeListWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeListWidget
@@ -63,4 +63,4 @@ export default defineMessages({
id: "Admin.manageProjectChallenges.controls.deleteSelected.label",
defaultMessage: "Delete Selected",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/ChallengeOverviewWidget.jsx b/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/ChallengeOverviewWidget.jsx
index c592f98f1..bb2399475 100644
--- a/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/ChallengeOverviewWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/ChallengeOverviewWidget.jsx
@@ -1,48 +1,53 @@
-import { Component } from 'react'
-import { FormattedMessage, FormattedDate } from 'react-intl'
-import _isEmpty from 'lodash/isEmpty'
-import { parseISO } from 'date-fns'
-import { ChallengeStatus, messagesByStatus }
- from '../../../../../services/Challenge/ChallengeStatus/ChallengeStatus'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import AsManager from '../../../../../interactions/User/AsManager'
-import ChallengeKeywords from '../../ChallengeKeywords/ChallengeKeywords'
-import VisibilitySwitch from '../../VisibilitySwitch/VisibilitySwitch'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import SvgSymbol from '../../../../SvgSymbol/SvgSymbol'
-import messages from './Messages'
+import { parseISO } from "date-fns";
+import _isEmpty from "lodash/isEmpty";
+import { Component } from "react";
+import { FormattedDate, FormattedMessage } from "react-intl";
+import AsManager from "../../../../../interactions/User/AsManager";
+import {
+ ChallengeStatus,
+ messagesByStatus,
+} from "../../../../../services/Challenge/ChallengeStatus/ChallengeStatus";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import SvgSymbol from "../../../../SvgSymbol/SvgSymbol";
+import ChallengeKeywords from "../../ChallengeKeywords/ChallengeKeywords";
+import VisibilitySwitch from "../../VisibilitySwitch/VisibilitySwitch";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'ChallengeOverviewWidget',
+ widgetKey: "ChallengeOverviewWidget",
label: messages.label,
targets: [WidgetDataTarget.challenge],
minWidth: 3,
defaultWidth: 4,
defaultHeight: 7,
-}
+};
export default class ChallengeOverviewWidget extends Component {
render() {
if (_isEmpty(this.props.challenge)) {
- return null
+ return null;
}
- const manager = AsManager(this.props.user)
- const status = this.props.challenge?.status ?? (ChallengeStatus.none)
+ const manager = AsManager(this.props.user);
+ const status = this.props.challenge?.status ?? ChallengeStatus.none;
const lastTaskRefreshText = this.props.intl.formatMessage(messages.lastTaskRefresh);
const dataOriginDateText =
- (!this.props.challenge.dataOriginDate || !this.props.challenge.lastTaskRefresh) ? null :
- this.props.intl.formatMessage(messages.dataOriginDate,
- {refreshDate: this.props.intl.formatDate(parseISO(this.props.challenge.lastTaskRefresh)),
- sourceDate: this.props.intl.formatDate(parseISO(this.props.challenge.dataOriginDate))})
+ !this.props.challenge.dataOriginDate || !this.props.challenge.lastTaskRefresh
+ ? null
+ : this.props.intl.formatMessage(messages.dataOriginDate, {
+ refreshDate: this.props.intl.formatDate(parseISO(this.props.challenge.lastTaskRefresh)),
+ sourceDate: this.props.intl.formatDate(parseISO(this.props.challenge.dataOriginDate)),
+ });
return (
-
@@ -60,33 +65,35 @@ export default class ChallengeOverviewWidget extends Component {
- {this.props.challenge.parent &&
-
-
- }
+ {this.props.challenge.parent && (
+
+
+ )}
- {this.props.challenge.enabled && this.props.challenge.parent && !this.props.challenge.parent.enabled &&
-
- }
+ {this.props.challenge.enabled &&
+ this.props.challenge.parent &&
+ !this.props.challenge.parent.enabled && (
+
+ )}
@@ -101,10 +108,14 @@ export default class ChallengeOverviewWidget extends Component {
- {this.props.challenge.created &&
-
@@ -114,10 +125,14 @@ export default class ChallengeOverviewWidget extends Component {
- {this.props.challenge.lastTaskRefresh &&
-
@@ -127,16 +142,20 @@ export default class ChallengeOverviewWidget extends Component {
- {this.props.challenge.dataOriginDate &&
-
- )
+ );
}
}
-registerWidgetType(ChallengeOverviewWidget, descriptor)
+registerWidgetType(ChallengeOverviewWidget, descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/Messages.js
index 391e6dd41..6ccb2db5c 100644
--- a/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/ChallengeOverviewWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeOverviewWidget
@@ -63,4 +63,4 @@ export default defineMessages({
id: "Widgets.ChallengeOverviewWidget.projectDisabledWarning",
defaultMessage: "project not discoverable",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/ChallengeTasksWidget.jsx b/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/ChallengeTasksWidget.jsx
index 65977f1b6..9bad51323 100644
--- a/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/ChallengeTasksWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/ChallengeTasksWidget.jsx
@@ -1,14 +1,13 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import ViewChallengeTasks from '../../ViewChallengeTasks/ViewChallengeTasks'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import {DEFAULT_TIMEZONE_OFFSET} from '../../../../TimezonePicker/TimezonePicker'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import { DEFAULT_TIMEZONE_OFFSET } from "../../../../TimezonePicker/TimezonePicker";
+import ViewChallengeTasks from "../../ViewChallengeTasks/ViewChallengeTasks";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'ChallengeTasksWidget',
+ widgetKey: "ChallengeTasksWidget",
label: messages.label,
targets: [WidgetDataTarget.challenge],
minWidth: 6,
@@ -16,15 +15,15 @@ const descriptor = {
defaultHeight: 49,
defaultConfiguration: {
timezoneOffset: DEFAULT_TIMEZONE_OFFSET,
- }
-}
+ },
+};
export default class ChallengeTasksWidget extends Component {
- setTimezone = timezoneOffset => {
+ setTimezone = (timezoneOffset) => {
if (this.props.widgetConfiguration.timezoneOffset !== timezoneOffset) {
- this.props.updateWidgetConfiguration({timezoneOffset})
+ this.props.updateWidgetConfiguration({ timezoneOffset });
}
- }
+ };
render() {
return (
@@ -36,10 +35,11 @@ export default class ChallengeTasksWidget extends Component {
+ currentTimezone={this.props.widgetConfiguration.timezoneOffset}
+ />
- )
+ );
}
}
-registerWidgetType(ChallengeTasksWidget, descriptor)
+registerWidgetType(ChallengeTasksWidget, descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/Messages.js
index 1b5479d59..05c721ef3 100644
--- a/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/ChallengeTasksWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeTasksWidget
@@ -13,4 +13,4 @@ export default defineMessages({
id: "Widgets.ChallengeTasksWidget.title",
defaultMessage: "Tasks",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/CommentsWidget/CommentsWidget.jsx b/src/components/AdminPane/Manage/Widgets/CommentsWidget/CommentsWidget.jsx
index b7ee613bd..b38364cdf 100644
--- a/src/components/AdminPane/Manage/Widgets/CommentsWidget/CommentsWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/CommentsWidget/CommentsWidget.jsx
@@ -1,36 +1,41 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import _map from 'lodash/map'
-import _flatMap from 'lodash/flatMap'
-import _compact from 'lodash/compact'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import CommentList from '../../../../CommentList/CommentList'
-import SvgSymbol from '../../../../SvgSymbol/SvgSymbol'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import messages from './Messages'
+import _compact from "lodash/compact";
+import _flatMap from "lodash/flatMap";
+import _map from "lodash/map";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import CommentList from "../../../../CommentList/CommentList";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import SvgSymbol from "../../../../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'CommentsWidget',
+ widgetKey: "CommentsWidget",
label: messages.label,
targets: [WidgetDataTarget.challenges, WidgetDataTarget.challenge, WidgetDataTarget.task],
minWidth: 3,
defaultWidth: 4,
defaultHeight: 12,
-}
+};
export default class CommentsWidget extends Component {
render() {
- const comments = _compact(_flatMap(this.props.challenges, challenge =>
- challenge.comments ?
- _map(challenge.comments, comment => Object.assign({challengeName: challenge.name}, comment)) :
- null
- ))
- const taskComments = this.props.task?.comments ?
- _map(this.props.task.comments, comment => Object.assign({challengeName: this.props.task?.parent?.name}, comment)) :
- null
+ const comments = _compact(
+ _flatMap(this.props.challenges, (challenge) =>
+ challenge.comments
+ ? _map(challenge.comments, (comment) =>
+ Object.assign({ challengeName: challenge.name }, comment),
+ )
+ : null,
+ ),
+ );
+ const taskComments = this.props.task?.comments
+ ? _map(this.props.task.comments, (comment) =>
+ Object.assign({ challengeName: this.props.task?.parent?.name }, comment),
+ )
+ : null;
- let exportControl = null
+ let exportControl = null;
// Comments can only be exported for single challenges.
if (comments.length > 0 && (this.props.challenges?.length ?? 0) === 1) {
@@ -42,13 +47,13 @@ export default class CommentsWidget extends Component {
className="mr-button mr-button--green-lighter mr-button--small mr-button--with-icon mr-text-sm"
>
- )
+ );
}
return (
@@ -70,4 +75,4 @@ export default class CommentsWidget extends Component {
}
}
-registerWidgetType(CommentsWidget, descriptor)
+registerWidgetType(CommentsWidget, descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/CommentsWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/CommentsWidget/Messages.js
index e6b4708ef..7bbd1eae8 100644
--- a/src/components/AdminPane/Manage/Widgets/CommentsWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/CommentsWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with CommentsWidget
@@ -18,4 +18,4 @@ export default defineMessages({
id: "Widgets.CommentsWidget.controls.export.label",
defaultMessage: "Export",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/LeaderboardWidget.jsx b/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/LeaderboardWidget.jsx
index 05ba407eb..7651c77db 100644
--- a/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/LeaderboardWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/LeaderboardWidget.jsx
@@ -1,26 +1,23 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import _noop from 'lodash/noop'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import WithLeaderboard
- from '../../../../../components/HOCs/WithLeaderboard/WithLeaderboard'
-import ChallengeOwnerLeaderboard
- from '../../ChallengeOwnerLeaderboard/ChallengeOwnerLeaderboard'
-import PastDurationSelector
- from '../../../../PastDurationSelector/PastDurationSelector'
+import _noop from "lodash/noop";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import WithLeaderboard from "../../../../../components/HOCs/WithLeaderboard/WithLeaderboard";
+import {
+ USER_TYPE_MAPPER,
+ USER_TYPE_REVIEWER,
+} from "../../../../../services/Leaderboard/Leaderboard";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import PastDurationSelector from "../../../../PastDurationSelector/PastDurationSelector";
// CURRENT_MONTH removed untill endpoint can handle unique params
-import { CUSTOM_RANGE }
- from '../../../../PastDurationSelector/PastDurationSelector'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import { USER_TYPE_MAPPER, USER_TYPE_REVIEWER }
- from '../../../../../services/Leaderboard/Leaderboard'
-import messages from './Messages'
+import { CUSTOM_RANGE } from "../../../../PastDurationSelector/PastDurationSelector";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import ChallengeOwnerLeaderboard from "../../ChallengeOwnerLeaderboard/ChallengeOwnerLeaderboard";
+import messages from "./Messages";
-const INITIAL_MONTHS_PAST = 1
+const INITIAL_MONTHS_PAST = 1;
const descriptor = {
- widgetKey: 'LeaderboardWidget',
+ widgetKey: "LeaderboardWidget",
label: messages.label,
targets: [WidgetDataTarget.challenges, WidgetDataTarget.challenge],
minWidth: 3,
@@ -29,60 +26,65 @@ const descriptor = {
defaultConfiguration: {
monthsPast: 1,
},
-}
+};
export default class LeaderboardWidget extends Component {
- setUserType = userType => {
+ setUserType = (userType) => {
if (this.props.widgetConfiguration.userType !== userType) {
- this.props.setUserType(userType,
+ this.props.setUserType(
+ userType,
this.props.widgetConfiguration.monthsPast,
this.props.widgetConfiguration.startDate,
- this.props.widgetConfiguration.endDate)
+ this.props.widgetConfiguration.endDate,
+ );
- this.props.updateWidgetConfiguration({userType})
+ this.props.updateWidgetConfiguration({ userType });
}
- }
+ };
- setMonthsPast = monthsPast => {
- this.props.setMonthsPast(monthsPast, true, this.props.widgetConfiguration.userType)
+ setMonthsPast = (monthsPast) => {
+ this.props.setMonthsPast(monthsPast, true, this.props.widgetConfiguration.userType);
if (this.props.widgetConfiguration.monthsPast !== monthsPast) {
- this.props.updateWidgetConfiguration({monthsPast, startDate: null, endDate: null})
+ this.props.updateWidgetConfiguration({ monthsPast, startDate: null, endDate: null });
}
- }
+ };
setDateRange = (startDate, endDate) => {
- this.props.setDateRange(startDate, endDate, this.props.widgetConfiguration.userType)
+ this.props.setDateRange(startDate, endDate, this.props.widgetConfiguration.userType);
- if (this.props.widgetConfiguration.startDate !== startDate ||
- this.props.widgetConfiguration.endDate !== endDate) {
- this.props.updateWidgetConfiguration({monthsPast: CUSTOM_RANGE,
- startDate, endDate})
+ if (
+ this.props.widgetConfiguration.startDate !== startDate ||
+ this.props.widgetConfiguration.endDate !== endDate
+ ) {
+ this.props.updateWidgetConfiguration({ monthsPast: CUSTOM_RANGE, startDate, endDate });
}
- }
+ };
componentDidMount() {
if (this.props.widgetConfiguration.monthsPast !== CUSTOM_RANGE) {
- this.props.setMonthsPast(this.props.widgetConfiguration.monthsPast,
- true,
- this.props.widgetConfiguration.userType)
- }
- else if (this.props.widgetConfiguration.startDate &&
- this.props.widgetConfiguration.endDate) {
- this.props.setDateRange(this.props.widgetConfiguration.startDate,
- this.props.widgetConfiguration.endDate,
- true,
- this.props.widgetConfiguration.userType)
+ this.props.setMonthsPast(
+ this.props.widgetConfiguration.monthsPast,
+ true,
+ this.props.widgetConfiguration.userType,
+ );
+ } else if (this.props.widgetConfiguration.startDate && this.props.widgetConfiguration.endDate) {
+ this.props.setDateRange(
+ this.props.widgetConfiguration.startDate,
+ this.props.widgetConfiguration.endDate,
+ true,
+ this.props.widgetConfiguration.userType,
+ );
}
}
render() {
- const monthsPast = this.props.widgetConfiguration.monthsPast
- const startDate = this.props.widgetConfiguration.startDate
- const endDate = this.props.widgetConfiguration.endDate
- const userType = this.props.widgetConfiguration.userType || USER_TYPE_MAPPER
+ const monthsPast = this.props.widgetConfiguration.monthsPast;
+ const startDate = this.props.widgetConfiguration.startDate;
+ const endDate = this.props.widgetConfiguration.endDate;
+ const userType = this.props.widgetConfiguration.userType || USER_TYPE_MAPPER;
- const selector =
+ const selector = (
+ );
- const chooseUserType =
+ const chooseUserType = (
-
@@ -121,10 +124,11 @@ export default class LeaderboardWidget extends Component {
onChange={_noop}
/>
-
+ );
return (
- )
+ );
}
}
-registerWidgetType(WithLeaderboard(LeaderboardWidget, INITIAL_MONTHS_PAST,
- {ignoreUser: true, filterChallenges: true,
- isWidget: true}), descriptor)
+registerWidgetType(
+ WithLeaderboard(LeaderboardWidget, INITIAL_MONTHS_PAST, {
+ ignoreUser: true,
+ filterChallenges: true,
+ isWidget: true,
+ }),
+ descriptor,
+);
diff --git a/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/Messages.js
index a13e20fb8..5ec3c78ec 100644
--- a/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/LeaderboardWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with LeaderboardWidget
@@ -23,4 +23,4 @@ export default defineMessages({
id: "Widgets.LeaderboardWidget.reviewer",
defaultMessage: "Reviewers",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/Messages.js
index 51360775a..2426b2fdd 100644
--- a/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ProjectAboutWidget
@@ -16,8 +16,7 @@ export default defineMessages({
content: {
id: "Widgets.ProjectAboutWidget.content",
- defaultMessage:
-`Projects serve as a means of grouping related challenges together. All
+ defaultMessage: `Projects serve as a means of grouping related challenges together. All
challenges must belong to a project.
You can create as many projects as needed to organize your challenges, and can
@@ -26,4 +25,4 @@ invite other MapRoulette users to help manage them with you.
Projects must be set to Discoverable before any challenges within them will
show up in public browsing or searching.`,
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/ProjectAboutWidget.jsx b/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/ProjectAboutWidget.jsx
index 5296216cb..02de1cbb6 100644
--- a/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/ProjectAboutWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/ProjectAboutWidget/ProjectAboutWidget.jsx
@@ -1,19 +1,18 @@
-import { Component } from 'react'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import MarkdownContent from '../../../../MarkdownContent/MarkdownContent'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import MarkdownContent from "../../../../MarkdownContent/MarkdownContent";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'ProjectAboutWidget',
+ widgetKey: "ProjectAboutWidget",
label: messages.label,
targets: [WidgetDataTarget.projects, WidgetDataTarget.project],
minWidth: 3,
defaultWidth: 6,
defaultHeight: 7,
-}
+};
export default class ProjectAboutWidget extends Component {
render() {
@@ -25,8 +24,8 @@ export default class ProjectAboutWidget extends Component {
>
- )
+ );
}
}
-registerWidgetType(injectIntl(ProjectAboutWidget), descriptor)
+registerWidgetType(injectIntl(ProjectAboutWidget), descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/ProjectListWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/ProjectListWidget/Messages.js
index 69889d4f6..c22829605 100644
--- a/src/components/AdminPane/Manage/Widgets/ProjectListWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/ProjectListWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ProjectListWidget
@@ -18,4 +18,4 @@ export default defineMessages({
id: "Widgets.ProjectListWidget.search.placeholder",
defaultMessage: "Search",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ProjectListWidget/ProjectListWidget.jsx b/src/components/AdminPane/Manage/Widgets/ProjectListWidget/ProjectListWidget.jsx
index acad0e799..ddc8e188b 100644
--- a/src/components/AdminPane/Manage/Widgets/ProjectListWidget/ProjectListWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/ProjectListWidget/ProjectListWidget.jsx
@@ -1,27 +1,24 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import classNames from 'classnames'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import { searchProjects, fetchManageableProjects } from '../../../../../services/Project/Project'
-import { extendedFind } from '../../../../../services/Challenge/Challenge'
-import WithChallengeResultParents
- from '../../../HOCs/WithChallengeResultParents/WithChallengeResultParents'
-import WithSearchResults
- from '../../../../HOCs/WithSearchResults/WithSearchResults'
-import WithComboSearch from '../../../HOCs/WithComboSearch/WithComboSearch'
-import WithSearch from '../../../../HOCs/WithSearch/WithSearch'
-import WithPagedProjects from '../../../../HOCs/WithPagedProjects/WithPagedProjects'
-import SearchBox from '../../../../SearchBox/SearchBox'
-import SvgSymbol from '../../../../SvgSymbol/SvgSymbol'
-import ProjectList from '../../ProjectList/ProjectList'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import MenuControl from '../../../../QuickWidget/MenuControl'
-import messages from './Messages'
+import classNames from "classnames";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import { extendedFind } from "../../../../../services/Challenge/Challenge";
+import { fetchManageableProjects, searchProjects } from "../../../../../services/Project/Project";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import WithPagedProjects from "../../../../HOCs/WithPagedProjects/WithPagedProjects";
+import WithSearch from "../../../../HOCs/WithSearch/WithSearch";
+import WithSearchResults from "../../../../HOCs/WithSearchResults/WithSearchResults";
+import MenuControl from "../../../../QuickWidget/MenuControl";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import SearchBox from "../../../../SearchBox/SearchBox";
+import SvgSymbol from "../../../../SvgSymbol/SvgSymbol";
+import WithChallengeResultParents from "../../../HOCs/WithChallengeResultParents/WithChallengeResultParents";
+import WithComboSearch from "../../../HOCs/WithComboSearch/WithComboSearch";
+import ProjectList from "../../ProjectList/ProjectList";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'ProjectListWidget',
+ widgetKey: "ProjectListWidget",
label: messages.label,
targets: [WidgetDataTarget.projects],
defaultWidth: 12,
@@ -29,41 +26,49 @@ const descriptor = {
defaultHeight: 15,
minHeight: 11,
defaultConfiguration: {
- view: 'card',
- sortBy: ['name'],
- }
-}
+ view: "card",
+ sortBy: ["name"],
+ },
+};
// Setup child components with needed HOCs.
const ProjectAndChallengeSearch = WithComboSearch(SearchBox, {
- 'adminProjects': queryCriteria => {
- // If no query is present then we don't need to search
- if (!queryCriteria.query) {
- return null
- }
- return searchProjects({searchQuery: queryCriteria.query,
- page: queryCriteria?.page?.currentPage,
- onlyEnabled: false},
- queryCriteria?.page?.resultsPerPage);
- },
- 'adminChallenges': queryCriteria => {
- // If no query is present then we don't need to search
- if (!queryCriteria.query) {
- return null
- }
- return extendedFind({searchQuery: queryCriteria.query,
- page: queryCriteria?.page?.currentPage,
- onlyEnabled: false},
- queryCriteria?.page?.resultsPerPage);
- },
-})
+ adminProjects: (queryCriteria) => {
+ // If no query is present then we don't need to search
+ if (!queryCriteria.query) {
+ return null;
+ }
+ return searchProjects(
+ {
+ searchQuery: queryCriteria.query,
+ page: queryCriteria?.page?.currentPage,
+ onlyEnabled: false,
+ },
+ queryCriteria?.page?.resultsPerPage,
+ );
+ },
+ adminChallenges: (queryCriteria) => {
+ // If no query is present then we don't need to search
+ if (!queryCriteria.query) {
+ return null;
+ }
+ return extendedFind(
+ {
+ searchQuery: queryCriteria.query,
+ page: queryCriteria?.page?.currentPage,
+ onlyEnabled: false,
+ },
+ queryCriteria?.page?.resultsPerPage,
+ );
+ },
+});
export default class ProjectListWidget extends Component {
- setView = view => {
+ setView = (view) => {
if (this.props.widgetConfiguration.view !== view) {
- this.props.updateWidgetConfiguration({view})
+ this.props.updateWidgetConfiguration({ view });
}
- }
+ };
viewControl = (view, icon) => (
this.setView(view)}>
@@ -72,11 +77,11 @@ export default class ProjectListWidget extends Component {
viewBox="0 0 20 20"
className={classNames(
"mr-h-4 mr-w-4 mr-ml-4",
- this.props.widgetConfiguration.view === view ? "mr-fill-white" : "mr-fill-white-50"
+ this.props.widgetConfiguration.view === view ? "mr-fill-white" : "mr-fill-white-50",
)}
/>
- )
+ );
render() {
const viewControls = (
@@ -87,13 +92,14 @@ export default class ProjectListWidget extends Component {
{this.viewControl("list")}
@@ -139,93 +131,93 @@ export default class ProjectManagersWidget extends Component {
{this.props.intl.formatMessage(messagesByRole[Role.admin])}
,
- ]
+ ];
- const adminManagers =
- _filter(this.props.project.managers.concat(this.props.project.teamManagers),
- manager => mostPrivilegedRole(manager.roles) === Role.admin)
+ const adminManagers = _filter(
+ this.props.project.managers.concat(this.props.project.teamManagers),
+ (manager) => mostPrivilegedRole(manager.roles) === Role.admin,
+ );
let managers = _map(
this.props.project.managers.concat(this.props.project.teamManagers),
- manager => {
- const isTeam = _isFinite(manager.groupType)
- const managerRole = mostPrivilegedRole(manager.roles)
- const isLastAdmin = managerRole === Role.admin && adminManagers.length < 2
+ (manager) => {
+ const isTeam = _isFinite(manager.groupType);
+ const managerRole = mostPrivilegedRole(manager.roles);
+ const isLastAdmin = managerRole === Role.admin && adminManagers.length < 2;
// Add remove-manager option to dropdown if appropriate
const dropdownOptions =
- user.canAdministrateProject(this.props.project) && !isLastAdmin ?
- roleOptions.concat([
-
- {this.props.intl.formatMessage(messages.removeManagerLabel)}
-
- ]) :
- roleOptions
+ user.canAdministrateProject(this.props.project) && !isLastAdmin
+ ? roleOptions.concat([
+
+ {this.props.intl.formatMessage(messages.removeManagerLabel)}
+ ,
+ ])
+ : roleOptions;
return (
- {isTeam ?
-
-
-
-
-
-
- {manager.name}
-
- :
-
-
-
-
-
-
-
- }
+ {isTeam ? (
+
+
+
+
+
+ {manager.name}
+
+ ) : (
+
+
+
+
+
+
+
+ )}
- {this.state.updatingManagers.indexOf(isTeam ? manager.id : manager.osmId) !== -1 ?
-
- {isLastAdmin || !user.canAdministrateProject(this.props.project) ?
- this.updateManagerRole(manager, e.target.value)}
- className="mr-select mr-py-1"
- >
- {dropdownOptions}
-
- }
-
- }
+ {this.state.updatingManagers.indexOf(isTeam ? manager.id : manager.osmId) !== -1 ? (
+
+ {isLastAdmin || !user.canAdministrateProject(this.props.project) ? (
+ this.updateManagerRole(manager, e.target.value)}
+ className="mr-select mr-py-1"
+ >
+ {dropdownOptions}
+
+ )}
+
+ )}
- )
+ );
}
const widgetIntro = user.canAdministrateProject(this.props.project) && (
@@ -236,66 +228,74 @@ export default class ProjectManagersWidget extends Component {
- {this.state.choosingTeam ?
- this.setState({
- addManagerName: username
- })}
- onChange={osmUser => this.setState({
- addManagerObject: osmUser
- })}
- placeholder={this.props.intl.formatMessage(messages.teamNamePlaceholder)}
- fixedMenu
- /> :
- this.setState({
- addManagerName: username
- })}
- onChange={osmUser => this.setState({
- addManagerObject: osmUser
- })}
- placeholder={this.props.intl.formatMessage(messages.osmUsernamePlaceholder)}
- fixedMenu
- />
- }
+ {this.state.choosingTeam ? (
+
+ this.setState({
+ addManagerName: username,
+ })
+ }
+ onChange={(osmUser) =>
+ this.setState({
+ addManagerObject: osmUser,
+ })
+ }
+ placeholder={this.props.intl.formatMessage(messages.teamNamePlaceholder)}
+ fixedMenu
+ />
+ ) : (
+
+ this.setState({
+ addManagerName: username,
+ })
+ }
+ onChange={(osmUser) =>
+ this.setState({
+ addManagerObject: osmUser,
+ })
+ }
+ placeholder={this.props.intl.formatMessage(messages.osmUsernamePlaceholder)}
+ fixedMenu
+ />
+ )}
- {!this.state.addingManager && !this.state.addManagerObject &&
-
this.switchManagerType(e.target.value)}
- >
-
- {this.props.intl.formatMessage(messages.userOption)}
-
-
- {this.props.intl.formatMessage(messages.teamOption)}
-
-
- }
+ {!this.state.addingManager && !this.state.addManagerObject && (
+
this.switchManagerType(e.target.value)}
+ >
+
+ {this.props.intl.formatMessage(messages.userOption)}
+
+
+ {this.props.intl.formatMessage(messages.teamOption)}
+
+
+ )}
{this.state.addingManager &&
}
- {!this.state.addingManager && this.state.addManagerObject &&
-
this.addManager(e.target.value)}
- className="mr-flex-grow-0 mr-min-w-30 mr-select"
- >
- {[
-
- {this.props.intl.formatMessage(messages.chooseRole)}
-
- ].concat(roleOptions)}
-
- }
+ {!this.state.addingManager && this.state.addManagerObject && (
+
this.addManager(e.target.value)}
+ className="mr-flex-grow-0 mr-min-w-30 mr-select"
+ >
+ {[
+
+ {this.props.intl.formatMessage(messages.chooseRole)}
+ ,
+ ].concat(roleOptions)}
+
+ )}
- )
-
+ );
return (
- )
+ );
}
}
-registerWidgetType(ProjectManagersWidget, descriptor)
+registerWidgetType(ProjectManagersWidget, descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/Messages.js
index ea2f1133c..332d9c562 100644
--- a/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ProjectOverviewWidget
@@ -13,4 +13,4 @@ export default defineMessages({
id: "Widgets.ProjectOverviewWidget.title",
defaultMessage: "Overview",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/ProjectOverviewWidget.jsx b/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/ProjectOverviewWidget.jsx
index bc1845810..137f378fb 100644
--- a/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/ProjectOverviewWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/ProjectOverviewWidget/ProjectOverviewWidget.jsx
@@ -1,19 +1,18 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import ProjectOverview from '../../ProjectOverview/ProjectOverview'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import ProjectOverview from "../../ProjectOverview/ProjectOverview";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'ProjectOverviewWidget',
+ widgetKey: "ProjectOverviewWidget",
label: messages.label,
targets: [WidgetDataTarget.project],
minWidth: 3,
defaultWidth: 4,
defaultHeight: 7,
-}
+};
export default class ProjectOverviewWidget extends Component {
render() {
@@ -25,8 +24,8 @@ export default class ProjectOverviewWidget extends Component {
>
- )
+ );
}
}
-registerWidgetType(ProjectOverviewWidget, descriptor)
+registerWidgetType(ProjectOverviewWidget, descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/Messages.js
index dbf24781a..28573db2f 100644
--- a/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with RecentActivityWidget
@@ -13,4 +13,4 @@ export default defineMessages({
id: "Widgets.RecentActivityWidget.title",
defaultMessage: "Recent Activity",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/RecentActivityWidget.jsx b/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/RecentActivityWidget.jsx
index ee050803e..0ff70bc66 100644
--- a/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/RecentActivityWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/RecentActivityWidget/RecentActivityWidget.jsx
@@ -1,34 +1,36 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import _takeRight from 'lodash/takeRight'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import ChallengeActivityTimeline
- from '../../../../ActivityTimeline/ChallengeActivityTimeline/ChallengeActivityTimeline'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import messages from './Messages'
+import _takeRight from "lodash/takeRight";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import ChallengeActivityTimeline from "../../../../ActivityTimeline/ChallengeActivityTimeline/ChallengeActivityTimeline";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'RecentActivityWidget',
+ widgetKey: "RecentActivityWidget",
label: messages.label,
targets: [WidgetDataTarget.challenge],
minWidth: 3,
defaultWidth: 4,
defaultHeight: 14,
-}
+};
export default class RecentActivityWidget extends Component {
render() {
return (
-
}>
-
+
}
+ >
+
);
}
}
-registerWidgetType(RecentActivityWidget, descriptor)
+registerWidgetType(RecentActivityWidget, descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/Messages.js
index 31b81501a..1ed9c67da 100644
--- a/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with StatusRadarWidget
@@ -18,4 +18,4 @@ export default defineMessages({
id: "Widgets.StatusRadarWidget.controls.loadStats.label",
defaultMessage: "Load Completion Stats",
},
-})
+});
diff --git a/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/StatusRadarWidget.jsx b/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/StatusRadarWidget.jsx
index c77298bc8..ebe698243 100644
--- a/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/StatusRadarWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/StatusRadarWidget/StatusRadarWidget.jsx
@@ -1,36 +1,37 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import CompletionRadar from '../../CompletionRadar/CompletionRadar'
-import BusySpinner from '../../../../BusySpinner/BusySpinner'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import WithChallengeMetrics
- from '../../../HOCs/WithChallengeMetrics/WithChallengeMetrics'
-import messages from './Messages'
-import './StatusRadarWidget.scss'
-import { PROJECT_CHALLENGE_LIMIT } from '../../../../../services/Project/Project'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import BusySpinner from "../../../../BusySpinner/BusySpinner";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import WithChallengeMetrics from "../../../HOCs/WithChallengeMetrics/WithChallengeMetrics";
+import CompletionRadar from "../../CompletionRadar/CompletionRadar";
+import messages from "./Messages";
+import "./StatusRadarWidget.scss";
+import { PROJECT_CHALLENGE_LIMIT } from "../../../../../services/Project/Project";
const descriptor = {
- widgetKey: 'StatusRadarWidget',
+ widgetKey: "StatusRadarWidget",
label: messages.label,
targets: [WidgetDataTarget.challenges, WidgetDataTarget.challenge],
minWidth: 3,
defaultWidth: 4,
defaultHeight: 12,
-}
+};
export default class StatusRadarWidget extends Component {
render() {
- let content = null
+ let content = null;
if (this.props.singleProject) {
if (!this.props.project) {
- content =
- }
- else if (this.props.challengeLimitExceeded) {
- content =
Sorry, project statistics are not available for projects with more than {PROJECT_CHALLENGE_LIMIT} challenges.
- }
- else if (!this.props.challengeStatsAvailable) {
+ content =
;
+ } else if (this.props.challengeLimitExceeded) {
+ content = (
+
+ Sorry, project statistics are not available for projects with more than{" "}
+ {PROJECT_CHALLENGE_LIMIT} challenges.
+
+ );
+ } else if (!this.props.challengeStatsAvailable) {
content = (
- )
- }
- else if (this.props.loadingChallengeStats) {
- content =
+ );
+ } else if (this.props.loadingChallengeStats) {
+ content =
;
}
}
if (!content) {
- content =
+ content =
;
}
return (
@@ -59,8 +59,8 @@ export default class StatusRadarWidget extends Component {
>
{content}
- )
+ );
}
}
-registerWidgetType(WithChallengeMetrics(StatusRadarWidget), descriptor)
+registerWidgetType(WithChallengeMetrics(StatusRadarWidget), descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/Messages.js b/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/Messages.js
index b6a47a595..984854d68 100644
--- a/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/Messages.js
+++ b/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with TagMetricsWidget
@@ -11,5 +11,5 @@ export default defineMessages({
title: {
id: "Widgets.TagMetricsWidget.title",
defaultMessage: "Tag Metrics",
- }
-})
+ },
+});
diff --git a/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/TagMetricsWidget.jsx b/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/TagMetricsWidget.jsx
index a0955b185..9f8fc9959 100644
--- a/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/TagMetricsWidget.jsx
+++ b/src/components/AdminPane/Manage/Widgets/TagMetricsWidget/TagMetricsWidget.jsx
@@ -1,22 +1,20 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import { WidgetDataTarget, registerWidgetType }
- from '../../../../../services/Widget/Widget'
-import TagMetrics from '../../../../TagMetrics/TagMetrics'
-import QuickWidget from '../../../../QuickWidget/QuickWidget'
-import WithChallengeTagMetrics
- from '../../../HOCs/WithChallengeTagMetrics/WithChallengeTagMetrics'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { WidgetDataTarget, registerWidgetType } from "../../../../../services/Widget/Widget";
+import QuickWidget from "../../../../QuickWidget/QuickWidget";
+import TagMetrics from "../../../../TagMetrics/TagMetrics";
+import WithChallengeTagMetrics from "../../../HOCs/WithChallengeTagMetrics/WithChallengeTagMetrics";
+import messages from "./Messages";
const descriptor = {
- widgetKey: 'TagMetricsWidget',
+ widgetKey: "TagMetricsWidget",
label: messages.label,
targets: [WidgetDataTarget.challenge],
minWidth: 2,
defaultWidth: 4,
minHeight: 4,
- defaultHeight: 6
-}
+ defaultHeight: 6,
+};
export default class TagMetricsWidget extends Component {
render() {
@@ -24,15 +22,13 @@ export default class TagMetricsWidget extends Component {
- }
+ widgetTitle={
}
noMain
>
- )
+ );
}
}
-registerWidgetType(WithChallengeTagMetrics(TagMetricsWidget), descriptor)
+registerWidgetType(WithChallengeTagMetrics(TagMetricsWidget), descriptor);
diff --git a/src/components/AdminPane/Manage/Widgets/widget_registry.js b/src/components/AdminPane/Manage/Widgets/widget_registry.js
index 3a9e7343e..579ca7017 100644
--- a/src/components/AdminPane/Manage/Widgets/widget_registry.js
+++ b/src/components/AdminPane/Manage/Widgets/widget_registry.js
@@ -5,21 +5,20 @@
*/
// Import first-party widgets shipped with MapRoulette
-export { default as ProjectAboutWidget } from './ProjectAboutWidget/ProjectAboutWidget'
-export { default as ProjectListWidget } from './ProjectListWidget/ProjectListWidget'
-export { default as ProjectOverviewWidget } from './ProjectOverviewWidget/ProjectOverviewWidget'
-export { default as ProjectManagersWidget } from './ProjectManagersWidget/ProjectManagersWidget'
-export { default as ChallengeOverviewWidget } from './ChallengeOverviewWidget/ChallengeOverviewWidget'
-export { default as ChallengeTasksWidget } from './ChallengeTasksWidget/ChallengeTasksWidget'
-export { default as ChallengeListWidget } from './ChallengeListWidget/ChallengeListWidget'
-export { default as CommentsWidget } from './CommentsWidget/CommentsWidget'
-export { default as BurndownChartWidget } from './BurndownChartWidget/BurndownChartWidget'
-export { default as CalendarHeatmapWidget } from './CalendarHeatmapWidget/CalendarHeatmapWidget'
-export { default as LeaderboardWidget } from './LeaderboardWidget/LeaderboardWidget'
-export { default as RecentActivityWidget } from './RecentActivityWidget/RecentActivityWidget'
-export { default as StatusRadarWidget } from './StatusRadarWidget/StatusRadarWidget'
-export { default as TagMetricsWidget } from './TagMetricsWidget/TagMetricsWidget'
-
+export { default as ProjectAboutWidget } from "./ProjectAboutWidget/ProjectAboutWidget";
+export { default as ProjectListWidget } from "./ProjectListWidget/ProjectListWidget";
+export { default as ProjectOverviewWidget } from "./ProjectOverviewWidget/ProjectOverviewWidget";
+export { default as ProjectManagersWidget } from "./ProjectManagersWidget/ProjectManagersWidget";
+export { default as ChallengeOverviewWidget } from "./ChallengeOverviewWidget/ChallengeOverviewWidget";
+export { default as ChallengeTasksWidget } from "./ChallengeTasksWidget/ChallengeTasksWidget";
+export { default as ChallengeListWidget } from "./ChallengeListWidget/ChallengeListWidget";
+export { default as CommentsWidget } from "./CommentsWidget/CommentsWidget";
+export { default as BurndownChartWidget } from "./BurndownChartWidget/BurndownChartWidget";
+export { default as CalendarHeatmapWidget } from "./CalendarHeatmapWidget/CalendarHeatmapWidget";
+export { default as LeaderboardWidget } from "./LeaderboardWidget/LeaderboardWidget";
+export { default as RecentActivityWidget } from "./RecentActivityWidget/RecentActivityWidget";
+export { default as StatusRadarWidget } from "./StatusRadarWidget/StatusRadarWidget";
+export { default as TagMetricsWidget } from "./TagMetricsWidget/TagMetricsWidget";
// Import (optional) contributed widgets specific to local installation.
//
@@ -27,24 +26,22 @@ export { default as TagMetricsWidget } from './TagMetricsWidget/TagMetricsWidget
// error if no 3rd-party widgets are present and we can still .gitignore the
// `contrib/` directory so they don't accidentally get committed if they are
// present.
-const contribFolder = './contrib'
-let moduleId = null
+const contribFolder = "./contrib";
+let moduleId = null;
// First see if we can locate a contrib/widget_registry.js module. If not,
// there's nothing more to do.
try {
- moduleId = require.resolve(`${contribFolder}/widget_registry.js`)
-}
-catch(e) {}
+ moduleId = require.resolve(`${contribFolder}/widget_registry.js`);
+} catch (e) {}
if (moduleId) {
- console.log("3rd-party widgets found. Loading.")
+ console.log("3rd-party widgets found. Loading.");
try {
- require(`${contribFolder}/widget_registry.js`)
- }
- catch(e) {
- console.log("Failed to load 3rd-party widgets:")
- console.log(e)
+ require(`${contribFolder}/widget_registry.js`);
+ } catch (e) {
+ console.log("Failed to load 3rd-party widgets:");
+ console.log(e);
}
}
diff --git a/src/components/AreaSelect/AreaSelect.js b/src/components/AreaSelect/AreaSelect.js
index 507625e58..3fc116ebc 100644
--- a/src/components/AreaSelect/AreaSelect.js
+++ b/src/components/AreaSelect/AreaSelect.js
@@ -1,7 +1,7 @@
-import L from 'leaflet'
-import './leaflet-areaselect'
-import { injectIntl } from 'react-intl'
-import { createControlComponent } from '@react-leaflet/core'
+import L from "leaflet";
+import "./leaflet-areaselect";
+import { createControlComponent } from "@react-leaflet/core";
+import { injectIntl } from "react-intl";
/**
* Leaflet AreaSelect that allows selection of a bounding box.
@@ -11,25 +11,25 @@ import { createControlComponent } from '@react-leaflet/core'
* Code provided by: https://github.com/heyman/leaflet-areaselect/
*/
const AreaSelectLeaflet = L.Control.extend({
- onAdd: function(map) {
- const areaSelect = this.options.bounds ?
- L.areaSelect({bounds: this.options.bounds}) :
- L.areaSelect({height: 300, width: 200})
- areaSelect.addTo(map)
+ onAdd: function (map) {
+ const areaSelect = this.options.bounds
+ ? L.areaSelect({ bounds: this.options.bounds })
+ : L.areaSelect({ height: 300, width: 200 });
+ areaSelect.addTo(map);
// Send a callback when the bounds change
areaSelect.on("change", () => {
- this.options.onBoundsChanged(areaSelect.getBounds())
- })
-
- return L.DomUtil.create('div')
- }})
+ this.options.onBoundsChanged(areaSelect.getBounds());
+ });
+ return L.DomUtil.create("div");
+ },
+});
/**
* AreaSelect is a react-leaflet component intended to be
* used as a child of a react-leaflet MapContainer instance.
*/
-export const AreaSelect = createControlComponent((props) => new AreaSelectLeaflet(props))
+export const AreaSelect = createControlComponent((props) => new AreaSelectLeaflet(props));
-export default injectIntl(AreaSelect)
+export default injectIntl(AreaSelect);
diff --git a/src/components/AreaSelect/leaflet-areaselect.js b/src/components/AreaSelect/leaflet-areaselect.js
index 3008b3e05..eeaa22ea3 100644
--- a/src/components/AreaSelect/leaflet-areaselect.js
+++ b/src/components/AreaSelect/leaflet-areaselect.js
@@ -1,229 +1,255 @@
-import L from 'leaflet'
+import L from "leaflet";
L.AreaSelect = L.Class.extend({
- includes: L.Evented.prototype,
-
- options: {
- width: 200,
- height: 300,
- keepAspectRatio: false,
- },
-
- determineWidthHeight: function() {
- if (this._bounds) {
- const northEast = this.map.latLngToLayerPoint(this.options.bounds.getNorthEast())
- const southWest = this.map.latLngToLayerPoint(this.options.bounds.getSouthWest())
-
- this._width = northEast.x - southWest.x
- this._height = northEast.y - southWest.y
- this._bounds = null
- }
- },
-
- getWidth: function() {
- if (this._bounds) {
- this.determineWidthHeight()
- }
-
- return this._width
- },
-
- getHeight: function() {
- if (this._bounds) {
- this.determineWidthHeight()
- }
-
- return this._height
- },
+ includes: L.Evented.prototype,
+
+ options: {
+ width: 200,
+ height: 300,
+ keepAspectRatio: false,
+ },
+
+ determineWidthHeight: function () {
+ if (this._bounds) {
+ const northEast = this.map.latLngToLayerPoint(this.options.bounds.getNorthEast());
+ const southWest = this.map.latLngToLayerPoint(this.options.bounds.getSouthWest());
+
+ this._width = northEast.x - southWest.x;
+ this._height = northEast.y - southWest.y;
+ this._bounds = null;
+ }
+ },
- initialize: function(options) {
- L.Util.setOptions(this, options);
+ getWidth: function () {
+ if (this._bounds) {
+ this.determineWidthHeight();
+ }
- this._width = this.options.width;
- this._height = this.options.height;
- this._bounds = this.options.bounds;
- },
+ return this._width;
+ },
- addTo: function(map) {
- this.map = map;
- this._createElements();
- this._render();
- return this;
- },
+ getHeight: function () {
+ if (this._bounds) {
+ this.determineWidthHeight();
+ }
- getBounds: function() {
- var size = this.map.getSize();
- var topRight = new L.Point();
- var bottomLeft = new L.Point();
-
- bottomLeft.x = Math.round((size.x - this.getWidth()) / 2);
- topRight.y = Math.round((size.y - this.getHeight()) / 2);
- topRight.x = size.x - bottomLeft.x;
- bottomLeft.y = size.y - topRight.y;
-
- var sw = this.map.containerPointToLatLng(bottomLeft);
- var ne = this.map.containerPointToLatLng(topRight);
-
- return new L.LatLngBounds(sw, ne);
- },
-
- getBBoxCoordinates: function() {
- var size = this.map.getSize();
-
- var topRight = new L.Point();
- var bottomLeft = new L.Point();
- var topLeft = new L.Point();
- var bottomRight = new L.Point();
-
- bottomLeft.x = Math.round((size.x - this.getWidth()) / 2);
- topRight.y = Math.round((size.y - this.getHeight()) / 2);
- topRight.x = size.x - bottomLeft.x;
- bottomLeft.y = size.y - topRight.y;
-
- topLeft.x = bottomLeft.x;
- topLeft.y = topRight.y;
- bottomRight.x = topRight.x;
- bottomRight.y = bottomLeft.y;
-
- var coordinates =
- [
- {"sw": this.map.containerPointToLatLng(bottomLeft)},
- {"nw": this.map.containerPointToLatLng(topLeft)},
- {"ne": this.map.containerPointToLatLng(topRight)},
- {"se": this.map.containerPointToLatLng(bottomRight)}
- ]
-
- return coordinates
- },
-
- remove: function() {
- this.map.off("moveend", this._onMapChange);
- this.map.off("zoomend", this._onMapChange);
- this.map.off("resize", this._onMapResize);
-
- this._container.parentNode.removeChild(this._container);
- },
-
-
- setDimensions: function(dimensions) {
- if (!dimensions)
- return;
-
- this._height = parseInt(dimensions.height) || this.getHeight();
- this._width = parseInt(dimensions.width) || this.getWidth();
- this._render();
- this.fire("change");
- },
-
-
- _createElements: function() {
- if (!!this._container)
- return;
-
- this._container = L.DomUtil.create("div", "leaflet-areaselect-container", this.map._controlContainer)
-
- this._nwHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
- this._swHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
- this._neHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
- this._seHandle = L.DomUtil.create("div", "leaflet-areaselect-handle leaflet-control", this._container);
-
- this._setUpHandlerEvents(this._nwHandle);
- this._setUpHandlerEvents(this._neHandle, -1, 1);
- this._setUpHandlerEvents(this._swHandle, 1, -1);
- this._setUpHandlerEvents(this._seHandle, -1, -1);
-
- this.map.on("moveend", this._onMapChange, this);
- this.map.on("zoomend", this._onMapChange, this);
- this.map.on("resize", this._onMapResize, this);
-
- this._rectangle = L.rectangle(this.getBounds(), {color:"blue"}).addTo(this.map)
-
- this.fire("change");
- },
-
- _setUpHandlerEvents: function(handle, xMod, yMod) {
- xMod = xMod || 1;
- yMod = yMod || 1;
-
- var self = this;
- function onMouseDown(event) {
- event.stopPropagation();
- self.map.dragging.disable();
- L.DomEvent.removeListener(this, "mousedown", onMouseDown);
- var curX = event.pageX;
- var curY = event.pageY;
- var ratio = self.getWidth() / self.getHeight();
- var size = self.map.getSize();
-
- function onMouseMove(event) {
- if (self.options.keepAspectRatio) {
- var maxHeight = (self._height >= self.getWidth() ? size.y : size.y * (1/ratio) ) - 30;
- self._height += (curY - event.originalEvent.pageY) * 2 * yMod;
- self._height = Math.max(30, self.getHeight());
- self._height = Math.min(maxHeight, self.getHeight());
- self._width = self.getHeight() * ratio;
- } else {
- self._width += (curX - event.originalEvent.pageX) * 2 * xMod;
- self._height += (curY - event.originalEvent.pageY) * 2 * yMod;
- self._width = Math.max(30, self.getWidth());
- self._height = Math.max(30, self.getHeight());
- self._width = Math.min(size.x-30, self.getWidth());
- self._height = Math.min(size.y-30, self.getHeight());
-
- }
-
- curX = event.originalEvent.pageX;
- curY = event.originalEvent.pageY;
- self._render();
- }
- function onMouseUp() {
- self.map.dragging.enable();
- L.DomEvent.removeListener(self.map, "mouseup", onMouseUp);
- L.DomEvent.removeListener(self.map, "mousemove", onMouseMove);
- L.DomEvent.addListener(handle, "mousedown", onMouseDown);
- self.fire("change");
- }
-
- L.DomEvent.addListener(self.map, "mousemove", onMouseMove);
- L.DomEvent.addListener(self.map, "mouseup", onMouseUp);
- }
- L.DomEvent.addListener(handle, "mousedown", onMouseDown);
- },
-
- _onMapResize: function() {
- this._render();
- },
-
- _onMapChange: function() {
- this._rectangle.setBounds(this.getBounds())
- this.fire("change");
- },
-
- _render: function() {
- var size = this.map.getSize();
- var handleOffset = Math.round(this._nwHandle.offsetWidth/2);
-
- var topBottomHeight = Math.round((size.y-this.getHeight())/2);
- var leftRightWidth = Math.round((size.x-this.getWidth())/2);
-
- function setDimensions(element, dimension) {
- element.style.width = dimension.width + "px";
- element.style.height = dimension.height + "px";
- element.style.top = dimension.top + "px";
- element.style.left = dimension.left + "px";
- element.style.bottom = dimension.bottom + "px";
- element.style.right = dimension.right + "px";
+ return this._height;
+ },
+
+ initialize: function (options) {
+ L.Util.setOptions(this, options);
+
+ this._width = this.options.width;
+ this._height = this.options.height;
+ this._bounds = this.options.bounds;
+ },
+
+ addTo: function (map) {
+ this.map = map;
+ this._createElements();
+ this._render();
+ return this;
+ },
+
+ getBounds: function () {
+ var size = this.map.getSize();
+ var topRight = new L.Point();
+ var bottomLeft = new L.Point();
+
+ bottomLeft.x = Math.round((size.x - this.getWidth()) / 2);
+ topRight.y = Math.round((size.y - this.getHeight()) / 2);
+ topRight.x = size.x - bottomLeft.x;
+ bottomLeft.y = size.y - topRight.y;
+
+ var sw = this.map.containerPointToLatLng(bottomLeft);
+ var ne = this.map.containerPointToLatLng(topRight);
+
+ return new L.LatLngBounds(sw, ne);
+ },
+
+ getBBoxCoordinates: function () {
+ var size = this.map.getSize();
+
+ var topRight = new L.Point();
+ var bottomLeft = new L.Point();
+ var topLeft = new L.Point();
+ var bottomRight = new L.Point();
+
+ bottomLeft.x = Math.round((size.x - this.getWidth()) / 2);
+ topRight.y = Math.round((size.y - this.getHeight()) / 2);
+ topRight.x = size.x - bottomLeft.x;
+ bottomLeft.y = size.y - topRight.y;
+
+ topLeft.x = bottomLeft.x;
+ topLeft.y = topRight.y;
+ bottomRight.x = topRight.x;
+ bottomRight.y = bottomLeft.y;
+
+ var coordinates = [
+ { sw: this.map.containerPointToLatLng(bottomLeft) },
+ { nw: this.map.containerPointToLatLng(topLeft) },
+ { ne: this.map.containerPointToLatLng(topRight) },
+ { se: this.map.containerPointToLatLng(bottomRight) },
+ ];
+
+ return coordinates;
+ },
+
+ remove: function () {
+ this.map.off("moveend", this._onMapChange);
+ this.map.off("zoomend", this._onMapChange);
+ this.map.off("resize", this._onMapResize);
+
+ this._container.parentNode.removeChild(this._container);
+ },
+
+ setDimensions: function (dimensions) {
+ if (!dimensions) return;
+
+ this._height = parseInt(dimensions.height) || this.getHeight();
+ this._width = parseInt(dimensions.width) || this.getWidth();
+ this._render();
+ this.fire("change");
+ },
+
+ _createElements: function () {
+ if (!!this._container) return;
+
+ this._container = L.DomUtil.create(
+ "div",
+ "leaflet-areaselect-container",
+ this.map._controlContainer,
+ );
+
+ this._nwHandle = L.DomUtil.create(
+ "div",
+ "leaflet-areaselect-handle leaflet-control",
+ this._container,
+ );
+ this._swHandle = L.DomUtil.create(
+ "div",
+ "leaflet-areaselect-handle leaflet-control",
+ this._container,
+ );
+ this._neHandle = L.DomUtil.create(
+ "div",
+ "leaflet-areaselect-handle leaflet-control",
+ this._container,
+ );
+ this._seHandle = L.DomUtil.create(
+ "div",
+ "leaflet-areaselect-handle leaflet-control",
+ this._container,
+ );
+
+ this._setUpHandlerEvents(this._nwHandle);
+ this._setUpHandlerEvents(this._neHandle, -1, 1);
+ this._setUpHandlerEvents(this._swHandle, 1, -1);
+ this._setUpHandlerEvents(this._seHandle, -1, -1);
+
+ this.map.on("moveend", this._onMapChange, this);
+ this.map.on("zoomend", this._onMapChange, this);
+ this.map.on("resize", this._onMapResize, this);
+
+ this._rectangle = L.rectangle(this.getBounds(), { color: "blue" }).addTo(this.map);
+
+ this.fire("change");
+ },
+
+ _setUpHandlerEvents: function (handle, xMod, yMod) {
+ xMod = xMod || 1;
+ yMod = yMod || 1;
+
+ var self = this;
+ function onMouseDown(event) {
+ event.stopPropagation();
+ self.map.dragging.disable();
+ L.DomEvent.removeListener(this, "mousedown", onMouseDown);
+ var curX = event.pageX;
+ var curY = event.pageY;
+ var ratio = self.getWidth() / self.getHeight();
+ var size = self.map.getSize();
+
+ function onMouseMove(event) {
+ if (self.options.keepAspectRatio) {
+ var maxHeight = (self._height >= self.getWidth() ? size.y : size.y * (1 / ratio)) - 30;
+ self._height += (curY - event.originalEvent.pageY) * 2 * yMod;
+ self._height = Math.max(30, self.getHeight());
+ self._height = Math.min(maxHeight, self.getHeight());
+ self._width = self.getHeight() * ratio;
+ } else {
+ self._width += (curX - event.originalEvent.pageX) * 2 * xMod;
+ self._height += (curY - event.originalEvent.pageY) * 2 * yMod;
+ self._width = Math.max(30, self.getWidth());
+ self._height = Math.max(30, self.getHeight());
+ self._width = Math.min(size.x - 30, self.getWidth());
+ self._height = Math.min(size.y - 30, self.getHeight());
}
- setDimensions(this._nwHandle, {left:leftRightWidth-handleOffset, top:topBottomHeight-7});
- setDimensions(this._neHandle, {right:leftRightWidth-handleOffset, top:topBottomHeight-7});
- setDimensions(this._swHandle, {left:leftRightWidth-handleOffset, bottom:topBottomHeight-7});
- setDimensions(this._seHandle, {right:leftRightWidth-handleOffset, bottom:topBottomHeight-7});
+ curX = event.originalEvent.pageX;
+ curY = event.originalEvent.pageY;
+ self._render();
+ }
+ function onMouseUp() {
+ self.map.dragging.enable();
+ L.DomEvent.removeListener(self.map, "mouseup", onMouseUp);
+ L.DomEvent.removeListener(self.map, "mousemove", onMouseMove);
+ L.DomEvent.addListener(handle, "mousedown", onMouseDown);
+ self.fire("change");
+ }
- this._rectangle.setBounds(this.getBounds())
+ L.DomEvent.addListener(self.map, "mousemove", onMouseMove);
+ L.DomEvent.addListener(self.map, "mouseup", onMouseUp);
}
+ L.DomEvent.addListener(handle, "mousedown", onMouseDown);
+ },
+
+ _onMapResize: function () {
+ this._render();
+ },
+
+ _onMapChange: function () {
+ this._rectangle.setBounds(this.getBounds());
+ this.fire("change");
+ },
+
+ _render: function () {
+ var size = this.map.getSize();
+ var handleOffset = Math.round(this._nwHandle.offsetWidth / 2);
+
+ var topBottomHeight = Math.round((size.y - this.getHeight()) / 2);
+ var leftRightWidth = Math.round((size.x - this.getWidth()) / 2);
+
+ function setDimensions(element, dimension) {
+ element.style.width = dimension.width + "px";
+ element.style.height = dimension.height + "px";
+ element.style.top = dimension.top + "px";
+ element.style.left = dimension.left + "px";
+ element.style.bottom = dimension.bottom + "px";
+ element.style.right = dimension.right + "px";
+ }
+
+ setDimensions(this._nwHandle, {
+ left: leftRightWidth - handleOffset,
+ top: topBottomHeight - 7,
+ });
+ setDimensions(this._neHandle, {
+ right: leftRightWidth - handleOffset,
+ top: topBottomHeight - 7,
+ });
+ setDimensions(this._swHandle, {
+ left: leftRightWidth - handleOffset,
+ bottom: topBottomHeight - 7,
+ });
+ setDimensions(this._seHandle, {
+ right: leftRightWidth - handleOffset,
+ bottom: topBottomHeight - 7,
+ });
+
+ this._rectangle.setBounds(this.getBounds());
+ },
});
-L.areaSelect = function(options) {
- return new L.AreaSelect(options);
-}
+L.areaSelect = function (options) {
+ return new L.AreaSelect(options);
+};
diff --git a/src/components/AutosuggestTextBox/AutosuggestMentionTextArea.jsx b/src/components/AutosuggestTextBox/AutosuggestMentionTextArea.jsx
index 98b0f330b..4963bc6e0 100644
--- a/src/components/AutosuggestTextBox/AutosuggestMentionTextArea.jsx
+++ b/src/components/AutosuggestTextBox/AutosuggestMentionTextArea.jsx
@@ -1,17 +1,17 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import classNames from 'classnames'
-import Downshift from 'downshift'
-import _map from 'lodash/map'
-import _isEmpty from 'lodash/isEmpty'
-import _differenceBy from 'lodash/differenceBy'
-import _noop from 'lodash/noop'
-import _omit from 'lodash/omit'
-import _concat from 'lodash/concat'
-import Dropdown from '../Dropdown/Dropdown'
-import BusySpinner from '../BusySpinner/BusySpinner'
-import messages from './Messages'
+import classNames from "classnames";
+import Downshift from "downshift";
+import _concat from "lodash/concat";
+import _differenceBy from "lodash/differenceBy";
+import _isEmpty from "lodash/isEmpty";
+import _map from "lodash/map";
+import _noop from "lodash/noop";
+import _omit from "lodash/omit";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import BusySpinner from "../BusySpinner/BusySpinner";
+import Dropdown from "../Dropdown/Dropdown";
+import messages from "./Messages";
/**
* AutosuggestMentionTextArea combines a text area with a dropdown, executing a search
@@ -23,19 +23,17 @@ export default class AutosuggestMentionTextArea extends Component {
state = {
textBoxActive: false,
showSuggestions: false,
- highlightResult: -1
- }
+ highlightResult: -1,
+ };
inputChanged = (inputText, downshift) => {
if (!this.props.disableShowSuggestions) {
- const searchOn = this.findMatch(inputText,
- this.props.inputRef?.current?.selectionStart)
+ const searchOn = this.findMatch(inputText, this.props.inputRef?.current?.selectionStart);
if (searchOn !== undefined && searchOn !== null) {
- this.props.search(searchOn)
- this.setState({showSuggestions: true})
- }
- else if (this.state.showSuggestions) {
- this.setState({showSuggestions: false})
+ this.props.search(searchOn);
+ this.setState({ showSuggestions: true });
+ } else if (this.state.showSuggestions) {
+ this.setState({ showSuggestions: false });
}
}
@@ -43,11 +41,10 @@ export default class AutosuggestMentionTextArea extends Component {
// selected and also when our textarea goes out of focus it is
// called with "". We need to make sure we don't register those
// changes thereby messing up our textarea value.
- if (this.props.onInputValueChange && !downshift.selectedItem &&
- this.state.textBoxActive) {
- this.props.onInputValueChange(inputText)
+ if (this.props.onInputValueChange && !downshift.selectedItem && this.state.textBoxActive) {
+ this.props.onInputValueChange(inputText);
}
- }
+ };
onChange = (item, downshift) => {
// Downshift does not automatically clear the selected menu item when it's
@@ -56,85 +53,86 @@ export default class AutosuggestMentionTextArea extends Component {
// Note that this clearing will result in another call to onChange with a
// null item
if (item && downshift.selectedItem) {
- downshift.clearSelection()
- const cursor = this.props.inputRef?.current?.selectionStart
- const newValue = this.replaceMatch(this.props.inputValue, item.displayName, cursor)
- this.props.onInputValueChange(newValue)
+ downshift.clearSelection();
+ const cursor = this.props.inputRef?.current?.selectionStart;
+ const newValue = this.replaceMatch(this.props.inputValue, item.displayName, cursor);
+ this.props.onInputValueChange(newValue);
}
- }
+ };
handleKeyDown = (e, dropdown, downshift) => {
// Ignore if modifier keys were pressed
if (e.metaKey || e.altKey || e.ctrlKey) {
- return
+ return;
}
-
+
if (dropdown.isDropdownVisible) {
- if (e.key === "ArrowUp" ||
- e.key === "ArrowDown" ||
- e.key === "ArrowRight" ||
- e.key === "ArrowLeft" ||
- e.key === "Enter") {
- e.preventDefault()
+ if (
+ e.key === "ArrowUp" ||
+ e.key === "ArrowDown" ||
+ e.key === "ArrowRight" ||
+ e.key === "ArrowLeft" ||
+ e.key === "Enter"
+ ) {
+ e.preventDefault();
}
- const items = _concat(this.props.preferredResults, this.getSearchResults())
- const itemsLength = items?.length ?? 0
+ const items = _concat(this.props.preferredResults, this.getSearchResults());
+ const itemsLength = items?.length ?? 0;
if (e.key === "Enter") {
if (this.state.highlightResult === -1) {
- return
+ return;
}
-
- downshift.selectItem(items[this.state.highlightResult])
- this.setState({highlightResult: -1})
- }
- else if (e.key === "ArrowDown") {
- if (this.state.highlightResult < (itemsLength - 1)) {
- this.setState({highlightResult: (this.state.highlightResult + 1) })
+
+ downshift.selectItem(items[this.state.highlightResult]);
+ this.setState({ highlightResult: -1 });
+ } else if (e.key === "ArrowDown") {
+ if (this.state.highlightResult < itemsLength - 1) {
+ this.setState({ highlightResult: this.state.highlightResult + 1 });
}
- }
- else if (e.key === "ArrowUp" && this.state.highlightResult > -1) {
+ } else if (e.key === "ArrowUp" && this.state.highlightResult > -1) {
if (this.state.highlightResult > 0) {
- this.setState({highlightResult: (this.state.highlightResult - 1) })
+ this.setState({ highlightResult: this.state.highlightResult - 1 });
}
}
}
- }
-
+ };
- regex = searchString => {
- return searchString.match(/^()@([\w]*)$/) || // match "@..."
- searchString.match(/([^[])@([\w]*)$/) || // match "hi @..."
- searchString.match(/(\[)@([^\]]*)$/) // match "[@...]"
- }
+ regex = (searchString) => {
+ return (
+ searchString.match(/^()@([\w]*)$/) || // match "@..."
+ searchString.match(/([^[])@([\w]*)$/) || // match "hi @..."
+ searchString.match(/(\[)@([^\]]*)$/)
+ ); // match "[@...]"
+ };
findMatch = (input, cursorPosition) => {
- const searchString = input.substring(0, cursorPosition)
- const searchMatch = this.regex(searchString)
+ const searchString = input.substring(0, cursorPosition);
+ const searchMatch = this.regex(searchString);
if (searchMatch) {
- return searchMatch[2]
+ return searchMatch[2];
}
- return null
- }
+ return null;
+ };
replaceMatch = (input, selectedValue, cursorPosition) => {
- const searchString = input.substring(0, cursorPosition)
- const searchMatch = this.regex(searchString)
+ const searchString = input.substring(0, cursorPosition);
+ const searchMatch = this.regex(searchString);
if (searchMatch) {
// If we matched a character before our @ that was not a [ we need
// to bump the index to leave it when we replace.
- const index = searchMatch[1] && searchMatch[1] !== "[" ?
- searchMatch.index + 1 : searchMatch.index
+ const index =
+ searchMatch[1] && searchMatch[1] !== "[" ? searchMatch.index + 1 : searchMatch.index;
- return [input.slice(0, index),
- "[@", selectedValue, "]",
- input.slice(cursorPosition)].join('')
+ return [input.slice(0, index), "[@", selectedValue, "]", input.slice(cursorPosition)].join(
+ "",
+ );
}
- }
+ };
/**
* Generates list of dropdown items from search results, or message indicating
@@ -145,7 +143,7 @@ export default class AutosuggestMentionTextArea extends Component {
dropdownItems(getItemProps) {
const generateResult = (result, className = "", index) => {
if (this.state.highlightResult === index) {
- className += this.props.highlightClassName
+ className += this.props.highlightClassName;
}
return (
{this.props.resultLabel(result)}
- )
- }
+ );
+ };
- let items = []
- const searchResults = this.getSearchResults()
- const preferredResults = this.props.preferredResults
+ let items = [];
+ const searchResults = this.getSearchResults();
+ const preferredResults = this.props.preferredResults;
if (!_isEmpty(preferredResults)) {
- let className = "mr-font-medium"
- items = items.concat(_map(preferredResults,
- (result, index) => {
+ let className = "mr-font-medium";
+ items = items.concat(
+ _map(preferredResults, (result, index) => {
// Add a border bottom to the last entry if there are more
// search results.
if (index === preferredResults.length - 1 && searchResults.length > 0) {
- className += " mr-border-b-2 mr-border-white-50 mr-mb-2 mr-pb-2"
+ className += " mr-border-b-2 mr-border-white-50 mr-mb-2 mr-pb-2";
}
- return generateResult(result, className, index)
- }))
+ return generateResult(result, className, index);
+ }),
+ );
}
// Now concat all other search results -- but the index will be offset by the
// preferred results length
- items = items.concat(_map(searchResults,
- (result, index) => generateResult(result, "", index + preferredResults.length)))
- return items
+ items = items.concat(
+ _map(searchResults, (result, index) =>
+ generateResult(result, "", index + preferredResults.length),
+ ),
+ );
+ return items;
}
getSearchResults = () => {
// Filter out any of our original preferredResults so they don't show
// in the list twice.
- return _differenceBy(this.props.searchResults,
- this.props.preferredResults,
- 'displayName')
- }
+ return _differenceBy(this.props.searchResults, this.props.preferredResults, "displayName");
+ };
render() {
return (
result ? this.props.resultLabel(result) : ''}
+ itemToString={(result) => (result ? this.props.resultLabel(result) : "")}
>
- {downshift => {
- const searchOn = this.findMatch(downshift.inputValue,
- this.props.inputRef?.current?.selectionStart)
- const resultItems = (searchOn !== undefined && searchOn !== null) ?
- this.dropdownItems(downshift.getItemProps, searchOn) : null
+ {(downshift) => {
+ const searchOn = this.findMatch(
+ downshift.inputValue,
+ this.props.inputRef?.current?.selectionStart,
+ );
+ const resultItems =
+ searchOn !== undefined && searchOn !== null
+ ? this.dropdownItems(downshift.getItemProps, searchOn)
+ : null;
- const show = this.state.showSuggestions && resultItems
+ const show = this.state.showSuggestions && resultItems;
return (
_noop}
- dropdownButton={dropdown => (
+ dropdownButton={(dropdown) => (
- )
+ );
case DETAIL_TABS.COMMENTS:
return (
-
-
- {startableChallenge && startControl && (
- {startControl}
- )}
+ {startableChallenge && startControl && {startControl} }
{(saveControl || unsaveControl) && (
{saveControl}
@@ -368,32 +343,28 @@ export class ChallengeDetail extends Component {
)}
- {!challenge.isVirtual &&
- (this.props.user?.settings?.isReviewer) && (
-
);
}
- }
+ };
render() {
const { browsedChallenge: challenge, owner } = this.props;
@@ -408,9 +379,7 @@ export class ChallengeDetail extends Component {
let isSaved = false;
if (_isObject(this.props.user) && !challenge.isVirtual) {
- if (
- _findIndex(this.props.user.savedChallenges, { id: challenge.id }) !== -1
- ) {
+ if (_findIndex(this.props.user.savedChallenges, { id: challenge.id }) !== -1) {
isSaved = true;
}
}
@@ -418,32 +387,26 @@ export class ChallengeDetail extends Component {
const dataOriginDateText = !challenge.dataOriginDate
? null
: this.props.intl.formatMessage(messages.dataOriginDateLabel, {
- refreshDate: this.props.intl.formatDate(
- parseISO(challenge.lastTaskRefresh)
- ),
- sourceDate: this.props.intl.formatDate(
- parseISO(challenge.dataOriginDate)
- ),
+ refreshDate: this.props.intl.formatDate(parseISO(challenge.lastTaskRefresh)),
+ sourceDate: this.props.intl.formatDate(parseISO(challenge.dataOriginDate)),
});
- const showMarkerPopup = (markerData) => {
- return (
-
-
- )
- }
+ const showMarkerPopup = (markerData) => {
+ return (
+
+
+ );
+ };
const virtualChallengeMapOverlay =
- this.state.selectedClusters.length > 0 ?
-
- this.setState({ bounds, zoom })
- }
+ updateTaskFilterBounds={(bounds, zoom) => this.setState({ bounds, zoom })}
selectedClusters={this.state.selectedClusters}
onBulkClusterSelection={this.onBulkClusterSelection}
onBulkClusterDeselection={this.onBulkClusterDeselection}
@@ -477,7 +438,7 @@ export class ChallengeDetail extends Component {
- {(this.props.history?.location?.state?.fromSearch) && (
+ {this.props.history?.location?.state?.fromSearch && (
{challenge.name}
- {FLAGGING_ACTIVE && !this.state.flagLoading && !challenge.isVirtual && this.props.user &&
-
-
- {this.state.issue &&
-
-
- }
-
- }
+ {FLAGGING_ACTIVE &&
+ !this.state.flagLoading &&
+ !challenge.isVirtual &&
+ this.props.user && (
+
+
+ {this.state.issue && (
+
+
+ )}
+
+ )}
- {this.state.flagModal &&
+ {this.state.flagModal && (
- }
+ )}
{_isObject(this.props.user) && challenge.enabled && this.state.pickingProject && (
- {" "}
- {_isObject(owner) ?
-
-
- {' '}
-
- {owner.osmProfile.displayName}
-
-
- : null}
+ {_isObject(owner) ? (
+
+
+ {" "}
+
+ {owner.osmProfile.displayName}
+
+
+ ) : null}
Test Passes
-
+ ,
);
const text = getByText("Test Passes");
expect(text).toBeInTheDocument();
});
- it('renders public challenge page when user is not logged in', () => {
+ it("renders public challenge page when user is not logged in", () => {
const { queryByText } = global.withProvider(
{
}}
owner={{ id: 2, osmProfile: { displayName: "Somebody" } }}
intl={{
- formatMessage: () => '',
- formatDate: () => '',
+ formatMessage: () => "",
+ formatDate: () => "",
}}
- />
- )
- const text = queryByText('Sign in to participate')
- expect(text).toBeInTheDocument()
- const cloneText = queryByText('Clone Challenge')
- expect(cloneText).not.toBeInTheDocument()
- })
+ />,
+ );
+ const text = queryByText("Sign in to participate");
+ expect(text).toBeInTheDocument();
+ const cloneText = queryByText("Clone Challenge");
+ expect(cloneText).not.toBeInTheDocument();
+ });
- it('renders clone challenge button for discoverable challenge', () => {
+ it("renders clone challenge button for discoverable challenge", () => {
const { getByText } = global.withProvider(
{
isLoggedIn: true,
id: 1,
}}
- match={{ url: '', params: {} }}
- history={{ location: { pathname: '', search: '' } }}
- location={{ search: '' }}
+ match={{ url: "", params: {} }}
+ history={{ location: { pathname: "", search: "" } }}
+ location={{ search: "" }}
browsedChallenge={{
id: 1,
parent: { id: 2 },
@@ -62,12 +62,12 @@ describe("ChallengeDetail", () => {
}}
owner={{ id: 2, osmProfile: { displayName: "Somebody" } }}
intl={{
- formatMessage: () => '',
- formatDate: () => '',
+ formatMessage: () => "",
+ formatDate: () => "",
}}
- />
- )
- const cloneText = getByText('Clone Challenge')
- expect(cloneText).toBeInTheDocument()
- })
+ />,
+ );
+ const cloneText = getByText("Clone Challenge");
+ expect(cloneText).toBeInTheDocument();
+ });
});
diff --git a/src/components/ChallengeDetail/FlagCommentInput.jsx b/src/components/ChallengeDetail/FlagCommentInput.jsx
index cce2bda82..4598b1e7f 100644
--- a/src/components/ChallengeDetail/FlagCommentInput.jsx
+++ b/src/components/ChallengeDetail/FlagCommentInput.jsx
@@ -1,60 +1,60 @@
-import { Component } from "react";
import classNames from "classnames";
+import { Component } from "react";
import { FormattedMessage, injectIntl } from "react-intl";
-import MarkdownContent from "../MarkdownContent/MarkdownContent";
-import AutosuggestMentionTextArea from "../AutosuggestTextBox/AutosuggestMentionTextArea";
import { postChallengeComment } from "../../services/Challenge/ChallengeComments";
+import AutosuggestMentionTextArea from "../AutosuggestTextBox/AutosuggestMentionTextArea";
+import MarkdownContent from "../MarkdownContent/MarkdownContent";
import messages from "./Messages";
export class FlagCommentInput extends Component {
state = {
showingPreview: false,
characterCount: 0,
- value: '',
+ value: "",
checked: false,
- emailValue: this.props.user.settings.email || '',
- submittingFlag: false
+ emailValue: this.props.user.settings.email || "",
+ submittingFlag: false,
};
handleSubmit = async () => {
- this.setState({ submittingFlag: true })
+ this.setState({ submittingFlag: true });
if (this.state.characterCount < 100) {
- this.props.handleInputError()
+ this.props.handleInputError();
} else if (!this.state.checked) {
- this.props.handleCheckboxError()
+ this.props.handleCheckboxError();
} else {
- const challenge = this.props.challenge
- const owner = window.env.REACT_APP_GITHUB_ISSUES_API_OWNER
- const repo = window.env.REACT_APP_GITHUB_ISSUES_API_REPO
- const body = `Challenge: [#${challenge.id} - ${challenge.name}](${window.env.REACT_APP_URL}/browse/challenges/${challenge.id}) \n\n Reported by: [${this.props.user.osmProfile.displayName}](https://www.openstreetmap.org/user/${encodeURIComponent(this.props.user.osmProfile.displayName)})\n\n${this.state.value}`
+ const challenge = this.props.challenge;
+ const owner = window.env.REACT_APP_GITHUB_ISSUES_API_OWNER;
+ const repo = window.env.REACT_APP_GITHUB_ISSUES_API_REPO;
+ const body = `Challenge: [#${challenge.id} - ${challenge.name}](${window.env.REACT_APP_URL}/browse/challenges/${challenge.id}) \n\n Reported by: [${this.props.user.osmProfile.displayName}](https://www.openstreetmap.org/user/${encodeURIComponent(this.props.user.osmProfile.displayName)})\n\n${this.state.value}`;
const response = await fetch(`https://api.github.com/repos/${owner}/${repo}/issues`, {
- method: 'POST',
+ method: "POST",
body: JSON.stringify({
title: `Reported Challenge #${challenge.id} - ${challenge.name}`,
owner,
repo,
body,
- state: 'open'
+ state: "open",
}),
headers: {
- 'Authorization': `token ${window.env.REACT_APP_GITHUB_ISSUES_API_TOKEN}`,
- 'Content-Type': 'application/json',
- 'Accept': 'application/vnd.github.v3+json',
+ Authorization: `token ${window.env.REACT_APP_GITHUB_ISSUES_API_TOKEN}`,
+ "Content-Type": "application/json",
+ Accept: "application/vnd.github.v3+json",
},
- })
+ });
if (response.ok) {
- const responseBody = await response.json()
- this.props.onModalSubmit(responseBody)
- const issue_link = responseBody.html_url
- const comment = `This challenge, challenge [#${challenge.id} - ${challenge.name}](${window.env.REACT_APP_URL}/browse/challenges/${challenge.id}) in project [#${challenge.parent.id} - ${challenge.parent.displayName}](${window.env.REACT_APP_URL}/browse/projects/${challenge.parent.id}), has been reported by [${this.props.user.osmProfile.displayName}](${window.env.REACT_APP_OSM_SERVER}/user/${encodeURIComponent(this.props.user.osmProfile.displayName)}). Please use [this GitHub issue](${issue_link}) to discuss. \n\n Report Content: \n ${this.state.value}`
- await postChallengeComment(challenge.id, comment)
- this.props.handleViewCommentsSubmit()
+ const responseBody = await response.json();
+ this.props.onModalSubmit(responseBody);
+ const issue_link = responseBody.html_url;
+ const comment = `This challenge, challenge [#${challenge.id} - ${challenge.name}](${window.env.REACT_APP_URL}/browse/challenges/${challenge.id}) in project [#${challenge.parent.id} - ${challenge.parent.displayName}](${window.env.REACT_APP_URL}/browse/projects/${challenge.parent.id}), has been reported by [${this.props.user.osmProfile.displayName}](${window.env.REACT_APP_OSM_SERVER}/user/${encodeURIComponent(this.props.user.osmProfile.displayName)}). Please use [this GitHub issue](${issue_link}) to discuss. \n\n Report Content: \n ${this.state.value}`;
+ await postChallengeComment(challenge.id, comment);
+ this.props.handleViewCommentsSubmit();
}
}
- this.setState({ submittingFlag: false })
+ this.setState({ submittingFlag: false });
};
handleChange = (val) => {
@@ -64,26 +64,32 @@ export class FlagCommentInput extends Component {
};
handleToggle = () => {
- this.setState({ checked: !this.state.checked })
+ this.setState({ checked: !this.state.checked });
};
render() {
- const maxCharacterCount = 1000
- const minCharacterCount = 100
+ const maxCharacterCount = 1000;
+ const minCharacterCount = 100;
return (
-
-
this.setState({ emailValue: event.target.value })} />
+
this.setState({ emailValue: event.target.value })}
+ />
this.setState({ showingPreview: false })}
>
@@ -92,9 +98,7 @@ export class FlagCommentInput extends Component {
this.setState({ showingPreview: true })}
>
@@ -107,7 +111,8 @@ export class FlagCommentInput extends Component {
this.state.characterCount < maxCharacterCount &&
this.state.characterCount > maxCharacterCount * 0.9,
"mr-text-red-light":
- this.state.characterCount >= maxCharacterCount || this.state.characterCount < minCharacterCount
+ this.state.characterCount >= maxCharacterCount ||
+ this.state.characterCount < minCharacterCount,
})}
>
{this.state.characterCount}/{maxCharacterCount}
@@ -131,7 +136,7 @@ export class FlagCommentInput extends Component {
cols="1"
inputValue={this.state.value}
onInputValueChange={this.handleChange}
- placeholder='Enter text here'
+ placeholder="Enter text here"
disableResize={true}
search={() => null}
disableShowSuggestions
@@ -149,14 +154,16 @@ export class FlagCommentInput extends Component {
- {this.props.displayInputError &&
+ {this.props.displayInputError && (
}
- {this.props.displayCheckboxError &&
+
+ )}
+ {this.props.displayCheckboxError && (
}
+
+ )}
{
return (
-
+
-
- )
-}
+ );
+};
export default FlagModel;
diff --git a/src/components/ChallengeDetail/Messages.js b/src/components/ChallengeDetail/Messages.js
index 13e67bd27..2eca6d4e7 100644
--- a/src/components/ChallengeDetail/Messages.js
+++ b/src/components/ChallengeDetail/Messages.js
@@ -1,37 +1,37 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeResultItem.
*/
export default defineMessages({
goBack: {
- id: 'ChallengeDetails.controls.goBack.label',
- defaultMessage: 'Go Back',
+ id: "ChallengeDetails.controls.goBack.label",
+ defaultMessage: "Go Back",
},
start: {
- id: 'ChallengeDetails.controls.start.label',
- defaultMessage: 'Start',
+ id: "ChallengeDetails.controls.start.label",
+ defaultMessage: "Start",
},
favorite: {
- id: 'ChallengeDetails.controls.favorite.label',
- defaultMessage: 'Favorite',
+ id: "ChallengeDetails.controls.favorite.label",
+ defaultMessage: "Favorite",
},
saveToFavorites: {
- id: 'ChallengeDetails.controls.favorite.tooltip',
- defaultMessage: 'Save to favorites',
+ id: "ChallengeDetails.controls.favorite.tooltip",
+ defaultMessage: "Save to favorites",
},
unfavorite: {
- id: 'ChallengeDetails.controls.unfavorite.label',
- defaultMessage: 'Unfavorite',
+ id: "ChallengeDetails.controls.unfavorite.label",
+ defaultMessage: "Unfavorite",
},
removeFromFavorites: {
- id: 'ChallengeDetails.controls.unfavorite.tooltip',
- defaultMessage: 'Remove from favorites',
+ id: "ChallengeDetails.controls.unfavorite.tooltip",
+ defaultMessage: "Remove from favorites",
},
manageLabel: {
@@ -45,8 +45,8 @@ export default defineMessages({
},
difficulty: {
- id: 'ChallengeDetails.fields.difficulty.label',
- defaultMessage: 'Difficulty',
+ id: "ChallengeDetails.fields.difficulty.label",
+ defaultMessage: "Difficulty",
},
lastTaskRefreshLabel: {
@@ -55,8 +55,8 @@ export default defineMessages({
},
ownerLabel: {
- id: 'ChallengeDetails.fields.owner.label',
- defaultMessage: 'Owner',
+ id: "ChallengeDetails.fields.owner.label",
+ defaultMessage: "Owner",
},
dataOriginDateLabel: {
@@ -76,66 +76,67 @@ export default defineMessages({
viewComments: {
id: "ChallengeDetails.fields.viewComments.label",
- defaultMessage: "Get In Touch"
+ defaultMessage: "Get In Touch",
},
viewOverview: {
id: "ChallengeDetails.fields.viewOverview.label",
- defaultMessage: "Overview"
+ defaultMessage: "Overview",
},
overpassQL: {
id: "ChallengeDetails.fields.overpassQL.label",
- defaultMessage: "Overpass Query"
+ defaultMessage: "Overpass Query",
},
write: {
id: "ChallengeDetails.controls.write.label",
- defaultMessage: "Write"
+ defaultMessage: "Write",
},
preview: {
id: "ChallengeDetails.controls.preview.label",
- defaultMessage: "Preview"
+ defaultMessage: "Preview",
},
review: {
id: "ChallengeDetails.controls.review.label",
- defaultMessage: "I have attempted to contact the Challenge creator"
+ defaultMessage: "I have attempted to contact the Challenge creator",
},
modalSubtitle: {
id: "ChallengeDetails.controls.modal.subtitle",
- defaultMessage: "You are about to report a Challenge. An issue will be created in this [public github repository](https://github.com/maproulette/challenge-reports/issues) and the Challenge creator will be notified by email. Any follow-up discussion should take place there. Reporting a Challenge does not disable it immediately. Please explain in detail what your issue is with this challenge, if possible linking to specific OSM changesets.",
+ defaultMessage:
+ "You are about to report a Challenge. An issue will be created in this [public github repository](https://github.com/maproulette/challenge-reports/issues) and the Challenge creator will be notified by email. Any follow-up discussion should take place there. Reporting a Challenge does not disable it immediately. Please explain in detail what your issue is with this challenge, if possible linking to specific OSM changesets.",
},
submitReport: {
id: "ChallengeDetails.controls.submit.report.label",
- defaultMessage: "Report Challenge"
+ defaultMessage: "Report Challenge",
},
textInputError: {
id: "ChallengeDetails.controls.text.input.error",
- defaultMessage: "Text Input should have minimum 100 characters"
+ defaultMessage: "Text Input should have minimum 100 characters",
},
checkboxError: {
id: "ChallengeDetails.controls.checkbox.error",
- defaultMessage: "Please ensure that checkbox is checked before continue"
+ defaultMessage: "Please ensure that checkbox is checked before continue",
},
reportedText: {
id: "ChallengeDetails.controls.reported_text",
- defaultMessage: "This challenge has been reported"
+ defaultMessage: "This challenge has been reported",
},
email: {
id: "ChallengeDetails.controls.email",
- defaultMessage: "Email"
+ defaultMessage: "Email",
},
cloneChallenge: {
id: "ChallengeDetails.controls.clone.challenge",
- defaultMessage: "Clone Challenge"
- }
-})
+ defaultMessage: "Clone Challenge",
+ },
+});
diff --git a/src/components/ChallengeEndModal/ChallengeEndModal.jsx b/src/components/ChallengeEndModal/ChallengeEndModal.jsx
index afabe2703..4912c786d 100644
--- a/src/components/ChallengeEndModal/ChallengeEndModal.jsx
+++ b/src/components/ChallengeEndModal/ChallengeEndModal.jsx
@@ -1,7 +1,7 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import Modal from '../Modal/Modal'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import Modal from "../Modal/Modal";
+import messages from "./Messages";
/**
* ChallengeEndModal presents a modal that displays a
@@ -12,16 +12,18 @@ import messages from './Messages'
export default class ChallengeEndModal extends Component {
state = {
active: true,
- }
+ };
- dismiss = () => this.setState({active: false})
+ dismiss = () => this.setState({ active: false });
render() {
return (
-
+
@@ -42,6 +44,6 @@ export default class ChallengeEndModal extends Component {
- )
+ );
}
}
diff --git a/src/components/ChallengeEndModal/ChallengeEndModal.test.jsx b/src/components/ChallengeEndModal/ChallengeEndModal.test.jsx
index a6b2a81ec..86a31cd18 100644
--- a/src/components/ChallengeEndModal/ChallengeEndModal.test.jsx
+++ b/src/components/ChallengeEndModal/ChallengeEndModal.test.jsx
@@ -1,12 +1,10 @@
-import { describe, it, expect } from "vitest";
+import { describe, expect, it } from "vitest";
import "@testing-library/jest-dom";
import ChallengeEndModal from "./ChallengeEndModal";
describe("ChallengeEndModal", () => {
it("renders MapRoulette landing page and slogan", () => {
- const { getByText } = global.withProvider(
-
- );
+ const { getByText } = global.withProvider(
);
const text = getByText("Challenge End");
expect(text).toBeInTheDocument();
});
diff --git a/src/components/ChallengeEndModal/Messages.js b/src/components/ChallengeEndModal/Messages.js
index cf9924c31..946697115 100644
--- a/src/components/ChallengeEndModal/Messages.js
+++ b/src/components/ChallengeEndModal/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with CongratulateModal.
@@ -6,17 +6,18 @@ import { defineMessages } from 'react-intl'
export default defineMessages({
header: {
id: "ChallengeEndModal.header",
- defaultMessage: "Challenge End"
+ defaultMessage: "Challenge End",
},
primaryMessage: {
id: "ChallengeEndModal.primaryMessage",
- defaultMessage: "You have marked all remaining tasks in this challenge " +
- "as either skipped or can't complete."
+ defaultMessage:
+ "You have marked all remaining tasks in this challenge " +
+ "as either skipped or can't complete.",
},
dismiss: {
id: "ChallengeEndModal.control.dismiss.label",
- defaultMessage: "Continue"
+ defaultMessage: "Continue",
},
-})
+});
diff --git a/src/components/ChallengeInfoSummary/ChallengeInfoSummary.jsx b/src/components/ChallengeInfoSummary/ChallengeInfoSummary.jsx
index f06b7fa6c..0d83e2ce8 100644
--- a/src/components/ChallengeInfoSummary/ChallengeInfoSummary.jsx
+++ b/src/components/ChallengeInfoSummary/ChallengeInfoSummary.jsx
@@ -1,9 +1,10 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import VirtualChallengeNameLink
- from '../VirtualChallengeNameLink/VirtualChallengeNameLink'
-import ChallengeNameLink from '../ChallengeNameLink/ChallengeNameLink'
-import OwnerContactLink, { JoinChallengeDiscussionLink } from '../ChallengeOwnerContactLink/ChallengeOwnerContactLink'
+import PropTypes from "prop-types";
+import { Component } from "react";
+import ChallengeNameLink from "../ChallengeNameLink/ChallengeNameLink";
+import OwnerContactLink, {
+ JoinChallengeDiscussionLink,
+} from "../ChallengeOwnerContactLink/ChallengeOwnerContactLink";
+import VirtualChallengeNameLink from "../VirtualChallengeNameLink/VirtualChallengeNameLink";
/**
* ChallengeInfoSummary displays various pieces of summary information about
@@ -26,9 +27,7 @@ export default class ChallengeInfoSummary extends Component {
-
- {this.props.task?.parent?.parent?.displayName}
-
+ {this.props.task?.parent?.parent?.displayName}
@@ -46,4 +45,4 @@ export default class ChallengeInfoSummary extends Component {
ChallengeInfoSummary.propTypes = {
task: PropTypes.object,
-}
+};
diff --git a/src/components/ChallengeNameLink/ChallengeNameLink.jsx b/src/components/ChallengeNameLink/ChallengeNameLink.jsx
index 72c22442e..282ad55ca 100644
--- a/src/components/ChallengeNameLink/ChallengeNameLink.jsx
+++ b/src/components/ChallengeNameLink/ChallengeNameLink.jsx
@@ -1,13 +1,12 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import _isFinite from 'lodash/isFinite'
-import { Link } from 'react-router-dom'
-import AsBrowsableChallenge
- from '../../interactions/Challenge/AsBrowsableChallenge'
-import SvgSymbol from '../SvgSymbol/SvgSymbol'
-import BusySpinner from '../BusySpinner/BusySpinner'
-import ShareLink from '../ShareLink/ShareLink'
-import { constructChallengeLink } from '../../utils/constructChangesetUrl'
+import _isFinite from "lodash/isFinite";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { Link } from "react-router-dom";
+import AsBrowsableChallenge from "../../interactions/Challenge/AsBrowsableChallenge";
+import { constructChallengeLink } from "../../utils/constructChangesetUrl";
+import BusySpinner from "../BusySpinner/BusySpinner";
+import ShareLink from "../ShareLink/ShareLink";
+import SvgSymbol from "../SvgSymbol/SvgSymbol";
/**
* ChallengeNameLink displays a linked name of the parent challenge of the
@@ -17,52 +16,47 @@ import { constructChallengeLink } from '../../utils/constructChangesetUrl'
*/
export default class ChallengeNameLink extends Component {
render() {
- const challenge = (this.props.task?.parent) || this.props.challenge || {}
- const project = (this.props.task?.parent?.parent) || this.props.project || {}
- const challengeBrowseRoute = AsBrowsableChallenge(challenge).browseURL()
- const challengeShareLink = constructChallengeLink(challenge?.id)
+ const challenge = this.props.task?.parent || this.props.challenge || {};
+ const project = this.props.task?.parent?.parent || this.props.project || {};
+ const challengeBrowseRoute = AsBrowsableChallenge(challenge).browseURL();
+ const challengeShareLink = constructChallengeLink(challenge?.id);
return (
- {_isFinite(this.props.virtualChallengeId) &&
-
-
- {this.props.virtualChallenge.name}
- :
-
- }
+ {_isFinite(this.props.virtualChallengeId) && (
+
+
+ {this.props.virtualChallenge.name}
+
+ ) : (
+
+ )}
- {challenge.name}
-
+ {challenge.name}
- {this.props.includeProject &&
-
-
- }
+ {this.props.includeProject && (
+
+
+ )}
- {!this.props.suppressShareLink &&
-
);
}
@@ -70,4 +64,4 @@ export default class ChallengeNameLink extends Component {
ChallengeNameLink.propTypes = {
task: PropTypes.object,
-}
+};
diff --git a/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.jsx b/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.jsx
index 1aedf9211..f744a397d 100644
--- a/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.jsx
+++ b/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.jsx
@@ -1,63 +1,63 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
+import _isFinite from "lodash/isFinite";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
import { Link } from "react-router-dom";
-import _isFinite from 'lodash/isFinite'
-import { FormattedMessage } from 'react-intl'
-import BusySpinner from '../BusySpinner/BusySpinner'
-import WithErrors from '../HOCs/WithErrors/WithErrors'
-import messages from './Messages'
+import BusySpinner from "../BusySpinner/BusySpinner";
+import WithErrors from "../HOCs/WithErrors/WithErrors";
+import messages from "./Messages";
export const JoinChallengeDiscussionLink = (props) => {
return (
+
- )
+ );
}
}
ChallengeOwnerContactLinkInternal.propTypes = {
task: PropTypes.object,
fetchOSMUser: PropTypes.func.isRequired,
-}
+};
const ChallengeOwnerContactLink = WithErrors(ChallengeOwnerContactLinkInternal);
-export default ChallengeOwnerContactLink;
\ No newline at end of file
+export default ChallengeOwnerContactLink;
diff --git a/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.test.jsx b/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.test.jsx
index 0c441e02e..979e03866 100644
--- a/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.test.jsx
+++ b/src/components/ChallengeOwnerContactLink/ChallengeOwnerContactLink.test.jsx
@@ -1,7 +1,7 @@
-import { describe, it, expect, vi } from "vitest";
+import { describe, expect, it, vi } from "vitest";
import "@testing-library/jest-dom";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
import { IntlProvider } from "react-intl";
-import { render, fireEvent, screen, waitFor } from "@testing-library/react";
import { ChallengeOwnerContactLinkInternal as ContactLink } from "./ChallengeOwnerContactLink";
const generateMockTask = (id, challengeOwnerId) => {
@@ -28,7 +28,7 @@ describe("ChallengeOwnerContactLinkInternal", () => {
const { getByText } = render(
null} />
-
+ ,
);
const text = getByText("Contact Challenge Owner");
expect(text).toBeInTheDocument();
@@ -37,11 +37,8 @@ describe("ChallengeOwnerContactLinkInternal", () => {
it("renders a link to OSM if a contactUrl is generated, and resets if the task data changes", async () => {
const { rerender } = render(
-
+
-
+
- null}
- task={generateMockTask(0)}
- addError={addError}
- />
-
+ null} task={generateMockTask(0)} addError={addError} />
+ ,
);
fireEvent.click(screen.getByText("Contact Challenge Owner"));
@@ -90,11 +80,8 @@ describe("ChallengeOwnerContactLinkInternal", () => {
render(
-
+
-
+
{props.type}
-
-
+
{props.selection}
@@ -20,6 +25,6 @@ const ButtonFilter = props => (
/>
-)
+);
-export default ButtonFilter
+export default ButtonFilter;
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/ChallengeFilterSubnav.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/ChallengeFilterSubnav.jsx
index 011835a7f..4b2f16d9f 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/ChallengeFilterSubnav.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/ChallengeFilterSubnav.jsx
@@ -1,18 +1,18 @@
-import { Component } from 'react'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import SearchBox from '../../SearchBox/SearchBox'
-import WithChallengeSearch from '../../HOCs/WithSearch/WithChallengeSearch'
-import WithCommandInterpreter from '../../HOCs/WithCommandInterpreter/WithCommandInterpreter'
-import FilterByDifficulty from './FilterByDifficulty'
-import FilterByKeyword from './FilterByKeyword'
-import FilterByCategorizationKeywords from './FilterByCategorizationKeywords'
-import ClearFiltersControl from './ClearFiltersControl'
-import SortChallengesSelector from './SortChallengesSelector'
-import './ChallengeFilterSubnav.scss'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import WithCommandInterpreter from "../../HOCs/WithCommandInterpreter/WithCommandInterpreter";
+import WithChallengeSearch from "../../HOCs/WithSearch/WithChallengeSearch";
+import SearchBox from "../../SearchBox/SearchBox";
+import ClearFiltersControl from "./ClearFiltersControl";
+import FilterByCategorizationKeywords from "./FilterByCategorizationKeywords";
+import FilterByDifficulty from "./FilterByDifficulty";
+import FilterByKeyword from "./FilterByKeyword";
+import SortChallengesSelector from "./SortChallengesSelector";
+import "./ChallengeFilterSubnav.scss";
+import messages from "./Messages";
// Setup child components with necessary HOCs
-const CommandSearchBox = WithCommandInterpreter(SearchBox)
+const CommandSearchBox = WithCommandInterpreter(SearchBox);
/**
* ChallengeFilterSubnav presents a navigation bar that contains options
@@ -29,13 +29,12 @@ const CommandSearchBox = WithCommandInterpreter(SearchBox)
*/
export class ChallengeFilterSubnav extends Component {
clearFilters = () => {
- this.props.clearSearchFilters()
- this.props.clearSearch()
- }
+ this.props.clearSearchFilters();
+ this.props.clearSearch();
+ };
render() {
- const filtersActive =
- this.props.unfilteredChallenges?.length > this.props.challenges?.length
+ const filtersActive = this.props.unfilteredChallenges?.length > this.props.challenges?.length;
return (
@@ -52,21 +51,21 @@ export class ChallengeFilterSubnav extends Component {
- {filtersActive && (
-
- )
+ );
}
}
-export default WithChallengeSearch(injectIntl(ChallengeFilterSubnav))
+export default WithChallengeSearch(injectIntl(ChallengeFilterSubnav));
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/ClearFiltersControl.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/ClearFiltersControl.jsx
index 7b0603700..5a5ef1932 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/ClearFiltersControl.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/ClearFiltersControl.jsx
@@ -1,13 +1,13 @@
-import { FormattedMessage } from 'react-intl'
-import messages from './Messages'
+import { FormattedMessage } from "react-intl";
+import messages from "./Messages";
-const ClearFiltersControl = props => (
+const ClearFiltersControl = (props) => (
-)
+);
-export default ClearFiltersControl
+export default ClearFiltersControl;
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByCategorizationKeywords.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByCategorizationKeywords.jsx
index 2a3d8a217..ee9ca4b54 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByCategorizationKeywords.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByCategorizationKeywords.jsx
@@ -1,12 +1,12 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { injectIntl, FormattedMessage } from 'react-intl'
-import Dropdown from '../../Dropdown/Dropdown'
-import ButtonFilter from './ButtonFilter'
-import messages from './Messages'
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import Dropdown from "../../Dropdown/Dropdown";
+import ButtonFilter from "./ButtonFilter";
+import messages from "./Messages";
/**
- * FilterByCategorizationKeywords displays a nav dropdown containing customizable options
+ * FilterByCategorizationKeywords displays a nav dropdown containing customizable options
* for filtering challenges by category keyword. The redux
* store is updated to reflect the chosen keywords.
*
@@ -14,62 +14,62 @@ import messages from './Messages'
*/
class FilterByCategorizationKeywords extends Component {
updateFilter = (value, categorizationFilters) => {
- const updatedFilters = new Set(categorizationFilters)
+ const updatedFilters = new Set(categorizationFilters);
if (value === null) {
- this.props.removeSearchFilters(['categorizationKeywords'])
- return
+ this.props.removeSearchFilters(["categorizationKeywords"]);
+ return;
} else {
if (updatedFilters.has(value)) {
- updatedFilters.delete(value)
+ updatedFilters.delete(value);
} else {
- updatedFilters.add(value)
+ updatedFilters.add(value);
}
}
- if(Array.from(updatedFilters).length === 0){
- this.props.removeSearchFilters(['categorizationKeywords'])
- return
+ if (Array.from(updatedFilters).length === 0) {
+ this.props.removeSearchFilters(["categorizationKeywords"]);
+ return;
}
// Update redux store or perform other necessary actions
- this.props.setCategorizationFilters(Array.from(updatedFilters))
- }
+ this.props.setCategorizationFilters(Array.from(updatedFilters));
+ };
addKeyword = (value, categories) => {
- if(!this.props.user?.id){
- return
+ if (!this.props.user?.id) {
+ return;
}
- value = value.trim()
- const addKeyword = new Set(categories)
+ value = value.trim();
+ const addKeyword = new Set(categories);
if (value === "" || categories.length === 6) {
- return
+ return;
}
- addKeyword.add(value)
+ addKeyword.add(value);
// Update redux store or perform other necessary actions
this.props.updateUserAppSetting(this.props.user.id, {
- 'categorizationKeys': Array.from(addKeyword),
- })
- }
+ categorizationKeys: Array.from(addKeyword),
+ });
+ };
removeKeyword = (value, categories, categorizationFilters) => {
- const removeKeyword = new Set(categories)
-
- removeKeyword.delete(value)
+ const removeKeyword = new Set(categories);
+
+ removeKeyword.delete(value);
if (categorizationFilters.includes(value)) {
- this.updateFilter(value, categorizationFilters)
+ this.updateFilter(value, categorizationFilters);
}
// Update redux store or perform other necessary actions
this.props.updateUserAppSetting(this.props.user.id, {
- 'categorizationKeys': Array.from(removeKeyword),
- })
- }
+ categorizationKeys: Array.from(removeKeyword),
+ });
+ };
render() {
const categorizationFilters = this.props.searchFilters?.categorizationKeywords ?? [];
@@ -81,9 +81,13 @@ class FilterByCategorizationKeywords extends Component {
dropdownButton={(dropdown) => (
props.updateFilter(keyword, categorizationFilters)}
>
- {keyword}
+
+ {keyword}
+
props.removeKeyword(keyword, categories, categorizationFilters)}>
@@ -122,19 +125,21 @@ const ListFilterItems = function (props) {
- ))
+ ));
// Add 'Anything' option to start of dropdown
menuItems.unshift(
- props.updateFilter(null)}>
-
- )
+ props.updateFilter(null)}>
+
+ ,
+ );
// Add box for manually entering other keywords not included in the menu.
menuItems.push(
- { props.signedOut ? (
+ {props.signedOut ? (
@@ -144,15 +149,19 @@ const ListFilterItems = function (props) {
) : null}
-
- {props.categories.length === 6
- ?
- : "Add a new category"}
+ {props.categories.length === 6 ? (
+
+ ) : (
+ "Add a new category"
+ )}
-
- )
+ ,
+ );
- return
{menuItems}
-}
+ return
{menuItems} ;
+};
FilterByCategorizationKeywords.propTypes = {
/** Invoked to update the challenge keyword filter */
setCategorizationFilters: PropTypes.func.isRequired,
/** Invoked to clear the challenge keyword filter */
removeSearchFilters: PropTypes.func.isRequired,
-}
+};
-export default injectIntl(FilterByCategorizationKeywords)
+export default injectIntl(FilterByCategorizationKeywords);
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByDifficulty.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByDifficulty.jsx
index 50d2cae4f..a9b7f9e95 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByDifficulty.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByDifficulty.jsx
@@ -1,13 +1,16 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import _map from 'lodash/map'
-import _isFinite from 'lodash/isFinite'
-import { injectIntl, FormattedMessage } from 'react-intl'
-import { ChallengeDifficulty, difficultyLabels, messagesByDifficulty }
- from '../../../services/Challenge/ChallengeDifficulty/ChallengeDifficulty'
-import Dropdown from '../../Dropdown/Dropdown'
-import ButtonFilter from './ButtonFilter'
-import messages from './Messages'
+import _isFinite from "lodash/isFinite";
+import _map from "lodash/map";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import {
+ ChallengeDifficulty,
+ difficultyLabels,
+ messagesByDifficulty,
+} from "../../../services/Challenge/ChallengeDifficulty/ChallengeDifficulty";
+import Dropdown from "../../Dropdown/Dropdown";
+import ButtonFilter from "./ButtonFilter";
+import messages from "./Messages";
/**
* FilterByDifficulty displays a nav dropdown containing options for filtering
@@ -24,69 +27,66 @@ export class FilterByDifficulty extends Component {
*/
updateFilter = (value, closeDropdown) => {
if (!_isFinite(value)) {
- this.props.removeSearchFilters(['difficulty'])
+ this.props.removeSearchFilters(["difficulty"]);
+ } else {
+ this.props.setSearchFilters({ difficulty: value });
}
- else {
- this.props.setSearchFilters({difficulty: value})
- }
- closeDropdown()
- }
+ closeDropdown();
+ };
render() {
- const localizedDifficultyLabels = difficultyLabels(this.props.intl)
- const notFiltering = !_isFinite(this.props.searchFilters.difficulty)
+ const localizedDifficultyLabels = difficultyLabels(this.props.intl);
+ const notFiltering = !_isFinite(this.props.searchFilters.difficulty);
return (
+ dropdownButton={(dropdown) => (
props.updateFilter(difficulty, props.closeDropdown)}>
{props.difficultyLabels[name]}
- ))
+ ));
// Add 'Any' option to start of dropdown
menuItems.unshift(
-
+
props.updateFilter(null, props.closeDropdown)}>
{props.difficultyLabels.any}
-
- )
+ ,
+ );
- return (
-
- {menuItems}
-
- )
-}
+ return {menuItems} ;
+};
FilterByDifficulty.propTypes = {
/** Invoked to update the challenge difficulty filter */
@@ -97,10 +97,10 @@ FilterByDifficulty.propTypes = {
searchFilters: PropTypes.object,
/** Set to true to render as a list instead of a dropdown */
asMenuList: PropTypes.bool,
-}
+};
FilterByDifficulty.defaultProps = {
searchFilters: {},
-}
+};
-export default injectIntl(FilterByDifficulty)
+export default injectIntl(FilterByDifficulty);
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByKeyword.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByKeyword.jsx
index 406085e66..bc45bc4f8 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByKeyword.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByKeyword.jsx
@@ -1,19 +1,20 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import _keys from 'lodash/keys'
-import _without from 'lodash/without'
-import _isEmpty from 'lodash/isEmpty'
-import _first from 'lodash/first'
-import { injectIntl, FormattedMessage } from 'react-intl'
-import { CHALLENGE_CATEGORY_OTHER,
- categoryMatchingKeywords,
- combinedCategoryKeywords,
- keywordLabels }
- from '../../../services/Challenge/ChallengeKeywords/ChallengeKeywords'
-import OtherKeywordsOption from './OtherKeywordsOption'
-import Dropdown from '../../Dropdown/Dropdown'
-import ButtonFilter from './ButtonFilter'
-import messages from './Messages'
+import _first from "lodash/first";
+import _isEmpty from "lodash/isEmpty";
+import _keys from "lodash/keys";
+import _without from "lodash/without";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import {
+ CHALLENGE_CATEGORY_OTHER,
+ categoryMatchingKeywords,
+ combinedCategoryKeywords,
+ keywordLabels,
+} from "../../../services/Challenge/ChallengeKeywords/ChallengeKeywords";
+import Dropdown from "../../Dropdown/Dropdown";
+import ButtonFilter from "./ButtonFilter";
+import messages from "./Messages";
+import OtherKeywordsOption from "./OtherKeywordsOption";
/**
* FilterByKeyword displays a nav dropdown containing options for filtering
@@ -32,50 +33,49 @@ export class FilterByKeyword extends Component {
*/
updateFilter = (value, closeDropdown) => {
if (value === null) {
- this.props.removeSearchFilters(['keywords'])
+ this.props.removeSearchFilters(["keywords"]);
+ } else {
+ this.props.setKeywordFilter(combinedCategoryKeywords[value]);
}
- else {
- this.props.setKeywordFilter(combinedCategoryKeywords[value])
- }
- closeDropdown()
- }
+ closeDropdown();
+ };
- setOtherKeywords = keywordString => {
- this.props.setKeywordFilter([keywordString])
- }
+ setOtherKeywords = (keywordString) => {
+ this.props.setKeywordFilter([keywordString]);
+ };
- clearOtherKeywords = closeDropdown => {
- this.updateFilter({value: null}, closeDropdown)
- }
+ clearOtherKeywords = (closeDropdown) => {
+ this.updateFilter({ value: null }, closeDropdown);
+ };
render() {
- const localizedKeywordLabels = keywordLabels(this.props.intl, true)
- const categories = _without(_keys(combinedCategoryKeywords), 'other')
- const activeCategory = categoryMatchingKeywords(this.props.searchFilters.keywords, true)
+ const localizedKeywordLabels = keywordLabels(this.props.intl, true);
+ const categories = _without(_keys(combinedCategoryKeywords), "other");
+ const activeCategory = categoryMatchingKeywords(this.props.searchFilters.keywords, true);
// If the active category doesn't match a known category, then it's a
// manually entered ("other") keyword
- const otherKeyword = activeCategory === CHALLENGE_CATEGORY_OTHER ?
- _first(this.props.searchFilters.keywords) : null
+ const otherKeyword =
+ activeCategory === CHALLENGE_CATEGORY_OTHER
+ ? _first(this.props.searchFilters.keywords)
+ : null;
- const notFiltering = _isEmpty(this.props.searchFilters.keywords)
+ const notFiltering = _isEmpty(this.props.searchFilters.keywords);
return (
+ dropdownButton={(dropdown) => (
props.updateFilter(keyword, props.closeDropdown)}>
{props.keywordLabels[keyword]}
- ))
+ ));
// Add 'Anything' option to start of dropdown
menuItems.unshift(
-
- props.updateFilter(null, props.closeDropdown)}>
- {props.keywordLabels.any}
-
-
- )
+
+ props.updateFilter(null, props.closeDropdown)}>{props.keywordLabels.any}
+ ,
+ );
// Add 'other' box for manually entering other keywords not included in menu.
menuItems.push(
-
+
- )
+ ,
+ );
- return (
-
- {menuItems}
-
- )
-}
+ return {menuItems} ;
+};
FilterByKeyword.propTypes = {
/** Invoked to update the challenge keyword filter */
@@ -137,10 +131,10 @@ FilterByKeyword.propTypes = {
removeSearchFilters: PropTypes.func.isRequired,
/** The current value of the challenge filter */
searchFilter: PropTypes.object,
-}
+};
FilterByKeyword.defaultProps = {
searchFilters: {},
-}
+};
-export default injectIntl(FilterByKeyword)
+export default injectIntl(FilterByKeyword);
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByLocation.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByLocation.jsx
index 4c2958b86..351f2a004 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/FilterByLocation.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/FilterByLocation.jsx
@@ -1,12 +1,13 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import _isEmpty from 'lodash/isEmpty'
-import _noop from 'lodash/noop'
-import { injectIntl, FormattedMessage } from 'react-intl'
-import { ChallengeLocation,
- locationLabels }
- from '../../../services/Challenge/ChallengeLocation/ChallengeLocation'
-import messages from './Messages'
+import _isEmpty from "lodash/isEmpty";
+import _noop from "lodash/noop";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import {
+ ChallengeLocation,
+ locationLabels,
+} from "../../../services/Challenge/ChallengeLocation/ChallengeLocation";
+import messages from "./Messages";
/**
* FilterByLocation displays radio buttons for filtering challenges by
@@ -23,30 +24,28 @@ export class FilterByLocation extends Component {
*/
updateFilter = (value) => {
if (_isEmpty(value)) {
- this.props.removeSearchFilters(['location'])
- }
- else {
+ this.props.removeSearchFilters(["location"]);
+ } else {
// For nearMe, we actually use the withinMapBounds setting -- we just
// also set the map bounds to be near the user.
if (value === ChallengeLocation.nearMe) {
// Note: repositioning the map will automatically trigger an update of the
// bounded challenges, so we don't need to request an update here.
- this.props.setSearchFilters({location: ChallengeLocation.intersectingMapBounds})
- this.props.locateMapToUser(this.props.user)
- }
- else {
- this.props.setSearchFilters({location: value})
+ this.props.setSearchFilters({ location: ChallengeLocation.intersectingMapBounds });
+ this.props.locateMapToUser(this.props.user);
+ } else {
+ this.props.setSearchFilters({ location: value });
}
}
- }
+ };
- componentDidMount(){
+ componentDidMount() {
// Default to 'intersectingMapBounds'
- this.props.setSearchFilters({location: ChallengeLocation.intersectingMapBounds})
+ this.props.setSearchFilters({ location: ChallengeLocation.intersectingMapBounds });
}
render() {
- const localizedLocationLabels = locationLabels(this.props.intl)
+ const localizedLocationLabels = locationLabels(this.props.intl);
return (
@@ -82,7 +81,7 @@ export class FilterByLocation extends Component {
- )
+ );
}
}
@@ -99,10 +98,10 @@ FilterByLocation.propTypes = {
searchFilters: PropTypes.object,
/** The current logged-in user, if any */
user: PropTypes.object,
-}
+};
FilterByLocation.defaultProps = {
searchFilters: {},
-}
+};
-export default injectIntl(FilterByLocation)
+export default injectIntl(FilterByLocation);
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/Messages.js b/src/components/ChallengePane/ChallengeFilterSubnav/Messages.js
index 25f0a559b..f81c897aa 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/Messages.js
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/Messages.js
@@ -1,42 +1,42 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeFilterSubnav
*/
export default defineMessages({
header: {
- id: 'ChallengeFilterSubnav.header',
- defaultMessage: 'Challenges',
+ id: "ChallengeFilterSubnav.header",
+ defaultMessage: "Challenges",
},
difficultyLabel: {
- id: 'ChallengeFilterSubnav.filter.difficulty.label',
- defaultMessage: 'Difficulty',
+ id: "ChallengeFilterSubnav.filter.difficulty.label",
+ defaultMessage: "Difficulty",
},
keywordLabel: {
- id: 'ChallengeFilterSubnav.filter.keyword.label',
- defaultMessage: 'Work on',
+ id: "ChallengeFilterSubnav.filter.keyword.label",
+ defaultMessage: "Work on",
},
categorizeLabel: {
- id: 'ChallengeFilterSubnav.filter.categorize.label',
- defaultMessage: 'Categorize',
+ id: "ChallengeFilterSubnav.filter.categorize.label",
+ defaultMessage: "Categorize",
},
locationLabel: {
- id: 'ChallengeFilterSubnav.filter.location.label',
- defaultMessage: 'Location',
+ id: "ChallengeFilterSubnav.filter.location.label",
+ defaultMessage: "Location",
},
searchLabel: {
- id: 'ChallengeFilterSubnav.filter.search.label',
- defaultMessage: 'Search by name or Id',
+ id: "ChallengeFilterSubnav.filter.search.label",
+ defaultMessage: "Search by name or Id",
},
searchLabelForId: {
- id: 'ChallengeFilterSubnav.filter.searchForId.label',
- defaultMessage: 'Search for task Id',
+ id: "ChallengeFilterSubnav.filter.searchForId.label",
+ defaultMessage: "Search for task Id",
},
clearFiltersLabel: {
@@ -83,4 +83,4 @@ export default defineMessages({
id: "ChallengeFilterSubnav.filter.categorization.new",
defaultMessage: "to add a new one.",
},
-})
+});
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/OtherKeywordsOption.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/OtherKeywordsOption.jsx
index ffef8509a..c57ea55a4 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/OtherKeywordsOption.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/OtherKeywordsOption.jsx
@@ -1,15 +1,13 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import SearchBox from '../../SearchBox/SearchBox'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import SearchBox from "../../SearchBox/SearchBox";
+import messages from "./Messages";
export default class OtherKeywordsOption extends Component {
render() {
return (
-
+
- )
+ );
}
}
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/ProjectFilterSubnav.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/ProjectFilterSubnav.jsx
index 500946e0d..c4c979986 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/ProjectFilterSubnav.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/ProjectFilterSubnav.jsx
@@ -1,13 +1,13 @@
-import { Component } from 'react'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import WithChallengeSearch from '../../HOCs/WithSearch/WithChallengeSearch'
-import FilterByDifficulty from './FilterByDifficulty'
-import FilterByKeyword from './FilterByKeyword'
-import FilterByCategorizationKeywords from './FilterByCategorizationKeywords'
-import ClearFiltersControl from './ClearFiltersControl'
-import SortChallengesSelector from './SortChallengesSelector'
-import './ChallengeFilterSubnav.scss'
-import messages from './Messages'
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import WithChallengeSearch from "../../HOCs/WithSearch/WithChallengeSearch";
+import ClearFiltersControl from "./ClearFiltersControl";
+import FilterByCategorizationKeywords from "./FilterByCategorizationKeywords";
+import FilterByDifficulty from "./FilterByDifficulty";
+import FilterByKeyword from "./FilterByKeyword";
+import SortChallengesSelector from "./SortChallengesSelector";
+import "./ChallengeFilterSubnav.scss";
+import messages from "./Messages";
/**
* ProjectilterSubnav presents a navigation bar that contains options
@@ -20,13 +20,12 @@ import messages from './Messages'
*/
export class ProjectilterSubnav extends Component {
clearFilters = () => {
- this.props.clearSearchFilters()
- this.props.clearSearch()
- }
+ this.props.clearSearchFilters();
+ this.props.clearSearch();
+ };
render() {
- const filtersActive =
- this.props.unfilteredChallenges?.length > this.props.challenges?.length
+ const filtersActive = this.props.unfilteredChallenges?.length > this.props.challenges?.length;
return (
@@ -42,13 +41,11 @@ export class ProjectilterSubnav extends Component {
- {filtersActive && (
-
- )}
+ {filtersActive &&
}
- )
+ );
}
}
-export default WithChallengeSearch(injectIntl(ProjectilterSubnav))
+export default WithChallengeSearch(injectIntl(ProjectilterSubnav));
diff --git a/src/components/ChallengePane/ChallengeFilterSubnav/SortChallengesSelector.jsx b/src/components/ChallengePane/ChallengeFilterSubnav/SortChallengesSelector.jsx
index 88672afac..388bef0b7 100644
--- a/src/components/ChallengePane/ChallengeFilterSubnav/SortChallengesSelector.jsx
+++ b/src/components/ChallengePane/ChallengeFilterSubnav/SortChallengesSelector.jsx
@@ -1,12 +1,11 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import _map from 'lodash/map'
-import { sortLabels, SORT_DEFAULT, ALL_SORT_OPTIONS }
- from '../../../services/Search/Search'
-import Dropdown from '../../Dropdown/Dropdown'
-import ButtonFilter from './ButtonFilter'
-import messages from './Messages'
+import _map from "lodash/map";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import { ALL_SORT_OPTIONS, SORT_DEFAULT, sortLabels } from "../../../services/Search/Search";
+import Dropdown from "../../Dropdown/Dropdown";
+import ButtonFilter from "./ButtonFilter";
+import messages from "./Messages";
/**
* SortChallengesSelector renders an unmanaged dropdown button that can be used
@@ -16,56 +15,53 @@ import messages from './Messages'
*/
export class SortChallengesSelector extends Component {
makeSelection = (option, closeDropdownMenu) => {
- this.props.setSearchSort({sortBy: option})
- closeDropdownMenu()
- }
+ this.props.setSearchSort({ sortBy: option });
+ closeDropdownMenu();
+ };
render() {
- const localizedLabels = sortLabels(this.props.intl)
- const currentSortCriteria = this.props.searchSort?.sortBy
- const activeLabel = currentSortCriteria ? localizedLabels[currentSortCriteria] :
- localizedLabels[SORT_DEFAULT]
+ const localizedLabels = sortLabels(this.props.intl);
+ const currentSortCriteria = this.props.searchSort?.sortBy;
+ const activeLabel = currentSortCriteria
+ ? localizedLabels[currentSortCriteria]
+ : localizedLabels[SORT_DEFAULT];
return (
+ dropdownButton={(dropdown) => (
props.makeSelection(sortByOption, props.closeDropdown)}>
{props.sortLabels[sortByOption]}
- ))
+ ));
- return (
-
- {menuItems}
-
- )
-}
+ return {menuItems} ;
+};
SortChallengesSelector.propTypes = {
/** Invoked to sort the challenges when a value is selected */
setSearchSort: PropTypes.func.isRequired,
-}
+};
-export default injectIntl(SortChallengesSelector)
+export default injectIntl(SortChallengesSelector);
diff --git a/src/components/ChallengePane/ChallengePane.jsx b/src/components/ChallengePane/ChallengePane.jsx
index bbce979e8..9ec51aa49 100644
--- a/src/components/ChallengePane/ChallengePane.jsx
+++ b/src/components/ChallengePane/ChallengePane.jsx
@@ -1,34 +1,33 @@
-import { Component } from 'react'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import _isEqual from 'lodash/isEqual'
-import _uniqBy from 'lodash/uniqBy'
-import _differenceBy from 'lodash/differenceBy'
-import { Popup } from 'react-leaflet'
-import ChallengeFilterSubnav from './ChallengeFilterSubnav/ChallengeFilterSubnav'
-import FilterByLocation from './ChallengeFilterSubnav/FilterByLocation'
-import MapPane from '../EnhancedMap/MapPane/MapPane'
-import TaskClusterMap from '../TaskClusterMap/TaskClusterMap'
-import CongratulateModal from '../CongratulateModal/CongratulateModal'
-import ChallengeEndModal from '../ChallengeEndModal/ChallengeEndModal'
-import ChallengeResultList from './ChallengeResultList/ChallengeResultList'
-import WithChallenges from '../HOCs/WithChallenges/WithChallenges'
-import WithStartChallenge from '../HOCs/WithStartChallenge/WithStartChallenge'
-import WithFilteredChallenges
- from '../HOCs/WithFilteredChallenges/WithFilteredChallenges'
-import WithChallengeSearch from '../HOCs/WithSearch/WithChallengeSearch'
-import WithSearchResults from '../HOCs/WithSearchResults/WithSearchResults'
-import WithBrowsedChallenge from '../HOCs/WithBrowsedChallenge/WithBrowsedChallenge'
-import WithClusteredTasks from '../HOCs/WithClusteredTasks/WithClusteredTasks'
-import WithMapBoundedTasks from '../HOCs/WithMapBoundedTasks/WithMapBoundedTasks'
-import WithStatus from '../HOCs/WithStatus/WithStatus'
-import WithChallengeTaskClusters from '../HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters'
-import WithTaskClusterMarkers from '../HOCs/WithTaskClusterMarkers/WithTaskClusterMarkers'
-import WithCurrentUser from '../HOCs/WithCurrentUser/WithCurrentUser'
-import { fromLatLngBounds } from '../../services/MapBounds/MapBounds'
-import { ChallengeStatus } from '../../services/Challenge/ChallengeStatus/ChallengeStatus'
-import TaskChallengeMarkerContent from './TaskChallengeMarkerContent'
-import StartVirtualChallenge from './StartVirtualChallenge/StartVirtualChallenge'
-import messages from './Messages'
+import _differenceBy from "lodash/differenceBy";
+import _isEqual from "lodash/isEqual";
+import _uniqBy from "lodash/uniqBy";
+import { Component } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import { Popup } from "react-leaflet";
+import { ChallengeStatus } from "../../services/Challenge/ChallengeStatus/ChallengeStatus";
+import { fromLatLngBounds } from "../../services/MapBounds/MapBounds";
+import ChallengeEndModal from "../ChallengeEndModal/ChallengeEndModal";
+import CongratulateModal from "../CongratulateModal/CongratulateModal";
+import MapPane from "../EnhancedMap/MapPane/MapPane";
+import WithBrowsedChallenge from "../HOCs/WithBrowsedChallenge/WithBrowsedChallenge";
+import WithChallengeTaskClusters from "../HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters";
+import WithChallenges from "../HOCs/WithChallenges/WithChallenges";
+import WithClusteredTasks from "../HOCs/WithClusteredTasks/WithClusteredTasks";
+import WithCurrentUser from "../HOCs/WithCurrentUser/WithCurrentUser";
+import WithFilteredChallenges from "../HOCs/WithFilteredChallenges/WithFilteredChallenges";
+import WithMapBoundedTasks from "../HOCs/WithMapBoundedTasks/WithMapBoundedTasks";
+import WithChallengeSearch from "../HOCs/WithSearch/WithChallengeSearch";
+import WithSearchResults from "../HOCs/WithSearchResults/WithSearchResults";
+import WithStartChallenge from "../HOCs/WithStartChallenge/WithStartChallenge";
+import WithStatus from "../HOCs/WithStatus/WithStatus";
+import WithTaskClusterMarkers from "../HOCs/WithTaskClusterMarkers/WithTaskClusterMarkers";
+import TaskClusterMap from "../TaskClusterMap/TaskClusterMap";
+import ChallengeFilterSubnav from "./ChallengeFilterSubnav/ChallengeFilterSubnav";
+import FilterByLocation from "./ChallengeFilterSubnav/FilterByLocation";
+import ChallengeResultList from "./ChallengeResultList/ChallengeResultList";
+import messages from "./Messages";
+import StartVirtualChallenge from "./StartVirtualChallenge/StartVirtualChallenge";
+import TaskChallengeMarkerContent from "./TaskChallengeMarkerContent";
const ShowChallengeListTogglesInternal = (props) => {
return (
@@ -38,37 +37,36 @@ const ShowChallengeListTogglesInternal = (props) => {
className="mr-checkbox-toggle mr-mr-1 mr-mb-6"
checked={props.showingArchived}
onChange={() => {
- props.setSearchFilters({ archived: !props.showingArchived })
+ props.setSearchFilters({ archived: !props.showingArchived });
}}
/>
-
+
+
+
+
- )
-}
+ );
+};
const ShowChallengeListToggles = WithChallengeSearch(ShowChallengeListTogglesInternal);
// Setup child components with necessary HOCs
-const ChallengeResults = WithStatus(ChallengeResultList)
-const ClusterMap =
- WithChallengeTaskClusters(
- WithTaskClusterMarkers(
- WithCurrentUser(
- TaskClusterMap('challenges')
- )
- ),
- true
- )
-const LocationFilter = WithCurrentUser(FilterByLocation)
+const ChallengeResults = WithStatus(ChallengeResultList);
+const ClusterMap = WithChallengeTaskClusters(
+ WithTaskClusterMarkers(WithCurrentUser(TaskClusterMap("challenges"))),
+ true,
+);
+const LocationFilter = WithCurrentUser(FilterByLocation);
/**
* ChallengePane represents the top-level view when the user is browsing,
@@ -82,90 +80,95 @@ const LocationFilter = WithCurrentUser(FilterByLocation)
*/
export class ChallengePane extends Component {
state = {
- selectedClusters: []
- }
+ selectedClusters: [],
+ };
- onBulkClusterSelection = clusters => {
+ onBulkClusterSelection = (clusters) => {
if (!clusters || clusters.length === 0) {
- return
+ return;
}
// Handle both clusters and individual tasks in case user declustered
this.setState({
selectedClusters: _uniqBy(
- this.state.selectedClusters.concat(clusters), clusters[0].isTask ? 'taskId' : 'clusterId'
+ this.state.selectedClusters.concat(clusters),
+ clusters[0].isTask ? "taskId" : "clusterId",
),
- })
- }
+ });
+ };
- onBulkClusterDeselection = clusters => {
+ onBulkClusterDeselection = (clusters) => {
if (!clusters || clusters.length === 0) {
- return
+ return;
}
// Handle both clusters and individual tasks in case user declustered
this.setState({
selectedClusters: _differenceBy(
- this.state.selectedClusters, clusters, clusters[0].isTask ? 'taskId' : 'clusterId'
+ this.state.selectedClusters,
+ clusters,
+ clusters[0].isTask ? "taskId" : "clusterId",
),
- })
- }
+ });
+ };
- resetSelectedClusters = () => this.setState({selectedClusters: []})
+ resetSelectedClusters = () => this.setState({ selectedClusters: [] });
componentDidUpdate() {
if (!_isEqual(this.state.bounds, this.props.mapBounds?.bounds)) {
- this.setState({bounds: this.props.mapBounds?.bounds,
- fromUserAction: this.props.mapBounds?.fromUserAction})
+ this.setState({
+ bounds: this.props.mapBounds?.bounds,
+ fromUserAction: this.props.mapBounds?.fromUserAction,
+ });
}
}
shouldComponentUpdate(nextProps, nextState) {
- return !_isEqual(this.props, nextProps) || !_isEqual(this.state, nextState)
+ return !_isEqual(this.props, nextProps) || !_isEqual(this.state, nextState);
}
render() {
const showingArchived = this.props.history.location.search.includes("archived=true");
- const showingGlobal = this.props.history.location.search.includes("global=true")
- const challengeStatus = [ChallengeStatus.ready,
- ChallengeStatus.partiallyLoaded,
- ChallengeStatus.none,
- ChallengeStatus.empty]
+ const showingGlobal = this.props.history.location.search.includes("global=true");
+ const challengeStatus = [
+ ChallengeStatus.ready,
+ ChallengeStatus.partiallyLoaded,
+ ChallengeStatus.none,
+ ChallengeStatus.empty,
+ ];
const showMarkerPopup = (markerData) => {
return (
-
-
- )
- }
+
+
+ );
+ };
const virtualChallengeMapOverlay =
- this.state.selectedClusters.length > 0 ?
-
{(this.props.history?.location?.state?.congratulate ?? false) &&
- !(this.props.history?.location?.state?.warn ?? false) &&
-
- }
+ !(this.props.history?.location?.state?.warn ?? false) &&
}
{(this.props.history?.location?.state?.warn ?? false) &&
- !(this.props.history?.location?.state?.congratulate ?? false) &&
-
- }
+ !(this.props.history?.location?.state?.congratulate ?? false) &&
}
@@ -179,11 +182,11 @@ export class ChallengePane extends Component {
zoom: this.state.zoom,
filters: this.props.searchCriteria?.filters,
searchQuery: this.props.searchCriteria?.query,
- challengeStatus
+ challengeStatus,
}}
updateTaskFilterBounds={(bounds, zoom, fromUserAction) => {
- this.props.updateChallengeSearchMapBounds(bounds, fromUserAction)
- this.resetSelectedClusters()
+ this.props.updateChallengeSearchMapBounds(bounds, fromUserAction);
+ this.resetSelectedClusters();
}}
selectedClusters={this.state.selectedClusters}
onBulkClusterSelection={this.onBulkClusterSelection}
@@ -204,23 +207,20 @@ export class ChallengePane extends Component {
}
}
-export default
- WithCurrentUser(
- WithChallenges(
- WithChallengeSearch(
- WithClusteredTasks(
- WithMapBoundedTasks(
- WithFilteredChallenges(
- WithSearchResults(
- WithStartChallenge(
- WithBrowsedChallenge(injectIntl(ChallengePane))
- ),
- 'challenges',
- 'challenges'
- )
- )
- )
- )
- )
- )
- )
+export default WithCurrentUser(
+ WithChallenges(
+ WithChallengeSearch(
+ WithClusteredTasks(
+ WithMapBoundedTasks(
+ WithFilteredChallenges(
+ WithSearchResults(
+ WithStartChallenge(WithBrowsedChallenge(injectIntl(ChallengePane))),
+ "challenges",
+ "challenges",
+ ),
+ ),
+ ),
+ ),
+ ),
+ ),
+);
diff --git a/src/components/ChallengePane/ChallengePane.test.jsx b/src/components/ChallengePane/ChallengePane.test.jsx
index eaacaa987..dd7b19816 100644
--- a/src/components/ChallengePane/ChallengePane.test.jsx
+++ b/src/components/ChallengePane/ChallengePane.test.jsx
@@ -1,4 +1,4 @@
-import { describe, it, expect } from "vitest";
+import { describe, expect, it } from "vitest";
import "@testing-library/jest-dom";
import { ChallengePane } from "./ChallengePane";
@@ -11,9 +11,9 @@ describe("ChallengePane", () => {
locateMapToUser={() => {}}
unfilteredChallenges={[]}
history={{ location: { pathname: "", search: "" } }}
- />
+ />,
);
const text = getByText("Sort by");
expect(text).toBeInTheDocument();
});
-});
\ No newline at end of file
+});
diff --git a/src/components/ChallengePane/ChallengeResultItem/ChallengeResultItem.jsx b/src/components/ChallengePane/ChallengeResultItem/ChallengeResultItem.jsx
index 885c9419c..6e280e47f 100644
--- a/src/components/ChallengePane/ChallengeResultItem/ChallengeResultItem.jsx
+++ b/src/components/ChallengePane/ChallengeResultItem/ChallengeResultItem.jsx
@@ -1,19 +1,17 @@
-import { createRef, Component } from 'react'
-import PropTypes from 'prop-types'
-import { Link } from 'react-router-dom'
-import _isObject from 'lodash/isObject'
-import _findIndex from 'lodash/findIndex'
-import _isEqual from 'lodash/isEqual'
-import _isFinite from 'lodash/isFinite'
-import { FormattedMessage, injectIntl } from 'react-intl'
-import { messagesByDifficulty }
- from '../../../services/Challenge/ChallengeDifficulty/ChallengeDifficulty'
-import AsManager
- from '../../../interactions/User/AsManager'
-import CardChallenge from '../../CardChallenge/CardChallenge'
-import MarkdownContent from '../../MarkdownContent/MarkdownContent'
-import messages from './Messages'
-import './ChallengeResultItem.scss'
+import _findIndex from "lodash/findIndex";
+import _isEqual from "lodash/isEqual";
+import _isFinite from "lodash/isFinite";
+import _isObject from "lodash/isObject";
+import PropTypes from "prop-types";
+import { Component, createRef } from "react";
+import { FormattedMessage, injectIntl } from "react-intl";
+import { Link } from "react-router-dom";
+import AsManager from "../../../interactions/User/AsManager";
+import { messagesByDifficulty } from "../../../services/Challenge/ChallengeDifficulty/ChallengeDifficulty";
+import CardChallenge from "../../CardChallenge/CardChallenge";
+import MarkdownContent from "../../MarkdownContent/MarkdownContent";
+import messages from "./Messages";
+import "./ChallengeResultItem.scss";
/**
* ChallengeResultItem represents a single challenge result in a ChallengeResultList.
@@ -31,30 +29,29 @@ import './ChallengeResultItem.scss'
*/
export class ChallengeResultItem extends Component {
constructor(props) {
- super(props)
- this.itemRef = createRef()
+ super(props);
+ this.itemRef = createRef();
}
shouldComponentUpdate(nextProps) {
// Only re-render under specific conditions:
// if the user has changed
- if ((nextProps?.user?.id) !== (this.props.user?.id)) {
- return true
+ if (nextProps?.user?.id !== this.props.user?.id) {
+ return true;
}
// if the user's savedChallenges have changed
- if ((nextProps.user?.savedChallenges?.length) !==
- (this.props.user?.savedChallenges?.length)) {
- return true
+ if (nextProps.user?.savedChallenges?.length !== this.props.user?.savedChallenges?.length) {
+ return true;
}
// if the challenge object itself changed
if (!_isEqual(nextProps.challenge, this.props.challenge)) {
- return true
+ return true;
}
- return false
+ return false;
}
/**
@@ -65,23 +62,22 @@ export class ChallengeResultItem extends Component {
browseChallenge = () => {
this.props.history.push(
`/browse/${
- this.props.challenge.isVirtual ? 'virtual' : 'challenges'
+ this.props.challenge.isVirtual ? "virtual" : "challenges"
}/${this.props.challenge.id}`,
- { fromSearch: true }
- )
- }
+ { fromSearch: true },
+ );
+ };
render() {
// Setup saved status and controls based on whether the user has saved this
// challenge
- let isSaved = false
- let unsaveChallengeControl = null
- let saveChallengeControl = null
+ let isSaved = false;
+ let unsaveChallengeControl = null;
+ let saveChallengeControl = null;
if (_isObject(this.props.user) && !this.props.challenge.isVirtual) {
- if (_findIndex(this.props.user.savedChallenges,
- {id: this.props.challenge.id}) !== -1) {
- isSaved = true
+ if (_findIndex(this.props.user.savedChallenges, { id: this.props.challenge.id }) !== -1) {
+ isSaved = true;
unsaveChallengeControl = (
- )
- }
- else {
+ );
+ } else {
saveChallengeControl = (
- )
+ );
}
}
// Does this user own (or can manage) the current challenge?
- const isManageable =
- AsManager(this.props.user).canManageChallenge(this.props.challenge)
+ const isManageable = AsManager(this.props.user).canManageChallenge(this.props.challenge);
const manageControl = !isManageable ? null : (
- )
+ );
return (
@@ -134,18 +128,16 @@ export class ChallengeResultItem extends Component {
excludeProjectId={this.props.excludeProjectId}
info={
- {_isFinite(this.props.challenge.difficulty) &&
-
-
- {' '}
-
-
-
- }
+ {_isFinite(this.props.challenge.difficulty) && (
+
+
+ {" "}
+
+
+
+ )}
{
const ownerLimit = Number(window.env.REACT_APP_BROWSE_CHALLENGES_OWNER_LIMIT);
@@ -29,9 +27,9 @@ const limitUserResults = (challenges) => {
if (ownerLimit) {
const userDictionary = {};
- const limitedChallenges = challenges.filter(challenge => {
+ const limitedChallenges = challenges.filter((challenge) => {
const { owner } = challenge;
-
+
if (userDictionary[owner]) {
userDictionary[owner]++;
if (userDictionary[owner] > ownerLimit) {
@@ -40,15 +38,15 @@ const limitUserResults = (challenges) => {
} else {
userDictionary[owner] = 1;
}
-
+
return true;
});
-
+
return limitedChallenges;
}
return challenges;
-}
+};
/**
* ChallengeResultList applies the current challenge filters and the given
@@ -60,59 +58,68 @@ const limitUserResults = (challenges) => {
* @author [Neil Rotstan](https://github.com/nrotstan)
*/
export class ChallengeResultList extends Component {
- constructor(props) {
- super(props);
- this.listRef = createRef();
- this.state = { data: null, pauseFetch: true };
- }
-
-
- componentDidUpdate(prevProps) {
- const prevQuery = prevProps.searchFilters.project || prevProps.searchFilters.task;
- const currentQuery = this.props.searchFilters.project || this.props.searchFilters.task;
- const searchType = this.props.searchFilters.searchType
-
- if (prevQuery !== currentQuery && !isNaN(currentQuery) && searchType === "task" ) {
- this.fetchData();
- }
+ constructor(props) {
+ super(props);
+ this.listRef = createRef();
+ this.state = { data: null, pauseFetch: true };
+ }
+
+ componentDidUpdate(prevProps) {
+ const prevQuery = prevProps.searchFilters.project || prevProps.searchFilters.task;
+ const currentQuery = this.props.searchFilters.project || this.props.searchFilters.task;
+ const searchType = this.props.searchFilters.searchType;
+
+ if (prevQuery !== currentQuery && !isNaN(currentQuery) && searchType === "task") {
+ this.fetchData();
}
-
- async fetchData() {
- if (this.state.pauseFetch) {
- this.setState({ pauseFetch: false });
- const query = this.props.searchFilters.project || this.props.searchFilters.task;
-
- if (query) {
- try {
- const response = await fetch(`${window.env.REACT_APP_MAP_ROULETTE_SERVER_URL}/api/v2/task/${query}`);
- const responseJson = await response.json();
- this.setState({ data: responseJson });
- } catch (error) {
- console.error(error);
- this.setState({ data: null });
- }
+ }
+
+ async fetchData() {
+ if (this.state.pauseFetch) {
+ this.setState({ pauseFetch: false });
+ const query = this.props.searchFilters.project || this.props.searchFilters.task;
+
+ if (query) {
+ try {
+ const response = await fetch(
+ `${window.env.REACT_APP_MAP_ROULETTE_SERVER_URL}/api/v2/task/${query}`,
+ );
+ const responseJson = await response.json();
+ this.setState({ data: responseJson });
+ } catch (error) {
+ console.error(error);
+ this.setState({ data: null });
}
-
- this.setState({ pauseFetch: true });
}
+
+ this.setState({ pauseFetch: true });
}
+ }
render() {
- const search = this.props.currentSearch?.challenges ?? {}
- const query = search.query ? search.query : this.props.searchFilters.project ? this.props.searchFilters.project : this.props.searchFilters.task
+ const search = this.props.currentSearch?.challenges ?? {};
+ const query = search.query
+ ? search.query
+ : this.props.searchFilters.project
+ ? this.props.searchFilters.project
+ : this.props.searchFilters.task;
const challengeResultsUnbound = _clone(this.props.pagedChallenges);
- const allChallenges = this.props.location?.pathname?.includes("browse/challenges")
- && (this.props.searchSort?.sortBy === "created"
- || _isEmpty(this.props.searchSort)
- || this.props.location.search.includes("default"))
+ const allChallenges =
+ this.props.location?.pathname?.includes("browse/challenges") &&
+ (this.props.searchSort?.sortBy === "created" ||
+ _isEmpty(this.props.searchSort) ||
+ this.props.location.search.includes("default"))
? limitUserResults(challengeResultsUnbound)
: challengeResultsUnbound;
-
- const challengeResults = this.props.project?.id && this.props.remainingChallengeOnly ? _filter(allChallenges, (challenge) => {
- return (isUsableChallengeStatus(challenge.status))
- }) : allChallenges
-
+
+ const challengeResults =
+ this.props.project?.id && this.props.remainingChallengeOnly
+ ? _filter(allChallenges, (challenge) => {
+ return isUsableChallengeStatus(challenge.status);
+ })
+ : allChallenges;
+
const uniqueParents = new Set();
const projectResults = this.props.challenges?.reduce((result, challenge) => {
@@ -122,7 +129,6 @@ export class ChallengeResultList extends Component {
}
return result;
}, []);
-
const uniqueParentIds = new Set();
@@ -134,40 +140,49 @@ export class ChallengeResultList extends Component {
return result;
}, []);
- const isFetching = (this.props.fetchingChallenges ?? []).length > 0
- const searchType = this.props.searchFilters.searchType
- const bounds = search?.mapBounds?.bounds
- const locationFilter = search?.filters?.location
- const otherFilters = _omit(search.filters, ['location'])
+ const isFetching = (this.props.fetchingChallenges ?? []).length > 0;
+ const searchType = this.props.searchFilters.searchType;
+ const bounds = search?.mapBounds?.bounds;
+ const locationFilter = search?.filters?.location;
+ const otherFilters = _omit(search.filters, ["location"]);
const unfiltered =
_isEmpty(search.query) &&
_isEmpty(otherFilters) &&
- (_isEmpty(locationFilter) || !bounds || !boundsWithinAllowedMaxDegrees(bounds))
+ (_isEmpty(locationFilter) || !bounds || !boundsWithinAllowedMaxDegrees(bounds));
- let matchedId = []
- if(!isNaN(query) && query && !this.props.history.location.pathname.includes('browse/projects/')) {
- if(this.props.searchFilters.searchType == "projects"){
+ let matchedId = [];
+ if (
+ !isNaN(query) &&
+ query &&
+ !this.props.history.location.pathname.includes("browse/projects/")
+ ) {
+ if (this.props.searchFilters.searchType == "projects") {
matchedId = _filter(projectIdResults, (item) => item.id.toString() === query.toString());
} else {
- matchedId = _filter(this.props.unfilteredChallenges, (item) => item.id.toString() === query.toString());
+ matchedId = _filter(
+ this.props.unfilteredChallenges,
+ (item) => item.id.toString() === query.toString(),
+ );
}
}
// If no filters are applied, inject any featured projects
if (unfiltered && this.props.featuredProjects.length > 0) {
// Try to locate them right above any featured challenges in the results
- let featuredIndex = _findIndex(challengeResults, {featured: true})
+ let featuredIndex = _findIndex(challengeResults, { featured: true });
if (featuredIndex === -1) {
// No featured challenges. If no sorting is in play, inject at top (after any
// saved challenges, if present)
if (_isEmpty(search?.sort?.sortBy)) {
- const savedChallenges = this.props.user?.savedChallenges ?? []
- featuredIndex =
- _findIndex(challengeResults, result => _findIndex(savedChallenges, {id: result.id}) === -1)
+ const savedChallenges = this.props.user?.savedChallenges ?? [];
+ featuredIndex = _findIndex(
+ challengeResults,
+ (result) => _findIndex(savedChallenges, { id: result.id }) === -1,
+ );
}
}
if (featuredIndex !== -1) {
- challengeResults.splice(featuredIndex, 0, ...this.props.featuredProjects)
+ challengeResults.splice(featuredIndex, 0, ...this.props.featuredProjects);
}
}
@@ -182,19 +197,23 @@ export class ChallengeResultList extends Component {
);
}
-
- if (!isNaN(query) && query && !this.props.history.location.pathname.includes('browse/projects/')) {
+
+ if (
+ !isNaN(query) &&
+ query &&
+ !this.props.history.location.pathname.includes("browse/projects/")
+ ) {
// Filters for Task Id
if (searchType === "task") {
let matchedChallengeId = null;
-
if (this.state.data) {
- matchedChallengeId = _filter(this.props.unfilteredChallenges, (item) =>
- item.id.toString() === this.state.data.parent.toString()
+ matchedChallengeId = _filter(
+ this.props.unfilteredChallenges,
+ (item) => item.id.toString() === this.state.data.parent.toString(),
);
}
-
+
if (matchedChallengeId && matchedChallengeId.length > 0) {
detectedIds = (
@@ -233,7 +252,7 @@ export class ChallengeResultList extends Component {
);
- }
+ }
} else if (matchedId.length === 0) {
detectedIds = (
@@ -242,7 +261,7 @@ export class ChallengeResultList extends Component {
);
- // Filters for Challenge Id
+ // Filters for Challenge Id
} else if (searchType === undefined || searchType === "challenges") {
detectedIds = (
@@ -257,7 +276,7 @@ export class ChallengeResultList extends Component {
/>
);
- // Filters for Project Id
+ // Filters for Project Id
} else if (searchType === "projects") {
detectedIds = (
@@ -274,8 +293,8 @@ export class ChallengeResultList extends Component {
);
}
}
-
- let results = null
+
+ let results = null;
if (challengeResults.length === 0) {
if (!isFetching) {
results = (
@@ -284,25 +303,32 @@ export class ChallengeResultList extends Component {
- )
+ );
}
- } else if (this.props.history.location.pathname.includes('browse/projects/') || searchType === undefined || searchType === "challenges") {
- results = _compact(_map(challengeResults, (result) => {
- if (result.parent) {
- return (
-
- );
- }
- }))
+ } else if (
+ this.props.history.location.pathname.includes("browse/projects/") ||
+ searchType === undefined ||
+ searchType === "challenges"
+ ) {
+ results = _compact(
+ _map(challengeResults, (result) => {
+ if (result.parent) {
+ return (
+
+ );
+ }
+ }),
+ );
} else if (!this.props.excludeProjectResults && searchType === "projects" && projectResults) {
- results = _compact(_map(projectResults, (result) => {
+ results = _compact(
+ _map(projectResults, (result) => {
return (
- )
- }))
+ );
+ }),
+ );
} else {
- results = null
+ results = null;
}
-
+
return (
@@ -341,13 +368,10 @@ export class ChallengeResultList extends Component {
{results}
- )
+ );
}
}
@@ -363,14 +387,13 @@ ChallengeResultList.propTypes = {
/** Remaining challenges after challenges have been paged */
pagedChallenges: PropTypes.array.isRequired,
-}
+};
-export default
- WithCurrentUser(
- WithFeatured(
- WithSortedChallenges(
- WithPagedChallenges(injectIntl(ChallengeResultList), 'challenges', 'pagedChallenges')
- ),
- { excludeChallenges: true } // just featured projects; we already get challenges
- )
- )
+export default WithCurrentUser(
+ WithFeatured(
+ WithSortedChallenges(
+ WithPagedChallenges(injectIntl(ChallengeResultList), "challenges", "pagedChallenges"),
+ ),
+ { excludeChallenges: true }, // just featured projects; we already get challenges
+ ),
+);
diff --git a/src/components/ChallengePane/ChallengeResultList/Messages.js b/src/components/ChallengePane/ChallengeResultList/Messages.js
index 0658c362c..602bf9161 100644
--- a/src/components/ChallengePane/ChallengeResultList/Messages.js
+++ b/src/components/ChallengePane/ChallengeResultList/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeResultList.
@@ -27,8 +27,8 @@ export default defineMessages({
completedChallengeCount: {
id: "Challenge.fields.ChallengeResultList.label",
defaultMessage:
- "{count,plural,=0{No challenges} one{# challenge} other{# challenges}} " +
- "completed in project"
+ "{count,plural,=0{No challenges} one{# challenge} other{# challenges}} " +
+ "completed in project",
},
project: {
@@ -37,8 +37,8 @@ export default defineMessages({
},
locatedIn: {
- id: 'ChallengeFilterSubnav.filter.locatedIn.label',
- defaultMessage: 'Located in ',
+ id: "ChallengeFilterSubnav.filter.locatedIn.label",
+ defaultMessage: "Located in ",
},
tooManyTasksLabel: {
@@ -75,4 +75,4 @@ export default defineMessages({
id: "Challenge.controls.goTo.label",
defaultMessage: "Go directly to:",
},
-})
+});
diff --git a/src/components/ChallengePane/ChallengeResultList/PageResultsButton.jsx b/src/components/ChallengePane/ChallengeResultList/PageResultsButton.jsx
index 008b99bc2..9d47b1343 100644
--- a/src/components/ChallengePane/ChallengeResultList/PageResultsButton.jsx
+++ b/src/components/ChallengePane/ChallengeResultList/PageResultsButton.jsx
@@ -1,10 +1,9 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { FormattedMessage } from 'react-intl'
-import { RESULTS_PER_PAGE } from '../../../services/Search/Search'
-import LoadMoreButton from '../../LoadMoreButton/LoadMoreButton'
-import messages from './Messages'
-
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { FormattedMessage } from "react-intl";
+import { RESULTS_PER_PAGE } from "../../../services/Search/Search";
+import LoadMoreButton from "../../LoadMoreButton/LoadMoreButton";
+import messages from "./Messages";
/**
* LoadMoreButton renders a 'load more' button that can be used
@@ -14,15 +13,17 @@ import messages from './Messages'
*/
export default class PageResultsButton extends Component {
render() {
- const resultsPerPage = this.props.searchPage?.resultsPerPage ?? RESULTS_PER_PAGE
- const currentPage = this.props.searchPage?.currentPage ?? 0
+ const resultsPerPage = this.props.searchPage?.resultsPerPage ?? RESULTS_PER_PAGE;
+ const currentPage = this.props.searchPage?.currentPage ?? 0;
return (
-
this.props.setSearchPage({currentPage: (currentPage + 1), resultsPerPage})} >
+ this.props.setSearchPage({ currentPage: currentPage + 1, resultsPerPage })}
+ >
- )
+ );
}
}
@@ -33,4 +34,4 @@ PageResultsButton.propTypes = {
hasMoreResults: PropTypes.bool,
/** Boolean flag indicating we should show a busy spinner */
isLoading: PropTypes.bool,
-}
+};
diff --git a/src/components/ChallengePane/Messages.js b/src/components/ChallengePane/Messages.js
index f7d2d16f0..5cd204926 100644
--- a/src/components/ChallengePane/Messages.js
+++ b/src/components/ChallengePane/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengePane
@@ -6,41 +6,41 @@ import { defineMessages } from 'react-intl'
export default defineMessages({
taskInfoLabel: {
id: "ChallengePane.controls.taskInfo.label",
- defaultMessage: "Task Info:"
+ defaultMessage: "Task Info:",
},
-
+
challengeNameLabel: {
id: "ChallengePane.controls.challengeName.label",
- defaultMessage: "Challenge Name:"
+ defaultMessage: "Challenge Name:",
},
challengeIdLabel: {
id: "ChallengePane.controls.challengeId.label",
- defaultMessage: "Challenge Id:"
+ defaultMessage: "Challenge Id:",
},
taskNameLabel: {
id: "ChallengePane.controls.taskName.label",
- defaultMessage: "Task Name:"
+ defaultMessage: "Task Name:",
},
taskIdLabel: {
id: "ChallengePane.controls.taskId.label",
- defaultMessage: "Task Id:"
+ defaultMessage: "Task Id:",
},
startTaskLabel: {
id: "ChallengePane.controls.startTask.label",
- defaultMessage: "Start Task"
+ defaultMessage: "Start Task",
},
showArchivedLabel: {
id: "ChallengePane.controls.showArchived.label",
- defaultMessage: "Show Archived"
+ defaultMessage: "Show Archived",
},
showGlobalLabel: {
id: "ChallengePane.controls.showGlobal.label",
- defaultMessage: "Show Global Challenges"
- }
-})
+ defaultMessage: "Show Global Challenges",
+ },
+});
diff --git a/src/components/ChallengePane/ProjectResultItem/ProjectResultItem.jsx b/src/components/ChallengePane/ProjectResultItem/ProjectResultItem.jsx
index 24c5c81ba..0978ad8d5 100644
--- a/src/components/ChallengePane/ProjectResultItem/ProjectResultItem.jsx
+++ b/src/components/ChallengePane/ProjectResultItem/ProjectResultItem.jsx
@@ -1,8 +1,8 @@
-import { createRef, Component } from 'react'
-import PropTypes from 'prop-types'
-import _isEqual from 'lodash/isEqual'
-import { injectIntl } from 'react-intl'
-import CardProject from '../../CardProject/CardProject'
+import _isEqual from "lodash/isEqual";
+import PropTypes from "prop-types";
+import { Component, createRef } from "react";
+import { injectIntl } from "react-intl";
+import CardProject from "../../CardProject/CardProject";
/**
* ProjectResultItem represents a single challenge result in a ChallengeResultList.
@@ -20,24 +20,24 @@ import CardProject from '../../CardProject/CardProject'
*/
export class ProjectResultItem extends Component {
constructor(props) {
- super(props)
- this.itemRef = createRef()
+ super(props);
+ this.itemRef = createRef();
}
shouldComponentUpdate(nextProps) {
// Only re-render under specific conditions:
// if the user has changed
- if ((nextProps?.user?.id) !== (this.props.user?.id)) {
- return true
+ if (nextProps?.user?.id !== this.props.user?.id) {
+ return true;
}
// if the project object itself changed
if (!_isEqual(nextProps.project, this.props.project)) {
- return true
+ return true;
}
- return false
+ return false;
}
/**
@@ -46,11 +46,8 @@ export class ProjectResultItem extends Component {
* @private
*/
browseProject = () => {
- this.props.history.push(
- `/browse/projects/${this.props.project.id}`,
- { fromSearch: true }
- )
- }
+ this.props.history.push(`/browse/projects/${this.props.project.id}`, { fromSearch: true });
+ };
render() {
return (
@@ -73,6 +70,6 @@ ProjectResultItem.propTypes = {
user: PropTypes.object,
/** The project represented by this item */
project: PropTypes.object.isRequired,
-}
+};
-export default injectIntl(ProjectResultItem)
+export default injectIntl(ProjectResultItem);
diff --git a/src/components/ChallengePane/StartVirtualChallenge/Messages.js b/src/components/ChallengePane/StartVirtualChallenge/Messages.js
index 2379d0c94..8928bcc86 100644
--- a/src/components/ChallengePane/StartVirtualChallenge/Messages.js
+++ b/src/components/ChallengePane/StartVirtualChallenge/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with StartVirtualChallenge
@@ -16,16 +16,16 @@ export default defineMessages({
startLabel: {
id: "VirtualChallenge.controls.start.label",
- defaultMessage: 'Start',
+ defaultMessage: "Start",
},
tooManyTasks: {
id: "VirtualChallenge.tooManyTasks",
- defaultMessage: 'At most {max} tasks can be worked on at once',
+ defaultMessage: "At most {max} tasks can be worked on at once",
},
selectedCount: {
id: "VirtualChallenge.selectedCount",
- defaultMessage: 'You have {count} selected',
+ defaultMessage: "You have {count} selected",
},
-})
+});
diff --git a/src/components/ChallengePane/StartVirtualChallenge/StartVirtualChallenge.jsx b/src/components/ChallengePane/StartVirtualChallenge/StartVirtualChallenge.jsx
index e5bb7fb4b..6e802e6e9 100644
--- a/src/components/ChallengePane/StartVirtualChallenge/StartVirtualChallenge.jsx
+++ b/src/components/ChallengePane/StartVirtualChallenge/StartVirtualChallenge.jsx
@@ -1,14 +1,14 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { injectIntl } from 'react-intl'
-import classNames from 'classnames'
-import { FormattedMessage } from 'react-intl'
-import _isObject from 'lodash/isObject'
-import _reduce from 'lodash/reduce'
-import QuickTextBox from '../../QuickTextBox/QuickTextBox'
-import SignInButton from '../../SignInButton/SignInButton'
-import BusySpinner from '../../BusySpinner/BusySpinner'
-import messages from './Messages'
+import classNames from "classnames";
+import _isObject from "lodash/isObject";
+import _reduce from "lodash/reduce";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { injectIntl } from "react-intl";
+import { FormattedMessage } from "react-intl";
+import BusySpinner from "../../BusySpinner/BusySpinner";
+import QuickTextBox from "../../QuickTextBox/QuickTextBox";
+import SignInButton from "../../SignInButton/SignInButton";
+import messages from "./Messages";
/**
* StartVirtualChallenge renders a control for initiating creation of
@@ -23,58 +23,59 @@ export class StartVirtualChallenge extends Component {
/** Determines whether to show the name input */
editingName: false,
/** Current value of name input */
- challengeName: '',
+ challengeName: "",
creatingVirtualChallenge: false,
- }
+ };
/** Invoked to display the virtual challenge name input field */
- startEditing = () => this.setState({editingName: true, challengeName: ''})
+ startEditing = () => this.setState({ editingName: true, challengeName: "" });
/** Updates the current value of the challenge name */
- setChallengeName = challengeName => this.setState({challengeName})
+ setChallengeName = (challengeName) => this.setState({ challengeName });
/** Invoked to successfully complete editing of the name */
finishEditing = () => {
- this.setState({creatingVirtualChallenge: true})
- this.props.createVirtualChallenge(
- this.state.challengeName, this.props.selectedClusters
- ).catch(() => null).then(() => this.setState({creatingVirtualChallenge: false}))
+ this.setState({ creatingVirtualChallenge: true });
+ this.props
+ .createVirtualChallenge(this.state.challengeName, this.props.selectedClusters)
+ .catch(() => null)
+ .then(() => this.setState({ creatingVirtualChallenge: false }));
- this.setState({editingName: false, challengeName: ''})
- }
+ this.setState({ editingName: false, challengeName: "" });
+ };
/** Invoked to cancel editing of the name */
- cancelEditing = () => this.setState({editingName: false, challengeName: ''})
+ cancelEditing = () => this.setState({ editingName: false, challengeName: "" });
- maxAllowedTasks = () => parseInt(window.env?.REACT_APP_VIRTUAL_CHALLENGE_MAX_TASKS ?? 10000)
+ maxAllowedTasks = () => parseInt(window.env?.REACT_APP_VIRTUAL_CHALLENGE_MAX_TASKS ?? 10000);
render() {
- const taskCount =
- _reduce(this.props.selectedClusters, (total, cluster) => total + cluster.numberOfPoints, 0)
+ const taskCount = _reduce(
+ this.props.selectedClusters,
+ (total, cluster) => total + cluster.numberOfPoints,
+ 0,
+ );
- let creationStep = null
+ let creationStep = null;
if (this.props.creatingVirtualChallenge || this.state.creatingVirtualChallenge) {
creationStep = (
- )
- }
- else if (taskCount > this.maxAllowedTasks()) {
+ );
+ } else if (taskCount > this.maxAllowedTasks()) {
creationStep = (
- )
- }
- else if (this.state.editingName) {
+ );
+ } else if (this.state.editingName) {
if (!_isObject(this.props.user)) {
- creationStep =
-
- )
+ );
}
return (
-
- {creationStep}
-
+
{creationStep}
- )
+ );
}
}
@@ -120,10 +116,10 @@ StartVirtualChallenge.propTypes = {
createVirtualChallenge: PropTypes.func.isRequired,
/** Set to true if the virtual challenge is in process of being created */
creatingVirtualChallenge: PropTypes.bool,
-}
+};
StartVirtualChallenge.defaultProps = {
creatingVirtualChallenge: false,
-}
+};
-export default injectIntl(StartVirtualChallenge)
+export default injectIntl(StartVirtualChallenge);
diff --git a/src/components/ChallengePane/TaskChallengeMarkerContent.jsx b/src/components/ChallengePane/TaskChallengeMarkerContent.jsx
index b4258f909..87ce2021d 100644
--- a/src/components/ChallengePane/TaskChallengeMarkerContent.jsx
+++ b/src/components/ChallengePane/TaskChallengeMarkerContent.jsx
@@ -1,46 +1,56 @@
-import { Component } from 'react'
-import WithLoadedTask from '../HOCs/WithLoadedTask/WithLoadedTask'
-import messages from './Messages'
+import { Component } from "react";
+import WithLoadedTask from "../HOCs/WithLoadedTask/WithLoadedTask";
+import messages from "./Messages";
/**
* The content to show in the popup when a task marker is clicked.
*/
class TaskChallengeMarkerContent extends Component {
render() {
- const markerData = this.props.marker
- let challengeId = markerData.options.parentId ||
- (this.props.task?.parent?.id)
- if (!challengeId &&
- (markerData.options?.challengeIds?.length ?? 0) === 1) {
- challengeId = markerData.options.challengeIds[0]
+ const markerData = this.props.marker;
+ let challengeId = markerData.options.parentId || this.props.task?.parent?.id;
+ if (!challengeId && (markerData.options?.challengeIds?.length ?? 0) === 1) {
+ challengeId = markerData.options.challengeIds[0];
}
return (
-
+
@@ -49,4 +59,4 @@ class TaskChallengeMarkerContent extends Component {
}
}
-export default WithLoadedTask(TaskChallengeMarkerContent)
+export default WithLoadedTask(TaskChallengeMarkerContent);
diff --git a/src/components/ChallengeProgress/ChallengeProgress.jsx b/src/components/ChallengeProgress/ChallengeProgress.jsx
index 0869fcf79..080ebc507 100644
--- a/src/components/ChallengeProgress/ChallengeProgress.jsx
+++ b/src/components/ChallengeProgress/ChallengeProgress.jsx
@@ -1,24 +1,31 @@
-import { Fragment, Component } from 'react'
-import PropTypes from 'prop-types'
-import classNames from 'classnames'
-import { FormattedMessage, FormattedNumber, injectIntl } from 'react-intl'
-import { ResponsiveBar } from '@nivo/bar'
-import _isObject from 'lodash/isObject'
-import _map from 'lodash/map'
-import _each from 'lodash/each'
-import _chunk from 'lodash/chunk'
-import _isEqual from 'lodash/isEqual'
-import { TaskPriority, keysByPriority, taskPriorityLabels }
- from '../../services/Task/TaskPriority/TaskPriority'
-import { TaskStatus, TaskStatusColors, keysByStatus, statusLabels }
- from '../../services/Task/TaskStatus/TaskStatus'
-import SvgSymbol from '../SvgSymbol/SvgSymbol'
-import messages from './Messages'
-import './ChallengeProgress.scss'
-import resolveConfig from 'tailwindcss/resolveConfig'
-import tailwindConfig from '../../tailwind.config.js'
-
-const colors = resolveConfig(tailwindConfig).theme.colors
+import { ResponsiveBar } from "@nivo/bar";
+import classNames from "classnames";
+import _chunk from "lodash/chunk";
+import _each from "lodash/each";
+import _isEqual from "lodash/isEqual";
+import _isObject from "lodash/isObject";
+import _map from "lodash/map";
+import PropTypes from "prop-types";
+import { Component, Fragment } from "react";
+import { FormattedMessage, FormattedNumber, injectIntl } from "react-intl";
+import {
+ TaskPriority,
+ keysByPriority,
+ taskPriorityLabels,
+} from "../../services/Task/TaskPriority/TaskPriority";
+import {
+ TaskStatus,
+ TaskStatusColors,
+ keysByStatus,
+ statusLabels,
+} from "../../services/Task/TaskStatus/TaskStatus";
+import SvgSymbol from "../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
+import "./ChallengeProgress.scss";
+import resolveConfig from "tailwindcss/resolveConfig";
+import tailwindConfig from "../../tailwind.config.js";
+
+const colors = resolveConfig(tailwindConfig).theme.colors;
export const ProgressTooltip = (props) => {
return (
@@ -27,42 +34,42 @@ export const ProgressTooltip = (props) => {
{props.input.label}
{props.input.value}%
{_map(challengeStatsColumns, (stats, index1) => (
- {_map(stats, (stat, index2) => (
-
-
- {this.props.prominentCounts ?
-
- {stat[1].count >= 0 ? stat[1].count : '--'}
- :
-
- {isNaN(stat[1].percent) ? '--' :
- /* eslint-disable-next-line react/style-prop-object */
-
- }
-
- (
+
+
+ {this.props.prominentCounts ? (
+ {stat[1].count >= 0 ? stat[1].count : "--"}
+ ) : (
+
+ {isNaN(stat[1].percent) ? (
+ "--"
+ ) : (
+ /* eslint-disable-next-line react/style-prop-object */
+
+ )}
+
+
+ {stat[0]}{" "}
+
+ {this.props.prominentCounts ? (
+
+ (
+ {isNaN(stat[1].percent) ? (
+ "--"
+ ) : (
+ /* eslint-disable-next-line react/style-prop-object */
+
+ ) : (
+
+ ({stat[1].count >= 0 ? stat[1].count : "--"}/
+ {taskActions.total >= 0 ? taskActions.total : "--"})
+
)}
- >
- {stat[0]}{' '}
-
- {this.props.prominentCounts ?
-
- ({isNaN(stat[1].percent) ? '--' :
- /* eslint-disable-next-line react/style-prop-object */
- :
-
- ({stat[1].count >= 0 ? stat[1].count : '--'}/{taskActions.total >= 0 ? taskActions.total : '--'})
-
- }
-
-
- ))}
+
+
+ ))}
))}
-
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}}
- tooltip={(input) => 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 }}
+ tooltip={(input) =>
- )
+ );
else {
- return null
+ return null;
}
}
calculateChallengeStats(taskActions, orderedStatuses, localizedStatuses) {
- let challengeStats = {}
- _each(orderedStatuses, status => {
+ let challengeStats = {};
+ _each(orderedStatuses, (status) => {
challengeStats[localizedStatuses[keysByStatus[status]]] = {
count: taskActions[keysByStatus[status]],
percent: this.percent(taskActions[keysByStatus[status]], taskActions.total),
- }
- })
+ };
+ });
- return challengeStats
+ return challengeStats;
}
calculateCompletionData(taskActions, availableLabel, localizedStatuses) {
const completionData = {
- "label": this.props.intl.formatMessage(messages.tooltipLabel),
+ label: this.props.intl.formatMessage(messages.tooltipLabel),
[availableLabel]: this.percent(taskActions.available, taskActions.total),
- }
+ };
- _each(orderedStatuses, status => {
- completionData[localizedStatuses[keysByStatus[status]]] =
- this.percent(taskActions[keysByStatus[status]], taskActions.total)
- })
+ _each(orderedStatuses, (status) => {
+ completionData[localizedStatuses[keysByStatus[status]]] = this.percent(
+ taskActions[keysByStatus[status]],
+ taskActions.total,
+ );
+ });
- return completionData
+ return completionData;
}
render() {
- const taskActions = this.props.challenge?.actions || this.props.taskMetrics
- const taskPriorityActions = this.props.taskMetricsByPriority
+ const taskActions = this.props.challenge?.actions || this.props.taskMetrics;
+ const taskPriorityActions = this.props.taskMetricsByPriority;
if (!_isObject(taskActions)) {
- return null
+ return null;
}
- let calculatedSeconds = null
- let averageTime = null
- if ((taskActions?.tasksWithTime ?? 0) > 0 &&
- (taskActions?.totalTimeSpent ?? 0) > 0) {
- calculatedSeconds = taskActions.totalTimeSpent / taskActions.tasksWithTime / 1000
- }
- else if ((taskActions?.avgTimeSpent ?? 0) > 0) {
- calculatedSeconds = taskActions.avgTimeSpent / 1000
+ let calculatedSeconds = null;
+ let averageTime = null;
+ if ((taskActions?.tasksWithTime ?? 0) > 0 && (taskActions?.totalTimeSpent ?? 0) > 0) {
+ calculatedSeconds = taskActions.totalTimeSpent / taskActions.tasksWithTime / 1000;
+ } else if ((taskActions?.avgTimeSpent ?? 0) > 0) {
+ calculatedSeconds = taskActions.avgTimeSpent / 1000;
}
if (calculatedSeconds) {
- averageTime =
+ averageTime = (
{Math.floor(calculatedSeconds / 60)}m {Math.floor(calculatedSeconds) % 60}s
- {this.props.noteAvgExcludesSkip &&
+ {this.props.noteAvgExcludesSkip && (
- }
+ )}
+ );
}
- const localizedStatuses = statusLabels(this.props.intl)
- const availableLabel = this.props.intl.formatMessage(messages.available)
+ const localizedStatuses = statusLabels(this.props.intl);
+ const availableLabel = this.props.intl.formatMessage(messages.available);
const statusColors = {
[localizedStatuses.fixed]: TaskStatusColors[TaskStatus.fixed],
@@ -281,44 +291,61 @@ export class ChallengeProgress extends Component {
[localizedStatuses.falsePositive]: TaskStatusColors[TaskStatus.falsePositive],
[localizedStatuses.skipped]: TaskStatusColors[TaskStatus.skipped],
[localizedStatuses.tooHard]: TaskStatusColors[TaskStatus.tooHard],
- [availableLabel]: 'rgba(0, 0, 0, .25)',
- }
-
- const orderedKeys = _map(orderedStatuses, status =>
- localizedStatuses[keysByStatus[status]]
- ).concat([availableLabel])
-
- const completionData = this.calculateCompletionData(taskActions, availableLabel, localizedStatuses)
- const challengeStats = this.calculateChallengeStats(taskActions, orderedStatuses, localizedStatuses)
+ [availableLabel]: "rgba(0, 0, 0, .25)",
+ };
+
+ const orderedKeys = _map(
+ orderedStatuses,
+ (status) => localizedStatuses[keysByStatus[status]],
+ ).concat([availableLabel]);
+
+ const completionData = this.calculateCompletionData(
+ taskActions,
+ availableLabel,
+ localizedStatuses,
+ );
+ const challengeStats = this.calculateChallengeStats(
+ taskActions,
+ orderedStatuses,
+ localizedStatuses,
+ );
const prioritizedCompletionProgress = _map(TaskPriority, (priority) => {
if (taskPriorityActions?.[priority]) {
- const localizedPriorityLabels = taskPriorityLabels(this.props.intl)
- const pActions = taskPriorityActions[priority]
-
- const completionPriorityData = this.calculateCompletionData(pActions, availableLabel, localizedStatuses)
- const challengePriorityStats = this.calculateChallengeStats(pActions, orderedStatuses, localizedStatuses)
+ const localizedPriorityLabels = taskPriorityLabels(this.props.intl);
+ const pActions = taskPriorityActions[priority];
+
+ const completionPriorityData = this.calculateCompletionData(
+ pActions,
+ availableLabel,
+ localizedStatuses,
+ );
+ const challengePriorityStats = this.calculateChallengeStats(
+ pActions,
+ orderedStatuses,
+ localizedStatuses,
+ );
return (
{this.generatePercentages(pActions, _chunk(Object.entries(challengePriorityStats), 3))}
{this.generateProgressBar(pActions, completionPriorityData, statusColors, orderedKeys)}
{this.generateProgressBarLabel(pActions)}
- )
+ );
}
- })
+ });
return (
@@ -328,11 +355,11 @@ export class ChallengeProgress extends Component {
{averageTime}
- {taskPriorityActions && this.props.setShowByPriority &&
+ {taskPriorityActions && this.props.setShowByPriority && (
this.props.setShowByPriority(!this.props.showByPriority)}
>
@@ -343,22 +370,21 @@ export class ChallengeProgress extends Component {
- }
+ )}
{this.props.showByPriority && prioritizedCompletionProgress}
);
}
}
-
-
ChallengeProgress.propTypes = {
taskMetrics: PropTypes.object,
-}
+};
-export default injectIntl(ChallengeProgress)
+export default injectIntl(ChallengeProgress);
diff --git a/src/components/ChallengeProgress/ChallengeProgress.test.jsx b/src/components/ChallengeProgress/ChallengeProgress.test.jsx
index cf6fa65d6..c4a1ee3ae 100644
--- a/src/components/ChallengeProgress/ChallengeProgress.test.jsx
+++ b/src/components/ChallengeProgress/ChallengeProgress.test.jsx
@@ -1,13 +1,11 @@
-import { describe, it, expect } from "vitest";
+import { describe, expect, it } from "vitest";
import "@testing-library/jest-dom";
import { ProgressTooltip } from "./ChallengeProgress";
describe("ProgressTooltip", () => {
it("renders value with % sign", () => {
- const { getByText } = global.withProvider(
-
@@ -34,8 +33,8 @@ export class ChallengeSnapshotProgress extends Component {
- )
+ );
}
}
-export default ChallengeSnapshotProgress
+export default ChallengeSnapshotProgress;
diff --git a/src/components/ChallengeProgress/Messages.js b/src/components/ChallengeProgress/Messages.js
index 9f18a0d37..e2b8b0819 100644
--- a/src/components/ChallengeProgress/Messages.js
+++ b/src/components/ChallengeProgress/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ChallengeProgress
@@ -6,46 +6,46 @@ import { defineMessages } from 'react-intl'
export default defineMessages({
available: {
id: "Task.fauxStatus.available",
- defaultMessage: "Available"
+ defaultMessage: "Available",
},
tooltipLabel: {
id: "ChallengeProgress.tooltip.label",
- defaultMessage: "Tasks"
+ defaultMessage: "Tasks",
},
tasksRemaining: {
id: "ChallengeProgress.tasks.remaining",
- defaultMessage: "Tasks Remaining: {taskCount, number}"
+ defaultMessage: "Tasks Remaining: {taskCount, number}",
},
outOfTotal: {
id: "ChallengeProgress.tasks.totalCount",
- defaultMessage: " of {totalCount, number}"
+ defaultMessage: " of {totalCount, number}",
},
byPriorityToggle: {
id: "ChallengeProgress.priority.toggle",
- defaultMessage: "View by Task Priority"
+ defaultMessage: "View by Task Priority",
},
priorityLabel: {
id: "ChallengeProgress.priority.label",
- defaultMessage: "{priority} Priority Tasks"
+ defaultMessage: "{priority} Priority Tasks",
},
reviewStatusLabel: {
id: "ChallengeProgress.reviewStatus.label",
- defaultMessage: "Review Status"
+ defaultMessage: "Review Status",
},
avgTimeSpent: {
id: "ChallengeProgress.metrics.averageTime.label",
- defaultMessage: "Avg time per task:"
+ defaultMessage: "Avg time per task:",
},
excludesSkip: {
id: "ChallengeProgress.metrics.excludesSkip.label",
- defaultMessage: "(excluding skipped tasks)"
+ defaultMessage: "(excluding skipped tasks)",
},
-})
+});
diff --git a/src/components/CheckForToken/CheckForToken.jsx b/src/components/CheckForToken/CheckForToken.jsx
index 9c2cd648d..db5dc2cf9 100644
--- a/src/components/CheckForToken/CheckForToken.jsx
+++ b/src/components/CheckForToken/CheckForToken.jsx
@@ -1,5 +1,5 @@
import { useEffect, useState } from "react";
-import { useDispatch } from 'react-redux'
+import { useDispatch } from "react-redux";
import { UseRouter } from "../../hooks/UseRouter/UseRouter";
import { callback } from "../../services/User/User";
@@ -8,47 +8,49 @@ export const CheckForToken = ({ children }) => {
query: { code, state },
location,
history,
- push
+ push,
} = UseRouter();
- const [verifying, setVerifying] = useState(false)
- const dispatch = useDispatch()
+ const [verifying, setVerifying] = useState(false);
+ const dispatch = useDispatch();
const authCode = code;
useEffect(() => {
if (authCode) {
- const storedState = localStorage.getItem('state')
-
- if (storedState === state || process.env.NODE_ENV === 'development') {
- setVerifying(true)
- callback(authCode, dispatch, push).then(() => {
- const queryParams = new URLSearchParams(location.search)
-
- if (queryParams.has('code')) {
- queryParams.delete('code')
- queryParams.delete('state')
- history.replace({
- search: queryParams.toString(),
- })
-
- setVerifying(false)
- localStorage.removeItem('state');
- }
- }).catch(() => {
- setVerifying(false)
- localStorage.removeItem('state');
- });
+ const storedState = localStorage.getItem("state");
+
+ if (storedState === state || process.env.NODE_ENV === "development") {
+ setVerifying(true);
+ callback(authCode, dispatch, push)
+ .then(() => {
+ const queryParams = new URLSearchParams(location.search);
+
+ if (queryParams.has("code")) {
+ queryParams.delete("code");
+ queryParams.delete("state");
+ history.replace({
+ search: queryParams.toString(),
+ });
+
+ setVerifying(false);
+ localStorage.removeItem("state");
+ }
+ })
+ .catch(() => {
+ setVerifying(false);
+ localStorage.removeItem("state");
+ });
} else {
- localStorage.removeItem('state');
+ localStorage.removeItem("state");
}
return;
} else {
- localStorage.removeItem('state');
+ localStorage.removeItem("state");
}
}, [authCode]);
if (verifying) {
- return
Verifying session...
+ return
Verifying session...
;
}
if (!authCode) {
@@ -58,4 +60,4 @@ export const CheckForToken = ({ children }) => {
return null;
};
-export default CheckForToken
+export default CheckForToken;
diff --git a/src/components/CommentList/CommentCountBadge/CommentCountBadge.jsx b/src/components/CommentList/CommentCountBadge/CommentCountBadge.jsx
index 4a00ef321..9ab208087 100644
--- a/src/components/CommentList/CommentCountBadge/CommentCountBadge.jsx
+++ b/src/components/CommentList/CommentCountBadge/CommentCountBadge.jsx
@@ -1,8 +1,8 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import classNames from 'classnames'
-import SvgSymbol from '../../SvgSymbol/SvgSymbol'
-import './CommentCountBadge.scss'
+import classNames from "classnames";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import SvgSymbol from "../../SvgSymbol/SvgSymbol";
+import "./CommentCountBadge.scss";
/**
* CommentCountBadge renders an icon with a badge containing a count of
@@ -15,20 +15,23 @@ import './CommentCountBadge.scss'
export default class CommentCountBadge extends Component {
render() {
return (
-
-
- )
+
+
+ );
}
}
CommentCountBadge.propTypes = {
comments: PropTypes.array,
tooltip: PropTypes.string,
-}
+};
CommentCountBadge.defaultProps = {
comments: [],
-}
+};
diff --git a/src/components/CommentList/CommentList.jsx b/src/components/CommentList/CommentList.jsx
index 12bddb8e8..744547565 100644
--- a/src/components/CommentList/CommentList.jsx
+++ b/src/components/CommentList/CommentList.jsx
@@ -1,18 +1,16 @@
-import { Fragment, Component } from 'react'
-import PropTypes from 'prop-types'
-import classNames from 'classnames'
-import { FormattedMessage,
- FormattedDate,
- FormattedTime } from 'react-intl'
-import { Link } from 'react-router-dom'
-import { parseISO } from 'date-fns'
-import _map from 'lodash/map'
-import _isObject from 'lodash/isObject'
-import _sortBy from 'lodash/sortBy'
-import _reverse from 'lodash/reverse'
-import _each from 'lodash/each'
-import MarkdownContent from '../MarkdownContent/MarkdownContent'
-import messages from './Messages'
+import classNames from "classnames";
+import { parseISO } from "date-fns";
+import _each from "lodash/each";
+import _isObject from "lodash/isObject";
+import _map from "lodash/map";
+import _reverse from "lodash/reverse";
+import _sortBy from "lodash/sortBy";
+import PropTypes from "prop-types";
+import { Component, Fragment } from "react";
+import { FormattedDate, FormattedMessage, FormattedTime } from "react-intl";
+import { Link } from "react-router-dom";
+import MarkdownContent from "../MarkdownContent/MarkdownContent";
+import messages from "./Messages";
/**
* CommentList renders the given comments as a list with some basic formatting,
@@ -22,90 +20,82 @@ import messages from './Messages'
*/
export default class CommentList extends Component {
render() {
- if (
- this.props.comments?.length === 0 &&
- this.props.taskComments?.length === 0
- ) {
+ if (this.props.comments?.length === 0 && this.props.taskComments?.length === 0) {
return (
- )
+ );
}
-
- let commentDates = []
-
+
+ let commentDates = [];
+
// Show in descending order, with the most recent comment first.
- let sortedComments = []
-
+ let sortedComments = [];
+
if (this.props.comments?.length !== 0) {
- commentDates = new Map()
+ commentDates = new Map();
_each(this.props.comments, (comment) =>
- commentDates.set(comment.id, parseISO(comment.created))
- )
-
+ commentDates.set(comment.id, parseISO(comment.created)),
+ );
+
// Show in descending order, with the most recent comment first.
sortedComments = _reverse(
- _sortBy(
- this.props.comments,
- (comment) => commentDates.get(comment.id).getTime()
- )
- )
+ _sortBy(this.props.comments, (comment) => commentDates.get(comment.id).getTime()),
+ );
} else {
- commentDates = new Map()
+ commentDates = new Map();
_each(this.props.taskComments, (comment) =>
- commentDates.set(comment.id, parseISO(comment.created))
- )
-
+ commentDates.set(comment.id, parseISO(comment.created)),
+ );
+
// Show in descending order, with the most recent comment first.
sortedComments = _reverse(
- _sortBy(
- this.props.taskComments,
- (comment) => commentDates.get(comment.id).getTime()
- )
- )
+ _sortBy(this.props.taskComments, (comment) => commentDates.get(comment.id).getTime()),
+ );
}
- const commentItems = _map(sortedComments, comment =>
+ const commentItems = _map(sortedComments, (comment) =>
!_isObject(comment) ? null : (
- — {comment.osm_username}
+ {" "}
+ — {comment.osm_username}
- {(this.props.includeChallengeNames || this.props.includeTaskLinks) &&
+ {(this.props.includeChallengeNames || this.props.includeTaskLinks) && (
- {this.props.includeChallengeNames &&
-
{comment.challengeName}
- }
- {this.props.includeTaskLinks && this.props.comments?.length !== 0 &&
-
-
-
- }
+ {this.props.includeChallengeNames && (
+
{comment.challengeName}
+ )}
+ {this.props.includeTaskLinks && this.props.comments?.length !== 0 && (
+
+
+
+ )}
- )
- )
+ ),
+ );
return
{commentItems} ;
}
@@ -119,15 +109,15 @@ CommentList.propTypes = {
osm_username: PropTypes.string,
comment: PropTypes.string,
created: PropTypes.string,
- })
+ }),
),
/**
* Set to true to include a link to the task on which the comment appears
*/
includeTaskLinks: PropTypes.bool,
-}
+};
CommentList.defaultProps = {
comments: [],
includeTaskLinks: false,
-}
+};
diff --git a/src/components/CommentList/Messages.js b/src/components/CommentList/Messages.js
index 1da43d83c..ab228de16 100644
--- a/src/components/CommentList/Messages.js
+++ b/src/components/CommentList/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with CommentList
@@ -6,11 +6,11 @@ import { defineMessages } from 'react-intl'
export default defineMessages({
viewTaskLabel: {
id: "CommentList.controls.viewTask.label",
- defaultMessage: "View Task"
+ defaultMessage: "View Task",
},
noComments: {
id: "CommentList.noComments.label",
- defaultMessage: "No Comments"
+ defaultMessage: "No Comments",
},
-})
+});
diff --git a/src/components/ConfigureColumnsModal/ConfigureColumnsModal.jsx b/src/components/ConfigureColumnsModal/ConfigureColumnsModal.jsx
index 372e3551a..674ae0a33 100644
--- a/src/components/ConfigureColumnsModal/ConfigureColumnsModal.jsx
+++ b/src/components/ConfigureColumnsModal/ConfigureColumnsModal.jsx
@@ -1,11 +1,11 @@
-import { Component } from 'react'
-import PropTypes from 'prop-types'
-import { DragDropContext, Draggable, Droppable } from 'react-beautiful-dnd';
-import _map from 'lodash/map'
-import External from '../External/External'
-import Modal from '../Modal/Modal'
-import { FormattedMessage } from 'react-intl'
-import messages from './Messages'
+import _map from "lodash/map";
+import PropTypes from "prop-types";
+import { Component } from "react";
+import { DragDropContext, Draggable, Droppable } from "react-beautiful-dnd";
+import { FormattedMessage } from "react-intl";
+import External from "../External/External";
+import Modal from "../Modal/Modal";
+import messages from "./Messages";
/**
* ConfigureColumnsModal renders a modal for configuring table columns
@@ -15,74 +15,61 @@ import messages from './Messages'
export default class ConfigureColumnsModal extends Component {
onDragEnd = (result) => {
// dropped outside the list or on itself
- if (!result.destination ||
- result.source.index === result.destination.index ) {
- return
+ if (!result.destination || result.source.index === result.destination.index) {
+ return;
}
- this.props.reorderAddedColumn(
- result.source.index,
- result.destination.index
- )
- }
+ this.props.reorderAddedColumn(result.source.index, result.destination.index);
+ };
close = () => {
- this.props.saveColumnSettings()
- this.props.onClose()
- }
+ this.props.saveColumnSettings();
+ this.props.onClose();
+ };
buildDraggableColumnList() {
- let index = -1
+ let index = -1;
return _map(this.props.addedColumns, (column, key) => {
- index += 1
- return (
-
- {(provided) => (
-
-
-
- {column.message}
-
+ index += 1;
+ return (
+
+ {(provided) => (
+
+
+
+ {column.message}
+
- {!column.permanent &&
-
- this.props.removeColumn(key)}
- >
-
-
- }
+ {!column.permanent && (
+
+ this.props.removeColumn(key)}
+ >
+
+ )}
- )}
-
- )
- })
+
+ );
+ });
}
render() {
- const availableColumns = _map(this.props.availableColumns, (column, key) =>
+ const availableColumns = _map(this.props.availableColumns, (column, key) => (
-
- {column.message}
-
+ {column.message}
- this.props.addColumn(key)}
- >
+ this.props.addColumn(key)}>
- )
+ ));
return (
@@ -116,19 +103,16 @@ export default class ConfigureColumnsModal extends Component {
-
-
- {(provided) => (
-
- {this.buildDraggableColumnList(provided)}
- {provided.placeholder}
-
- )}
-
-
+
+
+ {(provided) => (
+
+ {this.buildDraggableColumnList(provided)}
+ {provided.placeholder}
+
+ )}
+
+
- )
+ );
}
}
@@ -151,4 +135,4 @@ ConfigureColumnsModal.propTypes = {
addedColumns: PropTypes.object.isRequired,
availableColumns: PropTypes.object.isRequired,
reorderAddedColumn: PropTypes.func.isRequired,
-}
+};
diff --git a/src/components/ConfigureColumnsModal/Messages.js b/src/components/ConfigureColumnsModal/Messages.js
index 88b543696..6053e43b4 100644
--- a/src/components/ConfigureColumnsModal/Messages.js
+++ b/src/components/ConfigureColumnsModal/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ConfigureColumnsModal
@@ -33,4 +33,4 @@ export default defineMessages({
id: "ConfigureColumnsModal.controls.done.label",
defaultMessage: "Done",
},
-})
+});
diff --git a/src/components/ConfirmAction/ConfirmAction.jsx b/src/components/ConfirmAction/ConfirmAction.jsx
index 52efa644e..95f0b1ca8 100644
--- a/src/components/ConfirmAction/ConfirmAction.jsx
+++ b/src/components/ConfirmAction/ConfirmAction.jsx
@@ -1,11 +1,11 @@
-import { cloneElement, Fragment, Component } from "react";
+import _cloneDeep from "lodash/cloneDeep";
import PropTypes from "prop-types";
+import { Component, Fragment, cloneElement } from "react";
import { FormattedMessage } from "react-intl";
-import _cloneDeep from "lodash/cloneDeep";
-import Modal from "../Modal/Modal";
import External from "../External/External";
-import SvgSymbol from "../SvgSymbol/SvgSymbol";
import { ExternalContext } from "../External/External";
+import Modal from "../Modal/Modal";
+import SvgSymbol from "../SvgSymbol/SvgSymbol";
import messages from "./Messages";
import "./ConfirmAction.scss";
@@ -92,17 +92,11 @@ export default class ConfirmAction extends Component {
-
+
-
+
diff --git a/src/components/ConfirmAction/Messages.js b/src/components/ConfirmAction/Messages.js
index 999e65692..6159cf72f 100644
--- a/src/components/ConfirmAction/Messages.js
+++ b/src/components/ConfirmAction/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with ConfirmAction.
@@ -23,4 +23,4 @@ export default defineMessages({
id: "ConfirmAction.proceed",
defaultMessage: "Proceed",
},
-})
+});
diff --git a/src/components/CongratulateModal/CongratulateModal.jsx b/src/components/CongratulateModal/CongratulateModal.jsx
index 00954f207..18b2cbd09 100644
--- a/src/components/CongratulateModal/CongratulateModal.jsx
+++ b/src/components/CongratulateModal/CongratulateModal.jsx
@@ -1,10 +1,10 @@
-import { Component } from 'react'
-import { FormattedMessage } from 'react-intl'
-import Confetti from 'react-dom-confetti'
-import Modal from '../Modal/Modal'
-import SvgSymbol from '../SvgSymbol/SvgSymbol'
-import messages from './Messages'
-import './CongratulateModal.scss'
+import { Component } from "react";
+import Confetti from "react-dom-confetti";
+import { FormattedMessage } from "react-intl";
+import Modal from "../Modal/Modal";
+import SvgSymbol from "../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
+import "./CongratulateModal.scss";
/**
* CongratulateModal presents a celebratory modal that displays a
@@ -16,12 +16,12 @@ export default class CongratulateModal extends Component {
state = {
confetti: false,
active: true,
- }
+ };
- dismiss = () => this.setState({active: false})
+ dismiss = () => this.setState({ active: false });
componentDidMount() {
- setTimeout(() => this.setState({confetti: true}), 1000)
+ setTimeout(() => this.setState({ confetti: true }), 1000);
}
render() {
@@ -35,10 +35,17 @@ export default class CongratulateModal extends Component {
>
-
-
-
+
+
+
+
+
- )
+ );
}
}
diff --git a/src/components/CongratulateModal/CongratulateModal.test.jsx b/src/components/CongratulateModal/CongratulateModal.test.jsx
index e764b320c..85b7a728f 100644
--- a/src/components/CongratulateModal/CongratulateModal.test.jsx
+++ b/src/components/CongratulateModal/CongratulateModal.test.jsx
@@ -1,12 +1,10 @@
-import { describe, it, expect } from "vitest";
+import { describe, expect, it } from "vitest";
import "@testing-library/jest-dom";
import CongratulateModal from "./CongratulateModal";
describe("CongratulateModal", () => {
it("renders MapRoulette landing page and slogan", () => {
- const { getByText } = global.withProvider(
-
-
+
- { !props.currentCountryCode ?
-
- )
-}
+ );
+};
-const ListCountryItems = function(props) {
+const ListCountryItems = function (props) {
const countryList = _sortBy(
- _each(supportedCountries(), country => {
- country.name =
- props.intl.formatMessage(countryMessages[country.countryCode])
+ _each(supportedCountries(), (country) => {
+ country.name = props.intl.formatMessage(countryMessages[country.countryCode]);
}),
- 'name'
- )
+ "name",
+ );
- const menuItems = _map(countryList, country => (
+ const menuItems = _map(countryList, (country) => (
props.pickCountry(country.countryCode, props.closeDropdown)}>
{country.name}
- ))
+ ));
// Add option for "All Countries" that goes to standard (global) leaderboard
menuItems.unshift(
@@ -90,21 +84,17 @@ const ListCountryItems = function(props) {
props.pickCountry("ALL", props.closeDropdown)}>
-
- )
+ ,
+ );
- return (
-
- {menuItems}
-
- )
-}
+ return {menuItems} ;
+};
CountrySelector.propTypes = {
/** Current selection */
currentCountryCode: PropTypes.string,
/** Invoked when the user chooses a new country */
selectCountry: PropTypes.func.isRequired,
-}
+};
-export default injectIntl(CountrySelector)
+export default injectIntl(CountrySelector);
diff --git a/src/components/CountrySelector/Messages.js b/src/components/CountrySelector/Messages.js
index 03633e85d..4660b1001 100644
--- a/src/components/CountrySelector/Messages.js
+++ b/src/components/CountrySelector/Messages.js
@@ -1,181 +1,181 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for country names by country code.
*/
export default defineMessages({
- ALL: {id: "CountryName.ALL", defaultMessage: "All Countries"},
- AF: {id: "CountryName.AF", defaultMessage: "Afghanistan"},
- AO: {id: "CountryName.AO", defaultMessage: "Angola"},
- AL: {id: "CountryName.AL", defaultMessage: "Albania"},
- AE: {id: "CountryName.AE", defaultMessage: "United Arab Emirates"},
- AR: {id: "CountryName.AR", defaultMessage: "Argentina"},
- AM: {id: "CountryName.AM", defaultMessage: "Armenia"},
- AQ: {id: "CountryName.AQ", defaultMessage: "Antarctica"},
- TF: {id: "CountryName.TF", defaultMessage: "French Southern Territories"},
- AU: {id: "CountryName.AU", defaultMessage: "Australia"},
- AT: {id: "CountryName.AT", defaultMessage: "Austria"},
- AZ: {id: "CountryName.AZ", defaultMessage: "Azerbaijan"},
- BI: {id: "CountryName.BI", defaultMessage: "Burundi"},
- BE: {id: "CountryName.BE", defaultMessage: "Belgium"},
- BJ: {id: "CountryName.BJ", defaultMessage: "Benin"},
- BF: {id: "CountryName.BF", defaultMessage: "Burkina Faso"},
- BD: {id: "CountryName.BD", defaultMessage: "Bangladesh"},
- BG: {id: "CountryName.BG", defaultMessage: "Bulgaria"},
- BS: {id: "CountryName.BS", defaultMessage: "Bahamas"},
- BA: {id: "CountryName.BA", defaultMessage: "Bosnia and Herzegovina"},
- BY: {id: "CountryName.BY", defaultMessage: "Belarus"},
- BZ: {id: "CountryName.BZ", defaultMessage: "Belize"},
- BO: {id: "CountryName.BO", defaultMessage: "Bolivia"},
- BR: {id: "CountryName.BR", defaultMessage: "Brazil"},
- BN: {id: "CountryName.BN", defaultMessage: "Brunei"},
- BT: {id: "CountryName.BT", defaultMessage: "Bhutan"},
- BW: {id: "CountryName.BW", defaultMessage: "Botswana"},
- CF: {id: "CountryName.CF", defaultMessage: "Central African Republic"},
- CA: {id: "CountryName.CA", defaultMessage: "Canada"},
- CH: {id: "CountryName.CH", defaultMessage: "Switzerland"},
- CL: {id: "CountryName.CL", defaultMessage: "Chile"},
- CN: {id: "CountryName.CN", defaultMessage: "China"},
- CI: {id: "CountryName.CI", defaultMessage: "Ivory Coast"},
- CM: {id: "CountryName.CM", defaultMessage: "Cameroon"},
- CD: {id: "CountryName.CD", defaultMessage: "Congo (Kinshasa)"},
- CG: {id: "CountryName.CG", defaultMessage: "Congo (Brazzaville)"},
- CO: {id: "CountryName.CO", defaultMessage: "Colombia"},
- CR: {id: "CountryName.CR", defaultMessage: "Costa Rica"},
- CU: {id: "CountryName.CU", defaultMessage: "Cuba"},
- CY: {id: "CountryName.CY", defaultMessage: "Cyprus"},
- CZ: {id: "CountryName.CZ", defaultMessage: "Czech Republic"},
- DE: {id: "CountryName.DE", defaultMessage: "Germany"},
- DJ: {id: "CountryName.DJ", defaultMessage: "Djibouti"},
- DK: {id: "CountryName.DK", defaultMessage: "Denmark"},
- DO: {id: "CountryName.DO", defaultMessage: "Dominican Republic"},
- DZ: {id: "CountryName.DZ", defaultMessage: "Algeria"},
- EC: {id: "CountryName.EC", defaultMessage: "Ecuador"},
- EG: {id: "CountryName.EG", defaultMessage: "Egypt"},
- ER: {id: "CountryName.ER", defaultMessage: "Eritrea"},
- ES: {id: "CountryName.ES", defaultMessage: "Spain"},
- EE: {id: "CountryName.EE", defaultMessage: "Estonia"},
- ET: {id: "CountryName.ET", defaultMessage: "Ethiopia"},
- FI: {id: "CountryName.FI", defaultMessage: "Finland"},
- FJ: {id: "CountryName.FJ", defaultMessage: "Fiji"},
- FK: {id: "CountryName.FK", defaultMessage: "Falkland Islands"},
- FR: {id: "CountryName.FR", defaultMessage: "France"},
- GA: {id: "CountryName.GA", defaultMessage: "Gabon"},
- GB: {id: "CountryName.GB", defaultMessage: "United Kingdom"},
- GE: {id: "CountryName.GE", defaultMessage: "Georgia"},
- GH: {id: "CountryName.GH", defaultMessage: "Ghana"},
- GN: {id: "CountryName.GN", defaultMessage: "Guinea"},
- GM: {id: "CountryName.GM", defaultMessage: "Gambia"},
- GW: {id: "CountryName.GW", defaultMessage: "Guinea Bissau"},
- GQ: {id: "CountryName.GQ", defaultMessage: "Equatorial Guinea"},
- GR: {id: "CountryName.GR", defaultMessage: "Greece"},
- GL: {id: "CountryName.GL", defaultMessage: "Greenland"},
- GT: {id: "CountryName.GT", defaultMessage: "Guatemala"},
- GY: {id: "CountryName.GY", defaultMessage: "Guyana"},
- HN: {id: "CountryName.HN", defaultMessage: "Honduras"},
- HR: {id: "CountryName.HR", defaultMessage: "Croatia"},
- HT: {id: "CountryName.HT", defaultMessage: "Haiti"},
- HU: {id: "CountryName.HU", defaultMessage: "Hungary"},
- ID: {id: "CountryName.ID", defaultMessage: "Indonesia"},
- IN: {id: "CountryName.IN", defaultMessage: "India"},
- IE: {id: "CountryName.IE", defaultMessage: "Ireland"},
- IR: {id: "CountryName.IR", defaultMessage: "Iran"},
- IQ: {id: "CountryName.IQ", defaultMessage: "Iraq"},
- IS: {id: "CountryName.IS", defaultMessage: "Iceland"},
- IL: {id: "CountryName.IL", defaultMessage: "Israel"},
- IT: {id: "CountryName.IT", defaultMessage: "Italy"},
- JM: {id: "CountryName.JM", defaultMessage: "Jamaica"},
- JO: {id: "CountryName.JO", defaultMessage: "Jordan"},
- JP: {id: "CountryName.JP", defaultMessage: "Japan"},
- KZ: {id: "CountryName.KZ", defaultMessage: "Kazakhstan"},
- KE: {id: "CountryName.KE", defaultMessage: "Kenya"},
- KG: {id: "CountryName.KG", defaultMessage: "Kyrgyzstan"},
- KH: {id: "CountryName.KH", defaultMessage: "Cambodia"},
- KR: {id: "CountryName.KR", defaultMessage: "South Korea"},
- KW: {id: "CountryName.KW", defaultMessage: "Kuwait"},
- LA: {id: "CountryName.LA", defaultMessage: "Laos"},
- LB: {id: "CountryName.LB", defaultMessage: "Lebanon"},
- LR: {id: "CountryName.LR", defaultMessage: "Liberia"},
- LY: {id: "CountryName.LY", defaultMessage: "Libya"},
- LK: {id: "CountryName.LK", defaultMessage: "Sri Lanka"},
- LS: {id: "CountryName.LS", defaultMessage: "Lesotho"},
- LT: {id: "CountryName.LT", defaultMessage: "Lithuania"},
- LU: {id: "CountryName.LU", defaultMessage: "Luxembourg"},
- LV: {id: "CountryName.LV", defaultMessage: "Latvia"},
- MA: {id: "CountryName.MA", defaultMessage: "Morocco"},
- MD: {id: "CountryName.MD", defaultMessage: "Moldova"},
- MG: {id: "CountryName.MG", defaultMessage: "Madagascar"},
- MX: {id: "CountryName.MX", defaultMessage: "Mexico"},
- MK: {id: "CountryName.MK", defaultMessage: "Macedonia"},
- ML: {id: "CountryName.ML", defaultMessage: "Mali"},
- MM: {id: "CountryName.MM", defaultMessage: "Myanmar"},
- ME: {id: "CountryName.ME", defaultMessage: "Montenegro"},
- MN: {id: "CountryName.MN", defaultMessage: "Mongolia"},
- MZ: {id: "CountryName.MZ", defaultMessage: "Mozambique"},
- MR: {id: "CountryName.MR", defaultMessage: "Mauritania"},
- MW: {id: "CountryName.MW", defaultMessage: "Malawi"},
- MY: {id: "CountryName.MY", defaultMessage: "Malaysia"},
- NA: {id: "CountryName.NA", defaultMessage: "Namibia"},
- NC: {id: "CountryName.NC", defaultMessage: "New Caledonia"},
- NE: {id: "CountryName.NE", defaultMessage: "Niger"},
- NG: {id: "CountryName.NG", defaultMessage: "Nigeria"},
- NI: {id: "CountryName.NI", defaultMessage: "Nicaragua"},
- NL: {id: "CountryName.NL", defaultMessage: "Netherlands"},
- NO: {id: "CountryName.NO", defaultMessage: "Norway"},
- NP: {id: "CountryName.NP", defaultMessage: "Nepal"},
- NZ: {id: "CountryName.NZ", defaultMessage: "New Zealand"},
- OM: {id: "CountryName.OM", defaultMessage: "Oman"},
- PK: {id: "CountryName.PK", defaultMessage: "Pakistan"},
- PA: {id: "CountryName.PA", defaultMessage: "Panama"},
- PE: {id: "CountryName.PE", defaultMessage: "Peru"},
- PH: {id: "CountryName.PH", defaultMessage: "Philippines"},
- PG: {id: "CountryName.PG", defaultMessage: "Papua New Guinea"},
- PL: {id: "CountryName.PL", defaultMessage: "Poland"},
- PR: {id: "CountryName.PR", defaultMessage: "Puerto Rico"},
- KP: {id: "CountryName.KP", defaultMessage: "North Korea"},
- PT: {id: "CountryName.PT", defaultMessage: "Portugal"},
- PY: {id: "CountryName.PY", defaultMessage: "Paraguay"},
- QA: {id: "CountryName.QA", defaultMessage: "Qatar"},
- RO: {id: "CountryName.RO", defaultMessage: "Romania"},
- RU: {id: "CountryName.RU", defaultMessage: "Russia"},
- RW: {id: "CountryName.RW", defaultMessage: "Rwanda"},
- SA: {id: "CountryName.SA", defaultMessage: "Saudi Arabia"},
- SD: {id: "CountryName.SD", defaultMessage: "Sudan"},
- SS: {id: "CountryName.SS", defaultMessage: "South Sudan"},
- SN: {id: "CountryName.SN", defaultMessage: "Senegal"},
- SB: {id: "CountryName.SB", defaultMessage: "Solomon Islands"},
- SL: {id: "CountryName.SL", defaultMessage: "Sierra Leone"},
- SV: {id: "CountryName.SV", defaultMessage: "El Salvador"},
- SO: {id: "CountryName.SO", defaultMessage: "Somalia"},
- RS: {id: "CountryName.RS", defaultMessage: "Serbia"},
- SR: {id: "CountryName.SR", defaultMessage: "Suriname"},
- SK: {id: "CountryName.SK", defaultMessage: "Slovakia"},
- SI: {id: "CountryName.SI", defaultMessage: "Slovenia"},
- SE: {id: "CountryName.SE", defaultMessage: "Sweden"},
- SZ: {id: "CountryName.SZ", defaultMessage: "Swaziland"},
- SY: {id: "CountryName.SY", defaultMessage: "Syria"},
- TD: {id: "CountryName.TD", defaultMessage: "Chad"},
- TG: {id: "CountryName.TG", defaultMessage: "Togo"},
- TH: {id: "CountryName.TH", defaultMessage: "Thailand"},
- TJ: {id: "CountryName.TJ", defaultMessage: "Tajikistan"},
- TM: {id: "CountryName.TM", defaultMessage: "Turkmenistan"},
- TL: {id: "CountryName.TL", defaultMessage: "East Timor"},
- TT: {id: "CountryName.TT", defaultMessage: "Trinidad and Tobago"},
- TN: {id: "CountryName.TN", defaultMessage: "Tunisia"},
- TR: {id: "CountryName.TR", defaultMessage: "Turkey"},
- TW: {id: "CountryName.TW", defaultMessage: "Taiwan"},
- TZ: {id: "CountryName.TZ", defaultMessage: "Tanzania"},
- UG: {id: "CountryName.UG", defaultMessage: "Uganda"},
- UA: {id: "CountryName.UA", defaultMessage: "Ukraine"},
- UY: {id: "CountryName.UY", defaultMessage: "Uruguay"},
- US: {id: "CountryName.US", defaultMessage: "United States"},
- UZ: {id: "CountryName.UZ", defaultMessage: "Uzbekistan"},
- VE: {id: "CountryName.VE", defaultMessage: "Venezuela"},
- VN: {id: "CountryName.VN", defaultMessage: "Vietnam"},
- VU: {id: "CountryName.VU", defaultMessage: "Vanuatu"},
- PS: {id: "CountryName.PS", defaultMessage: "West Bank"},
- YE: {id: "CountryName.YE", defaultMessage: "Yemen"},
- ZA: {id: "CountryName.ZA", defaultMessage: "South Africa"},
- ZM: {id: "CountryName.ZM", defaultMessage: "Zambia"},
- ZW: {id: "CountryName.ZW", defaultMessage: "Zimbabwe"},
-})
+ ALL: { id: "CountryName.ALL", defaultMessage: "All Countries" },
+ AF: { id: "CountryName.AF", defaultMessage: "Afghanistan" },
+ AO: { id: "CountryName.AO", defaultMessage: "Angola" },
+ AL: { id: "CountryName.AL", defaultMessage: "Albania" },
+ AE: { id: "CountryName.AE", defaultMessage: "United Arab Emirates" },
+ AR: { id: "CountryName.AR", defaultMessage: "Argentina" },
+ AM: { id: "CountryName.AM", defaultMessage: "Armenia" },
+ AQ: { id: "CountryName.AQ", defaultMessage: "Antarctica" },
+ TF: { id: "CountryName.TF", defaultMessage: "French Southern Territories" },
+ AU: { id: "CountryName.AU", defaultMessage: "Australia" },
+ AT: { id: "CountryName.AT", defaultMessage: "Austria" },
+ AZ: { id: "CountryName.AZ", defaultMessage: "Azerbaijan" },
+ BI: { id: "CountryName.BI", defaultMessage: "Burundi" },
+ BE: { id: "CountryName.BE", defaultMessage: "Belgium" },
+ BJ: { id: "CountryName.BJ", defaultMessage: "Benin" },
+ BF: { id: "CountryName.BF", defaultMessage: "Burkina Faso" },
+ BD: { id: "CountryName.BD", defaultMessage: "Bangladesh" },
+ BG: { id: "CountryName.BG", defaultMessage: "Bulgaria" },
+ BS: { id: "CountryName.BS", defaultMessage: "Bahamas" },
+ BA: { id: "CountryName.BA", defaultMessage: "Bosnia and Herzegovina" },
+ BY: { id: "CountryName.BY", defaultMessage: "Belarus" },
+ BZ: { id: "CountryName.BZ", defaultMessage: "Belize" },
+ BO: { id: "CountryName.BO", defaultMessage: "Bolivia" },
+ BR: { id: "CountryName.BR", defaultMessage: "Brazil" },
+ BN: { id: "CountryName.BN", defaultMessage: "Brunei" },
+ BT: { id: "CountryName.BT", defaultMessage: "Bhutan" },
+ BW: { id: "CountryName.BW", defaultMessage: "Botswana" },
+ CF: { id: "CountryName.CF", defaultMessage: "Central African Republic" },
+ CA: { id: "CountryName.CA", defaultMessage: "Canada" },
+ CH: { id: "CountryName.CH", defaultMessage: "Switzerland" },
+ CL: { id: "CountryName.CL", defaultMessage: "Chile" },
+ CN: { id: "CountryName.CN", defaultMessage: "China" },
+ CI: { id: "CountryName.CI", defaultMessage: "Ivory Coast" },
+ CM: { id: "CountryName.CM", defaultMessage: "Cameroon" },
+ CD: { id: "CountryName.CD", defaultMessage: "Congo (Kinshasa)" },
+ CG: { id: "CountryName.CG", defaultMessage: "Congo (Brazzaville)" },
+ CO: { id: "CountryName.CO", defaultMessage: "Colombia" },
+ CR: { id: "CountryName.CR", defaultMessage: "Costa Rica" },
+ CU: { id: "CountryName.CU", defaultMessage: "Cuba" },
+ CY: { id: "CountryName.CY", defaultMessage: "Cyprus" },
+ CZ: { id: "CountryName.CZ", defaultMessage: "Czech Republic" },
+ DE: { id: "CountryName.DE", defaultMessage: "Germany" },
+ DJ: { id: "CountryName.DJ", defaultMessage: "Djibouti" },
+ DK: { id: "CountryName.DK", defaultMessage: "Denmark" },
+ DO: { id: "CountryName.DO", defaultMessage: "Dominican Republic" },
+ DZ: { id: "CountryName.DZ", defaultMessage: "Algeria" },
+ EC: { id: "CountryName.EC", defaultMessage: "Ecuador" },
+ EG: { id: "CountryName.EG", defaultMessage: "Egypt" },
+ ER: { id: "CountryName.ER", defaultMessage: "Eritrea" },
+ ES: { id: "CountryName.ES", defaultMessage: "Spain" },
+ EE: { id: "CountryName.EE", defaultMessage: "Estonia" },
+ ET: { id: "CountryName.ET", defaultMessage: "Ethiopia" },
+ FI: { id: "CountryName.FI", defaultMessage: "Finland" },
+ FJ: { id: "CountryName.FJ", defaultMessage: "Fiji" },
+ FK: { id: "CountryName.FK", defaultMessage: "Falkland Islands" },
+ FR: { id: "CountryName.FR", defaultMessage: "France" },
+ GA: { id: "CountryName.GA", defaultMessage: "Gabon" },
+ GB: { id: "CountryName.GB", defaultMessage: "United Kingdom" },
+ GE: { id: "CountryName.GE", defaultMessage: "Georgia" },
+ GH: { id: "CountryName.GH", defaultMessage: "Ghana" },
+ GN: { id: "CountryName.GN", defaultMessage: "Guinea" },
+ GM: { id: "CountryName.GM", defaultMessage: "Gambia" },
+ GW: { id: "CountryName.GW", defaultMessage: "Guinea Bissau" },
+ GQ: { id: "CountryName.GQ", defaultMessage: "Equatorial Guinea" },
+ GR: { id: "CountryName.GR", defaultMessage: "Greece" },
+ GL: { id: "CountryName.GL", defaultMessage: "Greenland" },
+ GT: { id: "CountryName.GT", defaultMessage: "Guatemala" },
+ GY: { id: "CountryName.GY", defaultMessage: "Guyana" },
+ HN: { id: "CountryName.HN", defaultMessage: "Honduras" },
+ HR: { id: "CountryName.HR", defaultMessage: "Croatia" },
+ HT: { id: "CountryName.HT", defaultMessage: "Haiti" },
+ HU: { id: "CountryName.HU", defaultMessage: "Hungary" },
+ ID: { id: "CountryName.ID", defaultMessage: "Indonesia" },
+ IN: { id: "CountryName.IN", defaultMessage: "India" },
+ IE: { id: "CountryName.IE", defaultMessage: "Ireland" },
+ IR: { id: "CountryName.IR", defaultMessage: "Iran" },
+ IQ: { id: "CountryName.IQ", defaultMessage: "Iraq" },
+ IS: { id: "CountryName.IS", defaultMessage: "Iceland" },
+ IL: { id: "CountryName.IL", defaultMessage: "Israel" },
+ IT: { id: "CountryName.IT", defaultMessage: "Italy" },
+ JM: { id: "CountryName.JM", defaultMessage: "Jamaica" },
+ JO: { id: "CountryName.JO", defaultMessage: "Jordan" },
+ JP: { id: "CountryName.JP", defaultMessage: "Japan" },
+ KZ: { id: "CountryName.KZ", defaultMessage: "Kazakhstan" },
+ KE: { id: "CountryName.KE", defaultMessage: "Kenya" },
+ KG: { id: "CountryName.KG", defaultMessage: "Kyrgyzstan" },
+ KH: { id: "CountryName.KH", defaultMessage: "Cambodia" },
+ KR: { id: "CountryName.KR", defaultMessage: "South Korea" },
+ KW: { id: "CountryName.KW", defaultMessage: "Kuwait" },
+ LA: { id: "CountryName.LA", defaultMessage: "Laos" },
+ LB: { id: "CountryName.LB", defaultMessage: "Lebanon" },
+ LR: { id: "CountryName.LR", defaultMessage: "Liberia" },
+ LY: { id: "CountryName.LY", defaultMessage: "Libya" },
+ LK: { id: "CountryName.LK", defaultMessage: "Sri Lanka" },
+ LS: { id: "CountryName.LS", defaultMessage: "Lesotho" },
+ LT: { id: "CountryName.LT", defaultMessage: "Lithuania" },
+ LU: { id: "CountryName.LU", defaultMessage: "Luxembourg" },
+ LV: { id: "CountryName.LV", defaultMessage: "Latvia" },
+ MA: { id: "CountryName.MA", defaultMessage: "Morocco" },
+ MD: { id: "CountryName.MD", defaultMessage: "Moldova" },
+ MG: { id: "CountryName.MG", defaultMessage: "Madagascar" },
+ MX: { id: "CountryName.MX", defaultMessage: "Mexico" },
+ MK: { id: "CountryName.MK", defaultMessage: "Macedonia" },
+ ML: { id: "CountryName.ML", defaultMessage: "Mali" },
+ MM: { id: "CountryName.MM", defaultMessage: "Myanmar" },
+ ME: { id: "CountryName.ME", defaultMessage: "Montenegro" },
+ MN: { id: "CountryName.MN", defaultMessage: "Mongolia" },
+ MZ: { id: "CountryName.MZ", defaultMessage: "Mozambique" },
+ MR: { id: "CountryName.MR", defaultMessage: "Mauritania" },
+ MW: { id: "CountryName.MW", defaultMessage: "Malawi" },
+ MY: { id: "CountryName.MY", defaultMessage: "Malaysia" },
+ NA: { id: "CountryName.NA", defaultMessage: "Namibia" },
+ NC: { id: "CountryName.NC", defaultMessage: "New Caledonia" },
+ NE: { id: "CountryName.NE", defaultMessage: "Niger" },
+ NG: { id: "CountryName.NG", defaultMessage: "Nigeria" },
+ NI: { id: "CountryName.NI", defaultMessage: "Nicaragua" },
+ NL: { id: "CountryName.NL", defaultMessage: "Netherlands" },
+ NO: { id: "CountryName.NO", defaultMessage: "Norway" },
+ NP: { id: "CountryName.NP", defaultMessage: "Nepal" },
+ NZ: { id: "CountryName.NZ", defaultMessage: "New Zealand" },
+ OM: { id: "CountryName.OM", defaultMessage: "Oman" },
+ PK: { id: "CountryName.PK", defaultMessage: "Pakistan" },
+ PA: { id: "CountryName.PA", defaultMessage: "Panama" },
+ PE: { id: "CountryName.PE", defaultMessage: "Peru" },
+ PH: { id: "CountryName.PH", defaultMessage: "Philippines" },
+ PG: { id: "CountryName.PG", defaultMessage: "Papua New Guinea" },
+ PL: { id: "CountryName.PL", defaultMessage: "Poland" },
+ PR: { id: "CountryName.PR", defaultMessage: "Puerto Rico" },
+ KP: { id: "CountryName.KP", defaultMessage: "North Korea" },
+ PT: { id: "CountryName.PT", defaultMessage: "Portugal" },
+ PY: { id: "CountryName.PY", defaultMessage: "Paraguay" },
+ QA: { id: "CountryName.QA", defaultMessage: "Qatar" },
+ RO: { id: "CountryName.RO", defaultMessage: "Romania" },
+ RU: { id: "CountryName.RU", defaultMessage: "Russia" },
+ RW: { id: "CountryName.RW", defaultMessage: "Rwanda" },
+ SA: { id: "CountryName.SA", defaultMessage: "Saudi Arabia" },
+ SD: { id: "CountryName.SD", defaultMessage: "Sudan" },
+ SS: { id: "CountryName.SS", defaultMessage: "South Sudan" },
+ SN: { id: "CountryName.SN", defaultMessage: "Senegal" },
+ SB: { id: "CountryName.SB", defaultMessage: "Solomon Islands" },
+ SL: { id: "CountryName.SL", defaultMessage: "Sierra Leone" },
+ SV: { id: "CountryName.SV", defaultMessage: "El Salvador" },
+ SO: { id: "CountryName.SO", defaultMessage: "Somalia" },
+ RS: { id: "CountryName.RS", defaultMessage: "Serbia" },
+ SR: { id: "CountryName.SR", defaultMessage: "Suriname" },
+ SK: { id: "CountryName.SK", defaultMessage: "Slovakia" },
+ SI: { id: "CountryName.SI", defaultMessage: "Slovenia" },
+ SE: { id: "CountryName.SE", defaultMessage: "Sweden" },
+ SZ: { id: "CountryName.SZ", defaultMessage: "Swaziland" },
+ SY: { id: "CountryName.SY", defaultMessage: "Syria" },
+ TD: { id: "CountryName.TD", defaultMessage: "Chad" },
+ TG: { id: "CountryName.TG", defaultMessage: "Togo" },
+ TH: { id: "CountryName.TH", defaultMessage: "Thailand" },
+ TJ: { id: "CountryName.TJ", defaultMessage: "Tajikistan" },
+ TM: { id: "CountryName.TM", defaultMessage: "Turkmenistan" },
+ TL: { id: "CountryName.TL", defaultMessage: "East Timor" },
+ TT: { id: "CountryName.TT", defaultMessage: "Trinidad and Tobago" },
+ TN: { id: "CountryName.TN", defaultMessage: "Tunisia" },
+ TR: { id: "CountryName.TR", defaultMessage: "Turkey" },
+ TW: { id: "CountryName.TW", defaultMessage: "Taiwan" },
+ TZ: { id: "CountryName.TZ", defaultMessage: "Tanzania" },
+ UG: { id: "CountryName.UG", defaultMessage: "Uganda" },
+ UA: { id: "CountryName.UA", defaultMessage: "Ukraine" },
+ UY: { id: "CountryName.UY", defaultMessage: "Uruguay" },
+ US: { id: "CountryName.US", defaultMessage: "United States" },
+ UZ: { id: "CountryName.UZ", defaultMessage: "Uzbekistan" },
+ VE: { id: "CountryName.VE", defaultMessage: "Venezuela" },
+ VN: { id: "CountryName.VN", defaultMessage: "Vietnam" },
+ VU: { id: "CountryName.VU", defaultMessage: "Vanuatu" },
+ PS: { id: "CountryName.PS", defaultMessage: "West Bank" },
+ YE: { id: "CountryName.YE", defaultMessage: "Yemen" },
+ ZA: { id: "CountryName.ZA", defaultMessage: "South Africa" },
+ ZM: { id: "CountryName.ZM", defaultMessage: "Zambia" },
+ ZW: { id: "CountryName.ZW", defaultMessage: "Zimbabwe" },
+});
diff --git a/src/components/Custom/RJSFFormFieldAdapter/Messages.js b/src/components/Custom/RJSFFormFieldAdapter/Messages.js
index e7380fdf7..e422e07d3 100644
--- a/src/components/Custom/RJSFFormFieldAdapter/Messages.js
+++ b/src/components/Custom/RJSFFormFieldAdapter/Messages.js
@@ -1,4 +1,4 @@
-import { defineMessages } from 'react-intl'
+import { defineMessages } from "react-intl";
/**
* Internationalized messages for use with RJSFFormFieldAdapter.
@@ -25,27 +25,27 @@ export default defineMessages({
},
writeLabel: {
- id: 'Form.controls.markdownField.write.label',
+ id: "Form.controls.markdownField.write.label",
defaultMessage: "Write",
},
previewLabel: {
- id: 'Form.controls.markdownField.preview.label',
+ id: "Form.controls.markdownField.preview.label",
defaultMessage: "Preview",
},
uploadErrorGeoJSON: {
- id: 'Form.controls.markdownField.uploadErrorGeoJSON.label',
+ id: "Form.controls.markdownField.uploadErrorGeoJSON.label",
defaultMessage: "Upload Failed! File must have '.json' or .geojson' extension.",
},
uploadErrorJSON: {
- id: 'Form.controls.markdownField.uploadErrorJSON.label',
+ id: "Form.controls.markdownField.uploadErrorJSON.label",
defaultMessage: "Upload Failed! File must have '.json' extension.",
},
formatErrorJSON: {
- id: 'Form.controls.markdownField.formatErrorJSON.label',
+ id: "Form.controls.markdownField.formatErrorJSON.label",
defaultMessage: "Upload Failed! Layout must be exported from the task completion flow.",
- }
-})
+ },
+});
diff --git a/src/components/Custom/RJSFFormFieldAdapter/RJSFFormFieldAdapter.jsx b/src/components/Custom/RJSFFormFieldAdapter/RJSFFormFieldAdapter.jsx
index 689f639ca..f11f114ec 100644
--- a/src/components/Custom/RJSFFormFieldAdapter/RJSFFormFieldAdapter.jsx
+++ b/src/components/Custom/RJSFFormFieldAdapter/RJSFFormFieldAdapter.jsx
@@ -1,26 +1,23 @@
-import { Fragment, useState } from 'react'
-import classNames from 'classnames'
-import _isString from 'lodash/isString'
-import _map from 'lodash/map'
-import _isArray from 'lodash/isArray'
-import _isObject from 'lodash/isObject'
-import _isEmpty from 'lodash/isEmpty'
-import _trim from 'lodash/trim'
-import TagsInput from 'react-tagsinput'
-import Dropzone from 'react-dropzone'
-import OriginalSelectWidget
- from '@rjsf/core/lib/components/widgets/SelectWidget'
-import OriginalTextWidget
- from '@rjsf/core/lib/components/widgets/TextWidget'
-import OriginalCheckboxWidget
- from '@rjsf/core/lib/components/widgets/CheckboxWidget'
-import { FormattedMessage } from 'react-intl'
-import MarkdownContent from '../../MarkdownContent/MarkdownContent'
-import Dropdown from '../../Dropdown/Dropdown'
-import SvgSymbol from '../../SvgSymbol/SvgSymbol'
-import messages from './Messages'
-import 'react-tagsinput/react-tagsinput.css'
-import './RJSFFormFieldAdapter.scss'
+import OriginalCheckboxWidget from "@rjsf/core/lib/components/widgets/CheckboxWidget";
+import OriginalSelectWidget from "@rjsf/core/lib/components/widgets/SelectWidget";
+import OriginalTextWidget from "@rjsf/core/lib/components/widgets/TextWidget";
+import classNames from "classnames";
+import _isArray from "lodash/isArray";
+import _isEmpty from "lodash/isEmpty";
+import _isObject from "lodash/isObject";
+import _isString from "lodash/isString";
+import _map from "lodash/map";
+import _trim from "lodash/trim";
+import { Fragment, useState } from "react";
+import Dropzone from "react-dropzone";
+import { FormattedMessage } from "react-intl";
+import TagsInput from "react-tagsinput";
+import Dropdown from "../../Dropdown/Dropdown";
+import MarkdownContent from "../../MarkdownContent/MarkdownContent";
+import SvgSymbol from "../../SvgSymbol/SvgSymbol";
+import messages from "./Messages";
+import "react-tagsinput/react-tagsinput.css";
+import "./RJSFFormFieldAdapter.scss";
/**
* fieldset tags can't be styled using flexbox or grid in Chrome, so this
@@ -34,14 +31,14 @@ import './RJSFFormFieldAdapter.scss'
*
* See: https://github.com/mozilla-services/react-jsonschema-form/issues/762
*/
-export const NoFieldsetObjectFieldTemplate = function(props) {
- const { TitleField, DescriptionField } = props
+export const NoFieldsetObjectFieldTemplate = function (props) {
+ const { TitleField, DescriptionField } = props;
return (
- {(props.uiSchema['ui:title'] || props.title) && (
+ {(props.uiSchema["ui:title"] || props.title) && (
- )
-}
+ );
+};
-export const CustomArrayFieldTemplate = props => {
- const addLabel = props.uiSchema["ui:addLabel"] ||
+export const CustomArrayFieldTemplate = (props) => {
+ const addLabel = props.uiSchema["ui:addLabel"] || (
-
+
{element.children}
- {element.hasRemove &&
-
- {deleteLabel ||
-
-
- }
+ {element.hasRemove && (
+
+ {deleteLabel || (
+
+
+ )}
- }
+ )}
- )
+ ));
return (
- {props.title &&
-
{props.title}
- }
+ {props.title &&
{props.title} }
{itemFields}
- {props.canAdd &&
-
-
- {addLabel}
-
-
- }
+ {props.canAdd && (
+
+
+ {addLabel}
+
+
+ )}
- )
-}
+ );
+};
-export const CustomFieldTemplate = function(props) {
- const {classNames, children, description, uiSchema, errors} = props
- const isCollapsed = uiSchema?.["ui:collapsed"] ?? false
+export const CustomFieldTemplate = function (props) {
+ const { classNames, children, description, uiSchema, errors } = props;
+ const isCollapsed = uiSchema?.["ui:collapsed"] ?? false;
return (
- {uiSchema?.["ui:groupHeader"] &&
-
- {uiSchema["ui:groupHeader"]}
- {uiSchema?.["ui:toggleCollapsed"] &&
- uiSchema["ui:toggleCollapsed"]()}>
-
- }
-
- }
- {uiSchema?.["ui:fieldGroupHeader"] && uiSchema["ui:toggleCollapsed"] &&
-
uiSchema["ui:toggleCollapsed"]()}
- >
- {uiSchema["ui:fieldGroupHeader"]}
-
- }
- {!isCollapsed &&
-
-
- }
+ {uiSchema?.["ui:groupHeader"] && (
+
+ {uiSchema["ui:groupHeader"]}
+ {uiSchema?.["ui:toggleCollapsed"] && (
+ uiSchema["ui:toggleCollapsed"]()}>
+
+ )}
+
+ )}
+ {uiSchema?.["ui:fieldGroupHeader"] && uiSchema["ui:toggleCollapsed"] && (
+
uiSchema["ui:toggleCollapsed"]()}
+ >
+ {uiSchema["ui:fieldGroupHeader"]}
+
+ )}
+ {!isCollapsed && (
+
+
+ )}
);
-}
+};
-export const CustomNotificationFieldTemplate = function(props) {
- const {classNames, children, description, errors} = props
+export const CustomNotificationFieldTemplate = function (props) {
+ const { classNames, children, description, errors } = props;
return (
-
-
+
+
);
-}
-
+};
/**
* A custom select widget with the new-ui styling
*/
-export const CustomSelectWidget = function(props) {
+export const CustomSelectWidget = function (props) {
return (
-
+
- )
-}
+ );
+};
-export const CustomCheckboxField = function(props) {
+export const CustomCheckboxField = function (props) {
return (
-
+
{props.schema.title}
{props.required && * }
- )
-}
-
+ );
+};
/**
* A custom text widget with the new-ui styling
*/
-export const CustomTextWidget = function(props) {
- const ButtonAction = props.formContext.buttonAction
+export const CustomTextWidget = function (props) {
+ const ButtonAction = props.formContext.buttonAction;
return (
- )
-}
+ );
+};
-export const ColumnRadioField = function(props) {
+export const ColumnRadioField = function (props) {
return (
props.onChange(option)}>
+ props.onChange(option)}
+ >
- )}
+ ))}
);
-}
+};
/**
* MarkdownEditField renders a textarea and markdown preview side-by-side.
*/
-export const MarkdownEditField = props => {
- const [showingPreview, setShowingPreview] = useState(false)
- const [formValues, setFormValues] = useState({})
+export const MarkdownEditField = (props) => {
+ const [showingPreview, setShowingPreview] = useState(false);
+ const [formValues, setFormValues] = useState({});
return (
@@ -270,7 +267,7 @@ export const MarkdownEditField = props => {
type="button"
className={classNames(
"mr-pr-2 mr-mr-2 mr-border-r mr-border-green mr-uppercase mr-font-medium",
- showingPreview ? "mr-text-green-lighter" : "mr-text-white"
+ showingPreview ? "mr-text-green-lighter" : "mr-text-white",
)}
onClick={() => setShowingPreview(false)}
>
@@ -280,7 +277,7 @@ export const MarkdownEditField = props => {
type="button"
className={classNames(
"mr-uppercase mr-font-medium",
- !showingPreview ? "mr-text-green-lighter" : "mr-text-white"
+ !showingPreview ? "mr-text-green-lighter" : "mr-text-white",
)}
onClick={() => setShowingPreview(true)}
>
@@ -288,63 +285,65 @@ export const MarkdownEditField = props => {
- {showingPreview ?
-
- {props.uiSchema["ui:previewNote"] &&
-
- {props.uiSchema["ui:previewNote"]}
-
- }
-
- {
- setFormValues(Object.assign({}, formValues, {[name]: value}))
- }}
- allowShortCodes
- allowFormFields
- allowPropertyReplacement
- />
-
- :
-
:
+ {badgeImage ? (
+