diff --git a/assets/js/src/subscribers/importExport/import.jsx b/assets/js/src/subscribers/importExport/import.jsx
index 938e875794..a173f8069b 100644
--- a/assets/js/src/subscribers/importExport/import.jsx
+++ b/assets/js/src/subscribers/importExport/import.jsx
@@ -10,15 +10,46 @@ import StepDataManipulation from './import/step_data_manipulation.jsx';
const container = document.getElementById('import_container');
+const subscribersLimitForValidation = 500;
+
const ImportSubscribers = () => {
const [stepMethodSelection, setStepMethodSelection] = useState(undefined);
return (
- } />
- } />
- } />
- } />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ }
+ />
);
diff --git a/assets/js/src/subscribers/importExport/import/step_data_manipulation.jsx b/assets/js/src/subscribers/importExport/import/step_data_manipulation.jsx
index 2879d131a9..5a77ad9fcf 100644
--- a/assets/js/src/subscribers/importExport/import/step_data_manipulation.jsx
+++ b/assets/js/src/subscribers/importExport/import/step_data_manipulation.jsx
@@ -1,8 +1,26 @@
import React, { useEffect } from 'react';
import PropTypes from 'prop-types';
import { withRouter } from 'react-router-dom';
+import PreviousNextStepButtons from './previous_next_step_buttons.jsx';
-function StepDataManipulation({ history, stepMethodSelection }) {
+function getPreviousStepLink(importData, subscribersLimitForValidation) {
+ if (importData === undefined) {
+ return 'step_method_selection';
+ }
+ if (importData.subscribersCount === undefined) {
+ return 'step_method_selection';
+ }
+ if (importData.subscribersCount < subscribersLimitForValidation) {
+ return 'step_method_selection';
+ }
+ return 'step_input_validation';
+}
+
+function StepDataManipulation({
+ history,
+ stepMethodSelection,
+ subscribersLimitForValidation,
+}) {
useEffect(
() => {
if (typeof (stepMethodSelection) === 'undefined') {
@@ -14,7 +32,13 @@ function StepDataManipulation({ history, stepMethodSelection }) {
return (
<>
-
+ (
+ history.push(getPreviousStepLink(stepMethodSelection, subscribersLimitForValidation))
+ )}
+ onNextAction={() => history.push('todo')}
+ />
>
);
}
@@ -32,6 +56,7 @@ StepDataManipulation.propTypes = {
subscribersCount: PropTypes.number,
subscribers: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.string)),
}),
+ subscribersLimitForValidation: PropTypes.number.isRequired,
};
StepDataManipulation.defaultProps = {
diff --git a/assets/js/src/subscribers/importExport/import/step_method_selection.jsx b/assets/js/src/subscribers/importExport/import/step_method_selection.jsx
index 4207b57a5d..d2a4cdcb36 100644
--- a/assets/js/src/subscribers/importExport/import/step_method_selection.jsx
+++ b/assets/js/src/subscribers/importExport/import/step_method_selection.jsx
@@ -8,16 +8,14 @@ import MethodUpload from './step_method_selection/method_upload.jsx';
import MethodMailChimp from './step_method_selection/method_mailchimp.jsx';
import processCsv from './step_method_selection/process_csv.jsx';
-const SUBSCRIBERS_LIMIT_FOR_VALIDATION = 500;
-
-const getNextStepLink = (importData) => {
+const getNextStepLink = (importData, subscribersLimitForValidation) => {
if (importData === undefined) {
return 'step_data_manipulation';
}
if (importData.subscribersCount === undefined) {
return 'step_data_manipulation';
}
- if (importData.subscribersCount < SUBSCRIBERS_LIMIT_FOR_VALIDATION) {
+ if (importData.subscribersCount < subscribersLimitForValidation) {
return 'step_data_manipulation';
}
return 'step_input_validation';
@@ -26,6 +24,7 @@ const getNextStepLink = (importData) => {
function StepMethodSelection({
history,
setStepMethodSelection,
+ subscribersLimitForValidation,
}) {
const [method, setMethod] = useState(undefined);
const [pastedCsvData, setPastedCsvData] = useState('');
@@ -33,7 +32,7 @@ function StepMethodSelection({
const finish = (parsedData) => {
setStepMethodSelection(parsedData);
- history.push(getNextStepLink(parsedData));
+ history.push(getNextStepLink(parsedData, subscribersLimitForValidation));
};
const processLocal = () => {
@@ -95,6 +94,7 @@ StepMethodSelection.propTypes = {
push: PropTypes.func.isRequired,
}).isRequired,
setStepMethodSelection: PropTypes.func.isRequired,
+ subscribersLimitForValidation: PropTypes.number.isRequired,
};
export default withRouter(StepMethodSelection);