Web: Client: Data Import: add props to configure SelectUsersStep
This commit is contained in:
parent
77ad2dadc2
commit
cbf24ea33b
@ -45,8 +45,14 @@ import {
|
|||||||
InjectedSelectUsersStepProps,
|
InjectedSelectUsersStepProps,
|
||||||
} from "../../types";
|
} from "../../types";
|
||||||
|
|
||||||
|
const REFRESH_TIMEOUT = 100;
|
||||||
|
const PAGING_BREAKPOINT = 25;
|
||||||
|
|
||||||
const SelectUsersStep = (props: SelectUsersStepProps) => {
|
const SelectUsersStep = (props: SelectUsersStepProps) => {
|
||||||
const {
|
const {
|
||||||
|
canDisable,
|
||||||
|
shouldSetUsers,
|
||||||
|
|
||||||
t,
|
t,
|
||||||
incrementStep,
|
incrementStep,
|
||||||
decrementStep,
|
decrementStep,
|
||||||
@ -55,6 +61,8 @@ const SelectUsersStep = (props: SelectUsersStepProps) => {
|
|||||||
setSearchValue,
|
setSearchValue,
|
||||||
checkedUsers,
|
checkedUsers,
|
||||||
users,
|
users,
|
||||||
|
areCheckedUsersEmpty,
|
||||||
|
setResultUsers,
|
||||||
|
|
||||||
quotaCharacteristics,
|
quotaCharacteristics,
|
||||||
} = props as InjectedSelectUsersStepProps;
|
} = props as InjectedSelectUsersStepProps;
|
||||||
@ -100,19 +108,35 @@ const SelectUsersStep = (props: SelectUsersStepProps) => {
|
|||||||
checkedUsers.withEmail.filter((user) => !user.isDuplicate).length +
|
checkedUsers.withEmail.filter((user) => !user.isDuplicate).length +
|
||||||
checkedUsers.withoutEmail.length;
|
checkedUsers.withoutEmail.length;
|
||||||
|
|
||||||
|
const handleStepIncrement = shouldSetUsers
|
||||||
|
? () => {
|
||||||
|
setResultUsers();
|
||||||
|
incrementStep();
|
||||||
|
}
|
||||||
|
: incrementStep;
|
||||||
|
|
||||||
|
const Buttons = (
|
||||||
|
<SaveCancelButtons
|
||||||
|
className="save-cancel-buttons"
|
||||||
|
onSaveClick={handleStepIncrement}
|
||||||
|
onCancelClick={decrementStep}
|
||||||
|
saveButtonLabel={t("Settings:NextStep")}
|
||||||
|
cancelButtonLabel={t("Common:Back")}
|
||||||
|
showReminder
|
||||||
|
displaySettings
|
||||||
|
saveButtonDisabled={
|
||||||
|
canDisable &&
|
||||||
|
(areCheckedUsersEmpty ||
|
||||||
|
(quota.max ? totalUsedUsers > quota.max : false))
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Wrapper>
|
<Wrapper>
|
||||||
{withEmailUsers.length > 0 ? (
|
{withEmailUsers.length > 0 ? (
|
||||||
<>
|
<>
|
||||||
<SaveCancelButtons
|
{Buttons}
|
||||||
className="save-cancel-buttons"
|
|
||||||
onSaveClick={incrementStep}
|
|
||||||
onCancelClick={decrementStep}
|
|
||||||
saveButtonLabel={t("Settings:NextStep")}
|
|
||||||
cancelButtonLabel={t("Common:Back")}
|
|
||||||
showReminder
|
|
||||||
displaySettings
|
|
||||||
/>
|
|
||||||
|
|
||||||
{quota.max && (
|
{quota.max && (
|
||||||
<UsersInfoBlock
|
<UsersInfoBlock
|
||||||
@ -129,20 +153,21 @@ const SelectUsersStep = (props: SelectUsersStepProps) => {
|
|||||||
placeholder={t("Common:Search")}
|
placeholder={t("Common:Search")}
|
||||||
value={searchValue}
|
value={searchValue}
|
||||||
onChange={onChangeInput}
|
onChange={onChangeInput}
|
||||||
refreshTimeout={100}
|
refreshTimeout={REFRESH_TIMEOUT}
|
||||||
onClearSearch={onClearSearchInput}
|
onClearSearch={onClearSearchInput}
|
||||||
size={InputSize.base}
|
size={InputSize.base}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<AccountsTable t={t} accountsData={filteredAccounts} />
|
<AccountsTable t={t} accountsData={filteredAccounts} />
|
||||||
|
|
||||||
{withEmailUsers.length > 25 && filteredAccounts.length > 0 && (
|
{withEmailUsers.length > PAGING_BREAKPOINT &&
|
||||||
<AccountsPaging
|
filteredAccounts.length > 0 && (
|
||||||
t={t}
|
<AccountsPaging
|
||||||
numberOfItems={withEmailUsers.length}
|
t={t}
|
||||||
setDataPortion={handleDataChange}
|
numberOfItems={withEmailUsers.length}
|
||||||
/>
|
setDataPortion={handleDataChange}
|
||||||
)}
|
/>
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
<Text fontWeight={600} lineHeight="20px" className="mb-17">
|
<Text fontWeight={600} lineHeight="20px" className="mb-17">
|
||||||
@ -150,17 +175,7 @@ const SelectUsersStep = (props: SelectUsersStepProps) => {
|
|||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{filteredAccounts.length > 0 && (
|
{filteredAccounts.length > 0 && Buttons}
|
||||||
<SaveCancelButtons
|
|
||||||
className="save-cancel-buttons"
|
|
||||||
onSaveClick={incrementStep}
|
|
||||||
onCancelClick={decrementStep}
|
|
||||||
saveButtonLabel={t("Settings:NextStep")}
|
|
||||||
cancelButtonLabel={t("Common:Back")}
|
|
||||||
showReminder
|
|
||||||
displaySettings
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</Wrapper>
|
</Wrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@ -175,6 +190,8 @@ export default inject<TStore>(({ importAccountsStore, currentQuotaStore }) => {
|
|||||||
setSearchValue,
|
setSearchValue,
|
||||||
cancelMigration,
|
cancelMigration,
|
||||||
checkedUsers,
|
checkedUsers,
|
||||||
|
areCheckedUsersEmpty,
|
||||||
|
setResultUsers,
|
||||||
} = importAccountsStore;
|
} = importAccountsStore;
|
||||||
|
|
||||||
const { quotaCharacteristics } = currentQuotaStore;
|
const { quotaCharacteristics } = currentQuotaStore;
|
||||||
@ -188,6 +205,8 @@ export default inject<TStore>(({ importAccountsStore, currentQuotaStore }) => {
|
|||||||
setSearchValue,
|
setSearchValue,
|
||||||
cancelMigration,
|
cancelMigration,
|
||||||
checkedUsers,
|
checkedUsers,
|
||||||
|
areCheckedUsersEmpty,
|
||||||
|
setResultUsers,
|
||||||
|
|
||||||
quotaCharacteristics,
|
quotaCharacteristics,
|
||||||
};
|
};
|
||||||
|
@ -112,6 +112,8 @@ export type TQuota = TPaymentFeature;
|
|||||||
|
|
||||||
export interface SelectUsersStepProps {
|
export interface SelectUsersStepProps {
|
||||||
t: TFunciton;
|
t: TFunciton;
|
||||||
|
canDisable: boolean;
|
||||||
|
shouldSetUsers: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface InjectedSelectUsersStepProps extends SelectUsersStepProps {
|
export interface InjectedSelectUsersStepProps extends SelectUsersStepProps {
|
||||||
@ -123,6 +125,8 @@ export interface InjectedSelectUsersStepProps extends SelectUsersStepProps {
|
|||||||
cancelMigration: TStore["importAccountsStore"]["cancelMigration"];
|
cancelMigration: TStore["importAccountsStore"]["cancelMigration"];
|
||||||
checkedUsers: TStore["importAccountsStore"]["checkedUsers"];
|
checkedUsers: TStore["importAccountsStore"]["checkedUsers"];
|
||||||
users: TStore["importAccountsStore"]["users"];
|
users: TStore["importAccountsStore"]["users"];
|
||||||
|
areCheckedUsersEmpty: TStore["importAccountsStore"]["areCheckedUsersEmpty"];
|
||||||
|
setResultUsers: TStore["importAccountsStore"]["setResultUsers"];
|
||||||
|
|
||||||
quotaCharacteristics: TStore["currentQuotaStore"]["quotaCharacteristics"];
|
quotaCharacteristics: TStore["currentQuotaStore"]["quotaCharacteristics"];
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user