Web: Client: Data Import: add cancel migration button at the import step
This commit is contained in:
parent
cb254d6a11
commit
3bab7dd627
@ -27,15 +27,16 @@
|
||||
import { inject, observer } from "mobx-react";
|
||||
import styled from "styled-components";
|
||||
|
||||
import { SaveCancelButtons } from "@docspace/shared/components/save-cancel-buttons";
|
||||
import AccountsIcon from "PUBLIC_DIR/images/catalog.accounts.react.svg?url";
|
||||
import RoomsIcon from "PUBLIC_DIR/images/catalog.rooms.react.svg?url";
|
||||
import PortfolioIcon from "PUBLIC_DIR/images/catalog.portfolio.react.svg?url";
|
||||
import ProjectsIcon from "PUBLIC_DIR/images/catalog.projects.react.svg?url";
|
||||
import DocumentsIcon from "PUBLIC_DIR/images/catalog.documents.react.svg?url";
|
||||
import { PRODUCT_NAME } from "@docspace/shared/constants";
|
||||
import { CancelUploadDialog } from "SRC_DIR/components/dialogs";
|
||||
import ImportSection from "../sub-components/ImportSection";
|
||||
import { ImportStepProps, InjectedImportStepProps } from "../types";
|
||||
import { MigrationButtons } from "../sub-components/MigrationButtons";
|
||||
|
||||
const Wrapper = styled.div`
|
||||
display: flex;
|
||||
@ -63,6 +64,15 @@ const ImportStep = (props: ImportStepProps) => {
|
||||
importOptions,
|
||||
setImportOptions,
|
||||
user,
|
||||
cancelMigration,
|
||||
clearCheckedAccounts,
|
||||
setStep,
|
||||
setWorkspace,
|
||||
setMigratingWorkspace,
|
||||
setMigrationPhase,
|
||||
|
||||
cancelUploadDialogVisible,
|
||||
setCancelUploadDialogVisible,
|
||||
} = props as InjectedImportStepProps;
|
||||
|
||||
const onChange = (e: React.ChangeEvent<HTMLInputElement>, name: string) => {
|
||||
@ -73,6 +83,18 @@ const ImportStep = (props: ImportStepProps) => {
|
||||
const users =
|
||||
t("Settings:Employees")[0].toUpperCase() + t("Settings:Employees").slice(1);
|
||||
|
||||
const onCancelMigration = () => {
|
||||
cancelMigration();
|
||||
clearCheckedAccounts();
|
||||
setStep(1);
|
||||
setWorkspace("");
|
||||
setMigratingWorkspace("");
|
||||
setMigrationPhase("");
|
||||
};
|
||||
|
||||
const showCancelDialog = () => setCancelUploadDialogVisible(true);
|
||||
const hideCancelDialog = () => setCancelUploadDialogVisible(false);
|
||||
|
||||
return (
|
||||
<Wrapper>
|
||||
<ImportSection
|
||||
@ -203,7 +225,7 @@ const ImportStep = (props: ImportStepProps) => {
|
||||
/>
|
||||
)}
|
||||
|
||||
<SaveCancelButtons
|
||||
<MigrationButtons
|
||||
className="save-cancel-buttons"
|
||||
onSaveClick={incrementStep}
|
||||
onCancelClick={decrementStep}
|
||||
@ -211,22 +233,58 @@ const ImportStep = (props: ImportStepProps) => {
|
||||
cancelButtonLabel={t("Common:Back")}
|
||||
displaySettings
|
||||
showReminder
|
||||
migrationCancelLabel={t("Settings:CancelImport")}
|
||||
onMigrationCancelClick={showCancelDialog}
|
||||
/>
|
||||
|
||||
{cancelUploadDialogVisible && (
|
||||
<CancelUploadDialog
|
||||
visible={cancelUploadDialogVisible}
|
||||
onClose={hideCancelDialog}
|
||||
cancelMigration={onCancelMigration}
|
||||
loading={false}
|
||||
isFifthStep={false}
|
||||
isSixthStep={false}
|
||||
/>
|
||||
)}
|
||||
</Wrapper>
|
||||
);
|
||||
};
|
||||
|
||||
export default inject<TStore>(({ importAccountsStore, userStore }) => {
|
||||
const { importOptions, setImportOptions, incrementStep, decrementStep } =
|
||||
importAccountsStore;
|
||||
export default inject<TStore>(
|
||||
({ importAccountsStore, userStore, dialogsStore }) => {
|
||||
const {
|
||||
importOptions,
|
||||
setImportOptions,
|
||||
incrementStep,
|
||||
decrementStep,
|
||||
cancelMigration,
|
||||
clearCheckedAccounts,
|
||||
setStep,
|
||||
setWorkspace,
|
||||
setMigratingWorkspace,
|
||||
setMigrationPhase,
|
||||
} = importAccountsStore;
|
||||
const { cancelUploadDialogVisible, setCancelUploadDialogVisible } =
|
||||
dialogsStore;
|
||||
|
||||
const { user } = userStore;
|
||||
const { user } = userStore;
|
||||
|
||||
return {
|
||||
user,
|
||||
importOptions,
|
||||
setImportOptions,
|
||||
incrementStep,
|
||||
decrementStep,
|
||||
};
|
||||
})(observer(ImportStep));
|
||||
return {
|
||||
user,
|
||||
importOptions,
|
||||
setImportOptions,
|
||||
incrementStep,
|
||||
decrementStep,
|
||||
cancelMigration,
|
||||
clearCheckedAccounts,
|
||||
setStep,
|
||||
setWorkspace,
|
||||
setMigratingWorkspace,
|
||||
setMigrationPhase,
|
||||
|
||||
cancelUploadDialogVisible,
|
||||
setCancelUploadDialogVisible,
|
||||
};
|
||||
},
|
||||
)(observer(ImportStep));
|
||||
|
@ -269,7 +269,7 @@ export interface InjectedAddEmailsStepProps extends AddEmailsStepProps {
|
||||
setWorkspace: TStore["importAccountsStore"]["setWorkspace"];
|
||||
setMigratingWorkspace: TStore["importAccountsStore"]["setMigratingWorkspace"];
|
||||
setMigrationPhase: TStore["importAccountsStore"]["setMigrationPhase"];
|
||||
|
||||
|
||||
cancelUploadDialogVisible: TStore["dialogsStore"]["cancelUploadDialogVisible"];
|
||||
setCancelUploadDialogVisible: TStore["dialogsStore"]["setCancelUploadDialogVisible"];
|
||||
|
||||
@ -465,7 +465,17 @@ export interface InjectedImportStepProps extends ImportStepProps {
|
||||
decrementStep: TStore["importAccountsStore"]["decrementStep"];
|
||||
importOptions: TStore["importAccountsStore"]["importOptions"];
|
||||
setImportOptions: TStore["importAccountsStore"]["setImportOptions"];
|
||||
cancelMigration: TStore["importAccountsStore"]["cancelMigration"];
|
||||
clearCheckedAccounts: TStore["importAccountsStore"]["clearCheckedAccounts"];
|
||||
setStep: TStore["importAccountsStore"]["setStep"];
|
||||
setWorkspace: TStore["importAccountsStore"]["setWorkspace"];
|
||||
setMigratingWorkspace: TStore["importAccountsStore"]["setMigratingWorkspace"];
|
||||
setMigrationPhase: TStore["importAccountsStore"]["setMigrationPhase"];
|
||||
|
||||
user: TStore["userStore"]["user"];
|
||||
|
||||
cancelUploadDialogVisible: TStore["dialogsStore"]["cancelUploadDialogVisible"];
|
||||
setCancelUploadDialogVisible: TStore["dialogsStore"]["setCancelUploadDialogVisible"];
|
||||
}
|
||||
|
||||
export interface ImportProcessingStepProps {
|
||||
|
Loading…
Reference in New Issue
Block a user