From 29b63af836e16d9876cfcb90670c39d47714dd2a Mon Sep 17 00:00:00 2001 From: Flavien Bonvin Date: Fri, 20 Sep 2024 06:53:38 +0000 Subject: [PATCH] Flavien modal two --- .../src/app/reset/ValidateResetTokenConfirmModal.tsx | 2 +- .../mail/src/app/components/list/tip/useTipConfig.tsx | 3 +-- .../TransactionTable/useTransactionTable.ts | 2 +- .../components/components/commander/Commander.tsx | 4 ++-- .../confirmActionModal/ConfirmActionModal.tsx | 9 +++++++-- .../components/drawer/views/DrawerContactView.tsx | 2 +- .../views/SecurityCenter/PassAliases/PassAliases.tsx | 2 +- .../views/SecurityCenter/PassAliases/interface.ts | 2 +- .../CreatePassAliasesForm/CreatePassAliasesForm.tsx | 15 ++++++--------- .../PassAliases/modals/PassAliasesUpsellModal.tsx | 2 +- .../PassAliases/modals/TryProtonPass.tsx | 9 +++++---- .../PassAliases/usePassAliasesProviderSetup.ts | 2 +- .../SecurityCenter/ProtonSentinel/ProtonSentinel.tsx | 3 ++- .../modal/ProtonSentinelUpsellModal.tsx | 5 ++--- .../components/editor/hooks/useEditorModal.tsx | 2 +- .../components/editor/modals/DefaultFontModal.tsx | 7 +++++-- .../components/editor/modals/InsertImageModal.tsx | 5 ++++- .../editor/modals/InsertLinkModal/InsertLinkModal.tsx | 3 ++- .../InsertLinkModal/InsertLinkModalComponent.tsx | 7 +++++-- packages/components/components/index.ts | 1 - .../keyTransparency/KeyTransparencyDetailsModal.tsx | 16 ++++++---------- packages/components/components/modalTwo/Modal.tsx | 11 +++++------ packages/components/components/modalTwo/index.ts | 11 ----------- .../components/components/modalTwo/useModalTwo.tsx | 5 ++--- .../LinkConfirmationModal/LinkConfirmationModal.tsx | 8 ++++++-- packages/components/components/prompt/Prompt.tsx | 8 +++++--- .../topnavbar/TopNavBarOfferSubscriptionReminder.tsx | 2 +- .../components/upsell/modal/UpsellModal.tsx | 7 +++++-- .../upsell/modal/types/AutoDeleteUpsellModal.tsx | 2 +- .../modal/types/ComposerAssistantB2BUpsellModal.tsx | 2 +- .../modal/types/ComposerAssistantB2CUpsellModal.tsx | 2 +- .../modal/types/ComposerAssistantUpsellModal.tsx | 2 +- .../upsell/modal/types/FiltersUpsellModal.tsx | 2 +- .../upsell/modal/types/IncreasePrivacyUpsellModal.tsx | 3 +-- .../upsell/modal/types/LabelsUpsellModal.tsx | 2 +- .../components/upsell/modal/types/PmMeUpsellModal.tsx | 2 +- .../containers/account/ChangePasswordModal.tsx | 16 ++++++---------- .../containers/account/DeleteAccountModal.tsx | 19 +++++++------------ .../components/containers/account/DeleteSection.tsx | 2 +- .../containers/account/EditDisplayNameModal.tsx | 15 ++++++--------- .../containers/account/EditExternalAddressModal.tsx | 15 ++++++--------- .../containers/account/FamilyPlanSection.tsx | 2 +- .../containers/account/LeaveFamilyModal.tsx | 3 +-- .../components/containers/account/LostTwoFAModal.tsx | 2 +- .../containers/account/ReauthUsingRecoveryModal.tsx | 15 ++++++--------- .../containers/account/TwoFactorSection.tsx | 3 ++- .../components/containers/account/UsernameSection.tsx | 3 ++- .../containers/account/fido/AddSecurityKeyModal.tsx | 15 ++++++--------- .../containers/account/fido/EditSecurityKeyModal.tsx | 15 ++++++--------- .../account/fido/RemoveSecurityKeyModal.tsx | 4 ++-- .../ConfirmSessionRecoveryCancellationModal.tsx | 16 ++++++---------- .../sessionRecovery/InitiateSessionRecoveryModal.tsx | 12 +++++------- .../PasswordResetAvailableAccountModal.tsx | 16 ++++++---------- .../PasswordResetAvailableProductModal.tsx | 12 +++++------- .../SessionRecoveryInProgressModal.tsx | 12 +++++------- .../statusCards/PasswordResetAvailableCard.tsx | 2 +- .../statusCards/SessionRecoveryInProgressCard.tsx | 2 +- .../containers/account/totp/DisableTOTPModal.tsx | 4 ++-- .../containers/account/totp/EnableTOTPModal.tsx | 17 ++++++----------- .../containers/addresses/AddressActions.tsx | 2 +- .../components/containers/addresses/AddressModal.tsx | 16 ++++++---------- .../containers/addresses/AddressesWithMembers.tsx | 2 +- .../containers/addresses/AddressesWithUser.tsx | 9 ++------- .../containers/addresses/DeleteAddressPrompt.tsx | 3 +-- .../containers/addresses/EditInternalAddressModal.tsx | 15 ++++++--------- .../containers/addresses/PMSignatureField.tsx | 2 +- .../missingKeys/CreateMissingKeysAddressModal.tsx | 16 ++++++---------- .../components/containers/api/DelinquentModal.tsx | 3 +-- .../api/humanVerification/HumanVerificationModal.tsx | 6 ++++-- .../b2bDashboard/VPN/TogglingMonitoringModal.tsx | 2 +- .../containers/b2bDashboard/VPN/VPNEvents.tsx | 3 ++- .../holidaysCalendarModal/HolidaysCalendarModal.tsx | 14 ++++++++------ .../HolidaysCalendarModalWithDirectory.tsx | 15 ++++++--------- .../personalCalendarModal/PersonalCalendarModal.tsx | 6 +++++- .../SubscribedCalendarModal.tsx | 3 ++- .../containers/calendar/exportModal/ExportModal.tsx | 2 +- .../containers/calendar/importModal/ImportModal.tsx | 2 +- .../calendar/settings/CalendarDeleteSection.tsx | 3 ++- .../calendar/settings/CalendarExportSection.tsx | 2 +- .../calendar/settings/CalendarImportSection.tsx | 2 +- .../calendar/settings/CalendarShareSection.tsx | 2 +- .../settings/CalendarSubpageHeaderSection.tsx | 2 +- .../calendar/settings/MyCalendarsSection.tsx | 2 +- .../calendar/settings/OtherCalendarsSection.tsx | 2 +- .../calendar/settings/SharedCalendarsSection.tsx | 3 ++- .../calendar/shareProton/ShareCalendarModal.tsx | 14 ++++++-------- ...areCalendarWithSignatureVerificationErrorModal.tsx | 13 +++++-------- .../containers/calendar/shareURL/EditLinkModal.tsx | 3 ++- .../containers/calendar/shareURL/ShareLinkModal.tsx | 3 ++- .../calendar/shareURL/ShareLinkSuccessModal.tsx | 3 +-- .../containers/challenge/ChallengeError.tsx | 2 +- .../containers/contacts/edit/ContactEditModal.tsx | 7 +++++-- .../contacts/email/ContactEmailSettingsModal.tsx | 14 ++++++-------- .../contacts/group/ContactGroupDeleteModal.tsx | 2 +- .../contacts/group/ContactGroupDetailsModal.tsx | 4 ++-- .../contacts/group/ContactGroupEditModal.tsx | 7 ++++++- .../containers/contacts/hooks/useApplyGroups.tsx | 2 +- .../contacts/hooks/useContactMergeModals.tsx | 3 ++- .../containers/contacts/hooks/useContactModals.tsx | 2 +- .../containers/contacts/import/ContactImportModal.tsx | 4 ++-- .../contacts/import/steps/ContactImportAttaching.tsx | 5 ++++- .../contacts/import/steps/ContactImportCsv.tsx | 4 +++- .../contacts/import/steps/ContactImportGroups.tsx | 4 +++- .../contacts/import/steps/ContactImportSummary.tsx | 4 +++- .../contacts/import/steps/ContactImportWarning.tsx | 4 +++- .../contacts/import/steps/ContactImporting.tsx | 4 +++- .../contacts/merge/ContactMergeDetailsModal.tsx | 7 +++++-- .../contacts/merge/ContactMergeErrorContent.tsx | 5 +++-- .../containers/contacts/merge/ContactMergeModal.tsx | 4 ++-- .../contacts/merge/ContactMergePreviewModal.tsx | 4 ++-- .../contacts/merge/ContactMergeTableContent.tsx | 4 +++- .../contacts/merge/ContactMergeViewContent.tsx | 4 +++- .../contacts/merge/ContactMergingContent.tsx | 4 +++- .../contacts/modals/ContactClearDataConfirmModal.tsx | 7 +++++-- .../modals/ContactClearDataExecutionModal.tsx | 7 +++++-- .../contacts/modals/ContactDecryptionErrorModal.tsx | 15 ++++++--------- .../containers/contacts/modals/ContactDeleteModal.tsx | 2 +- .../contacts/modals/ContactExportingModal.tsx | 7 +++++-- .../contacts/modals/ContactGroupLimitReachedModal.tsx | 2 +- .../containers/contacts/modals/ContactImageModal.tsx | 8 ++++++-- .../contacts/modals/ContactResignExecutionModal.tsx | 7 +++++-- .../contacts/modals/ContactSignatureErrorModal.tsx | 8 +++++--- .../contacts/modals/ContactUpgradeModal.tsx | 3 +-- .../containers/contacts/modals/SelectEmailsModal.tsx | 8 ++++++-- .../contacts/selector/ContactSelectorModal.tsx | 7 +++++-- .../containers/contacts/view/ContactDetailsModal.tsx | 7 +++++-- .../containers/credentialLeak/BreachModal.tsx | 7 +++++-- .../credentialLeak/CredentialLeakSection.tsx | 2 +- .../InboxDesktopFreeTrialOnboardingModal.tsx | 5 ++++- .../components/containers/domains/CatchAllModal.tsx | 7 +++++-- .../components/containers/domains/DomainModal.tsx | 15 ++++++--------- .../components/containers/domains/DomainsSection.tsx | 2 +- .../components/containers/filePreview/CloseModal.tsx | 3 +-- .../components/containers/filePreview/FilePreview.tsx | 5 ++--- .../containers/filters/ActionsFilterToolbar.tsx | 2 +- .../components/containers/filters/FilterItemRow.tsx | 3 ++- .../containers/filters/modal/CloseFilterModal.tsx | 3 +-- .../containers/filters/modal/DeleteFilterModal.tsx | 3 +-- .../filters/modal/FilterActionsFormFolderRow.tsx | 3 ++- .../filters/modal/FilterActionsFormLabelsRow.tsx | 3 ++- .../containers/filters/modal/FilterModal.tsx | 8 ++++++-- .../filters/modal/advanced/AdvancedFilterModal.tsx | 8 ++++++-- .../components/containers/filters/spams/Spams.tsx | 3 ++- .../containers/filters/spams/modals/SpamModal.tsx | 8 ++++++-- .../containers/forward/ConfirmDeleteForwarding.tsx | 3 +-- .../components/containers/forward/ForwardModal.tsx | 15 ++++++--------- .../components/containers/forward/ForwardSection.tsx | 4 +++- .../containers/forward/OutgoingForwardActions.tsx | 3 ++- .../components/containers/general/PmMeSection.tsx | 3 ++- .../containers/gmailSyncModal/GmailSyncModal.tsx | 4 ++-- .../components/containers/heading/UserDropdown.tsx | 2 +- .../containers/invoices/InvoiceTextModal.tsx | 15 ++++++--------- .../components/containers/keys/AddressKeysSection.tsx | 2 +- .../components/containers/keys/UserKeysSection.tsx | 2 +- .../components/containers/keys/addKey/AddKeyModal.tsx | 7 +++++-- .../keys/exportKey/ExportPrivateKeyModal.tsx | 16 ++++++---------- .../keys/exportKey/ExportPublicKeyModal.tsx | 13 +++++-------- .../containers/keys/importKeys/ImportKeyModal.tsx | 10 ++++++---- .../keys/reactivateKeys/ReactivateKeysModal.tsx | 17 ++++++----------- .../containers/keys/shared/DecryptFileKeyModal.tsx | 16 ++++++---------- .../components/containers/labels/ActionsLabel.tsx | 2 +- .../components/containers/labels/FoldersSection.tsx | 2 +- .../components/containers/labels/LabelsSection.tsx | 2 +- .../containers/labels/modals/DeleteLabelModal.tsx | 2 +- .../containers/labels/modals/EditLabelModal.tsx | 8 ++++++-- packages/components/containers/login/UnlockModal.tsx | 15 ++++++--------- .../containers/mail/MailComposerModeModal.tsx | 7 +++++-- .../components/containers/mail/MailDensityModal.tsx | 7 +++++-- .../components/containers/mail/MailShortcutsModal.tsx | 15 ++++++--------- .../containers/mail/MailViewLayoutModal.tsx | 7 +++++-- .../containers/members/ChangeMemberPasswordModal.tsx | 16 ++++++---------- .../members/InviteUserCreateSubUserModal.tsx | 4 ++-- .../containers/members/SubUserBulkCreateModal.tsx | 14 ++++++-------- .../containers/members/SubUserCreateModal.tsx | 16 ++++++---------- .../containers/members/SubUserDeleteModal.tsx | 15 ++++++--------- .../containers/members/SubUserEditModal.tsx | 14 ++++++-------- .../Unprivatization/MemberUnprivatizationModal.tsx | 14 ++++++-------- .../containers/members/UserInviteOrEditModal.tsx | 15 ++++++--------- .../components/containers/members/UserRemoveModal.tsx | 2 +- .../UsersAndAddressesSection.tsx | 2 +- .../CreateUserAccountsModal.tsx | 10 +++++----- .../multipleUserCreation/MultiUserCreationSection.tsx | 2 +- .../containers/messages/AutoDeleteSetting.tsx | 2 +- .../containers/mnemonic/DisableMnemonicModal.tsx | 4 ++-- .../containers/mnemonic/GenerateMnemonicModal.tsx | 14 ++++++-------- .../containers/offers/components/OfferModal.tsx | 5 +++-- .../containers/offers/hooks/useOfferModal.ts | 2 +- .../containers/onboarding/OnboardingModal.tsx | 9 +++++---- .../ActivatePasswordlessOrganizationKey.tsx | 7 +++++-- .../organization/ChangeOrganizationKeysModal.tsx | 18 +++++++----------- .../ChangeOrganizationKeysPasswordlessModal.tsx | 8 ++++++-- .../organization/ChangeOrganizationPasswordModal.tsx | 18 +++++++----------- .../organization/EditOrganizationIdentityModal.tsx | 16 ++++++---------- .../organization/InviteOrganizationKeysModal.tsx | 7 +++++-- .../containers/organization/OrganizationNameModal.tsx | 15 ++++++--------- .../containers/organization/OrganizationSection.tsx | 3 ++- .../OrganizationTwoFARemindersSection.tsx | 3 ++- .../organization/ReactivateOrganizationKeysModal.tsx | 16 ++++++---------- .../ReactivatePasswordlessOrganizationKey.tsx | 7 +++++-- .../organization/SendEmailReminderTwoFAModal.tsx | 14 ++++++-------- .../organization/SetupOrganizationModal.tsx | 16 ++++++---------- .../organization/groups/AddSubdomainModal.tsx | 17 ++++++----------- .../organization/groups/DiscardGroupChangesPrompt.tsx | 2 +- .../containers/organization/groups/EditGroup.tsx | 3 ++- .../organization/groups/GroupAddressDomainSelect.tsx | 3 ++- .../organization/groups/GroupItemActionPrompt.tsx | 2 +- .../groups/GroupItemMoreOptionsDropdown.tsx | 3 ++- .../logoUpload/LightLabellingFeatureModal.tsx | 7 ++++--- .../organization/logoUpload/OrganizationLogoModal.tsx | 14 ++++++-------- .../logoUpload/OrganizationLogoRemovalModal.tsx | 15 ++++++--------- .../logoUpload/OrganizationLogoTipsModal.tsx | 12 +++++------- .../organization/sso/ConfigureSamlModal.tsx | 15 ++++++--------- .../organization/sso/DomainVerificationState.tsx | 2 +- .../containers/organization/sso/RemoveSSOModal.tsx | 16 ++++++---------- .../containers/organization/sso/RemoveSSOSection.tsx | 2 +- .../organization/sso/SetupSSODomainModal.tsx | 15 ++++++--------- .../containers/organization/sso/SsoPage.tsx | 5 +++-- .../containers/organization/sso/TXTRecordModal.tsx | 12 +++++------- .../containers/organization/sso/TestSamlModal.tsx | 12 +++++------- .../organization/sso/scim/DisableSCIMModal.tsx | 7 +++++-- .../organization/sso/scim/SCIMSettingsSection.tsx | 2 +- .../organization/sso/scim/SetupSCIMModal.tsx | 12 +++++------- .../containers/organization/useOrganizationModals.tsx | 2 +- packages/components/containers/password/AuthModal.tsx | 17 ++++++----------- .../components/containers/payments/CreditsModal.tsx | 7 +++++-- .../components/containers/payments/CreditsSection.tsx | 4 ++-- .../components/containers/payments/DowngradeModal.tsx | 3 +-- .../components/containers/payments/EditCardModal.tsx | 7 +++++-- .../containers/payments/LossLoyaltyModal.tsx | 3 +-- .../containers/payments/MemberDowngradeModal.tsx | 15 ++++++--------- .../payments/PassLaunchOfferDowngradeModal.tsx | 3 +-- .../components/containers/payments/PayPalModal.tsx | 2 +- .../components/containers/payments/RenewToggle.tsx | 2 +- .../payments/methods/PaymentMethodsSection.tsx | 2 +- .../subscription/AutomaticSubscriptionModal.tsx | 2 +- .../payments/subscription/CalendarDowngradeModal.tsx | 2 +- .../payments/subscription/FeedbackDowngradeModal.tsx | 16 ++++++---------- .../subscription/HighlightPlanDowngradeModal.tsx | 12 +++++------- .../payments/subscription/InAppPurchaseModal.tsx | 7 +++++-- .../payments/subscription/PendingInvitationModal.tsx | 14 ++++++-------- .../subscription/PendingInvitationModalErrors.tsx | 2 +- .../subscription/SubscriptionModalProvider.tsx | 6 +++++- .../subscription/SubscriptionSubmitButton.tsx | 3 ++- .../CancelB2bSubscriptionModal.tsx | 10 +++++----- .../CancelB2bSubscriptionSection.tsx | 2 +- .../CancelSubscriptionLoadingModal.tsx | 5 +++-- .../cancelSubscription/CancelSubscriptionModal.tsx | 2 +- .../cancelSubscription/useCancelSubscriptionFlow.tsx | 4 ++-- .../cancellationFlow/CancelConfirmationModal.tsx | 7 +++++-- .../cancellationFlow/CancelRedirectionModal.tsx | 2 +- .../cancellationFlow/CancellationReminderSection.tsx | 10 ++-------- .../CancellationReminderModal.tsx | 7 +++++-- .../subscription/panels/PendingInvitationsPanel.tsx | 2 +- .../containers/recovery/DataRecoverySection.tsx | 2 +- .../containers/recovery/OverviewSection.tsx | 2 +- .../containers/recovery/SessionRecoverySection.tsx | 2 +- .../containers/recovery/VoidRecoveryFilesModal.tsx | 2 +- .../recovery/email/ConfirmRemoveEmailModal.tsx | 13 +++++-------- .../containers/recovery/email/RecoveryEmail.tsx | 3 ++- .../recovery/email/VerifyRecoveryEmailModal.tsx | 2 +- .../recovery/phone/ConfirmRemovePhoneModal.tsx | 13 +++++-------- .../containers/recovery/phone/RecoveryPhone.tsx | 3 ++- .../recovery/phone/VerifyRecoveryPhoneModal.tsx | 2 +- .../containers/referral/modals/ReferralModal.tsx | 17 ++++++----------- .../security/ExternalPGPSettingsSection.tsx | 2 +- .../containers/sessions/SessionsSection.tsx | 3 ++- .../containers/smtp/SMTPSubmissionSection.tsx | 2 +- .../components/containers/smtp/SMTPTokenModal.tsx | 18 ++++++------------ packages/components/containers/support/BugModal.tsx | 10 +++++----- .../containers/support/FreeUserLiveChatModal.tsx | 12 +++++------- packages/components/containers/themes/ThemesModal.tsx | 7 +++++-- .../topBanners/PendingInvitationTopBanner.tsx | 3 ++- .../containers/topBanners/SessionRecoveryBanners.tsx | 2 +- .../ProtonVPNClientsSection.tsx | 5 +++-- .../WireGuardConfigurationSection.tsx | 3 ++- .../WireGuardCreationModal.tsx | 8 ++++++-- .../vpn/gateways/GatewayAddServersModal.tsx | 7 +++++-- .../containers/vpn/gateways/GatewayModal.tsx | 14 ++++++-------- .../containers/vpn/gateways/GatewayRenameModal.tsx | 14 ++++++-------- .../containers/vpn/gateways/GatewayServersModal.tsx | 14 ++++++-------- .../containers/vpn/gateways/GatewayUsersModal.tsx | 7 +++++-- .../containers/vpn/gateways/GatewaysSection.tsx | 2 +- packages/components/hooks/useLinkHandler.tsx | 2 +- packages/components/index.ts | 14 ++++++++++++++ .../components/payments/chargebee/ChargebeeIframe.tsx | 4 +++- .../client-extensions/billed-user/BilledUserModal.tsx | 9 +++++++-- 286 files changed, 957 insertions(+), 984 deletions(-) delete mode 100644 packages/components/components/modalTwo/index.ts diff --git a/applications/account/src/app/reset/ValidateResetTokenConfirmModal.tsx b/applications/account/src/app/reset/ValidateResetTokenConfirmModal.tsx index 9310b3e7e1..67aa777d2b 100644 --- a/applications/account/src/app/reset/ValidateResetTokenConfirmModal.tsx +++ b/applications/account/src/app/reset/ValidateResetTokenConfirmModal.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components/modalTwo'; +import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components'; import type { RecoveryMethod } from '@proton/components/containers/resetPassword/interface'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; import { PASS_APP_NAME } from '@proton/shared/lib/constants'; diff --git a/applications/mail/src/app/components/list/tip/useTipConfig.tsx b/applications/mail/src/app/components/list/tip/useTipConfig.tsx index 97b944615f..59d4650295 100644 --- a/applications/mail/src/app/components/list/tip/useTipConfig.tsx +++ b/applications/mail/src/app/components/list/tip/useTipConfig.tsx @@ -1,8 +1,7 @@ import { c } from 'ttag'; -import { EditLabelModal } from '@proton/components'; +import { EditLabelModal, useModalStateObject } from '@proton/components'; import ProtonSentinelUpsellModal from '@proton/components/components/drawer/views/SecurityCenter/ProtonSentinel/modal/ProtonSentinelUpsellModal'; -import { useModalStateObject } from '@proton/components/components/modalTwo'; import AutoDeleteUpsellModal from '@proton/components/components/upsell/modal/types/AutoDeleteUpsellModal'; import IncreasePrivacyUpsellModal from '@proton/components/components/upsell/modal/types/IncreasePrivacyUpsellModal'; import LabelsUpsellModal from '@proton/components/components/upsell/modal/types/LabelsUpsellModal'; diff --git a/applications/wallet/src/app/components/TransactionList/TransactionTable/useTransactionTable.ts b/applications/wallet/src/app/components/TransactionList/TransactionTable/useTransactionTable.ts index 8db0d8291d..fea2f72102 100644 --- a/applications/wallet/src/app/components/TransactionList/TransactionTable/useTransactionTable.ts +++ b/applications/wallet/src/app/components/TransactionList/TransactionTable/useTransactionTable.ts @@ -1,7 +1,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'; import type { WasmSortOrder, WasmTransactionDetails } from '@proton/andromeda'; -import { useModalStateWithData } from '@proton/components/components'; +import { useModalStateWithData } from '@proton/components/components/modalTwo/useModalState'; import { useUserKeys } from '@proton/components/hooks'; import { type IWasmApiWalletData, diff --git a/packages/components/components/commander/Commander.tsx b/packages/components/components/commander/Commander.tsx index 68f23bdd53..9bdc5cf9ec 100644 --- a/packages/components/components/commander/Commander.tsx +++ b/packages/components/components/commander/Commander.tsx @@ -7,12 +7,12 @@ import { InputFieldTwo } from '@proton/components'; import DropdownMenuButton from '@proton/components/components/dropdown/DropdownMenuButton'; import type { IconName } from '@proton/components/components/icon/Icon'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import { normalize } from '@proton/shared/lib/helpers/string'; import clsx from '@proton/utils/clsx'; import Form from '../form/Form'; -import type { ModalProps } from '../modalTwo'; -import { ModalTwo } from '../modalTwo'; import { Mark } from '../text'; import './Commander.scss'; diff --git a/packages/components/components/confirmActionModal/ConfirmActionModal.tsx b/packages/components/components/confirmActionModal/ConfirmActionModal.tsx index b48aafd8e1..2321e1f4bb 100644 --- a/packages/components/components/confirmActionModal/ConfirmActionModal.tsx +++ b/packages/components/components/confirmActionModal/ConfirmActionModal.tsx @@ -4,8 +4,13 @@ import React, { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalSize, ModalStateProps } from '@proton/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, useModalTwoStatic } from '@proton/components'; +import type { ModalSize } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; export interface ConfirmActionModalProps { message: string | ReactNode; diff --git a/packages/components/components/drawer/views/DrawerContactView.tsx b/packages/components/components/drawer/views/DrawerContactView.tsx index 944846c84f..776876932b 100644 --- a/packages/components/components/drawer/views/DrawerContactView.tsx +++ b/packages/components/components/drawer/views/DrawerContactView.tsx @@ -4,10 +4,10 @@ import { c } from 'ttag'; import { EasySwitchProvider } from '@proton/activation'; import { Button } from '@proton/atoms'; -import { useModalTwoStatic } from '@proton/components/components'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import type { SelectedDrawerOption } from '@proton/components/components/drawer/views/DrawerView'; import DrawerView from '@proton/components/components/drawer/views/DrawerView'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import { useContactModals } from '@proton/components/containers'; import { useContactMergeModals } from '@proton/components/containers/contacts/hooks/useContactMergeModals'; import ContactImportModal from '@proton/components/containers/contacts/import/ContactImportModal'; diff --git a/packages/components/components/drawer/views/SecurityCenter/PassAliases/PassAliases.tsx b/packages/components/components/drawer/views/SecurityCenter/PassAliases/PassAliases.tsx index f0da92360b..2aab06e57f 100644 --- a/packages/components/components/drawer/views/SecurityCenter/PassAliases/PassAliases.tsx +++ b/packages/components/components/drawer/views/SecurityCenter/PassAliases/PassAliases.tsx @@ -3,9 +3,9 @@ import { useMemo } from 'react'; import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; -import { useModalStateObject } from '@proton/components/components'; import Icon from '@proton/components/components/icon/Icon'; import Loader from '@proton/components/components/loader/Loader'; +import { useModalStateObject } from '@proton/components/components/modalTwo/useModalState'; import { ErrorBoundary } from '@proton/components/containers'; import { GenericErrorDisplay } from '@proton/components/containers/error/GenericError'; import { useApi, useAuthentication } from '@proton/components/hooks'; diff --git a/packages/components/components/drawer/views/SecurityCenter/PassAliases/interface.ts b/packages/components/components/drawer/views/SecurityCenter/PassAliases/interface.ts index 0e040083b0..cd9a0a4d73 100644 --- a/packages/components/components/drawer/views/SecurityCenter/PassAliases/interface.ts +++ b/packages/components/components/drawer/views/SecurityCenter/PassAliases/interface.ts @@ -1,4 +1,4 @@ -import type { ModalStateReturnObj } from '@proton/components/components'; +import type { ModalStateReturnObj } from '@proton/components/components/modalTwo/useModalState'; import type { PassBridgeAliasItem } from '@proton/pass/lib/bridge/types'; import type { AliasOptions, Share, ShareType } from '@proton/pass/types'; diff --git a/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/CreatePassAliasesForm/CreatePassAliasesForm.tsx b/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/CreatePassAliasesForm/CreatePassAliasesForm.tsx index 04a8003b0c..acf4d65458 100644 --- a/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/CreatePassAliasesForm/CreatePassAliasesForm.tsx +++ b/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/CreatePassAliasesForm/CreatePassAliasesForm.tsx @@ -4,18 +4,15 @@ import { c } from 'ttag'; import type { Input } from '@proton/atoms'; import { Button, CircleLoader, Href } from '@proton/atoms'; -import { - InputFieldTwo, - type ModalProps, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - TextAreaTwo, -} from '@proton/components/components'; +import { InputFieldTwo, TextAreaTwo } from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; import { InputFieldStacked } from '@proton/components/components/inputFieldStacked'; import InputFieldStackedGroup from '@proton/components/components/inputFieldStacked/InputFieldStackedGroup'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { useNotifications } from '@proton/components/hooks'; diff --git a/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/PassAliasesUpsellModal.tsx b/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/PassAliasesUpsellModal.tsx index c5248fe3c5..1ac710bae0 100644 --- a/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/PassAliasesUpsellModal.tsx +++ b/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/PassAliasesUpsellModal.tsx @@ -1,6 +1,6 @@ import { c } from 'ttag'; -import type { ModalStateProps } from '@proton/components/components'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { useUser } from '@proton/components/hooks'; import { diff --git a/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/TryProtonPass.tsx b/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/TryProtonPass.tsx index 9d54363beb..7f802cfd08 100644 --- a/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/TryProtonPass.tsx +++ b/packages/components/components/drawer/views/SecurityCenter/PassAliases/modals/TryProtonPass.tsx @@ -1,9 +1,10 @@ import { c } from 'ttag'; -import { Button, ButtonLike } from '@proton/atoms'; -import { Href } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter } from '@proton/components/components'; +import { Button, ButtonLike, Href } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; import { useApi } from '@proton/components/hooks'; import { PASS_WEB_APP_URL } from '@proton/pass/constants'; import { TelemetrySecurityCenterEvents } from '@proton/shared/lib/api/telemetry'; diff --git a/packages/components/components/drawer/views/SecurityCenter/PassAliases/usePassAliasesProviderSetup.ts b/packages/components/components/drawer/views/SecurityCenter/PassAliases/usePassAliasesProviderSetup.ts index 5421cb021d..cac8102ec5 100644 --- a/packages/components/components/drawer/views/SecurityCenter/PassAliases/usePassAliasesProviderSetup.ts +++ b/packages/components/components/drawer/views/SecurityCenter/PassAliases/usePassAliasesProviderSetup.ts @@ -3,7 +3,7 @@ import { useEffect, useReducer } from 'react'; import { c } from 'ttag'; import { NOTIFICATION_DEFAULT_EXPIRATION_TIME } from '@proton/components'; -import { useModalStateObject } from '@proton/components/components'; +import { useModalStateObject } from '@proton/components/components/modalTwo/useModalState'; import { useAddresses, useAuthentication, useNotifications, useUser } from '@proton/components/hooks'; import useAsyncError from '@proton/hooks/useAsyncError'; import useIsMounted from '@proton/hooks/useIsMounted'; diff --git a/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/ProtonSentinel.tsx b/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/ProtonSentinel.tsx index 7336a32799..d9ace32ab8 100644 --- a/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/ProtonSentinel.tsx +++ b/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/ProtonSentinel.tsx @@ -3,7 +3,8 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; -import { useModalStateObject, useSettingsLink } from '@proton/components/components'; +import { useSettingsLink } from '@proton/components/components'; +import { useModalStateObject } from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import { getDisabledString, getEnabledString } from '@proton/components/containers/credentialLeak/helpers'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; diff --git a/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/modal/ProtonSentinelUpsellModal.tsx b/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/modal/ProtonSentinelUpsellModal.tsx index b18019ee05..feced6192c 100644 --- a/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/modal/ProtonSentinelUpsellModal.tsx +++ b/packages/components/components/drawer/views/SecurityCenter/ProtonSentinel/modal/ProtonSentinelUpsellModal.tsx @@ -2,9 +2,11 @@ import { c } from 'ttag'; import { ButtonLike, Href } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import ModalContent from '@proton/components/components/modalTwo/ModalContent'; import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import { useUser } from '@proton/components/hooks'; import { APP_UPSELL_REF_PATH, @@ -16,9 +18,6 @@ import { addUpsellPath, getUpgradePath, getUpsellRef } from '@proton/shared/lib/ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import protonSentinelImage from '@proton/styles/assets/img/illustrations/upsell-proton-sentinel.svg'; -import type { ModalStateProps } from '../../../../../modalTwo'; -import { ModalTwo } from '../../../../../modalTwo'; - interface Props { modalProps: ModalStateProps; upsellComponent?: UPSELL_COMPONENT; diff --git a/packages/components/components/editor/hooks/useEditorModal.tsx b/packages/components/components/editor/hooks/useEditorModal.tsx index 77e8cbb8af..45b269bbfd 100644 --- a/packages/components/components/editor/hooks/useEditorModal.tsx +++ b/packages/components/components/editor/hooks/useEditorModal.tsx @@ -1,6 +1,6 @@ import { useCallback, useState } from 'react'; -import { useModalState } from '../../../components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; function useEditorModal

() { const [modalsStateProps, openModal, render] = useModalState(); diff --git a/packages/components/components/editor/modals/DefaultFontModal.tsx b/packages/components/components/editor/modals/DefaultFontModal.tsx index 6f0b53f78b..101870b8e1 100644 --- a/packages/components/components/editor/modals/DefaultFontModal.tsx +++ b/packages/components/components/editor/modals/DefaultFontModal.tsx @@ -1,12 +1,15 @@ -import React, { useState } from 'react'; +import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { updateFontFace, updateFontSize } from '@proton/shared/lib/api/mailSettings'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import FontFaceSelect from '../../../containers/layouts/FontFaceSelect'; import FontSizeSelect from '../../../containers/layouts/FontSizeSelect'; import { useApi, useEventManager, useMailSettings, useNotifications } from '../../../hooks'; diff --git a/packages/components/components/editor/modals/InsertImageModal.tsx b/packages/components/components/editor/modals/InsertImageModal.tsx index f424a7c214..c013ae6c4f 100644 --- a/packages/components/components/editor/modals/InsertImageModal.tsx +++ b/packages/components/components/editor/modals/InsertImageModal.tsx @@ -5,6 +5,10 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { isValidHttpUrl } from '@proton/shared/lib/helpers/url'; import debounce from '@proton/utils/debounce'; import generateUID from '@proton/utils/generateUID'; @@ -13,7 +17,6 @@ import FileButton from '../../button/FileButton'; import Form from '../../form/Form'; import Input from '../../input/Input'; import Label from '../../label/Label'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../modalTwo'; enum ImageState { Initial, diff --git a/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModal.tsx b/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModal.tsx index 2f0481a4e2..828c75468c 100644 --- a/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModal.tsx +++ b/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModal.tsx @@ -2,7 +2,8 @@ import { useMemo } from 'react'; import { SelectionRangeTypes } from 'roosterjs-editor-types'; -import type { ModalStateProps } from '../../../modalTwo'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; + import type { ModalLinkProps } from '../../hooks/interface'; import InsertLinkModalComponent from './InsertLinkModalComponent'; diff --git a/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModalComponent.tsx b/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModalComponent.tsx index 25156cf951..3081576211 100644 --- a/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModalComponent.tsx +++ b/packages/components/components/editor/modals/InsertLinkModal/InsertLinkModalComponent.tsx @@ -8,6 +8,11 @@ import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import Field from '@proton/components/components/container/Field'; import Row from '@proton/components/components/container/Row'; import Form from '@proton/components/components/form/Form'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { useMailSettings } from '@proton/components/hooks'; @@ -16,8 +21,6 @@ import { addLinkPrefix, linkToType } from '@proton/shared/lib/helpers/url'; import { useLinkHandler } from '../../../../hooks/useLinkHandler'; import Label from '../../../label/Label'; -import type { ModalStateProps } from '../../../modalTwo'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../modalTwo'; import type { InsertLinkSelectionType } from './InsertLinkModal'; export interface InsertLinkModalProps { diff --git a/packages/components/components/index.ts b/packages/components/components/index.ts index 8cbb6d8af9..fb2b993b6c 100644 --- a/packages/components/components/index.ts +++ b/packages/components/components/index.ts @@ -9,7 +9,6 @@ export * from './link'; export * from './logo'; export * from './maintenanceLayout'; export * from './miniCalendar'; -export * from './modalTwo'; export * from './newFeatureOnboarding'; export * from './newFeatureTag'; export * from './orderable'; diff --git a/packages/components/components/keyTransparency/KeyTransparencyDetailsModal.tsx b/packages/components/components/keyTransparency/KeyTransparencyDetailsModal.tsx index 5d20c312a2..aa8619dfc1 100644 --- a/packages/components/components/keyTransparency/KeyTransparencyDetailsModal.tsx +++ b/packages/components/components/keyTransparency/KeyTransparencyDetailsModal.tsx @@ -2,17 +2,13 @@ import { formatDistanceToNow } from 'date-fns'; import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - AppLink, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useConfig, - useKeyTransparencyContext, -} from '@proton/components'; +import { AppLink, useConfig, useKeyTransparencyContext } from '@proton/components'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { AddressAuditWarningDetails, LocalStorageAuditResult, diff --git a/packages/components/components/modalTwo/Modal.tsx b/packages/components/components/modalTwo/Modal.tsx index 94ba3c653e..b578f1c75c 100644 --- a/packages/components/components/modalTwo/Modal.tsx +++ b/packages/components/components/modalTwo/Modal.tsx @@ -1,5 +1,10 @@ import { type ElementType, createContext, useEffect, useLayoutEffect, useRef, useState } from 'react'; +import Dialog from '@proton/components/components/dialog/Dialog'; +import useFocusTrap from '@proton/components/components/focus/useFocusTrap'; +import { useModalPosition } from '@proton/components/components/modalTwo/modalPositions'; +import Portal from '@proton/components/components/portal/Portal'; +import { useHotkeys } from '@proton/components/hooks/useHotkeys'; import useInstance from '@proton/hooks/useInstance'; import usePrevious from '@proton/hooks/usePrevious'; import { type PolymorphicPropsWithoutRef } from '@proton/react-polymorphic-types'; @@ -7,12 +12,6 @@ import { modalTwoRootClassName } from '@proton/shared/lib/busy'; import clsx from '@proton/utils/clsx'; import generateUID from '@proton/utils/generateUID'; -import { useHotkeys } from '../../hooks/useHotkeys'; -import Dialog from '../dialog/Dialog'; -import useFocusTrap from '../focus/useFocusTrap'; -import { Portal } from '../portal'; -import { useModalPosition } from './modalPositions'; - import './Modal.scss'; export type ModalSize = 'small' | 'medium' | 'large' | 'xlarge' | 'full'; diff --git a/packages/components/components/modalTwo/index.ts b/packages/components/components/modalTwo/index.ts deleted file mode 100644 index 897d7f4e09..0000000000 --- a/packages/components/components/modalTwo/index.ts +++ /dev/null @@ -1,11 +0,0 @@ -export { default as ModalTwo } from './Modal'; -export * from './Modal'; -export { default as ModalTwoContent } from './ModalContent'; -export * from './ModalContent'; -export { default as ModalTwoFooter } from './ModalFooter'; -export { default as ModalTwoHeader } from './ModalHeader'; -export { default as useModalState } from './useModalState'; -export { useModalTwo, useModalTwoStatic, useModalTwoPromise } from './useModalTwo'; -export * from './useModalState'; - -export { default as BasicModal } from './BasicModal'; diff --git a/packages/components/components/modalTwo/useModalTwo.tsx b/packages/components/components/modalTwo/useModalTwo.tsx index 2cb8664a92..0ec294ab4a 100644 --- a/packages/components/components/modalTwo/useModalTwo.tsx +++ b/packages/components/components/modalTwo/useModalTwo.tsx @@ -1,11 +1,10 @@ import type { ComponentType, ReactNode } from 'react'; import { useCallback, useRef, useState } from 'react'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import noop from '@proton/utils/noop'; -import type { ModalStateProps } from './useModalState'; -import useModalState from './useModalState'; - type PartialModalStateProps = Partial; export const useModalTwoStatic = < diff --git a/packages/components/components/notifications/LinkConfirmationModal/LinkConfirmationModal.tsx b/packages/components/components/notifications/LinkConfirmationModal/LinkConfirmationModal.tsx index e35af3edb1..c3963334d4 100644 --- a/packages/components/components/notifications/LinkConfirmationModal/LinkConfirmationModal.tsx +++ b/packages/components/components/notifications/LinkConfirmationModal/LinkConfirmationModal.tsx @@ -4,14 +4,18 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import { updateConfirmLink } from '@proton/shared/lib/api/mailSettings'; import { openNewTab } from '@proton/shared/lib/helpers/browser'; import { rtlSanitize } from '@proton/shared/lib/helpers/string'; import { CONFIRM_LINK } from '@proton/shared/lib/mail/mailSettings'; import { useApi, useEventManager } from '../../../hooks'; -import type { ModalProps, ModalStateProps } from '../../modalTwo'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../modalTwo'; import LinkConfirmationModalLink from './LinkConfirmationModalLink'; import LinkConfirmationModalPhishing from './LinkConfirmationModalPhishing'; diff --git a/packages/components/components/prompt/Prompt.tsx b/packages/components/components/prompt/Prompt.tsx index 63de7b0dab..961d89a9c2 100644 --- a/packages/components/components/prompt/Prompt.tsx +++ b/packages/components/components/prompt/Prompt.tsx @@ -1,11 +1,13 @@ import type { ReactElement, ReactNode } from 'react'; import { cloneElement, useContext } from 'react'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo, { ModalContext } from '@proton/components/components/modalTwo/Modal'; +import type { ModalContentProps } from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; import clsx from '@proton/utils/clsx'; -import type { ModalContentProps, ModalProps } from '../modalTwo'; -import { ModalContext, ModalTwo, ModalTwoContent, ModalTwoFooter } from '../modalTwo'; - import './Prompt.scss'; const PromptTitle = ({ children }: { children: ReactNode }) => ( diff --git a/packages/components/components/topnavbar/TopNavBarOfferSubscriptionReminder.tsx b/packages/components/components/topnavbar/TopNavBarOfferSubscriptionReminder.tsx index 58f54b8700..20a43a104a 100644 --- a/packages/components/components/topnavbar/TopNavBarOfferSubscriptionReminder.tsx +++ b/packages/components/components/topnavbar/TopNavBarOfferSubscriptionReminder.tsx @@ -1,5 +1,6 @@ import { useRef } from 'react'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import { FeatureCode } from '@proton/components/containers/features'; import useOfferFlags from '@proton/components/containers/offers/hooks/useOfferFlags'; import type { Offer, OfferConfig } from '@proton/components/containers/offers/interface'; @@ -8,7 +9,6 @@ import type { APP_NAMES } from '@proton/shared/lib/constants'; import type { Currency } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../modalTwo'; import { Spotlight, useSpotlightShow } from '../spotlight'; import TopNavbarUpgradeButton from './TopNavbarUpgradeButton'; diff --git a/packages/components/components/upsell/modal/UpsellModal.tsx b/packages/components/components/upsell/modal/UpsellModal.tsx index 0a12d47861..fff4e1a2ba 100644 --- a/packages/components/components/upsell/modal/UpsellModal.tsx +++ b/packages/components/components/upsell/modal/UpsellModal.tsx @@ -3,11 +3,14 @@ import type { ReactNode } from 'react'; import { c } from 'ttag'; import { ButtonLike } from '@proton/atoms'; -import type { ModalSize, ModalStateProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoHeader } from '@proton/components/components'; import Icon, { type IconSize } from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalSize } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import calendarHeaderImage from '@proton/styles/assets/img/illustrations/upsell-calendar-header.svg'; import composerAssistantImage from '@proton/styles/assets/img/illustrations/upsell-composer-assistant.svg'; import mailHeaderImage from '@proton/styles/assets/img/illustrations/upsell-mail-header.svg'; diff --git a/packages/components/components/upsell/modal/types/AutoDeleteUpsellModal.tsx b/packages/components/components/upsell/modal/types/AutoDeleteUpsellModal.tsx index b16f542e11..970c96c5ba 100644 --- a/packages/components/components/upsell/modal/types/AutoDeleteUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/AutoDeleteUpsellModal.tsx @@ -1,11 +1,11 @@ import { c } from 'ttag'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import useUpsellConfig from '@proton/components/components/upsell/useUpsellConfig'; import { APP_UPSELL_REF_PATH, MAIL_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; import { getUpsellRef } from '@proton/shared/lib/helpers/upsell'; -import type { ModalStateProps } from '../../../modalTwo'; import useOneDollarConfig from '../../useOneDollarPromo'; interface Props { diff --git a/packages/components/components/upsell/modal/types/ComposerAssistantB2BUpsellModal.tsx b/packages/components/components/upsell/modal/types/ComposerAssistantB2BUpsellModal.tsx index e5223a4224..032ffb2872 100644 --- a/packages/components/components/upsell/modal/types/ComposerAssistantB2BUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/ComposerAssistantB2BUpsellModal.tsx @@ -1,8 +1,8 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalStateProps } from '@proton/components/components'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Price from '@proton/components/components/price/Price'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { useSubscriptionModal } from '@proton/components/containers'; diff --git a/packages/components/components/upsell/modal/types/ComposerAssistantB2CUpsellModal.tsx b/packages/components/components/upsell/modal/types/ComposerAssistantB2CUpsellModal.tsx index b9a02d0592..8854e2a1d6 100644 --- a/packages/components/components/upsell/modal/types/ComposerAssistantB2CUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/ComposerAssistantB2CUpsellModal.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; -import { type ModalStateProps } from '@proton/components/components'; import Loader from '@proton/components/components/loader/Loader'; +import { type ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Price from '@proton/components/components/price/Price'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import useUpsellConfig from '@proton/components/components/upsell/useUpsellConfig'; diff --git a/packages/components/components/upsell/modal/types/ComposerAssistantUpsellModal.tsx b/packages/components/components/upsell/modal/types/ComposerAssistantUpsellModal.tsx index 9dbf64ce9a..dfdc290ab3 100644 --- a/packages/components/components/upsell/modal/types/ComposerAssistantUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/ComposerAssistantUpsellModal.tsx @@ -1,5 +1,5 @@ -import type { ModalStateProps } from '@proton/components/components'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import ComposerAssistantB2BUpsellModal from '@proton/components/components/upsell/modal/types/ComposerAssistantB2BUpsellModal'; import ComposerAssistantB2CUpsellModal from '@proton/components/components/upsell/modal/types/ComposerAssistantB2CUpsellModal'; import { getIsB2CUserAbleToRunScribe } from '@proton/components/components/upsell/modal/types/ComposerAssistantUpsellModal.helpers'; diff --git a/packages/components/components/upsell/modal/types/FiltersUpsellModal.tsx b/packages/components/components/upsell/modal/types/FiltersUpsellModal.tsx index 513778811f..9a8e979de4 100644 --- a/packages/components/components/upsell/modal/types/FiltersUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/FiltersUpsellModal.tsx @@ -1,6 +1,6 @@ import { c } from 'ttag'; -import type { ModalStateProps } from '@proton/components/components'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import useUpsellConfig from '@proton/components/components/upsell/useUpsellConfig'; import { APP_UPSELL_REF_PATH, MAIL_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; diff --git a/packages/components/components/upsell/modal/types/IncreasePrivacyUpsellModal.tsx b/packages/components/components/upsell/modal/types/IncreasePrivacyUpsellModal.tsx index 1166162bff..d5bcbf44b2 100644 --- a/packages/components/components/upsell/modal/types/IncreasePrivacyUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/IncreasePrivacyUpsellModal.tsx @@ -1,12 +1,11 @@ import { c } from 'ttag'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { useUser } from '@proton/components/hooks'; import { APP_UPSELL_REF_PATH, MAIL_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; import { addUpsellPath, getUpgradePath, getUpsellRef } from '@proton/shared/lib/helpers/upsell'; -import type { ModalStateProps } from '../../../modalTwo'; - interface Props { modalProps: ModalStateProps; upsellComponent?: UPSELL_COMPONENT; diff --git a/packages/components/components/upsell/modal/types/LabelsUpsellModal.tsx b/packages/components/components/upsell/modal/types/LabelsUpsellModal.tsx index f5dd3360a4..73827da059 100644 --- a/packages/components/components/upsell/modal/types/LabelsUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/LabelsUpsellModal.tsx @@ -1,6 +1,6 @@ import { c } from 'ttag'; -import type { ModalStateProps } from '@proton/components/components'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import useUpsellConfig from '@proton/components/components/upsell/useUpsellConfig'; import type { MAIL_UPSELL_PATHS } from '@proton/shared/lib/constants'; diff --git a/packages/components/components/upsell/modal/types/PmMeUpsellModal.tsx b/packages/components/components/upsell/modal/types/PmMeUpsellModal.tsx index f57ab88121..f905ef2de0 100644 --- a/packages/components/components/upsell/modal/types/PmMeUpsellModal.tsx +++ b/packages/components/components/upsell/modal/types/PmMeUpsellModal.tsx @@ -1,6 +1,6 @@ import { c } from 'ttag'; -import type { ModalStateProps } from '@proton/components/components'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { APP_UPSELL_REF_PATH, MAIL_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; import { addUpsellPath, getUpgradePath, getUpsellRef } from '@proton/shared/lib/helpers/upsell'; diff --git a/packages/components/containers/account/ChangePasswordModal.tsx b/packages/components/containers/account/ChangePasswordModal.tsx index 47a0b39839..29ccb5bc7f 100644 --- a/packages/components/containers/account/ChangePasswordModal.tsx +++ b/packages/components/containers/account/ChangePasswordModal.tsx @@ -6,6 +6,11 @@ import { signoutAction } from '@proton/account'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useDispatch } from '@proton/redux-shared-store'; import { PASSWORD_WRONG_ERROR } from '@proton/shared/lib/api/auth'; import { updatePrivateKeyRoute } from '@proton/shared/lib/api/keys'; @@ -25,16 +30,7 @@ import { getUpdateKeysPayload } from '@proton/shared/lib/keys/changePassword'; import { srpVerify } from '@proton/shared/lib/srp'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { useApi, useAuthentication, diff --git a/packages/components/containers/account/DeleteAccountModal.tsx b/packages/components/containers/account/DeleteAccountModal.tsx index 3e533fcbb2..2b544ab30c 100644 --- a/packages/components/containers/account/DeleteAccountModal.tsx +++ b/packages/components/containers/account/DeleteAccountModal.tsx @@ -7,6 +7,12 @@ import { Button, Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Form from '@proton/components/components/form/Form'; import Checkbox from '@proton/components/components/input/Checkbox'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { useLoading } from '@proton/hooks'; @@ -21,18 +27,7 @@ import { getOrganizationDenomination } from '@proton/shared/lib/organization/hel import isTruthy from '@proton/utils/isTruthy'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - ErrorButton, - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - TextAreaTwo, - useFormErrors, - useModalState, -} from '../../components'; +import { ErrorButton, InputFieldTwo, TextAreaTwo, useFormErrors } from '../../components'; import { AuthModal } from '../../containers'; import { useApi, diff --git a/packages/components/containers/account/DeleteSection.tsx b/packages/components/containers/account/DeleteSection.tsx index fc8147abdc..76411df00a 100644 --- a/packages/components/containers/account/DeleteSection.tsx +++ b/packages/components/containers/account/DeleteSection.tsx @@ -2,10 +2,10 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { ADDRESS_TYPE, APPS, MAIL_APP_NAME, VPN_APP_NAME } from '@proton/shared/lib/constants'; import { hasMigrationDiscount, hasVisionary } from '@proton/shared/lib/helpers/subscription'; -import { useModalState } from '../../components/modalTwo'; import { useAddresses, useConfig, useSubscription } from '../../hooks'; import { DiscountWarningModal, VisionaryWarningModal } from '../payments/subscription/PlanLossWarningModal'; import DeleteAccountModal from './DeleteAccountModal'; diff --git a/packages/components/containers/account/EditDisplayNameModal.tsx b/packages/components/containers/account/EditDisplayNameModal.tsx index d81e4ede89..e5682c2ca2 100644 --- a/packages/components/containers/account/EditDisplayNameModal.tsx +++ b/packages/components/containers/account/EditDisplayNameModal.tsx @@ -4,19 +4,16 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { updateAddress } from '@proton/shared/lib/api/addresses'; import type { Address } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; import { useApi, useEventManager, useNotifications } from '../../hooks'; interface Props extends ModalProps<'form'> { diff --git a/packages/components/containers/account/EditExternalAddressModal.tsx b/packages/components/containers/account/EditExternalAddressModal.tsx index ee87f4a9ae..91d4791e3d 100644 --- a/packages/components/containers/account/EditExternalAddressModal.tsx +++ b/packages/components/containers/account/EditExternalAddressModal.tsx @@ -4,6 +4,11 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { renameExternalAddress } from '@proton/shared/lib/api/addresses'; import { getEmailParts } from '@proton/shared/lib/helpers/email'; @@ -11,15 +16,7 @@ import { confirmEmailValidator, emailValidator, requiredValidator } from '@proto import type { Address } from '@proton/shared/lib/interfaces'; import { getRenamedAddressKeys } from '@proton/shared/lib/keys'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; import { useApi, useEventManager, useGetOrganizationKey, useGetUserKeys, useNotifications } from '../../hooks'; interface Props extends ModalProps<'form'> { diff --git a/packages/components/containers/account/FamilyPlanSection.tsx b/packages/components/containers/account/FamilyPlanSection.tsx index 5b7de9f595..91452fe35f 100644 --- a/packages/components/containers/account/FamilyPlanSection.tsx +++ b/packages/components/containers/account/FamilyPlanSection.tsx @@ -3,8 +3,8 @@ import { useMemo } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { useModalState } from '@proton/components/components'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useAddresses, useCalendars, useMember, useOrganization, useUser } from '@proton/components/hooks'; import { isOrganizationDuo, isOrganizationFamily } from '@proton/shared/lib/organization/helper'; diff --git a/packages/components/containers/account/LeaveFamilyModal.tsx b/packages/components/containers/account/LeaveFamilyModal.tsx index 09f50bf7bc..a21c6fde62 100644 --- a/packages/components/containers/account/LeaveFamilyModal.tsx +++ b/packages/components/containers/account/LeaveFamilyModal.tsx @@ -1,6 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useOrganization } from '@proton/components/hooks'; import useApi from '@proton/components/hooks/useApi'; @@ -11,8 +12,6 @@ import { leaveOrganisation } from '@proton/shared/lib/api/organization'; import { BRAND_NAME, PLANS, PLAN_NAMES } from '@proton/shared/lib/constants'; import { isOrganizationFamily } from '@proton/shared/lib/organization/helper'; -import type { ModalStateProps } from '../../components'; - interface Props extends ModalStateProps { organisationName: string; } diff --git a/packages/components/containers/account/LostTwoFAModal.tsx b/packages/components/containers/account/LostTwoFAModal.tsx index 7ea5fcea85..27635f1e91 100644 --- a/packages/components/containers/account/LostTwoFAModal.tsx +++ b/packages/components/containers/account/LostTwoFAModal.tsx @@ -3,6 +3,7 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useApi, useEventManager, useNotifications, useUserSettings } from '@proton/components/hooks'; import { disableTotp, removeSecurityKey } from '@proton/shared/lib/api/settings'; @@ -11,7 +12,6 @@ import { getHasFIDO2SettingEnabled } from '@proton/shared/lib/settings/twoFactor import { getId } from '@proton/shared/lib/webauthn/id'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; import ReauthUsingRecoveryModal from './ReauthUsingRecoveryModal'; interface Props extends ModalProps { diff --git a/packages/components/containers/account/ReauthUsingRecoveryModal.tsx b/packages/components/containers/account/ReauthUsingRecoveryModal.tsx index 16087a5159..80997e2eb5 100644 --- a/packages/components/containers/account/ReauthUsingRecoveryModal.tsx +++ b/packages/components/containers/account/ReauthUsingRecoveryModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button, InlineLinkButton } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import { getMnemonicAuthInfo, reauthMnemonic } from '@proton/shared/lib/api/auth'; import { reauthByEmailVerification, reauthBySmsVerification } from '@proton/shared/lib/api/verify'; @@ -14,15 +19,7 @@ import { srpAuth } from '@proton/shared/lib/srp'; import clsx from '@proton/utils/clsx'; import isTruthy from '@proton/utils/isTruthy'; -import type { ModalProps } from '../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - Tabs, - useFormErrors, -} from '../../components'; +import { Tabs, useFormErrors } from '../../components'; import { useApi, useAuthentication, diff --git a/packages/components/containers/account/TwoFactorSection.tsx b/packages/components/containers/account/TwoFactorSection.tsx index 5006469d22..9d07ffcc20 100644 --- a/packages/components/containers/account/TwoFactorSection.tsx +++ b/packages/components/containers/account/TwoFactorSection.tsx @@ -6,6 +6,7 @@ import { c } from 'ttag'; import { Button, InlineLinkButton } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import { APPS } from '@proton/shared/lib/constants'; @@ -15,7 +16,7 @@ import { getHasFIDO2Support } from '@proton/shared/lib/webauthn/helper'; import { getId } from '@proton/shared/lib/webauthn/id'; import clsx from '@proton/utils/clsx'; -import { ButtonGroup, useModalState } from '../../components'; +import { ButtonGroup } from '../../components'; import { useAvailableRecoveryMethods, useConfig, useNotifications, useUserSettings } from '../../hooks'; import LostTwoFAModal from './LostTwoFAModal'; import SettingsLayout from './SettingsLayout'; diff --git a/packages/components/containers/account/UsernameSection.tsx b/packages/components/containers/account/UsernameSection.tsx index d507e43cdd..ee749ef323 100644 --- a/packages/components/containers/account/UsernameSection.tsx +++ b/packages/components/containers/account/UsernameSection.tsx @@ -4,10 +4,11 @@ import { useLocation } from 'react-router-dom'; import { c } from 'ttag'; import { Button, Card, CircleLoader, Href, InlineLinkButton } from '@proton/atoms'; -import { AppLink, PromotionBanner, Tooltip, useModalState } from '@proton/components'; +import { AppLink, PromotionBanner, Tooltip } from '@proton/components'; import Badge from '@proton/components/components/badge/Badge'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useLoading from '@proton/hooks/useLoading'; import { postVerifySend } from '@proton/shared/lib/api/verify'; import { getAppHref } from '@proton/shared/lib/apps/helper'; diff --git a/packages/components/containers/account/fido/AddSecurityKeyModal.tsx b/packages/components/containers/account/fido/AddSecurityKeyModal.tsx index 20dc62dea6..203eba6ee9 100644 --- a/packages/components/containers/account/fido/AddSecurityKeyModal.tsx +++ b/packages/components/containers/account/fido/AddSecurityKeyModal.tsx @@ -7,6 +7,11 @@ import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Checkbox from '@proton/components/components/input/Checkbox'; import Info from '@proton/components/components/link/Info'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import RegisterSecurityKeyContent from '@proton/components/containers/account/fido/RegisterSecurityKeyContent'; import { useLoading } from '@proton/hooks'; import { getSecurityKeyChallenge, registerSecurityKey } from '@proton/shared/lib/api/settings'; @@ -18,15 +23,7 @@ import { getCreatePayload } from '@proton/shared/lib/webauthn/create'; import type { RegisterCredentials } from '@proton/shared/lib/webauthn/interface'; import physicalKeyRegistered from '@proton/styles/assets/img/illustrations/physical-key-registered.svg'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, useFormErrors } from '../../../components'; import { useApi, useErrorHandler, useEventManager } from '../../../hooks'; import AuthModal from '../../password/AuthModal'; import { maxSecurityKeyNameLength } from './constants'; diff --git a/packages/components/containers/account/fido/EditSecurityKeyModal.tsx b/packages/components/containers/account/fido/EditSecurityKeyModal.tsx index ca8a356f54..69aced3f88 100644 --- a/packages/components/containers/account/fido/EditSecurityKeyModal.tsx +++ b/packages/components/containers/account/fido/EditSecurityKeyModal.tsx @@ -5,19 +5,16 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { renameSecurityKey } from '@proton/shared/lib/api/settings'; import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, useFormErrors } from '../../../components'; import { useApi, useErrorHandler, useEventManager, useNotifications } from '../../../hooks'; import { maxSecurityKeyNameLength } from './constants'; diff --git a/packages/components/containers/account/fido/RemoveSecurityKeyModal.tsx b/packages/components/containers/account/fido/RemoveSecurityKeyModal.tsx index b9d0102fd2..86d01cd635 100644 --- a/packages/components/containers/account/fido/RemoveSecurityKeyModal.tsx +++ b/packages/components/containers/account/fido/RemoveSecurityKeyModal.tsx @@ -1,14 +1,14 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { removeSecurityKey } from '@proton/shared/lib/api/settings'; import { lockSensitiveSettings, unlockPasswordChanges } from '@proton/shared/lib/api/user'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { useModalState } from '../../../components'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import AuthModal from '../../password/AuthModal'; diff --git a/packages/components/containers/account/sessionRecovery/ConfirmSessionRecoveryCancellationModal.tsx b/packages/components/containers/account/sessionRecovery/ConfirmSessionRecoveryCancellationModal.tsx index bcf22c690a..d2c2757851 100644 --- a/packages/components/containers/account/sessionRecovery/ConfirmSessionRecoveryCancellationModal.tsx +++ b/packages/components/containers/account/sessionRecovery/ConfirmSessionRecoveryCancellationModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import metrics, { observeApiError } from '@proton/metrics'; import { abortSessionRecovery } from '@proton/shared/lib/api/sessionRecovery'; @@ -11,16 +16,7 @@ import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; import { srpAuth } from '@proton/shared/lib/srp'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../../components'; import { useApi, useEventManager, useNotifications, useUser } from '../../../hooks'; import { useSessionRecoveryLocalStorage } from './SessionRecoveryLocalStorageManager'; diff --git a/packages/components/containers/account/sessionRecovery/InitiateSessionRecoveryModal.tsx b/packages/components/containers/account/sessionRecovery/InitiateSessionRecoveryModal.tsx index 031ebeb2eb..965ab9d427 100644 --- a/packages/components/containers/account/sessionRecovery/InitiateSessionRecoveryModal.tsx +++ b/packages/components/containers/account/sessionRecovery/InitiateSessionRecoveryModal.tsx @@ -3,6 +3,11 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; import useLoading from '@proton/hooks/useLoading'; import metrics, { observeApiError } from '@proton/metrics'; @@ -10,13 +15,6 @@ import { initiateSessionRecovery } from '@proton/shared/lib/api/sessionRecovery' import { API_CUSTOM_ERROR_CODES } from '@proton/shared/lib/errors'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; import { useApi, useAvailableRecoveryMethods, useEventManager, useNotifications, useUser } from '../../../hooks'; import SessionRecoveryResetConfirmedPrompt from './SessionRecoveryResetConfirmedPrompt'; import sessionRecoveryIllustration from './session-recovery-illustration.svg'; diff --git a/packages/components/containers/account/sessionRecovery/PasswordResetAvailableAccountModal.tsx b/packages/components/containers/account/sessionRecovery/PasswordResetAvailableAccountModal.tsx index 6e20e285a6..3f6b5b1ea8 100644 --- a/packages/components/containers/account/sessionRecovery/PasswordResetAvailableAccountModal.tsx +++ b/packages/components/containers/account/sessionRecovery/PasswordResetAvailableAccountModal.tsx @@ -5,6 +5,11 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useIsSessionRecoveryInitiatedByCurrentSession, useSessionRecoveryInsecureTimeRemaining, @@ -24,16 +29,7 @@ import { getArmoredPrivateUserKeys, getEncryptedArmoredOrganizationKey } from '@ import { srpVerify } from '@proton/shared/lib/srp'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../../components'; import { useApi, useAuthentication, diff --git a/packages/components/containers/account/sessionRecovery/PasswordResetAvailableProductModal.tsx b/packages/components/containers/account/sessionRecovery/PasswordResetAvailableProductModal.tsx index 48b3386208..c24846e16c 100644 --- a/packages/components/containers/account/sessionRecovery/PasswordResetAvailableProductModal.tsx +++ b/packages/components/containers/account/sessionRecovery/PasswordResetAvailableProductModal.tsx @@ -4,15 +4,13 @@ import { c, msgid } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useSessionRecoveryInsecureTimeRemaining } from '@proton/components/hooks/useSessionRecovery'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; import { useUser } from '../../../hooks'; import ConfirmSessionRecoveryCancellationModal from './ConfirmSessionRecoveryCancellationModal'; import passwordResetIllustration from './password-reset-illustration.svg'; diff --git a/packages/components/containers/account/sessionRecovery/SessionRecoveryInProgressModal.tsx b/packages/components/containers/account/sessionRecovery/SessionRecoveryInProgressModal.tsx index ef1d44c55c..62f847ec28 100644 --- a/packages/components/containers/account/sessionRecovery/SessionRecoveryInProgressModal.tsx +++ b/packages/components/containers/account/sessionRecovery/SessionRecoveryInProgressModal.tsx @@ -5,14 +5,12 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; import { useSessionRecoveryGracePeriodHoursRemaining, useUser } from '../../../hooks'; import ConfirmSessionRecoveryCancellationModal from './ConfirmSessionRecoveryCancellationModal'; import SessionRecoveryInProgressModalIllustration from './SessionRecoveryInProgressModalIllustration'; diff --git a/packages/components/containers/account/sessionRecovery/statusCards/PasswordResetAvailableCard.tsx b/packages/components/containers/account/sessionRecovery/statusCards/PasswordResetAvailableCard.tsx index 7a2ef38143..eeba04b808 100644 --- a/packages/components/containers/account/sessionRecovery/statusCards/PasswordResetAvailableCard.tsx +++ b/packages/components/containers/account/sessionRecovery/statusCards/PasswordResetAvailableCard.tsx @@ -2,10 +2,10 @@ import { format } from 'date-fns'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { dateLocale } from '@proton/shared/lib/i18n'; import clsx from '@proton/utils/clsx'; -import { useModalState } from '../../../../components'; import { useUser } from '../../../../hooks'; import ConfirmSessionRecoveryCancellationModal from '../ConfirmSessionRecoveryCancellationModal'; import PasswordResetAvailableAccountModal from '../PasswordResetAvailableAccountModal'; diff --git a/packages/components/containers/account/sessionRecovery/statusCards/SessionRecoveryInProgressCard.tsx b/packages/components/containers/account/sessionRecovery/statusCards/SessionRecoveryInProgressCard.tsx index a76f098146..294b26bc95 100644 --- a/packages/components/containers/account/sessionRecovery/statusCards/SessionRecoveryInProgressCard.tsx +++ b/packages/components/containers/account/sessionRecovery/statusCards/SessionRecoveryInProgressCard.tsx @@ -2,10 +2,10 @@ import { format } from 'date-fns'; import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { dateLocale } from '@proton/shared/lib/i18n'; import clsx from '@proton/utils/clsx'; -import { useModalState } from '../../../../components'; import { useSessionRecoveryGracePeriodHoursRemaining, useUser } from '../../../../hooks'; import ConfirmSessionRecoveryCancellationModal from '../ConfirmSessionRecoveryCancellationModal'; import SessionRecoveryStatusTitle from './SessionRecoveryStatusTitle'; diff --git a/packages/components/containers/account/totp/DisableTOTPModal.tsx b/packages/components/containers/account/totp/DisableTOTPModal.tsx index 7a1c40ba12..cd521942c6 100644 --- a/packages/components/containers/account/totp/DisableTOTPModal.tsx +++ b/packages/components/containers/account/totp/DisableTOTPModal.tsx @@ -1,12 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { disableTotp } from '@proton/shared/lib/api/settings'; -import type { ModalProps } from '../../../components'; -import { useModalState } from '../../../components'; import { useEventManager, useNotifications } from '../../../hooks'; import AuthModal from '../../password/AuthModal'; diff --git a/packages/components/containers/account/totp/EnableTOTPModal.tsx b/packages/components/containers/account/totp/EnableTOTPModal.tsx index e959acd59a..4fb4f90366 100644 --- a/packages/components/containers/account/totp/EnableTOTPModal.tsx +++ b/packages/components/containers/account/totp/EnableTOTPModal.tsx @@ -7,6 +7,11 @@ import { Button, Href, InlineLinkButton } from '@proton/atoms'; import Copy from '@proton/components/components/button/Copy'; import Form from '@proton/components/components/form/Form'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { getApiError } from '@proton/shared/lib/api/helpers/apiErrorHelper'; import { TOTP_WRONG_ERROR, setupTotp } from '@proton/shared/lib/api/settings'; @@ -18,17 +23,7 @@ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import { getTOTPData } from '@proton/shared/lib/settings/twoFactor'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - QRCode, - TotpInput, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, QRCode, TotpInput, useFormErrors } from '../../../components'; import { useApi, useConfig, useEventManager, useNotifications, useUser } from '../../../hooks'; import AuthModal from '../../password/AuthModal'; diff --git a/packages/components/containers/addresses/AddressActions.tsx b/packages/components/containers/addresses/AddressActions.tsx index 5070214274..513ae0bf90 100644 --- a/packages/components/containers/addresses/AddressActions.tsx +++ b/packages/components/containers/addresses/AddressActions.tsx @@ -3,6 +3,7 @@ import { c } from 'ttag'; import { disableAllowAddressDeletion } from '@proton/account'; import { useApi } from '@proton/components'; import DropdownActions from '@proton/components/components/dropdown/DropdownActions'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useLoading } from '@proton/hooks'; import { useDispatch } from '@proton/redux-shared-store'; import { deleteAddress, disableAddress, enableAddress } from '@proton/shared/lib/api/addresses'; @@ -11,7 +12,6 @@ import type { Address, Member, UserModel } from '@proton/shared/lib/interfaces'; import { useFlag } from '@proton/unleash'; import isTruthy from '@proton/utils/isTruthy'; -import { useModalState } from '../../components'; import EditExternalAddressModal from '../../containers/account/EditExternalAddressModal'; import EditInternalAddressModal from '../../containers/addresses/EditInternalAddressModal'; import { useAddressFlags, useEventManager, useNotifications, useOrganizationKey } from '../../hooks'; diff --git a/packages/components/containers/addresses/AddressModal.tsx b/packages/components/containers/addresses/AddressModal.tsx index ca5ad267ed..916b8f8462 100644 --- a/packages/components/containers/addresses/AddressModal.tsx +++ b/packages/components/containers/addresses/AddressModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button, CircleLoader } from '@proton/atoms'; import { DropdownSizeUnit } from '@proton/components/components/dropdown/utils'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import useKTVerifier from '@proton/components/containers/keyTransparency/useKTVerifier'; @@ -31,16 +36,7 @@ import { } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { useAddresses, useApi, diff --git a/packages/components/containers/addresses/AddressesWithMembers.tsx b/packages/components/containers/addresses/AddressesWithMembers.tsx index c23e381751..45239cb9cf 100644 --- a/packages/components/containers/addresses/AddressesWithMembers.tsx +++ b/packages/components/containers/addresses/AddressesWithMembers.tsx @@ -8,6 +8,7 @@ import { Button, Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import SettingsLink from '@proton/components/components/link/SettingsLink'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { GenericError } from '@proton/components/containers'; import { ALL_MEMBERS_ID, BRAND_NAME, MEMBER_PRIVATE } from '@proton/shared/lib/constants'; import { getAvailableAddressDomains } from '@proton/shared/lib/helpers/address'; @@ -15,7 +16,6 @@ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { Member, Organization, UserModel } from '@proton/shared/lib/interfaces'; import { getOrganizationKeyInfo, validateOrganizationKey } from '@proton/shared/lib/organization/helper'; -import { useModalState } from '../../components'; import { useAddresses, useCustomDomains, diff --git a/packages/components/containers/addresses/AddressesWithUser.tsx b/packages/components/containers/addresses/AddressesWithUser.tsx index 30c8cfed56..752c53cfd5 100644 --- a/packages/components/containers/addresses/AddressesWithUser.tsx +++ b/packages/components/containers/addresses/AddressesWithUser.tsx @@ -4,6 +4,7 @@ import { c } from 'ttag'; import { Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { SettingsParagraph } from '@proton/components/containers'; @@ -16,13 +17,7 @@ import type { Address, CachedOrganizationKey, Member, UserModel } from '@proton/ import { getIsNonDefault, sortAddresses } from '@proton/shared/lib/mail/addresses'; import move from '@proton/utils/move'; -import { - OrderableTable, - OrderableTableBody, - OrderableTableHeader, - OrderableTableRow, - useModalState, -} from '../../components'; +import { OrderableTable, OrderableTableBody, OrderableTableHeader, OrderableTableRow } from '../../components'; import { useAddresses, useApi, useEventManager, useNotifications } from '../../hooks'; import AddressActions from './AddressActions'; import AddressStatus from './AddressStatus'; diff --git a/packages/components/containers/addresses/DeleteAddressPrompt.tsx b/packages/components/containers/addresses/DeleteAddressPrompt.tsx index 88b505886c..8dae79531e 100644 --- a/packages/components/containers/addresses/DeleteAddressPrompt.tsx +++ b/packages/components/containers/addresses/DeleteAddressPrompt.tsx @@ -3,11 +3,10 @@ import type { PropsWithChildren } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; -import type { ModalProps } from '../../components'; - interface Props extends ModalProps, PropsWithChildren { onDeleteAddress: () => Promise; email: string; diff --git a/packages/components/containers/addresses/EditInternalAddressModal.tsx b/packages/components/containers/addresses/EditInternalAddressModal.tsx index f151bc83cb..ca7ff579fa 100644 --- a/packages/components/containers/addresses/EditInternalAddressModal.tsx +++ b/packages/components/containers/addresses/EditInternalAddressModal.tsx @@ -4,6 +4,11 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { renameInternalAddress, updateAddress } from '@proton/shared/lib/api/addresses'; import { CANONICALIZE_SCHEME, canonicalizeEmail, getEmailParts } from '@proton/shared/lib/helpers/email'; @@ -12,15 +17,7 @@ import type { Address } from '@proton/shared/lib/interfaces'; import { getRenamedAddressKeys } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; import { useApi, useEventManager, useGetOrganizationKey, useGetUserKeys, useNotifications } from '../../hooks'; interface Props extends ModalProps<'form'> { diff --git a/packages/components/containers/addresses/PMSignatureField.tsx b/packages/components/containers/addresses/PMSignatureField.tsx index 7be3abb1c5..c06cb808b4 100644 --- a/packages/components/containers/addresses/PMSignatureField.tsx +++ b/packages/components/containers/addresses/PMSignatureField.tsx @@ -1,5 +1,6 @@ import { c } from 'ttag'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { useLoading } from '@proton/hooks'; @@ -9,7 +10,6 @@ import { addUpsellPath, getUpgradePath, getUpsellRef } from '@proton/shared/lib/ import type { MailSettings, UserSettings } from '@proton/shared/lib/interfaces'; import { getProtonMailSignature } from '@proton/shared/lib/mail/signature'; -import { useModalState } from '../../components'; import { useApi, useEventManager, useNotifications, useToggle, useUser } from '../../hooks'; interface Props { diff --git a/packages/components/containers/addresses/missingKeys/CreateMissingKeysAddressModal.tsx b/packages/components/containers/addresses/missingKeys/CreateMissingKeysAddressModal.tsx index f50b02bbef..1d95efb060 100644 --- a/packages/components/containers/addresses/missingKeys/CreateMissingKeysAddressModal.tsx +++ b/packages/components/containers/addresses/missingKeys/CreateMissingKeysAddressModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { getMemberAddresses } from '@proton/account'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; import TableHeader from '@proton/components/components/table/TableHeader'; @@ -29,16 +34,7 @@ import { import { getOrganizationKeyInfo, validateOrganizationKey } from '@proton/shared/lib/organization/helper'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - PasswordInputTwo, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../../components'; import { useApi, useAuthentication, diff --git a/packages/components/containers/api/DelinquentModal.tsx b/packages/components/containers/api/DelinquentModal.tsx index 1d7e23cda0..c87b6819b9 100644 --- a/packages/components/containers/api/DelinquentModal.tsx +++ b/packages/components/containers/api/DelinquentModal.tsx @@ -2,12 +2,11 @@ import { c } from 'ttag'; import { ButtonLike } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { getInvoicesPathname } from '@proton/shared/lib/apps/helper'; import { BRAND_NAME, UNPAID_STATE } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../components'; - interface Props extends ModalProps { delinquent?: UNPAID_STATE; } diff --git a/packages/components/containers/api/humanVerification/HumanVerificationModal.tsx b/packages/components/containers/api/humanVerification/HumanVerificationModal.tsx index e4bcee05c0..38dfbc23ea 100644 --- a/packages/components/containers/api/humanVerification/HumanVerificationModal.tsx +++ b/packages/components/containers/api/humanVerification/HumanVerificationModal.tsx @@ -2,6 +2,10 @@ import { useState } from 'react'; import { c } from 'ttag'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useTheme } from '@proton/components/containers/themes/ThemeProvider'; import { useLoading } from '@proton/hooks'; import { getApiError } from '@proton/shared/lib/api/helpers/apiErrorHelper'; @@ -9,8 +13,6 @@ import { API_CUSTOM_ERROR_CODES } from '@proton/shared/lib/errors'; import type { HumanVerificationMethodType } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { ModalTwo as Modal, ModalTwoContent as ModalContent, ModalTwoHeader as ModalHeader } from '../../../components'; import { useNotifications } from '../../../hooks'; import HumanVerificationForm from './HumanVerificationForm'; import { isVerifyAddressOwnership } from './helper'; diff --git a/packages/components/containers/b2bDashboard/VPN/TogglingMonitoringModal.tsx b/packages/components/containers/b2bDashboard/VPN/TogglingMonitoringModal.tsx index 481a07c6af..ca51a7e335 100644 --- a/packages/components/containers/b2bDashboard/VPN/TogglingMonitoringModal.tsx +++ b/packages/components/containers/b2bDashboard/VPN/TogglingMonitoringModal.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; interface Props extends ModalProps { diff --git a/packages/components/containers/b2bDashboard/VPN/VPNEvents.tsx b/packages/components/containers/b2bDashboard/VPN/VPNEvents.tsx index 54f9769b19..66b5e37196 100644 --- a/packages/components/containers/b2bDashboard/VPN/VPNEvents.tsx +++ b/packages/components/containers/b2bDashboard/VPN/VPNEvents.tsx @@ -5,7 +5,8 @@ import { endOfDay, isAfter, isBefore, startOfDay } from 'date-fns'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { Pagination, useModalState, usePaginationAsync } from '@proton/components'; +import { Pagination, usePaginationAsync } from '@proton/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import TimeIntl from '@proton/components/components/time/TimeIntl'; import Toggle from '@proton/components/components/toggle/Toggle'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; diff --git a/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModal.tsx b/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModal.tsx index c5fa430e19..cb2a1bb685 100644 --- a/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModal.tsx +++ b/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModal.tsx @@ -6,6 +6,10 @@ import { Button } from '@proton/atoms'; import { useGetHolidaysDirectory } from '@proton/calendar/holidaysDirectory/hooks'; import Form from '@proton/components/components/form/Form'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; import { CALENDAR_MODAL_TYPE } from '@proton/components/containers/calendar/calendarModal/interface'; import type { CalendarBootstrap, @@ -13,8 +17,6 @@ import type { VisualCalendar, } from '@proton/shared/lib/interfaces/calendar'; -import type { ModalProps } from '../../../../components'; -import { ModalTwo as Modal, ModalTwoContent, ModalTwoFooter } from '../../../../components'; import { useGetCalendarBootstrap } from '../../../../hooks'; import GenericError from '../../../error/GenericError'; import HolidaysCalendarModalWithDirectory from './HolidaysCalendarModalWithDirectory'; @@ -73,7 +75,7 @@ const HolidaysCalendarModal = ({ if (error) { return ( - + @@ -82,15 +84,15 @@ const HolidaysCalendarModal = ({ {c('Action').t`Close`} - + ); } if (!directory || (calendar && !bootstrap)) { return ( - + - + ); } diff --git a/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModalWithDirectory.tsx b/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModalWithDirectory.tsx index 7899e493d8..1e79f26ab3 100644 --- a/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModalWithDirectory.tsx +++ b/packages/components/containers/calendar/calendarModal/holidaysCalendarModal/HolidaysCalendarModalWithDirectory.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import ColorPicker from '@proton/components/components/input/ColorPicker'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { getCalendarModalSize } from '@proton/components/containers/calendar/calendarModal/helpers'; @@ -39,15 +44,7 @@ import type { } from '@proton/shared/lib/interfaces/calendar'; import uniqueBy from '@proton/utils/uniqueBy'; -import type { ModalProps } from '../../../../components'; -import { - InputFieldTwo as InputField, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useFormErrors, -} from '../../../../components'; +import { InputFieldTwo as InputField, useFormErrors } from '../../../../components'; import CountrySelect from '../../../../components/country/CountrySelect'; import { useApi, diff --git a/packages/components/containers/calendar/calendarModal/personalCalendarModal/PersonalCalendarModal.tsx b/packages/components/containers/calendar/calendarModal/personalCalendarModal/PersonalCalendarModal.tsx index 8efa39796f..e2fe0234c7 100644 --- a/packages/components/containers/calendar/calendarModal/personalCalendarModal/PersonalCalendarModal.tsx +++ b/packages/components/containers/calendar/calendarModal/personalCalendarModal/PersonalCalendarModal.tsx @@ -8,6 +8,10 @@ import Form from '@proton/components/components/form/Form'; import ColorPicker from '@proton/components/components/input/ColorPicker'; import TextArea from '@proton/components/components/input/TextArea'; import Loader from '@proton/components/components/loader/Loader'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { getCalendarModalSize } from '@proton/components/containers/calendar/calendarModal/helpers'; @@ -21,7 +25,7 @@ import { getSharedCalendarSubHeaderText } from '@proton/shared/lib/calendar/shar import type { Nullable } from '@proton/shared/lib/interfaces'; import type { NotificationModel, SubscribedCalendar, VisualCalendar } from '@proton/shared/lib/interfaces/calendar'; -import { InputFieldTwo, ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; +import { InputFieldTwo } from '../../../../components'; import type { SelectChangeEvent } from '../../../../components/selectTwo/select'; import { TruncatedText } from '../../../../components/truncatedText'; import GenericError from '../../../error/GenericError'; diff --git a/packages/components/containers/calendar/calendarModal/subscribedCalendarModal/SubscribedCalendarModal.tsx b/packages/components/containers/calendar/calendarModal/subscribedCalendarModal/SubscribedCalendarModal.tsx index dc11d5d9ac..6a18f70d13 100644 --- a/packages/components/containers/calendar/calendarModal/subscribedCalendarModal/SubscribedCalendarModal.tsx +++ b/packages/components/containers/calendar/calendarModal/subscribedCalendarModal/SubscribedCalendarModal.tsx @@ -6,6 +6,7 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Loader from '@proton/components/components/loader/Loader'; +import BasicModal from '@proton/components/components/modalTwo/BasicModal'; import { useLoading } from '@proton/hooks'; import { validateSubscription } from '@proton/shared/lib/api/calendars'; import { CALENDAR_TYPE, MAX_CHARS_API } from '@proton/shared/lib/calendar/constants'; @@ -16,7 +17,7 @@ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { VisualCalendar } from '@proton/shared/lib/interfaces/calendar'; import { CALENDAR_SUBSCRIPTION_STATUS } from '@proton/shared/lib/interfaces/calendar'; -import { BasicModal, InputFieldTwo } from '../../../../components'; +import { InputFieldTwo } from '../../../../components'; import { useApi } from '../../../../hooks'; import { GenericError } from '../../../error'; import useGetCalendarActions from '../../hooks/useGetCalendarActions'; diff --git a/packages/components/containers/calendar/exportModal/ExportModal.tsx b/packages/components/containers/calendar/exportModal/ExportModal.tsx index 9b2a8b023a..fd2a98c72a 100644 --- a/packages/components/containers/calendar/exportModal/ExportModal.tsx +++ b/packages/components/containers/calendar/exportModal/ExportModal.tsx @@ -4,6 +4,7 @@ import { format } from 'date-fns'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import BasicModal from '@proton/components/components/modalTwo/BasicModal'; import { createExportIcs } from '@proton/shared/lib/calendar/export/createExportIcs'; import { getProdIdFromNameAndVersion } from '@proton/shared/lib/calendar/vcalConfig'; import { getUniqueVtimezones } from '@proton/shared/lib/calendar/vtimezoneHelper'; @@ -18,7 +19,6 @@ import { EXPORT_ERRORS, EXPORT_STEPS } from '@proton/shared/lib/interfaces/calen import { getWeekStartsOn } from '@proton/shared/lib/settings/helper'; import { getAppVersion } from '../../..'; -import { BasicModal } from '../../../components'; import { useConfig, useGetCalendarUserSettings, useUserSettings } from '../../../hooks'; import { useGetVtimezonesMap } from '../../../hooks/useGetVtimezonesMap'; import ExportSummaryModalContent from './ExportSummaryModalContent'; diff --git a/packages/components/containers/calendar/importModal/ImportModal.tsx b/packages/components/containers/calendar/importModal/ImportModal.tsx index 002ae15871..e5adea6096 100644 --- a/packages/components/containers/calendar/importModal/ImportModal.tsx +++ b/packages/components/containers/calendar/importModal/ImportModal.tsx @@ -4,6 +4,7 @@ import { useEffect, useState } from 'react'; import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; +import BasicModal from '@proton/components/components/modalTwo/BasicModal'; import { updateMember } from '@proton/shared/lib/api/calendars'; import { getProbablyActiveCalendars, getWritableCalendars } from '@proton/shared/lib/calendar/calendar'; import { ICAL_METHOD, IMPORT_ERROR_TYPE, MAX_IMPORT_FILE_SIZE } from '@proton/shared/lib/calendar/constants'; @@ -26,7 +27,6 @@ import { IMPORT_STEPS } from '@proton/shared/lib/interfaces/calendar'; import { useFlag } from '@proton/unleash'; import noop from '@proton/utils/noop'; -import { BasicModal } from '../../../components'; import { useAddresses, useApi, useConfig, useEventManager, useGetCalendarUserSettings, useUser } from '../../../hooks'; import { useCalendarModelEventManager } from '../../eventManager/calendar'; import AttachingModalContent from './AttachingModalContent'; diff --git a/packages/components/containers/calendar/settings/CalendarDeleteSection.tsx b/packages/components/containers/calendar/settings/CalendarDeleteSection.tsx index c58ca43beb..4e20d5df61 100644 --- a/packages/components/containers/calendar/settings/CalendarDeleteSection.tsx +++ b/packages/components/containers/calendar/settings/CalendarDeleteSection.tsx @@ -3,8 +3,9 @@ import { useHistory } from 'react-router'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { ErrorButton, useModalState } from '@proton/components/components'; +import { ErrorButton } from '@proton/components/components'; import Alert from '@proton/components/components/alert/Alert'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { SettingsParagraph } from '@proton/components/containers'; import { getNextDefaultCalendar } from '@proton/components/containers/calendar/settings/defaultCalendar'; diff --git a/packages/components/containers/calendar/settings/CalendarExportSection.tsx b/packages/components/containers/calendar/settings/CalendarExportSection.tsx index f1b9ae7f66..9b9ba00795 100644 --- a/packages/components/containers/calendar/settings/CalendarExportSection.tsx +++ b/packages/components/containers/calendar/settings/CalendarExportSection.tsx @@ -6,12 +6,12 @@ import { Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import CalendarSelect from '@proton/components/components/calendarSelect/CalendarSelect'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { SelectChangeEvent } from '@proton/components/components/selectTwo/select'; import { ExportModal } from '@proton/components/containers/calendar/exportModal'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { VisualCalendar } from '@proton/shared/lib/interfaces/calendar'; -import { useModalState } from '../../../components'; import { SettingsParagraph, SettingsSection } from '../../account'; interface Props { diff --git a/packages/components/containers/calendar/settings/CalendarImportSection.tsx b/packages/components/containers/calendar/settings/CalendarImportSection.tsx index 1c0cdbf77d..c021c551fb 100644 --- a/packages/components/containers/calendar/settings/CalendarImportSection.tsx +++ b/packages/components/containers/calendar/settings/CalendarImportSection.tsx @@ -5,6 +5,7 @@ import { EASY_SWITCH_SOURCES, ImportProvider, ImportType } from '@proton/activat import { Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { getProbablyActiveCalendars, getWritableCalendars } from '@proton/shared/lib/calendar/calendar'; import { IMPORT_CALENDAR_FAQ_URL } from '@proton/shared/lib/calendar/constants'; import { CALENDAR_APP_NAME } from '@proton/shared/lib/constants'; @@ -13,7 +14,6 @@ import type { UserModel } from '@proton/shared/lib/interfaces'; import type { VisualCalendar } from '@proton/shared/lib/interfaces/calendar'; import { useFlag } from '@proton/unleash'; -import { useModalState } from '../../../components'; import { SettingsParagraph, SettingsSection } from '../../account'; import { ImportModal } from '../importModal'; diff --git a/packages/components/containers/calendar/settings/CalendarShareSection.tsx b/packages/components/containers/calendar/settings/CalendarShareSection.tsx index be0cf787ec..5ddb589c55 100644 --- a/packages/components/containers/calendar/settings/CalendarShareSection.tsx +++ b/packages/components/containers/calendar/settings/CalendarShareSection.tsx @@ -3,8 +3,8 @@ import type { Dispatch, SetStateAction } from 'react'; import { c } from 'ttag'; import { Button, ButtonLike, Card } from '@proton/atoms'; -import { useModalState } from '@proton/components/components'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { SettingsParagraph, SettingsSectionWide } from '@proton/components/containers'; import { useApi, useNotifications } from '@proton/components/hooks'; import { removeInvitation, removeMember } from '@proton/shared/lib/api/calendars'; diff --git a/packages/components/containers/calendar/settings/CalendarSubpageHeaderSection.tsx b/packages/components/containers/calendar/settings/CalendarSubpageHeaderSection.tsx index 464e83b2f3..00099a592d 100644 --- a/packages/components/containers/calendar/settings/CalendarSubpageHeaderSection.tsx +++ b/packages/components/containers/calendar/settings/CalendarSubpageHeaderSection.tsx @@ -1,10 +1,10 @@ import { c } from 'ttag'; import { ButtonLike, Href } from '@proton/atoms'; -import { useModalState } from '@proton/components/components'; import Alert from '@proton/components/components/alert/Alert'; import CalendarSelectIcon from '@proton/components/components/calendarSelect/CalendarSelectIcon'; import Icon from '@proton/components/components/icon/Icon'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import { SettingsSectionWide } from '@proton/components/containers'; import { useContactEmailsCache } from '@proton/components/containers/contacts/ContactEmailsProvider'; diff --git a/packages/components/containers/calendar/settings/MyCalendarsSection.tsx b/packages/components/containers/calendar/settings/MyCalendarsSection.tsx index 743c34e42a..08278e84cf 100644 --- a/packages/components/containers/calendar/settings/MyCalendarsSection.tsx +++ b/packages/components/containers/calendar/settings/MyCalendarsSection.tsx @@ -6,6 +6,7 @@ import { Button, ButtonLike, Card, Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { SettingsParagraph } from '@proton/components/containers'; import { getNextDefaultCalendar } from '@proton/components/containers/calendar/settings/defaultCalendar'; @@ -19,7 +20,6 @@ import type { Address, Subscription, UserModel } from '@proton/shared/lib/interf import type { ModalWithProps } from '@proton/shared/lib/interfaces/Modal'; import type { VisualCalendar } from '@proton/shared/lib/interfaces/calendar'; -import { useModalState } from '../../../components'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import { useModalsMap } from '../../../hooks/useModalsMap'; import { PersonalCalendarModal } from '../calendarModal/personalCalendarModal/PersonalCalendarModal'; diff --git a/packages/components/containers/calendar/settings/OtherCalendarsSection.tsx b/packages/components/containers/calendar/settings/OtherCalendarsSection.tsx index 4142ed2bca..89591ab68f 100644 --- a/packages/components/containers/calendar/settings/OtherCalendarsSection.tsx +++ b/packages/components/containers/calendar/settings/OtherCalendarsSection.tsx @@ -7,6 +7,7 @@ import { Button, ButtonLike, Card, Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { SharedCalendarsSection } from '@proton/components/containers'; import { removeCalendar } from '@proton/shared/lib/api/calendars'; @@ -23,7 +24,6 @@ import type { VisualCalendar, } from '@proton/shared/lib/interfaces/calendar'; -import { useModalState } from '../../../components'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import { useModalsMap } from '../../../hooks/useModalsMap'; import { SettingsParagraph } from '../../account'; diff --git a/packages/components/containers/calendar/settings/SharedCalendarsSection.tsx b/packages/components/containers/calendar/settings/SharedCalendarsSection.tsx index 942799fb1f..5c22f577c7 100644 --- a/packages/components/containers/calendar/settings/SharedCalendarsSection.tsx +++ b/packages/components/containers/calendar/settings/SharedCalendarsSection.tsx @@ -6,6 +6,7 @@ import { Button, ButtonLike } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; import TableCell from '@proton/components/components/table/TableCell'; @@ -35,7 +36,7 @@ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { Address, UserModel } from '@proton/shared/lib/interfaces'; import type { CalendarMemberInvitation, VisualCalendar } from '@proton/shared/lib/interfaces/calendar'; -import { ButtonGroup, useModalState } from '../../../components'; +import { ButtonGroup } from '../../../components'; import CalendarSelectIcon from '../../../components/calendarSelect/CalendarSelectIcon'; import { SettingsSectionWide } from '../../../containers'; import CalendarBadge from '../../../containers/calendar/settings/CalendarBadge'; diff --git a/packages/components/containers/calendar/shareProton/ShareCalendarModal.tsx b/packages/components/containers/calendar/shareProton/ShareCalendarModal.tsx index 373733cb92..226120af53 100644 --- a/packages/components/containers/calendar/shareProton/ShareCalendarModal.tsx +++ b/packages/components/containers/calendar/shareProton/ShareCalendarModal.tsx @@ -4,17 +4,16 @@ import { useEffect, useRef, useState } from 'react'; import { c, msgid } from 'ttag'; import { Button, Href } from '@proton/atoms'; -import { - AddressesAutocompleteTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '@proton/components/components'; +import { AddressesAutocompleteTwo } from '@proton/components/components'; import AddressesInput, { AddressesInputItem } from '@proton/components/components/addressesInput/AddressesInput'; import Icon from '@proton/components/components/icon/Icon'; import RadioGroup from '@proton/components/components/input/RadioGroup'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import InputField from '@proton/components/components/v2/field/InputField'; import { useKeyTransparencyContext } from '@proton/components/containers/keyTransparency/useKeyTransparencyContext'; import { @@ -47,7 +46,6 @@ import clsx from '@proton/utils/clsx'; import isTruthy from '@proton/utils/isTruthy'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; import { useContactEmailsCache } from '../../contacts/ContactEmailsProvider'; export enum VALIDATION_ERROR_TYPES { diff --git a/packages/components/containers/calendar/shareProton/ShareCalendarWithSignatureVerificationErrorModal.tsx b/packages/components/containers/calendar/shareProton/ShareCalendarWithSignatureVerificationErrorModal.tsx index 3badaf367e..03333834fd 100644 --- a/packages/components/containers/calendar/shareProton/ShareCalendarWithSignatureVerificationErrorModal.tsx +++ b/packages/components/containers/calendar/shareProton/ShareCalendarWithSignatureVerificationErrorModal.tsx @@ -1,16 +1,13 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; - interface Props extends ModalProps { senderEmail: string; onCancel: () => void; diff --git a/packages/components/containers/calendar/shareURL/EditLinkModal.tsx b/packages/components/containers/calendar/shareURL/EditLinkModal.tsx index 738543daed..602ecc92fb 100644 --- a/packages/components/containers/calendar/shareURL/EditLinkModal.tsx +++ b/packages/components/containers/calendar/shareURL/EditLinkModal.tsx @@ -4,12 +4,13 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import BasicModal from '@proton/components/components/modalTwo/BasicModal'; import type { BasicModalProps } from '@proton/components/components/modalTwo/BasicModal'; import { useLoading } from '@proton/hooks'; import { MAX_CHARS_CLEARTEXT } from '@proton/shared/lib/calendar/constants'; import type { Nullable } from '@proton/shared/lib/interfaces/utils'; -import { BasicModal, InputFieldTwo } from '../../../components'; +import { InputFieldTwo } from '../../../components'; import { useNotifications } from '../../../hooks'; interface EditLinkModalProps extends Omit { diff --git a/packages/components/containers/calendar/shareURL/ShareLinkModal.tsx b/packages/components/containers/calendar/shareURL/ShareLinkModal.tsx index 610dcd9911..7059ca6dea 100644 --- a/packages/components/containers/calendar/shareURL/ShareLinkModal.tsx +++ b/packages/components/containers/calendar/shareURL/ShareLinkModal.tsx @@ -4,6 +4,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import BasicModal from '@proton/components/components/modalTwo/BasicModal'; import type { BasicModalProps } from '@proton/components/components/modalTwo/BasicModal'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; @@ -21,7 +22,7 @@ import type { CalendarLink, CalendarUrlResponse } from '@proton/shared/lib/inter import { ACCESS_LEVEL } from '@proton/shared/lib/interfaces/calendar'; import { splitKeys } from '@proton/shared/lib/keys'; -import { BasicModal, InputFieldTwo } from '../../../components'; +import { InputFieldTwo } from '../../../components'; interface Props extends Omit { calendarID: string; diff --git a/packages/components/containers/calendar/shareURL/ShareLinkSuccessModal.tsx b/packages/components/containers/calendar/shareURL/ShareLinkSuccessModal.tsx index d01cb8a158..2eca937702 100644 --- a/packages/components/containers/calendar/shareURL/ShareLinkSuccessModal.tsx +++ b/packages/components/containers/calendar/shareURL/ShareLinkSuccessModal.tsx @@ -3,11 +3,10 @@ import type { MouseEvent } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import BasicModal from '@proton/components/components/modalTwo/BasicModal'; import { BRAND_NAME } from '@proton/shared/lib/constants'; import { ACCESS_LEVEL } from '@proton/shared/lib/interfaces/calendar'; -import { BasicModal } from '../../../components'; - interface Props { link: string; onSubmit: (e: MouseEvent) => void; diff --git a/packages/components/containers/challenge/ChallengeError.tsx b/packages/components/containers/challenge/ChallengeError.tsx index f4fac6da83..d8fc5fb016 100644 --- a/packages/components/containers/challenge/ChallengeError.tsx +++ b/packages/components/containers/challenge/ChallengeError.tsx @@ -2,8 +2,8 @@ import { c } from 'ttag'; import { InlineLinkButton } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; -import { useModalState } from '../../components/modalTwo'; import BugModal from '../support/BugModal'; const ChallengeError = () => { diff --git a/packages/components/containers/contacts/edit/ContactEditModal.tsx b/packages/components/containers/contacts/edit/ContactEditModal.tsx index 2b126724f1..1bf7972474 100644 --- a/packages/components/containers/contacts/edit/ContactEditModal.tsx +++ b/packages/components/containers/contacts/edit/ContactEditModal.tsx @@ -3,6 +3,11 @@ import { useEffect, useRef, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { addVCardProperty, @@ -22,8 +27,6 @@ import type { SimpleMap } from '@proton/shared/lib/interfaces/utils'; import isTruthy from '@proton/utils/isTruthy'; import randomIntFromInterval from '@proton/utils/randomIntFromInterval'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useContactEmails, useEventManager, useHandler, useNotifications } from '../../../hooks'; import type { ContactGroupEditProps } from '../group/ContactGroupEditModal'; import useApplyGroups from '../hooks/useApplyGroups'; diff --git a/packages/components/containers/contacts/email/ContactEmailSettingsModal.tsx b/packages/components/containers/contacts/email/ContactEmailSettingsModal.tsx index c48b5db229..fb83e35341 100644 --- a/packages/components/containers/contacts/email/ContactEmailSettingsModal.tsx +++ b/packages/components/containers/contacts/email/ContactEmailSettingsModal.tsx @@ -3,14 +3,7 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { - Label, - type ModalProps, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, -} from '@proton/components/components'; +import { Label } from '@proton/components/components'; import Alert from '@proton/components/components/alert/Alert'; import Collapsible from '@proton/components/components/collapsible/Collapsible'; import CollapsibleContent from '@proton/components/components/collapsible/CollapsibleContent'; @@ -20,6 +13,11 @@ import Field from '@proton/components/components/container/Field'; import Row from '@proton/components/components/container/Row'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import getPublicKeysEmailHelper from '@proton/shared/lib/api/helpers/getPublicKeysEmailHelper'; import { extractScheme } from '@proton/shared/lib/api/helpers/mailSettings'; diff --git a/packages/components/containers/contacts/group/ContactGroupDeleteModal.tsx b/packages/components/containers/contacts/group/ContactGroupDeleteModal.tsx index 47c22ae864..9b17de2b2d 100644 --- a/packages/components/containers/contacts/group/ContactGroupDeleteModal.tsx +++ b/packages/components/containers/contacts/group/ContactGroupDeleteModal.tsx @@ -2,13 +2,13 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { allSucceded } from '@proton/shared/lib/api/helpers/response'; import { deleteLabels } from '@proton/shared/lib/api/labels'; import type { ContactGroup } from '@proton/shared/lib/interfaces/contacts'; -import type { ModalProps } from '../../../components'; import { useApi, useContactGroups, useEventManager, useNotifications } from '../../../hooks'; import { getDeleteText } from '../../general/helper'; diff --git a/packages/components/containers/contacts/group/ContactGroupDetailsModal.tsx b/packages/components/containers/contacts/group/ContactGroupDetailsModal.tsx index a2a8124efe..6ed0366ed7 100644 --- a/packages/components/containers/contacts/group/ContactGroupDetailsModal.tsx +++ b/packages/components/containers/contacts/group/ContactGroupDetailsModal.tsx @@ -2,12 +2,12 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import type { Recipient } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { ModalTwo } from '../../../components'; import ModalContent from '../../../components/modalTwo/ModalContent'; import ModalFooter from '../../../components/modalTwo/ModalFooter'; import ModalHeader from '../../../components/modalTwo/ModalHeader'; diff --git a/packages/components/containers/contacts/group/ContactGroupEditModal.tsx b/packages/components/containers/contacts/group/ContactGroupEditModal.tsx index c3841edb09..2f81714c90 100644 --- a/packages/components/containers/contacts/group/ContactGroupEditModal.tsx +++ b/packages/components/containers/contacts/group/ContactGroupEditModal.tsx @@ -4,7 +4,7 @@ import { useMemo, useState } from 'react'; import { c, msgid } from 'ttag'; import { Button, Input } from '@proton/atoms'; -import { Label, type ModalProps, ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components'; +import { Label } from '@proton/components'; import { type AddressesAutocompleteItem, getContactsAutocompleteItems, @@ -14,6 +14,11 @@ import Autocomplete from '@proton/components/components/autocomplete/Autocomplet import Field from '@proton/components/components/container/Field'; import Row from '@proton/components/components/container/Row'; import ColorPicker from '@proton/components/components/input/ColorPicker'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { getRandomAccentColor } from '@proton/shared/lib/colors'; import { hasReachedContactGroupMembersLimit } from '@proton/shared/lib/contacts/helpers/contactGroup'; import { validateEmailAddress } from '@proton/shared/lib/helpers/email'; diff --git a/packages/components/containers/contacts/hooks/useApplyGroups.tsx b/packages/components/containers/contacts/hooks/useApplyGroups.tsx index 5dae164a81..c3f9321702 100644 --- a/packages/components/containers/contacts/hooks/useApplyGroups.tsx +++ b/packages/components/containers/contacts/hooks/useApplyGroups.tsx @@ -2,7 +2,7 @@ import { useCallback } from 'react'; import { c } from 'ttag'; -import { useModalTwoStatic } from '@proton/components/components'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import { labelContactEmails, unLabelContactEmails } from '@proton/shared/lib/api/contacts'; import { hasReachedContactGroupMembersLimit } from '@proton/shared/lib/contacts/helpers/contactGroup'; import type { Contact, ContactEmail } from '@proton/shared/lib/interfaces/contacts'; diff --git a/packages/components/containers/contacts/hooks/useContactMergeModals.tsx b/packages/components/containers/contacts/hooks/useContactMergeModals.tsx index 57598ca3df..3a3e45e725 100644 --- a/packages/components/containers/contacts/hooks/useContactMergeModals.tsx +++ b/packages/components/containers/contacts/hooks/useContactMergeModals.tsx @@ -1,4 +1,5 @@ -import { useModalTwoStatic } from '../../../components/modalTwo/useModalTwo'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; + import ContactMergeDetailsModal from '../merge/ContactMergeDetailsModal'; import type { ContactMergeProps } from '../merge/ContactMergeModal'; import ContactMergeModal from '../merge/ContactMergeModal'; diff --git a/packages/components/containers/contacts/hooks/useContactModals.tsx b/packages/components/containers/contacts/hooks/useContactModals.tsx index 81c9ed5ae1..54dccc64d1 100644 --- a/packages/components/containers/contacts/hooks/useContactModals.tsx +++ b/packages/components/containers/contacts/hooks/useContactModals.tsx @@ -1,7 +1,7 @@ +import { useModalTwo, useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import type { Recipient } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import { useModalTwo, useModalTwoStatic } from '../../../components/modalTwo/useModalTwo'; import type { ContactEditProps } from '../edit/ContactEditModal'; import ContactEditModal from '../edit/ContactEditModal'; import type { ContactEmailSettingsProps } from '../email/ContactEmailSettingsModal'; diff --git a/packages/components/containers/contacts/import/ContactImportModal.tsx b/packages/components/containers/contacts/import/ContactImportModal.tsx index ad25be59f2..e8c22bc1db 100644 --- a/packages/components/containers/contacts/import/ContactImportModal.tsx +++ b/packages/components/containers/contacts/import/ContactImportModal.tsx @@ -1,10 +1,10 @@ import { useState } from 'react'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import type { ImportContactsModel } from '@proton/shared/lib/interfaces/contacts/Import'; import { IMPORT_STEPS } from '@proton/shared/lib/interfaces/contacts/Import'; -import type { ModalProps } from '../../../components/modalTwo'; -import { ModalTwo } from '../../../components/modalTwo'; import ContactImportAttaching from './steps/ContactImportAttaching'; import ContactImportCsv from './steps/ContactImportCsv'; import ContactImportGroups from './steps/ContactImportGroups'; diff --git a/packages/components/containers/contacts/import/steps/ContactImportAttaching.tsx b/packages/components/containers/contacts/import/steps/ContactImportAttaching.tsx index 69f092f130..94b3df9568 100644 --- a/packages/components/containers/contacts/import/steps/ContactImportAttaching.tsx +++ b/packages/components/containers/contacts/import/steps/ContactImportAttaching.tsx @@ -4,9 +4,12 @@ import { c } from 'ttag'; import { EASY_SWITCH_SEARCH_SOURCES } from '@proton/activation/src/interface'; import { Button, Href } from '@proton/atoms'; -import { Alert, AttachedFile, Dropzone, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components'; +import { Alert, AttachedFile, Dropzone } from '@proton/components'; import FileInput from '@proton/components/components/input/FileInput'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { APPS } from '@proton/shared/lib/constants'; import { MAX_CONTACTS_PER_USER, diff --git a/packages/components/containers/contacts/import/steps/ContactImportCsv.tsx b/packages/components/containers/contacts/import/steps/ContactImportCsv.tsx index c56e22daec..4f51dccf29 100644 --- a/packages/components/containers/contacts/import/steps/ContactImportCsv.tsx +++ b/packages/components/containers/contacts/import/steps/ContactImportCsv.tsx @@ -5,6 +5,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Table from '@proton/components/components/table/Table'; import { ImportFatalError } from '@proton/shared/lib/contacts/errors/ImportFatalError'; import { toVCardContacts } from '@proton/shared/lib/contacts/helpers/csv'; @@ -17,7 +20,6 @@ import { import type { ImportContactsModel } from '@proton/shared/lib/interfaces/contacts/Import'; import { IMPORT_STEPS } from '@proton/shared/lib/interfaces/contacts/Import'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; import { useNotifications } from '../../../../hooks'; import ContactImportCsvTableBody from './ContactImportCsvTableBody'; import ContactImportCsvTableHeader from './ContactImportCsvTableHeader'; diff --git a/packages/components/containers/contacts/import/steps/ContactImportGroups.tsx b/packages/components/containers/contacts/import/steps/ContactImportGroups.tsx index 4222855120..79bc51662c 100644 --- a/packages/components/containers/contacts/import/steps/ContactImportGroups.tsx +++ b/packages/components/containers/contacts/import/steps/ContactImportGroups.tsx @@ -4,6 +4,9 @@ import { c, msgid } from 'ttag'; import { Button, Input } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { FORBIDDEN_LABEL_NAMES } from '@proton/shared/lib/constants'; @@ -13,7 +16,6 @@ import type { ContactGroup, ImportContactsModel } from '@proton/shared/lib/inter import { IMPORT_GROUPS_ACTION } from '@proton/shared/lib/interfaces/contacts'; import isTruthy from '@proton/utils/isTruthy'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; import { useApi, useEventManager } from '../../../../hooks'; import { submitCategories } from '../encryptAndSubmit'; diff --git a/packages/components/containers/contacts/import/steps/ContactImportSummary.tsx b/packages/components/containers/contacts/import/steps/ContactImportSummary.tsx index 5f6b69d2dc..555b1227ea 100644 --- a/packages/components/containers/contacts/import/steps/ContactImportSummary.tsx +++ b/packages/components/containers/contacts/import/steps/ContactImportSummary.tsx @@ -4,12 +4,14 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import DynamicProgress from '@proton/components/components/progress/DynamicProgress'; import { getImportCategoriesModel, haveCategories } from '@proton/shared/lib/contacts/helpers/import'; import type { ImportContactsModel } from '@proton/shared/lib/interfaces/contacts/Import'; import { IMPORT_STEPS } from '@proton/shared/lib/interfaces/contacts/Import'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; import { useUser } from '../../../../hooks'; import { useGetContactGroups } from '../../../../hooks/useCategories'; import { extractTotals } from '../encryptAndSubmit'; diff --git a/packages/components/containers/contacts/import/steps/ContactImportWarning.tsx b/packages/components/containers/contacts/import/steps/ContactImportWarning.tsx index 1c91ff186e..03f1b2014a 100644 --- a/packages/components/containers/contacts/import/steps/ContactImportWarning.tsx +++ b/packages/components/containers/contacts/import/steps/ContactImportWarning.tsx @@ -4,11 +4,13 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { CONTACTS_APP_NAME } from '@proton/shared/lib/constants'; import type { ImportContactsModel } from '@proton/shared/lib/interfaces/contacts/Import'; import { IMPORT_STEPS } from '@proton/shared/lib/interfaces/contacts/Import'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; import ErrorDetails from './ContactImportWarningErrorDetails'; interface Props { diff --git a/packages/components/containers/contacts/import/steps/ContactImporting.tsx b/packages/components/containers/contacts/import/steps/ContactImporting.tsx index fcdb36ee26..b19fd116b3 100644 --- a/packages/components/containers/contacts/import/steps/ContactImporting.tsx +++ b/packages/components/containers/contacts/import/steps/ContactImporting.tsx @@ -5,6 +5,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import DynamicProgress from '@proton/components/components/progress/DynamicProgress'; import { getApiWithAbort } from '@proton/shared/lib/api/helpers/customConfig'; import { CATEGORIES, OVERWRITE } from '@proton/shared/lib/contacts/constants'; @@ -18,7 +21,6 @@ import type { import { IMPORT_STEPS } from '@proton/shared/lib/interfaces/contacts/Import'; import { splitKeys } from '@proton/shared/lib/keys/keys'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; import { useApi, useBeforeUnload, useEventManager, useGetUserKeys } from '../../../../hooks'; import { extractTotals, processContactsInBatches } from '../encryptAndSubmit'; diff --git a/packages/components/containers/contacts/merge/ContactMergeDetailsModal.tsx b/packages/components/containers/contacts/merge/ContactMergeDetailsModal.tsx index 50958d8069..811eacc08d 100644 --- a/packages/components/containers/contacts/merge/ContactMergeDetailsModal.tsx +++ b/packages/components/containers/contacts/merge/ContactMergeDetailsModal.tsx @@ -4,13 +4,16 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import useContactList from '@proton/components/containers/contacts/hooks/useContactList'; import { toMap } from '@proton/shared/lib/helpers/object'; import type { ContactEmail } from '@proton/shared/lib/interfaces/contacts'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useAddresses, useContactGroups, useUserKeys } from '../../../hooks'; import useContact from '../hooks/useContact'; import useVCardContact from '../hooks/useVCardContact'; diff --git a/packages/components/containers/contacts/merge/ContactMergeErrorContent.tsx b/packages/components/containers/contacts/merge/ContactMergeErrorContent.tsx index 6c69625e4b..a5d8902d6a 100644 --- a/packages/components/containers/contacts/merge/ContactMergeErrorContent.tsx +++ b/packages/components/containers/contacts/merge/ContactMergeErrorContent.tsx @@ -3,8 +3,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Icon from '@proton/components/components/icon/Icon'; - -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; interface Props { model: { diff --git a/packages/components/containers/contacts/merge/ContactMergeModal.tsx b/packages/components/containers/contacts/merge/ContactMergeModal.tsx index 745f715c5a..b45b83de56 100644 --- a/packages/components/containers/contacts/merge/ContactMergeModal.tsx +++ b/packages/components/containers/contacts/merge/ContactMergeModal.tsx @@ -1,9 +1,9 @@ import { useEffect, useMemo, useState } from 'react'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import type { ContactFormatted, ContactMergeModel } from '@proton/shared/lib/interfaces/contacts'; -import type { ModalProps } from '../../../components'; -import { ModalTwo } from '../../../components'; import { useEventManager } from '../../../hooks'; import type { ContactMergePreviewModalProps } from './ContactMergePreviewModal'; import ContactMergeTableContent from './ContactMergeTableContent'; diff --git a/packages/components/containers/contacts/merge/ContactMergePreviewModal.tsx b/packages/components/containers/contacts/merge/ContactMergePreviewModal.tsx index 832b8a742c..444a19681a 100644 --- a/packages/components/containers/contacts/merge/ContactMergePreviewModal.tsx +++ b/packages/components/containers/contacts/merge/ContactMergePreviewModal.tsx @@ -1,6 +1,8 @@ import type { Dispatch, SetStateAction } from 'react'; import { useEffect, useMemo, useState } from 'react'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import { useLoading } from '@proton/hooks'; import { getContact } from '@proton/shared/lib/api/contacts'; import { processApiRequestsSafe } from '@proton/shared/lib/api/helpers/safeApiRequests'; @@ -10,8 +12,6 @@ import type { Contact, ContactMergeModel } from '@proton/shared/lib/interfaces/c import type { VCardContact } from '@proton/shared/lib/interfaces/contacts/VCard'; import { splitKeys } from '@proton/shared/lib/keys/keys'; -import type { ModalProps } from '../../../components'; -import { ModalTwo } from '../../../components'; import { useApi, useEventManager, useUserKeys } from '../../../hooks'; import ContactMergeErrorContent from './ContactMergeErrorContent'; import ContactMergeViewContent from './ContactMergeViewContent'; diff --git a/packages/components/containers/contacts/merge/ContactMergeTableContent.tsx b/packages/components/containers/contacts/merge/ContactMergeTableContent.tsx index 14c299abfb..4afe531d8e 100644 --- a/packages/components/containers/contacts/merge/ContactMergeTableContent.tsx +++ b/packages/components/containers/contacts/merge/ContactMergeTableContent.tsx @@ -4,10 +4,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { ContactFormatted, ContactMergeModel } from '@proton/shared/lib/interfaces/contacts'; import move from '@proton/utils/move'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import type { ContactMergePreviewModalProps } from './ContactMergePreviewModal'; import MergeTable from './table/MergeTable'; diff --git a/packages/components/containers/contacts/merge/ContactMergeViewContent.tsx b/packages/components/containers/contacts/merge/ContactMergeViewContent.tsx index 2550be969e..f3cc528506 100644 --- a/packages/components/containers/contacts/merge/ContactMergeViewContent.tsx +++ b/packages/components/containers/contacts/merge/ContactMergeViewContent.tsx @@ -4,12 +4,14 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { toMap } from '@proton/shared/lib/helpers/object'; import type { ContactEmail } from '@proton/shared/lib/interfaces/contacts'; import type { VCardContact } from '@proton/shared/lib/interfaces/contacts/VCard'; import noop from '@proton/utils/noop'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useAddresses, useContactGroups } from '../../../hooks'; import useContactList from '../hooks/useContactList'; import ContactView from '../view/ContactView'; diff --git a/packages/components/containers/contacts/merge/ContactMergingContent.tsx b/packages/components/containers/contacts/merge/ContactMergingContent.tsx index 9848997430..5da6c253c7 100644 --- a/packages/components/containers/contacts/merge/ContactMergingContent.tsx +++ b/packages/components/containers/contacts/merge/ContactMergingContent.tsx @@ -4,6 +4,9 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import DynamicProgress from '@proton/components/components/progress/DynamicProgress'; import { useLoading } from '@proton/hooks'; import { addContacts, deleteContacts, getContact } from '@proton/shared/lib/api/contacts'; @@ -22,7 +25,6 @@ import type { VCardContact } from '@proton/shared/lib/interfaces/contacts/VCard' import { splitKeys } from '@proton/shared/lib/keys/keys'; import chunk from '@proton/utils/chunk'; -import { ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useApi, useUserKeys } from '../../../hooks'; const { OVERWRITE_CONTACT } = OVERWRITE; diff --git a/packages/components/containers/contacts/modals/ContactClearDataConfirmModal.tsx b/packages/components/containers/contacts/modals/ContactClearDataConfirmModal.tsx index 85fe549ba5..41dfc424be 100644 --- a/packages/components/containers/contacts/modals/ContactClearDataConfirmModal.tsx +++ b/packages/components/containers/contacts/modals/ContactClearDataConfirmModal.tsx @@ -4,10 +4,13 @@ import { c } from 'ttag'; import { Button, Input } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { Key } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import Row from '../../../components/container/Row'; import type { ContactClearDataExecutionProps } from './ContactClearDataExecutionModal'; diff --git a/packages/components/containers/contacts/modals/ContactClearDataExecutionModal.tsx b/packages/components/containers/contacts/modals/ContactClearDataExecutionModal.tsx index c2df87dfd1..8308ead17c 100644 --- a/packages/components/containers/contacts/modals/ContactClearDataExecutionModal.tsx +++ b/packages/components/containers/contacts/modals/ContactClearDataExecutionModal.tsx @@ -4,12 +4,15 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import DynamicProgress from '@proton/components/components/progress/DynamicProgress'; import { dropDataEncryptedWithAKey } from '@proton/shared/lib/contacts/globalOperations'; import type { Key } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useApi, useContacts, useEventManager, useGetUserKeys } from '../../../hooks'; export interface ContactClearDataExecutionProps { diff --git a/packages/components/containers/contacts/modals/ContactDecryptionErrorModal.tsx b/packages/components/containers/contacts/modals/ContactDecryptionErrorModal.tsx index 875e50d5ab..07573b6a1a 100644 --- a/packages/components/containers/contacts/modals/ContactDecryptionErrorModal.tsx +++ b/packages/components/containers/contacts/modals/ContactDecryptionErrorModal.tsx @@ -5,20 +5,17 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Copy from '@proton/components/components/button/Copy'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { APPS } from '@proton/shared/lib/constants'; import { getKeyUsedForContact } from '@proton/shared/lib/contacts/keyVerifications'; import type { Key } from '@proton/shared/lib/interfaces'; import type { Contact } from '@proton/shared/lib/interfaces/contacts'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - UnderlineButton, - useSettingsLink, -} from '../../../components'; +import { UnderlineButton, useSettingsLink } from '../../../components'; import { useNotifications, useUser } from '../../../hooks'; import useContact from '../hooks/useContact'; import type { ContactClearDataConfirmProps } from './ContactClearDataConfirmModal'; diff --git a/packages/components/containers/contacts/modals/ContactDeleteModal.tsx b/packages/components/containers/contacts/modals/ContactDeleteModal.tsx index 1899969391..44d12485b0 100644 --- a/packages/components/containers/contacts/modals/ContactDeleteModal.tsx +++ b/packages/components/containers/contacts/modals/ContactDeleteModal.tsx @@ -2,6 +2,7 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { clearContacts, deleteContacts } from '@proton/shared/lib/api/contacts'; @@ -9,7 +10,6 @@ import { allSucceded } from '@proton/shared/lib/api/helpers/response'; import { wait } from '@proton/shared/lib/helpers/promise'; import type { Contact } from '@proton/shared/lib/interfaces/contacts'; -import type { ModalProps } from '../../../components'; import { ErrorButton } from '../../../components'; import { useApi, useContacts, useEventManager, useNotifications } from '../../../hooks'; import { getDeleteText } from '../../general/helper'; diff --git a/packages/components/containers/contacts/modals/ContactExportingModal.tsx b/packages/components/containers/contacts/modals/ContactExportingModal.tsx index dee46ae78d..a5f2f986a4 100644 --- a/packages/components/containers/contacts/modals/ContactExportingModal.tsx +++ b/packages/components/containers/contacts/modals/ContactExportingModal.tsx @@ -5,13 +5,16 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import DynamicProgress from '@proton/components/components/progress/DynamicProgress'; import { exportContactsFromLabel } from '@proton/shared/lib/contacts/helpers/export'; import downloadFile from '@proton/shared/lib/helpers/downloadFile'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useApi, useContacts, useGetUserKeys } from '../../../hooks'; const DOWNLOAD_FILENAME = 'protonContacts'; diff --git a/packages/components/containers/contacts/modals/ContactGroupLimitReachedModal.tsx b/packages/components/containers/contacts/modals/ContactGroupLimitReachedModal.tsx index 2fa6bc178a..290b71b1ca 100644 --- a/packages/components/containers/contacts/modals/ContactGroupLimitReachedModal.tsx +++ b/packages/components/containers/contacts/modals/ContactGroupLimitReachedModal.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useContactGroups } from '@proton/components/hooks'; import type { ContactGroup } from '@proton/shared/lib/interfaces/contacts'; diff --git a/packages/components/containers/contacts/modals/ContactImageModal.tsx b/packages/components/containers/contacts/modals/ContactImageModal.tsx index dfc7354a82..01ffd381e1 100644 --- a/packages/components/containers/contacts/modals/ContactImageModal.tsx +++ b/packages/components/containers/contacts/modals/ContactImageModal.tsx @@ -6,13 +6,17 @@ import { c } from 'ttag'; import { Button, Input } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import FileInput from '@proton/components/components/input/FileInput'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { CONTACT_IMG_SIZE } from '@proton/shared/lib/contacts/constants'; import { resizeImage } from '@proton/shared/lib/helpers/image'; import { isValidHttpUrl } from '@proton/shared/lib/helpers/url'; import debounce from '@proton/utils/debounce'; -import type { ModalProps } from '../../../components'; -import { ErrorZone, Label, ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; +import { ErrorZone, Label } from '../../../components'; import Field from '../../../components/container/Field'; import Row from '../../../components/container/Row'; import { useNotifications } from '../../../hooks'; diff --git a/packages/components/containers/contacts/modals/ContactResignExecutionModal.tsx b/packages/components/containers/contacts/modals/ContactResignExecutionModal.tsx index f5ea2c6ced..d4139886be 100644 --- a/packages/components/containers/contacts/modals/ContactResignExecutionModal.tsx +++ b/packages/components/containers/contacts/modals/ContactResignExecutionModal.tsx @@ -4,11 +4,14 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import DynamicProgress from '@proton/components/components/progress/DynamicProgress'; import { resignAllContacts } from '@proton/shared/lib/contacts/globalOperations'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useApi, useContacts, useEventManager, useGetUserKeys } from '../../../hooks'; const ContactResignExecutionModal = ({ ...rest }: ModalProps) => { diff --git a/packages/components/containers/contacts/modals/ContactSignatureErrorModal.tsx b/packages/components/containers/contacts/modals/ContactSignatureErrorModal.tsx index 343500f33d..ee1d8dc8fe 100644 --- a/packages/components/containers/contacts/modals/ContactSignatureErrorModal.tsx +++ b/packages/components/containers/contacts/modals/ContactSignatureErrorModal.tsx @@ -2,9 +2,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; - -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; export interface ContactSignatureErrorProps { contactID: string; diff --git a/packages/components/containers/contacts/modals/ContactUpgradeModal.tsx b/packages/components/containers/contacts/modals/ContactUpgradeModal.tsx index e9caa7dc42..54c3215300 100644 --- a/packages/components/containers/contacts/modals/ContactUpgradeModal.tsx +++ b/packages/components/containers/contacts/modals/ContactUpgradeModal.tsx @@ -1,5 +1,6 @@ import { c } from 'ttag'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import useOneDollarConfig from '@proton/components/components/upsell/useOneDollarPromo'; import useUpsellConfig from '@proton/components/components/upsell/useUpsellConfig'; @@ -7,8 +8,6 @@ import { useConfig } from '@proton/components/hooks'; import { SHARED_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; import { getUpsellRefFromApp } from '@proton/shared/lib/helpers/upsell'; -import type { ModalStateProps } from '../../../components'; - const ContactUpgradeModal = (modalProps: ModalStateProps) => { const { APP_NAME } = useConfig(); diff --git a/packages/components/containers/contacts/modals/SelectEmailsModal.tsx b/packages/components/containers/contacts/modals/SelectEmailsModal.tsx index caa9c981eb..099f7882c5 100644 --- a/packages/components/containers/contacts/modals/SelectEmailsModal.tsx +++ b/packages/components/containers/contacts/modals/SelectEmailsModal.tsx @@ -6,11 +6,15 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Checkbox from '@proton/components/components/input/Checkbox'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { Contact, ContactEmail } from '@proton/shared/lib/interfaces/contacts'; import isTruthy from '@proton/utils/isTruthy'; -import type { ModalProps } from '../../../components'; -import { Label, ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; +import { Label } from '../../../components'; import Field from '../../../components/container/Field'; import Row from '../../../components/container/Row'; import { useContactGroups } from '../../../hooks'; diff --git a/packages/components/containers/contacts/selector/ContactSelectorModal.tsx b/packages/components/containers/contacts/selector/ContactSelectorModal.tsx index b7d78a9d7d..077cc91143 100644 --- a/packages/components/containers/contacts/selector/ContactSelectorModal.tsx +++ b/packages/components/containers/contacts/selector/ContactSelectorModal.tsx @@ -7,6 +7,11 @@ import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Checkbox from '@proton/components/components/input/Checkbox'; import SearchInput from '@proton/components/components/input/SearchInput'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { toMap } from '@proton/shared/lib/helpers/object'; @@ -15,8 +20,6 @@ import type { Recipient } from '@proton/shared/lib/interfaces/Address'; import type { ContactEmail, ContactGroup } from '@proton/shared/lib/interfaces/contacts/Contact'; import clsx from '@proton/utils/clsx'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useActiveBreakpoint, useContactEmailsSortedByName, useUserSettings } from '../../../hooks'; import { useContactGroups } from '../../../hooks/useCategories'; import type { ContactEditProps } from '../edit/ContactEditModal'; diff --git a/packages/components/containers/contacts/view/ContactDetailsModal.tsx b/packages/components/containers/contacts/view/ContactDetailsModal.tsx index 95377da98d..b9f50a5842 100644 --- a/packages/components/containers/contacts/view/ContactDetailsModal.tsx +++ b/packages/components/containers/contacts/view/ContactDetailsModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import { APPS } from '@proton/shared/lib/constants'; import { CRYPTO_PROCESSING_TYPES } from '@proton/shared/lib/contacts/constants'; @@ -14,8 +19,6 @@ import { toMap } from '@proton/shared/lib/helpers/object'; import type { ContactEmail } from '@proton/shared/lib/interfaces/contacts'; import type { VCardContact } from '@proton/shared/lib/interfaces/contacts/VCard'; -import type { ModalProps } from '../../../components/modalTwo'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components/modalTwo'; import { useAddresses, useConfig, diff --git a/packages/components/containers/credentialLeak/BreachModal.tsx b/packages/components/containers/credentialLeak/BreachModal.tsx index 8fb6fd3ced..62c0bbabe4 100644 --- a/packages/components/containers/credentialLeak/BreachModal.tsx +++ b/packages/components/containers/credentialLeak/BreachModal.tsx @@ -1,9 +1,12 @@ import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import { updateBreachState } from '@proton/shared/lib/api/breaches'; diff --git a/packages/components/containers/credentialLeak/CredentialLeakSection.tsx b/packages/components/containers/credentialLeak/CredentialLeakSection.tsx index 8d1a3c4c09..eb42a2610e 100644 --- a/packages/components/containers/credentialLeak/CredentialLeakSection.tsx +++ b/packages/components/containers/credentialLeak/CredentialLeakSection.tsx @@ -7,13 +7,13 @@ import { GenericError, SUBSCRIPTION_STEPS, useErrorHandler, - useModalStateObject, useSubscriptionModal, useUser, useUserSettings, } from '@proton/components'; import Icon from '@proton/components/components/icon/Icon'; import Loader from '@proton/components/components/loader/Loader'; +import { useModalStateObject } from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import { useApi, useNotifications } from '@proton/components/hooks'; import { useLoading } from '@proton/hooks'; diff --git a/packages/components/containers/desktop/freeTrial/InboxDesktopFreeTrialOnboardingModal.tsx b/packages/components/containers/desktop/freeTrial/InboxDesktopFreeTrialOnboardingModal.tsx index 5726af6adc..18bb386c85 100644 --- a/packages/components/containers/desktop/freeTrial/InboxDesktopFreeTrialOnboardingModal.tsx +++ b/packages/components/containers/desktop/freeTrial/InboxDesktopFreeTrialOnboardingModal.tsx @@ -3,7 +3,10 @@ import { useEffect } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, useModalState } from '@proton/components/components'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useUser } from '@proton/components/hooks'; import { APP_UPSELL_REF_PATH, MAIL_APP_NAME, MAIL_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; import { getUpsellRef } from '@proton/shared/lib/helpers/upsell'; diff --git a/packages/components/containers/domains/CatchAllModal.tsx b/packages/components/containers/domains/CatchAllModal.tsx index 51bc4e51f1..29398a3aa2 100644 --- a/packages/components/containers/domains/CatchAllModal.tsx +++ b/packages/components/containers/domains/CatchAllModal.tsx @@ -2,11 +2,14 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Info from '@proton/components/components/link/Info'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { Domain, DomainAddress } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import AddressesTable from './AddressesTable'; interface Props extends ModalProps { diff --git a/packages/components/containers/domains/DomainModal.tsx b/packages/components/containers/domains/DomainModal.tsx index f2e86bb0ab..7a2cb2c2ec 100644 --- a/packages/components/containers/domains/DomainModal.tsx +++ b/packages/components/containers/domains/DomainModal.tsx @@ -7,6 +7,11 @@ import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Icon from '@proton/components/components/icon/Icon'; import RoundedIcon from '@proton/components/components/icon/RoundedIcon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import { useLoading } from '@proton/hooks'; import { addDomain, getDomain } from '@proton/shared/lib/api/domains'; @@ -22,15 +27,7 @@ import { import clsx from '@proton/utils/clsx'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - ButtonGroup, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useFormErrors, -} from '../../components'; +import { ButtonGroup, useFormErrors } from '../../components'; import { useApi, useCustomDomains, useEventManager, useNotifications, useStep } from '../../hooks'; import AddressesSection from './AddressesSection'; import DKIMSection from './DKIMSection'; diff --git a/packages/components/containers/domains/DomainsSection.tsx b/packages/components/containers/domains/DomainsSection.tsx index d96e7c3f98..6563994c51 100644 --- a/packages/components/containers/domains/DomainsSection.tsx +++ b/packages/components/containers/domains/DomainsSection.tsx @@ -6,6 +6,7 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; import DropdownActions from '@proton/components/components/dropdown/DropdownActions'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; import TableHeader from '@proton/components/components/table/TableHeader'; @@ -27,7 +28,6 @@ import type { Domain, DomainAddress } from '@proton/shared/lib/interfaces'; import { hasPaidMail } from '@proton/shared/lib/user/helpers'; import isTruthy from '@proton/utils/isTruthy'; -import { useModalState } from '../../components'; import { useApi, useCustomDomains, diff --git a/packages/components/containers/filePreview/CloseModal.tsx b/packages/components/containers/filePreview/CloseModal.tsx index 2dfd9e4510..8f2a7732b7 100644 --- a/packages/components/containers/filePreview/CloseModal.tsx +++ b/packages/components/containers/filePreview/CloseModal.tsx @@ -1,10 +1,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; -import type { ModalProps } from '../../components'; - interface Props extends ModalProps { isSaving?: boolean; handleDiscard?: () => void; diff --git a/packages/components/containers/filePreview/FilePreview.tsx b/packages/components/containers/filePreview/FilePreview.tsx index 6802de7135..1f1f07c17b 100644 --- a/packages/components/containers/filePreview/FilePreview.tsx +++ b/packages/components/containers/filePreview/FilePreview.tsx @@ -4,8 +4,8 @@ import { forwardRef, useEffect, useRef, useState } from 'react'; import { c } from 'ttag'; import useFocusTrap from '@proton/components/components/focus/useFocusTrap'; -import { useCombinedRefs } from '@proton/hooks'; -import { useLoading } from '@proton/hooks'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; +import { useCombinedRefs, useLoading } from '@proton/hooks'; import busy from '@proton/shared/lib/busy'; import { isMinimumSafariVersion, isSafari } from '@proton/shared/lib/helpers/browser'; import { @@ -19,7 +19,6 @@ import { } from '@proton/shared/lib/helpers/mimetype'; import { isPreviewAvailable, isPreviewTooLarge } from '@proton/shared/lib/helpers/preview'; -import { useModalState } from '../../components'; import { useBeforeUnload, useHotkeys } from '../../hooks'; import AudioPreview from './AudioPreview'; import CloseModal from './CloseModal'; diff --git a/packages/components/containers/filters/ActionsFilterToolbar.tsx b/packages/components/containers/filters/ActionsFilterToolbar.tsx index ea1cc375fd..7ca13973cc 100644 --- a/packages/components/containers/filters/ActionsFilterToolbar.tsx +++ b/packages/components/containers/filters/ActionsFilterToolbar.tsx @@ -1,12 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton'; import FiltersUpsellModal from '@proton/components/components/upsell/modal/types/FiltersUpsellModal'; import { useFilters } from '@proton/components/hooks'; import { hasReachedFiltersLimit } from '@proton/shared/lib/helpers/filters'; -import { useModalState } from '../../components'; import useUser from '../../hooks/useUser'; import FilterModal from './modal/FilterModal'; import AdvancedFilterModal from './modal/advanced/AdvancedFilterModal'; diff --git a/packages/components/containers/filters/FilterItemRow.tsx b/packages/components/containers/filters/FilterItemRow.tsx index 0a0a80384f..208df28092 100644 --- a/packages/components/containers/filters/FilterItemRow.tsx +++ b/packages/components/containers/filters/FilterItemRow.tsx @@ -5,6 +5,7 @@ import { c } from 'ttag'; import type { DropdownActionProps } from '@proton/components/components/dropdown/DropdownActions'; import DropdownActions from '@proton/components/components/dropdown/DropdownActions'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import FiltersUpsellModal from '@proton/components/components/upsell/modal/types/FiltersUpsellModal'; import { useLoading } from '@proton/hooks'; @@ -12,7 +13,7 @@ import { deleteFilter, toggleEnable } from '@proton/shared/lib/api/filters'; import { FILTER_STATUS } from '@proton/shared/lib/constants'; import { hasReachedFiltersLimit } from '@proton/shared/lib/helpers/filters'; -import { OrderableTableRow, useModalState } from '../../components'; +import { OrderableTableRow } from '../../components'; import { useApi, useEventManager, useNotifications, useUser } from '../../hooks'; import FilterWarningModal from './FilterWarningModal'; import type { Filter } from './interfaces'; diff --git a/packages/components/containers/filters/modal/CloseFilterModal.tsx b/packages/components/containers/filters/modal/CloseFilterModal.tsx index 08a31fef8e..0a830fcfe4 100644 --- a/packages/components/containers/filters/modal/CloseFilterModal.tsx +++ b/packages/components/containers/filters/modal/CloseFilterModal.tsx @@ -1,10 +1,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; -import type { ModalProps } from '../../../components'; - interface Props extends ModalProps { handleDiscard?: () => void; } diff --git a/packages/components/containers/filters/modal/DeleteFilterModal.tsx b/packages/components/containers/filters/modal/DeleteFilterModal.tsx index 253b62a890..22cc3e3bd6 100644 --- a/packages/components/containers/filters/modal/DeleteFilterModal.tsx +++ b/packages/components/containers/filters/modal/DeleteFilterModal.tsx @@ -1,10 +1,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; -import type { ModalProps } from '../../../components'; - interface Props extends ModalProps { filterName: string; handleDelete: () => void; diff --git a/packages/components/containers/filters/modal/FilterActionsFormFolderRow.tsx b/packages/components/containers/filters/modal/FilterActionsFormFolderRow.tsx index f4b288ab5c..ebea2bdc35 100644 --- a/packages/components/containers/filters/modal/FilterActionsFormFolderRow.tsx +++ b/packages/components/containers/filters/modal/FilterActionsFormFolderRow.tsx @@ -4,6 +4,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Icon, { type IconName } from '@proton/components/components/icon/Icon'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Option from '@proton/components/components/option/Option'; import SearchableSelect from '@proton/components/components/selectTwo/SearchableSelect'; import { useUser } from '@proton/components/hooks'; @@ -11,7 +12,7 @@ import { buildTreeview, formatFolderName, hasReachedFolderLimit } from '@proton/ import type { Folder, FolderWithSubFolders } from '@proton/shared/lib/interfaces/Folder'; import clsx from '@proton/utils/clsx'; -import { InputFieldTwo, useModalState } from '../../../components'; +import { InputFieldTwo } from '../../../components'; import type { LabelModel } from '../../labels/modals/EditLabelModal'; import EditLabelModal from '../../labels/modals/EditLabelModal'; import { getDefaultFolderOptions, noFolderOption, noFolderValue } from '../constants'; diff --git a/packages/components/containers/filters/modal/FilterActionsFormLabelsRow.tsx b/packages/components/containers/filters/modal/FilterActionsFormLabelsRow.tsx index 0536ecb23c..0f4ad7259c 100644 --- a/packages/components/containers/filters/modal/FilterActionsFormLabelsRow.tsx +++ b/packages/components/containers/filters/modal/FilterActionsFormLabelsRow.tsx @@ -5,12 +5,13 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Checkbox from '@proton/components/components/input/Checkbox'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useUser } from '@proton/components/hooks'; import { hasReachedLabelLimit } from '@proton/shared/lib/helpers/folder'; import type { Label } from '@proton/shared/lib/interfaces/Label'; import clsx from '@proton/utils/clsx'; -import { LabelStack, useModalState } from '../../../components'; +import { LabelStack } from '../../../components'; import type { LabelModel } from '../../labels/modals/EditLabelModal'; import EditLabelModal from '../../labels/modals/EditLabelModal'; import type { Actions } from '../interfaces'; diff --git a/packages/components/containers/filters/modal/FilterModal.tsx b/packages/components/containers/filters/modal/FilterModal.tsx index ab23fe2dce..544e48ca23 100644 --- a/packages/components/containers/filters/modal/FilterModal.tsx +++ b/packages/components/containers/filters/modal/FilterModal.tsx @@ -5,6 +5,12 @@ import { c } from 'ttag'; import Form from '@proton/components/components/form/Form'; import Checkbox from '@proton/components/components/input/Checkbox'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useLoading } from '@proton/hooks'; import { addTreeFilter, applyFilters, updateFilter } from '@proton/shared/lib/api/filters'; import isDeepEqual from '@proton/shared/lib/helpers/isDeepEqual'; @@ -12,8 +18,6 @@ import { AUTO_REPLY_CHARACTER_COUNT_LIMIT } from '@proton/shared/lib/mail/consta import { removeImagesFromContent } from '@proton/shared/lib/sanitize/purify'; import generateUID from '@proton/utils/generateUID'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, useModalState } from '../../../components'; import { useApi, useEventManager, useFilters, useFolders, useLabels, useNotifications } from '../../../hooks'; import { getDefaultFolders, noFolderValue } from '../constants'; import type { diff --git a/packages/components/containers/filters/modal/advanced/AdvancedFilterModal.tsx b/packages/components/containers/filters/modal/advanced/AdvancedFilterModal.tsx index 0fc238d769..fec3e6fad3 100644 --- a/packages/components/containers/filters/modal/advanced/AdvancedFilterModal.tsx +++ b/packages/components/containers/filters/modal/advanced/AdvancedFilterModal.tsx @@ -6,12 +6,16 @@ import { c } from 'ttag'; import { Href } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import useDebounceInput from '@proton/components/components/input/useDebounceInput'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useLoading } from '@proton/hooks'; import { addTreeFilter, checkSieveFilter, updateFilter } from '@proton/shared/lib/api/filters'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; -import type { ModalProps } from '../../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, useModalState } from '../../../../components'; import { useApi, useEventManager, useFilters, useNotifications } from '../../../../hooks'; import { FILTER_VERSION } from '../../constants'; import type { AdvancedSimpleFilterModalModel, CreateFilter, ErrorsSieve, Filter } from '../../interfaces'; diff --git a/packages/components/containers/filters/spams/Spams.tsx b/packages/components/containers/filters/spams/Spams.tsx index dbe7979097..509948fdc2 100644 --- a/packages/components/containers/filters/spams/Spams.tsx +++ b/packages/components/containers/filters/spams/Spams.tsx @@ -2,9 +2,10 @@ import { useEffect, useRef } from 'react'; import { c } from 'ttag'; -import { LabelStack, Pagination, useModalState } from '@proton/components/components'; +import { LabelStack, Pagination } from '@proton/components/components'; import SearchInput from '@proton/components/components/input/SearchInput'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; import TableCell from '@proton/components/components/table/TableCell'; diff --git a/packages/components/containers/filters/spams/modals/SpamModal.tsx b/packages/components/containers/filters/spams/modals/SpamModal.tsx index 4d25bcb219..4bc4683af0 100644 --- a/packages/components/containers/filters/spams/modals/SpamModal.tsx +++ b/packages/components/containers/filters/spams/modals/SpamModal.tsx @@ -5,11 +5,15 @@ import { c } from 'ttag'; import { Button, Input } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Radio from '@proton/components/components/input/Radio'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { validateEmailAddress } from '@proton/shared/lib/helpers/email'; import { isDomain } from '@proton/shared/lib/helpers/validators'; -import type { ModalProps } from '../../../../components'; -import { Label, ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; +import { Label } from '../../../../components'; import Field from '../../../../components/container/Field'; import Row from '../../../../components/container/Row'; import type { SpamLocation } from '../Spams.interfaces'; diff --git a/packages/components/containers/forward/ConfirmDeleteForwarding.tsx b/packages/components/containers/forward/ConfirmDeleteForwarding.tsx index 56a606c109..42f1fe5dfd 100644 --- a/packages/components/containers/forward/ConfirmDeleteForwarding.tsx +++ b/packages/components/containers/forward/ConfirmDeleteForwarding.tsx @@ -1,11 +1,10 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; -import type { ModalProps } from '../../components'; - interface Props { reActivateE2EE: boolean; modalProps: ModalProps; diff --git a/packages/components/containers/forward/ForwardModal.tsx b/packages/components/containers/forward/ForwardModal.tsx index 6f331ac2bb..f5641abfc4 100644 --- a/packages/components/containers/forward/ForwardModal.tsx +++ b/packages/components/containers/forward/ForwardModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import useKTVerifier from '@proton/components/containers/keyTransparency/useKTVerifier'; @@ -23,15 +28,7 @@ import { addAddressKeysProcess, getEmailFromKey, splitKeys } from '@proton/share import illustration from '@proton/styles/assets/img/illustrations/forward-email-verification.svg'; import uniqueBy from '@proton/utils/uniqueBy'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; import { useAddressFlags, useAddresses, diff --git a/packages/components/containers/forward/ForwardSection.tsx b/packages/components/containers/forward/ForwardSection.tsx index fcd59f4cff..52d3d135e0 100644 --- a/packages/components/containers/forward/ForwardSection.tsx +++ b/packages/components/containers/forward/ForwardSection.tsx @@ -4,6 +4,8 @@ import { useLocation } from 'react-router'; import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton'; import UpsellModal from '@proton/components/components/upsell/modal/UpsellModal'; import { useIncomingAddressForwardings, useOutgoingAddressForwardings } from '@proton/components/hooks'; @@ -12,7 +14,7 @@ import { addUpsellPath, getUpgradePath, getUpsellRef } from '@proton/shared/lib/ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import isTruthy from '@proton/utils/isTruthy'; -import { Tabs, useModalState, useModalTwoStatic } from '../../components'; +import { Tabs } from '../../components'; import { useAddresses, useUser } from '../../hooks'; import { SettingsParagraph, SettingsSection, SettingsSectionWide } from '../account'; import ForwardModal from './ForwardModal'; diff --git a/packages/components/containers/forward/OutgoingForwardActions.tsx b/packages/components/containers/forward/OutgoingForwardActions.tsx index e7c61d7feb..46e51ab09a 100644 --- a/packages/components/containers/forward/OutgoingForwardActions.tsx +++ b/packages/components/containers/forward/OutgoingForwardActions.tsx @@ -1,6 +1,8 @@ import { c } from 'ttag'; import DropdownActions from '@proton/components/components/dropdown/DropdownActions'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import { deleteForwarding, pauseForwarding, @@ -11,7 +13,6 @@ import type { Address, OutgoingAddressForwarding, UserModel } from '@proton/shar import { ForwardingState, ForwardingType } from '@proton/shared/lib/interfaces'; import isTruthy from '@proton/utils/isTruthy'; -import { useModalState, useModalTwoStatic } from '../../components'; import { useActiveBreakpoint, useAddressFlags, diff --git a/packages/components/containers/general/PmMeSection.tsx b/packages/components/containers/general/PmMeSection.tsx index 8880746dcb..f72361f1b4 100644 --- a/packages/components/containers/general/PmMeSection.tsx +++ b/packages/components/containers/general/PmMeSection.tsx @@ -1,12 +1,13 @@ import { c } from 'ttag'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton'; import PmMeUpsellModal from '@proton/components/components/upsell/modal/types/PmMeUpsellModal'; import { APP_UPSELL_REF_PATH, MAIL_APP_NAME, MAIL_UPSELL_PATHS, UPSELL_COMPONENT } from '@proton/shared/lib/constants'; import { addUpsellPath, getUpgradePath, getUpsellRef } from '@proton/shared/lib/helpers/upsell'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; -import { useModalState, useSettingsLink } from '../../components'; +import { useSettingsLink } from '../../components'; import { useSubscription, useUser } from '../../hooks'; import { SettingsParagraph, SettingsSection } from '../account'; import PmMeButton, { getActivateString } from './PmMeButton'; diff --git a/packages/components/containers/gmailSyncModal/GmailSyncModal.tsx b/packages/components/containers/gmailSyncModal/GmailSyncModal.tsx index ded2d43e8e..40cead2547 100644 --- a/packages/components/containers/gmailSyncModal/GmailSyncModal.tsx +++ b/packages/components/containers/gmailSyncModal/GmailSyncModal.tsx @@ -8,8 +8,8 @@ import { useEasySwitchDispatch, useEasySwitchSelector } from '@proton/activation import { changeCreateLoadingState, createSyncItem } from '@proton/activation/src/logic/sync/sync.actions'; import { selectCreateSyncState } from '@proton/activation/src/logic/sync/sync.selectors'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { ModalTwo } from '@proton/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; import ModalContent from '@proton/components/components/modalTwo/ModalContent'; import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; diff --git a/packages/components/containers/heading/UserDropdown.tsx b/packages/components/containers/heading/UserDropdown.tsx index a567360f7f..c9549ace85 100644 --- a/packages/components/containers/heading/UserDropdown.tsx +++ b/packages/components/containers/heading/UserDropdown.tsx @@ -23,7 +23,6 @@ import { useFeature, useIsSecurityCheckupAvailable, useIsSentinelUser, - useModalState, useNotifications, useOrganization, usePopperAnchor, @@ -41,6 +40,7 @@ import DropdownMenu from '@proton/components/components/dropdown/DropdownMenu'; import { DropdownSizeUnit } from '@proton/components/components/dropdown/utils'; import Icon from '@proton/components/components/icon/Icon'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useDispatch } from '@proton/redux-shared-store'; import { getAvailableApps } from '@proton/shared/lib/apps/apps'; import { getAppHref, getAppShortName } from '@proton/shared/lib/apps/helper'; diff --git a/packages/components/containers/invoices/InvoiceTextModal.tsx b/packages/components/containers/invoices/InvoiceTextModal.tsx index 1cd63fb59d..f2c94d91e9 100644 --- a/packages/components/containers/invoices/InvoiceTextModal.tsx +++ b/packages/components/containers/invoices/InvoiceTextModal.tsx @@ -6,18 +6,15 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { updateInvoiceText } from '@proton/shared/lib/api/settings'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - TextAreaTwo, -} from '../../components'; +import { InputFieldTwo, TextAreaTwo } from '../../components'; import { useApi, useEventManager, useNotifications, useUserSettings } from '../../hooks'; export interface Props { diff --git a/packages/components/containers/keys/AddressKeysSection.tsx b/packages/components/containers/keys/AddressKeysSection.tsx index 3d4f517d2e..36a6b12f30 100644 --- a/packages/components/containers/keys/AddressKeysSection.tsx +++ b/packages/components/containers/keys/AddressKeysSection.tsx @@ -6,6 +6,7 @@ import { c } from 'ttag'; import { useInactiveKeys } from '@proton/account'; import { Button } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useKTVerifier from '@proton/components/containers/keyTransparency/useKTVerifier'; import type { AlgorithmInfo } from '@proton/crypto'; import type { KeyGenConfig } from '@proton/shared/lib/interfaces'; @@ -20,7 +21,6 @@ import { } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import { useModalState } from '../../components'; import { useAddresses, useAddressesKeys, diff --git a/packages/components/containers/keys/UserKeysSection.tsx b/packages/components/containers/keys/UserKeysSection.tsx index f749b30017..ba9817b94b 100644 --- a/packages/components/containers/keys/UserKeysSection.tsx +++ b/packages/components/containers/keys/UserKeysSection.tsx @@ -2,11 +2,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { AlgorithmInfo } from '@proton/crypto'; import type { KeyGenConfig } from '@proton/shared/lib/interfaces'; import { addUserKeysProcess } from '@proton/shared/lib/keys'; -import { useModalState } from '../../components'; import { useApi, useAuthentication, diff --git a/packages/components/containers/keys/addKey/AddKeyModal.tsx b/packages/components/containers/keys/addKey/AddKeyModal.tsx index b4bac6f905..751a9e2040 100644 --- a/packages/components/containers/keys/addKey/AddKeyModal.tsx +++ b/packages/components/containers/keys/addKey/AddKeyModal.tsx @@ -1,6 +1,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { AlgorithmInfo } from '@proton/crypto'; import useLoading from '@proton/hooks/useLoading'; import { DEFAULT_KEYGEN_TYPE, KEYGEN_CONFIGS } from '@proton/shared/lib/constants'; @@ -8,8 +13,6 @@ import type { KeyGenConfig } from '@proton/shared/lib/interfaces'; import { getAlgorithmExists } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import useNotifications from '../../../hooks/useNotifications'; interface Props extends ModalProps { diff --git a/packages/components/containers/keys/exportKey/ExportPrivateKeyModal.tsx b/packages/components/containers/keys/exportKey/ExportPrivateKeyModal.tsx index e0aa979851..5dd1bceb35 100644 --- a/packages/components/containers/keys/exportKey/ExportPrivateKeyModal.tsx +++ b/packages/components/containers/keys/exportKey/ExportPrivateKeyModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { PrivateKeyReference } from '@proton/crypto'; import { CryptoProxy } from '@proton/crypto'; import { useLoading } from '@proton/hooks'; @@ -13,16 +18,7 @@ import { passwordLengthValidator } from '@proton/shared/lib/helpers/formValidato import generateUID from '@proton/utils/generateUID'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../../components'; import { useModals } from '../../../hooks'; import UnlockModal from '../../login/UnlockModal'; diff --git a/packages/components/containers/keys/exportKey/ExportPublicKeyModal.tsx b/packages/components/containers/keys/exportKey/ExportPublicKeyModal.tsx index 02195ee559..cbf01419ed 100644 --- a/packages/components/containers/keys/exportKey/ExportPublicKeyModal.tsx +++ b/packages/components/containers/keys/exportKey/ExportPublicKeyModal.tsx @@ -2,6 +2,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { PublicKeyReference } from '@proton/crypto'; import { CryptoProxy } from '@proton/crypto'; import { useLoading } from '@proton/hooks'; @@ -9,14 +14,6 @@ import { KEY_FILE_EXTENSION } from '@proton/shared/lib/constants'; import downloadFile from '@proton/shared/lib/helpers/downloadFile'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; - const handleExport = async (name: string, publicKey: PublicKeyReference) => { const fingerprint = publicKey.getFingerprint(); const filename = ['publickey.', name, '-', fingerprint, KEY_FILE_EXTENSION].join(''); diff --git a/packages/components/containers/keys/importKeys/ImportKeyModal.tsx b/packages/components/containers/keys/importKeys/ImportKeyModal.tsx index e34fa664cc..b5bcdb2104 100644 --- a/packages/components/containers/keys/importKeys/ImportKeyModal.tsx +++ b/packages/components/containers/keys/importKeys/ImportKeyModal.tsx @@ -3,14 +3,16 @@ import { useRef, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { PrivateKeyReference } from '@proton/crypto'; import { CryptoProxy } from '@proton/crypto'; -import type { ArmoredKeyWithInfo } from '@proton/shared/lib/keys'; -import type { OnKeyImportCallback } from '@proton/shared/lib/keys'; +import type { ArmoredKeyWithInfo, OnKeyImportCallback } from '@proton/shared/lib/keys'; import getRandomString from '@proton/utils/getRandomString'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../components'; import { useModals, useNotifications } from '../../../hooks'; import GenericError from '../../error/GenericError'; import DecryptFileKeyModal from '../shared/DecryptFileKeyModal'; diff --git a/packages/components/containers/keys/reactivateKeys/ReactivateKeysModal.tsx b/packages/components/containers/keys/reactivateKeys/ReactivateKeysModal.tsx index e6d8dcf45d..abe40fa858 100644 --- a/packages/components/containers/keys/reactivateKeys/ReactivateKeysModal.tsx +++ b/packages/components/containers/keys/reactivateKeys/ReactivateKeysModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { PrivateKeyReference } from '@proton/crypto'; import { CryptoProxy } from '@proton/crypto'; import { useLoading } from '@proton/hooks'; @@ -25,17 +30,7 @@ import { mnemonicToBase64RandomBytes } from '@proton/shared/lib/mnemonic'; import { computeKeyPassword } from '@proton/srp'; import isTruthy from '@proton/utils/isTruthy'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - PasswordInputTwo, - Tabs, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, PasswordInputTwo, Tabs, useFormErrors } from '../../../components'; import { useApi, useIsMnemonicAvailable, diff --git a/packages/components/containers/keys/shared/DecryptFileKeyModal.tsx b/packages/components/containers/keys/shared/DecryptFileKeyModal.tsx index aa8eaf4539..b6a28f8bf8 100644 --- a/packages/components/containers/keys/shared/DecryptFileKeyModal.tsx +++ b/packages/components/containers/keys/shared/DecryptFileKeyModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { PrivateKeyReference } from '@proton/crypto'; import { CryptoProxy } from '@proton/crypto'; import { useLoading } from '@proton/hooks'; @@ -12,16 +17,7 @@ import type { ArmoredKeyWithInfo } from '@proton/shared/lib/keys'; import generateUID from '@proton/utils/generateUID'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../../components'; interface Props extends ModalProps { privateKeyInfo: ArmoredKeyWithInfo; diff --git a/packages/components/containers/labels/ActionsLabel.tsx b/packages/components/containers/labels/ActionsLabel.tsx index 26ba7aedd4..1cf745e2c7 100644 --- a/packages/components/containers/labels/ActionsLabel.tsx +++ b/packages/components/containers/labels/ActionsLabel.tsx @@ -1,9 +1,9 @@ import { c } from 'ttag'; import DropdownActions from '@proton/components/components/dropdown/DropdownActions'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { Label } from '@proton/shared/lib/interfaces/Label'; -import { useModalState } from '../../components'; import DeleteLabelModal from './modals/DeleteLabelModal'; import EditLabelModal from './modals/EditLabelModal'; diff --git a/packages/components/containers/labels/FoldersSection.tsx b/packages/components/containers/labels/FoldersSection.tsx index f8582e3150..2857b5b0cb 100644 --- a/packages/components/containers/labels/FoldersSection.tsx +++ b/packages/components/containers/labels/FoldersSection.tsx @@ -3,6 +3,7 @@ import { c } from 'ttag'; import { Button, Scroll } from '@proton/atoms'; import Info from '@proton/components/components/link/Info'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton'; import LabelsUpsellModal from '@proton/components/components/upsell/modal/types/LabelsUpsellModal'; import { useLoading } from '@proton/hooks'; @@ -10,7 +11,6 @@ import { orderAllFolders } from '@proton/shared/lib/api/labels'; import { MAIL_UPSELL_PATHS } from '@proton/shared/lib/constants'; import { hasReachedFolderLimit } from '@proton/shared/lib/helpers/folder'; -import { useModalState } from '../../components'; import { useApi, useEventManager, useFolders, useMailSettings, useNotifications, useUser } from '../../hooks'; import { SettingsSection } from '../account'; import SettingsLayout from '../account/SettingsLayout'; diff --git a/packages/components/containers/labels/LabelsSection.tsx b/packages/components/containers/labels/LabelsSection.tsx index 9ef6bb10c0..1710a5fb00 100644 --- a/packages/components/containers/labels/LabelsSection.tsx +++ b/packages/components/containers/labels/LabelsSection.tsx @@ -6,6 +6,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import useDebounceInput from '@proton/components/components/input/useDebounceInput'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton'; import LabelsUpsellModal from '@proton/components/components/upsell/modal/types/LabelsUpsellModal'; import { useLoading } from '@proton/hooks'; @@ -15,7 +16,6 @@ import { hasReachedLabelLimit } from '@proton/shared/lib/helpers/folder'; import isDeepEqual from '@proton/shared/lib/helpers/isDeepEqual'; import type { Label } from '@proton/shared/lib/interfaces'; -import { useModalState } from '../../components'; import { useApi, useEventManager, useLabels, useNotifications, useUser } from '../../hooks'; import { SettingsSection } from '../account'; import LabelSortableList from './LabelSortableList'; diff --git a/packages/components/containers/labels/modals/DeleteLabelModal.tsx b/packages/components/containers/labels/modals/DeleteLabelModal.tsx index aa78fae908..4b6b8272ba 100644 --- a/packages/components/containers/labels/modals/DeleteLabelModal.tsx +++ b/packages/components/containers/labels/modals/DeleteLabelModal.tsx @@ -1,13 +1,13 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useApi, useEventManager, useNotifications } from '@proton/components/hooks'; import { deleteLabel } from '@proton/shared/lib/api/labels'; import { LABEL_TYPE } from '@proton/shared/lib/constants'; import type { Label } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../../components'; import { ErrorButton } from '../../../components'; interface Props extends ModalProps { diff --git a/packages/components/containers/labels/modals/EditLabelModal.tsx b/packages/components/containers/labels/modals/EditLabelModal.tsx index b42fb5ef90..261ce114d3 100644 --- a/packages/components/containers/labels/modals/EditLabelModal.tsx +++ b/packages/components/containers/labels/modals/EditLabelModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { checkLabelAvailability, create as createLabel, updateLabel } from '@proton/shared/lib/api/labels'; import { getRandomAccentColor } from '@proton/shared/lib/colors'; @@ -14,8 +19,7 @@ import type { Folder } from '@proton/shared/lib/interfaces/Folder'; import type { Label } from '@proton/shared/lib/interfaces/Label'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, useFormErrors } from '../../../components'; +import { useFormErrors } from '../../../components'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import NewLabelForm from '../NewLabelForm'; diff --git a/packages/components/containers/login/UnlockModal.tsx b/packages/components/containers/login/UnlockModal.tsx index 2e9d043416..e6f7db251f 100644 --- a/packages/components/containers/login/UnlockModal.tsx +++ b/packages/components/containers/login/UnlockModal.tsx @@ -4,21 +4,18 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { PASSWORD_WRONG_ERROR } from '@proton/shared/lib/api/auth'; import { getApiError } from '@proton/shared/lib/api/helpers/apiErrorHelper'; import { queryUnlock } from '@proton/shared/lib/api/user'; import { srpAuth } from '@proton/shared/lib/srp'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo } from '../../components'; import { useApi, useErrorHandler } from '../../hooks'; interface Props extends Omit, 'as' | 'onSubmit' | 'size' | 'onSuccess'> { diff --git a/packages/components/containers/mail/MailComposerModeModal.tsx b/packages/components/containers/mail/MailComposerModeModal.tsx index df6ed78092..ce23a8d6f8 100644 --- a/packages/components/containers/mail/MailComposerModeModal.tsx +++ b/packages/components/containers/mail/MailComposerModeModal.tsx @@ -1,13 +1,16 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { updateComposerMode } from '@proton/shared/lib/api/mailSettings'; import type { COMPOSER_MODE } from '@proton/shared/lib/mail/mailSettings'; import { DEFAULT_MAILSETTINGS } from '@proton/shared/lib/mail/mailSettings'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useApi, useEventManager, useMailSettings, useNotifications } from '../../hooks'; import ComposerModeCards from '../layouts/ComposerModeCards'; diff --git a/packages/components/containers/mail/MailDensityModal.tsx b/packages/components/containers/mail/MailDensityModal.tsx index 819afff2a7..311539d198 100644 --- a/packages/components/containers/mail/MailDensityModal.tsx +++ b/packages/components/containers/mail/MailDensityModal.tsx @@ -1,12 +1,15 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { updateDensity } from '@proton/shared/lib/api/settings'; import type { DENSITY } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useApi, useEventManager, useNotifications, useUserSettings } from '../../hooks'; import DensityRadiosCards from '../layouts/DensityRadiosCards'; diff --git a/packages/components/containers/mail/MailShortcutsModal.tsx b/packages/components/containers/mail/MailShortcutsModal.tsx index 3b8c457501..05e8f94b7e 100644 --- a/packages/components/containers/mail/MailShortcutsModal.tsx +++ b/packages/components/containers/mail/MailShortcutsModal.tsx @@ -2,20 +2,17 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { MAIL_APP_NAME } from '@proton/shared/lib/constants'; import { DEFAULT_MAILSETTINGS } from '@proton/shared/lib/mail/mailSettings'; import { getShortcuts } from '@proton/shared/lib/shortcuts/mail'; import clsx from '@proton/utils/clsx'; -import type { ModalProps } from '../../components'; -import { - Label, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - ShortcutsSectionView, -} from '../../components'; +import { Label, ShortcutsSectionView } from '../../components'; import Field from '../../components/container/Field'; import Row from '../../components/container/Row'; import { useMailSettings } from '../../hooks'; diff --git a/packages/components/containers/mail/MailViewLayoutModal.tsx b/packages/components/containers/mail/MailViewLayoutModal.tsx index 3f338de6f1..9336b89442 100644 --- a/packages/components/containers/mail/MailViewLayoutModal.tsx +++ b/packages/components/containers/mail/MailViewLayoutModal.tsx @@ -1,13 +1,16 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { updateViewLayout } from '@proton/shared/lib/api/mailSettings'; import type { VIEW_LAYOUT } from '@proton/shared/lib/mail/mailSettings'; import { DEFAULT_MAILSETTINGS } from '@proton/shared/lib/mail/mailSettings'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useApi, useEventManager, useMailSettings, useNotifications } from '../../hooks'; import ViewLayoutCards from '../layouts/ViewLayoutCards'; diff --git a/packages/components/containers/members/ChangeMemberPasswordModal.tsx b/packages/components/containers/members/ChangeMemberPasswordModal.tsx index 67c4a6c93b..a72dd46af0 100644 --- a/packages/components/containers/members/ChangeMemberPasswordModal.tsx +++ b/packages/components/containers/members/ChangeMemberPasswordModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useAuthentication, useBeforeUnload, @@ -36,16 +41,7 @@ import { srpVerify } from '@proton/shared/lib/srp'; import { formatUser } from '@proton/shared/lib/user/helpers'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { GenericError } from '../error'; import { AuthModal } from '../password'; diff --git a/packages/components/containers/members/InviteUserCreateSubUserModal.tsx b/packages/components/containers/members/InviteUserCreateSubUserModal.tsx index 424ac6ded8..9ce0f55e9a 100644 --- a/packages/components/containers/members/InviteUserCreateSubUserModal.tsx +++ b/packages/components/containers/members/InviteUserCreateSubUserModal.tsx @@ -1,6 +1,8 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import { getInviteLimit } from '@proton/components/containers/members/UsersAndAddressesSection/helper'; @@ -9,8 +11,6 @@ import { BRAND_NAME, PLAN_NAMES } from '@proton/shared/lib/constants'; import type { Domain, EnhancedMember, Organization } from '@proton/shared/lib/interfaces'; import { isOrganizationFamily } from '@proton/shared/lib/organization/helper'; -import type { ModalStateProps } from '../../components'; -import { useModalState } from '../../components'; import { useCustomDomains } from '../../hooks'; import SubUserCreateModal from './SubUserCreateModal'; diff --git a/packages/components/containers/members/SubUserBulkCreateModal.tsx b/packages/components/containers/members/SubUserBulkCreateModal.tsx index 50c9ea3bda..94f3bac53c 100644 --- a/packages/components/containers/members/SubUserBulkCreateModal.tsx +++ b/packages/components/containers/members/SubUserBulkCreateModal.tsx @@ -3,6 +3,12 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button, InlineLinkButton } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import SubUserCreateHint from '@proton/components/containers/members/SubUserCreateHint'; import CreateUserAccountsModal from '@proton/components/containers/members/multipleUserCreation/CreateUserAccountsModal/CreateUserAccountsModal'; import UploadCSVFileButton from '@proton/components/containers/members/multipleUserCreation/UploadCSVFileButton'; @@ -11,14 +17,6 @@ import type { APP_NAMES } from '@proton/shared/lib/constants'; import type { Domain, EnhancedMember } from '@proton/shared/lib/interfaces'; import { CreateMemberMode } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useModalState, -} from '../../components'; import type { CsvConfig } from './multipleUserCreation/csv'; import { downloadSampleCSV } from './multipleUserCreation/csv'; diff --git a/packages/components/containers/members/SubUserCreateModal.tsx b/packages/components/containers/members/SubUserCreateModal.tsx index dbf5f59003..371724e65a 100644 --- a/packages/components/containers/members/SubUserCreateModal.tsx +++ b/packages/components/containers/members/SubUserCreateModal.tsx @@ -15,6 +15,11 @@ import { Button, InlineLinkButton } from '@proton/atoms'; import { DropdownSizeUnit } from '@proton/components/components/dropdown/utils'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import Toggle from '@proton/components/components/toggle/Toggle'; @@ -47,16 +52,7 @@ import { useFlag } from '@proton/unleash'; import clamp from '@proton/utils/clamp'; import isTruthy from '@proton/utils/isTruthy'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { useApi, useErrorHandler, diff --git a/packages/components/containers/members/SubUserDeleteModal.tsx b/packages/components/containers/members/SubUserDeleteModal.tsx index 240c9c2200..07560d78ad 100644 --- a/packages/components/containers/members/SubUserDeleteModal.tsx +++ b/packages/components/containers/members/SubUserDeleteModal.tsx @@ -5,21 +5,18 @@ import { c } from 'ttag'; import { Button, Card } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { NAME_PLACEHOLDER } from '@proton/shared/lib/constants'; import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; import { removeDiacritics } from '@proton/shared/lib/helpers/string'; import type { Member } from '@proton/shared/lib/interfaces/Member'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; const clean = (value: string) => { return removeDiacritics(value.toLowerCase().replace(/\s+/g, '')); diff --git a/packages/components/containers/members/SubUserEditModal.tsx b/packages/components/containers/members/SubUserEditModal.tsx index 1de6d23887..54d52e83a5 100644 --- a/packages/components/containers/members/SubUserEditModal.tsx +++ b/packages/components/containers/members/SubUserEditModal.tsx @@ -13,6 +13,12 @@ import { } from '@proton/account'; import { Button, Card } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import Toggle from '@proton/components/components/toggle/Toggle'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; @@ -29,14 +35,6 @@ import useFlag from '@proton/unleash/useFlag'; import noop from '@proton/utils/noop'; import { InputFieldTwo, useFormErrors } from '../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - type ModalProps, - useModalState, -} from '../../components/modalTwo'; import { useApi, useErrorHandler, useNotifications, useOrganization, useOrganizationKey } from '../../hooks'; import Addresses from '../addresses/Addresses'; import useVerifyOutboundPublicKeys from '../keyTransparency/useVerifyOutboundPublicKeys'; diff --git a/packages/components/containers/members/Unprivatization/MemberUnprivatizationModal.tsx b/packages/components/containers/members/Unprivatization/MemberUnprivatizationModal.tsx index bf21ea6578..e0164a8986 100644 --- a/packages/components/containers/members/Unprivatization/MemberUnprivatizationModal.tsx +++ b/packages/components/containers/members/Unprivatization/MemberUnprivatizationModal.tsx @@ -2,6 +2,12 @@ import { c } from 'ttag'; import { memberAcceptUnprivatization, memberRejectUnprivatization } from '@proton/account/member/actions'; import { Button, InlineLinkButton } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; import useApi from '@proton/components/hooks/useApi'; import useNotifications from '@proton/components/hooks/useNotifications'; @@ -11,14 +17,6 @@ import { unlockPasswordChanges } from '@proton/shared/lib/api/user'; import type { Member } from '@proton/shared/lib/interfaces'; import { type ParsedUnprivatizationData } from '@proton/shared/lib/keys'; -import { - type ModalProps, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useModalState, -} from '../../../components/modalTwo'; import AuthModal from '../../password/AuthModal'; interface Props extends Omit, 'children' | 'buttons'> { diff --git a/packages/components/containers/members/UserInviteOrEditModal.tsx b/packages/components/containers/members/UserInviteOrEditModal.tsx index 346f396f7a..8d94cab727 100644 --- a/packages/components/containers/members/UserInviteOrEditModal.tsx +++ b/packages/components/containers/members/UserInviteOrEditModal.tsx @@ -4,6 +4,11 @@ import { useMemo, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import { useLoading } from '@proton/hooks'; import { editMemberInvitation, inviteMember, updateAI } from '@proton/shared/lib/api/members'; @@ -14,15 +19,7 @@ import { hasDuo, hasFamily, hasVisionary } from '@proton/shared/lib/helpers/subs import type { Member, Organization } from '@proton/shared/lib/interfaces'; import clamp from '@proton/utils/clamp'; -import type { ModalStateProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; import { useApi, useEventManager, useNotifications, useSubscription } from '../../hooks'; import { AssistantUpdateSubscriptionButton } from '../payments'; import MemberStorageSelector, { getInitialStorage, getStorageRange, getTotalStorage } from './MemberStorageSelector'; diff --git a/packages/components/containers/members/UserRemoveModal.tsx b/packages/components/containers/members/UserRemoveModal.tsx index 38be916eab..efe1cb4fc2 100644 --- a/packages/components/containers/members/UserRemoveModal.tsx +++ b/packages/components/containers/members/UserRemoveModal.tsx @@ -3,6 +3,7 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { deleteMember } from '@proton/shared/lib/api/members'; @@ -10,7 +11,6 @@ import { BRAND_NAME } from '@proton/shared/lib/constants'; import type { Member, Organization } from '@proton/shared/lib/interfaces'; import { MEMBER_STATE } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../components'; import { useApi, useEventManager, useNotifications } from '../../hooks'; interface Props extends ModalProps { diff --git a/packages/components/containers/members/UsersAndAddressesSection/UsersAndAddressesSection.tsx b/packages/components/containers/members/UsersAndAddressesSection/UsersAndAddressesSection.tsx index deb34027b3..d016054ba7 100644 --- a/packages/components/containers/members/UsersAndAddressesSection/UsersAndAddressesSection.tsx +++ b/packages/components/containers/members/UsersAndAddressesSection/UsersAndAddressesSection.tsx @@ -10,6 +10,7 @@ import { Avatar, Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import SearchInput from '@proton/components/components/input/SearchInput'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; import TableCell from '@proton/components/components/table/TableCell'; @@ -46,7 +47,6 @@ import { } from '@proton/shared/lib/organization/helper'; import clsx from '@proton/utils/clsx'; -import { useModalState } from '../../../components'; import Tooltip from '../../../components/tooltip/Tooltip'; import { useAddresses, diff --git a/packages/components/containers/members/multipleUserCreation/CreateUserAccountsModal/CreateUserAccountsModal.tsx b/packages/components/containers/members/multipleUserCreation/CreateUserAccountsModal/CreateUserAccountsModal.tsx index 421dcf72ef..b8a1bf6222 100644 --- a/packages/components/containers/members/multipleUserCreation/CreateUserAccountsModal/CreateUserAccountsModal.tsx +++ b/packages/components/containers/members/multipleUserCreation/CreateUserAccountsModal/CreateUserAccountsModal.tsx @@ -6,13 +6,8 @@ import { c, msgid } from 'ttag'; import { InvalidAddressesError, UnavailableAddressesError, createMember } from '@proton/account'; import validateAddUser from '@proton/account/members/validateAddUser'; import { Button, Input } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; import { Marks, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, useApi, useBeforeUnload, useEventManager, @@ -26,6 +21,11 @@ import { } from '@proton/components'; import Icon from '@proton/components/components/icon/Icon'; import Checkbox from '@proton/components/components/input/Checkbox'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Progress from '@proton/components/components/progress/Progress'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; diff --git a/packages/components/containers/members/multipleUserCreation/MultiUserCreationSection.tsx b/packages/components/containers/members/multipleUserCreation/MultiUserCreationSection.tsx index 2cf339a4f4..4e15ceb9a8 100644 --- a/packages/components/containers/members/multipleUserCreation/MultiUserCreationSection.tsx +++ b/packages/components/containers/members/multipleUserCreation/MultiUserCreationSection.tsx @@ -4,7 +4,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import { Tooltip } from '@proton/components'; -import { useModalState } from '@proton/components/components/modalTwo'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { APP_NAMES } from '@proton/shared/lib/constants'; import { CreateMemberMode } from '@proton/shared/lib/interfaces'; import { getIsDomainActive } from '@proton/shared/lib/organization/helper'; diff --git a/packages/components/containers/messages/AutoDeleteSetting.tsx b/packages/components/containers/messages/AutoDeleteSetting.tsx index 3dc3998cc2..cd390a4a21 100644 --- a/packages/components/containers/messages/AutoDeleteSetting.tsx +++ b/packages/components/containers/messages/AutoDeleteSetting.tsx @@ -1,13 +1,13 @@ import { c } from 'ttag'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import UpsellIcon from '@proton/components/components/upsell/UpsellIcon'; import AutoDeleteUpsellModal from '@proton/components/components/upsell/modal/types/AutoDeleteUpsellModal'; import { useLoading } from '@proton/hooks'; import { updateAutoDelete } from '@proton/shared/lib/api/mailSettings'; import { AUTO_DELETE_SPAM_AND_TRASH_DAYS } from '@proton/shared/lib/mail/mailSettings'; -import { useModalState } from '../../components'; import { useApi, useEventManager, useFeature, useUser } from '../../hooks'; import { SettingsLayout, SettingsLayoutLeft, SettingsLayoutRight } from '../account'; import { FeatureCode } from '../features'; diff --git a/packages/components/containers/mnemonic/DisableMnemonicModal.tsx b/packages/components/containers/mnemonic/DisableMnemonicModal.tsx index 978d3a06c7..a3c4bb33a6 100644 --- a/packages/components/containers/mnemonic/DisableMnemonicModal.tsx +++ b/packages/components/containers/mnemonic/DisableMnemonicModal.tsx @@ -1,11 +1,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { disableMnemonicPhrase } from '@proton/shared/lib/api/settingsMnemonic'; -import type { ModalProps } from '../../components'; -import { useModalState } from '../../components'; import { useEventManager, useNotifications } from '../../hooks'; import AuthModal from '../password/AuthModal'; diff --git a/packages/components/containers/mnemonic/GenerateMnemonicModal.tsx b/packages/components/containers/mnemonic/GenerateMnemonicModal.tsx index c2246fbc58..7025845d00 100644 --- a/packages/components/containers/mnemonic/GenerateMnemonicModal.tsx +++ b/packages/components/containers/mnemonic/GenerateMnemonicModal.tsx @@ -3,6 +3,12 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { reactivateMnemonicPhrase, updateMnemonicPhrase } from '@proton/shared/lib/api/settingsMnemonic'; @@ -12,14 +18,6 @@ import type { MnemonicData } from '@proton/shared/lib/mnemonic'; import { generateMnemonicPayload, generateMnemonicWithSalt } from '@proton/shared/lib/mnemonic'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useModalState, -} from '../../components'; import { useApi, useEventManager, useGetUserKeys, useUser } from '../../hooks'; import AuthModal from '../password/AuthModal'; import { MnemonicPhraseStepButtons, MnemonicPhraseStepContent } from './MnemonicPhraseStep'; diff --git a/packages/components/containers/offers/components/OfferModal.tsx b/packages/components/containers/offers/components/OfferModal.tsx index 954b144530..fe26a81c6b 100644 --- a/packages/components/containers/offers/components/OfferModal.tsx +++ b/packages/components/containers/offers/components/OfferModal.tsx @@ -1,9 +1,10 @@ +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; import type { Currency } from '@proton/shared/lib/interfaces'; import clsx from '@proton/utils/clsx'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components/modalTwo'; -import { ModalTwo, ModalTwoContent } from '../../../components/modalTwo'; import useOnSelectDeal from '../hooks/useOnSelectDeal'; import useVisitedOffer from '../hooks/useVisitedOffer'; import type { Offer, OfferConfig, OfferProps } from '../interface'; diff --git a/packages/components/containers/offers/hooks/useOfferModal.ts b/packages/components/containers/offers/hooks/useOfferModal.ts index 6ba038b5a1..2a29cead61 100644 --- a/packages/components/containers/offers/hooks/useOfferModal.ts +++ b/packages/components/containers/offers/hooks/useOfferModal.ts @@ -1,6 +1,6 @@ import { useState } from 'react'; -import { useModalState } from '@proton/components/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useAutomaticCurrency } from '@proton/components/payments/client-extensions'; import type { Currency } from '@proton/shared/lib/interfaces'; diff --git a/packages/components/containers/onboarding/OnboardingModal.tsx b/packages/components/containers/onboarding/OnboardingModal.tsx index 920b8465a1..96cc03d22d 100644 --- a/packages/components/containers/onboarding/OnboardingModal.tsx +++ b/packages/components/containers/onboarding/OnboardingModal.tsx @@ -4,6 +4,9 @@ import { isValidElement, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalSize } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; import StepDot from '@proton/components/components/stepDot/StepDot'; import StepDots from '@proton/components/components/stepDots/StepDots'; import { updateFlags, updateWelcomeFlags } from '@proton/shared/lib/api/settings'; @@ -14,8 +17,6 @@ import isTruthy from '@proton/utils/isTruthy'; import noop from '@proton/utils/noop'; import range from '@proton/utils/range'; -import type { ModalSize } from '../../components'; -import { ModalTwoContent as ModalContent, ModalTwo } from '../../components'; import { useApi, useConfig, @@ -200,7 +201,7 @@ const OnboardingModal = ({ return ( - + {childStep} {hasDots ? (

@@ -218,7 +219,7 @@ const OnboardingModal = ({
) : null} - + ); }; diff --git a/packages/components/containers/organization/ActivatePasswordlessOrganizationKey.tsx b/packages/components/containers/organization/ActivatePasswordlessOrganizationKey.tsx index f67abe3872..78f6e5a98f 100644 --- a/packages/components/containers/organization/ActivatePasswordlessOrganizationKey.tsx +++ b/packages/components/containers/organization/ActivatePasswordlessOrganizationKey.tsx @@ -7,6 +7,11 @@ import type { AcceptOrganizationKeyInvitePayload } from '@proton/account'; import { acceptOrganizationKeyInvite, prepareAcceptOrganizationKeyInvite } from '@proton/account'; import { Button, Card, CircleLoader } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; import { useLoading } from '@proton/hooks'; import { useDispatch } from '@proton/redux-shared-store'; @@ -14,8 +19,6 @@ import { getSilentApi } from '@proton/shared/lib/api/helpers/customConfig'; import { BRAND_NAME } from '@proton/shared/lib/constants'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useApi, useErrorHandler, useNotifications, useOrganization, useOrganizationKey } from '../../hooks'; import useVerifyOutboundPublicKeys from '../keyTransparency/useVerifyOutboundPublicKeys'; diff --git a/packages/components/containers/organization/ChangeOrganizationKeysModal.tsx b/packages/components/containers/organization/ChangeOrganizationKeysModal.tsx index 3af8736687..2fe2da10a1 100644 --- a/packages/components/containers/organization/ChangeOrganizationKeysModal.tsx +++ b/packages/components/containers/organization/ChangeOrganizationKeysModal.tsx @@ -6,23 +6,19 @@ import { rotateOrganizationKeys } from '@proton/account'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useLoading } from '@proton/hooks'; import { useDispatch } from '@proton/redux-shared-store'; import { confirmPasswordValidator, passwordLengthValidator } from '@proton/shared/lib/helpers/formValidators'; import type { CachedOrganizationKey } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, - useModalState, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { useErrorHandler, useEventManager, useNotifications } from '../../hooks'; import AuthModal from '../password/AuthModal'; diff --git a/packages/components/containers/organization/ChangeOrganizationKeysPasswordlessModal.tsx b/packages/components/containers/organization/ChangeOrganizationKeysPasswordlessModal.tsx index 13fb666ccc..034853c777 100644 --- a/packages/components/containers/organization/ChangeOrganizationKeysPasswordlessModal.tsx +++ b/packages/components/containers/organization/ChangeOrganizationKeysPasswordlessModal.tsx @@ -5,12 +5,16 @@ import { c } from 'ttag'; import type { OrganizationKeyRotationPayload } from '@proton/account'; import { getKeyRotationPayload, rotatePasswordlessOrganizationKeys } from '@proton/account'; import { Button, CircleLoader } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useLoading } from '@proton/hooks'; import { useDispatch } from '@proton/redux-shared-store'; import { getSilentApi } from '@proton/shared/lib/api/helpers/customConfig'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, useModalState } from '../../components'; import { useApi, useErrorHandler, useEventManager, useNotifications } from '../../hooks'; import useVerifyOutboundPublicKeys from '../keyTransparency/useVerifyOutboundPublicKeys'; import AuthModal from '../password/AuthModal'; diff --git a/packages/components/containers/organization/ChangeOrganizationPasswordModal.tsx b/packages/components/containers/organization/ChangeOrganizationPasswordModal.tsx index 9a8d658e78..6108ca626c 100644 --- a/packages/components/containers/organization/ChangeOrganizationPasswordModal.tsx +++ b/packages/components/containers/organization/ChangeOrganizationPasswordModal.tsx @@ -5,6 +5,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { PrivateKeyReference } from '@proton/crypto'; import { useLoading } from '@proton/hooks'; import { updateBackupKey } from '@proton/shared/lib/api/organization'; @@ -12,17 +18,7 @@ import { confirmPasswordValidator, passwordLengthValidator } from '@proton/share import { getBackupKeyData } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, - useModalState, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { useEventManager, useNotifications } from '../../hooks'; import AuthModal from '../password/AuthModal'; diff --git a/packages/components/containers/organization/EditOrganizationIdentityModal.tsx b/packages/components/containers/organization/EditOrganizationIdentityModal.tsx index d093b8da71..a21c30c8e4 100644 --- a/packages/components/containers/organization/EditOrganizationIdentityModal.tsx +++ b/packages/components/containers/organization/EditOrganizationIdentityModal.tsx @@ -6,16 +6,12 @@ import { c } from 'ttag'; import { changeOrganizationSignature } from '@proton/account'; import { getIsEligibleOrganizationIdentityAddress } from '@proton/account/organizationKey/actions'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '@proton/components'; -import SettingsLink from '@proton/components/components/link/SettingsLink'; +import { InputFieldTwo, SettingsLink, useFormErrors } from '@proton/components/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { useAddresses, useErrorHandler, useNotifications } from '@proton/components/hooks'; diff --git a/packages/components/containers/organization/InviteOrganizationKeysModal.tsx b/packages/components/containers/organization/InviteOrganizationKeysModal.tsx index 3daf2c9647..2c8ac0ddfd 100644 --- a/packages/components/containers/organization/InviteOrganizationKeysModal.tsx +++ b/packages/components/containers/organization/InviteOrganizationKeysModal.tsx @@ -6,14 +6,17 @@ import type { MemberKeyPayload } from '@proton/account'; import { getMemberKeyPayloads, setAdminRoles } from '@proton/account'; import { Button, CircleLoader } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { useDispatch } from '@proton/redux-shared-store'; import { getSilentApi } from '@proton/shared/lib/api/helpers/customConfig'; import type { EnhancedMember } from '@proton/shared/lib/interfaces'; import { getMemberEmailOrName } from '@proton/shared/lib/keys/memberHelper'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useApi, useErrorHandler, useEventManager, useNotifications } from '../../hooks'; import useVerifyOutboundPublicKeys from '../keyTransparency/useVerifyOutboundPublicKeys'; import AdministratorList, { AdministratorItem } from './AdministratorList'; diff --git a/packages/components/containers/organization/OrganizationNameModal.tsx b/packages/components/containers/organization/OrganizationNameModal.tsx index acbf91fab6..88d7cd400c 100644 --- a/packages/components/containers/organization/OrganizationNameModal.tsx +++ b/packages/components/containers/organization/OrganizationNameModal.tsx @@ -4,6 +4,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { updateOrganizationName } from '@proton/shared/lib/api/organization'; import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; @@ -11,15 +16,7 @@ import type { Organization } from '@proton/shared/lib/interfaces'; import { getOrganizationDenomination } from '@proton/shared/lib/organization/helper'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; import { useApi, useEventManager, useNotifications } from '../../hooks'; interface Props extends ModalProps { diff --git a/packages/components/containers/organization/OrganizationSection.tsx b/packages/components/containers/organization/OrganizationSection.tsx index 0b655239ce..c55a15f319 100644 --- a/packages/components/containers/organization/OrganizationSection.tsx +++ b/packages/components/containers/organization/OrganizationSection.tsx @@ -6,6 +6,7 @@ import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; import SettingsLink from '@proton/components/components/link/SettingsLink'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Tooltip from '@proton/components/components/tooltip/Tooltip'; import useKTActivation from '@proton/components/containers/keyTransparency/useKTActivation'; import useLoading from '@proton/hooks/useLoading'; @@ -22,7 +23,7 @@ import { handleSetupAddressKeys } from '@proton/shared/lib/keys'; import { getOrganizationDenomination } from '@proton/shared/lib/organization/helper'; import type { Credentials } from '@proton/shared/lib/srp'; -import { ButtonGroup, Label, useModalState } from '../../components'; +import { ButtonGroup, Label } from '../../components'; import Row from '../../components/container/Row'; import { useApi, diff --git a/packages/components/containers/organization/OrganizationTwoFARemindersSection.tsx b/packages/components/containers/organization/OrganizationTwoFARemindersSection.tsx index 97333f1404..bbf6717613 100644 --- a/packages/components/containers/organization/OrganizationTwoFARemindersSection.tsx +++ b/packages/components/containers/organization/OrganizationTwoFARemindersSection.tsx @@ -2,9 +2,10 @@ import { c } from 'ttag'; import { useMemberAddresses } from '@proton/account'; import { Button } from '@proton/atoms'; -import { useConfig, useMembers, useModalState } from '@proton/components'; +import { useConfig, useMembers } from '@proton/components'; import Info from '@proton/components/components/link/Info'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { APPS } from '@proton/shared/lib/constants'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { Organization } from '@proton/shared/lib/interfaces'; diff --git a/packages/components/containers/organization/ReactivateOrganizationKeysModal.tsx b/packages/components/containers/organization/ReactivateOrganizationKeysModal.tsx index 6d7ea27fbb..caee0ef49a 100644 --- a/packages/components/containers/organization/ReactivateOrganizationKeysModal.tsx +++ b/packages/components/containers/organization/ReactivateOrganizationKeysModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { PrivateKeyReference } from '@proton/crypto'; import { CryptoProxy } from '@proton/crypto'; import { useLoading } from '@proton/hooks'; @@ -15,16 +20,7 @@ import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import { decryptPrivateKeyWithSalt } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - PasswordInputTwo, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, PasswordInputTwo, useFormErrors } from '../../components'; import { useApi, useAuthentication, useEventManager, useGetOrganizationKey, useNotifications } from '../../hooks'; interface Props extends ModalProps { diff --git a/packages/components/containers/organization/ReactivatePasswordlessOrganizationKey.tsx b/packages/components/containers/organization/ReactivatePasswordlessOrganizationKey.tsx index 1d7261d568..5b077f2aa8 100644 --- a/packages/components/containers/organization/ReactivatePasswordlessOrganizationKey.tsx +++ b/packages/components/containers/organization/ReactivatePasswordlessOrganizationKey.tsx @@ -2,11 +2,14 @@ import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { Member, UserModel } from '@proton/shared/lib/interfaces'; import { getMemberEmailOrName } from '@proton/shared/lib/keys/memberHelper'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import AdministratorList from './AdministratorList'; interface Props extends Omit { diff --git a/packages/components/containers/organization/SendEmailReminderTwoFAModal.tsx b/packages/components/containers/organization/SendEmailReminderTwoFAModal.tsx index d0d3bf844d..6afa44277c 100644 --- a/packages/components/containers/organization/SendEmailReminderTwoFAModal.tsx +++ b/packages/components/containers/organization/SendEmailReminderTwoFAModal.tsx @@ -3,6 +3,11 @@ import { c } from 'ttag'; import { Avatar, Button } from '@proton/atoms'; import Badge from '@proton/components/components/badge/Badge'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { sendEmailReminderTwoFA } from '@proton/shared/lib/api/organization'; import { MEMBER_ROLE } from '@proton/shared/lib/constants'; @@ -10,14 +15,7 @@ import { getInitials } from '@proton/shared/lib/helpers/string'; import type { Address, Member, PartialMemberAddress } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { useFormErrors } from '../../components'; import { useApi, useEventManager, useNotifications } from '../../hooks'; interface Props extends ModalProps { diff --git a/packages/components/containers/organization/SetupOrganizationModal.tsx b/packages/components/containers/organization/SetupOrganizationModal.tsx index 3d16c4d71d..0f22ce84af 100644 --- a/packages/components/containers/organization/SetupOrganizationModal.tsx +++ b/packages/components/containers/organization/SetupOrganizationModal.tsx @@ -6,6 +6,11 @@ import type { OrganizationKeyRotationPayload } from '@proton/account'; import { MAX_CHARS_API, createPasswordlessOrganizationKeys, getKeyRotationPayload } from '@proton/account'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { useDispatch } from '@proton/redux-shared-store'; import { getSilentApi } from '@proton/shared/lib/api/helpers/customConfig'; @@ -20,16 +25,7 @@ import { getOrganizationDenomination } from '@proton/shared/lib/organization/hel import clamp from '@proton/utils/clamp'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, - useSettingsLink, -} from '../../components'; +import { InputFieldTwo, useFormErrors, useSettingsLink } from '../../components'; import { useApi, useErrorHandler, diff --git a/packages/components/containers/organization/groups/AddSubdomainModal.tsx b/packages/components/containers/organization/groups/AddSubdomainModal.tsx index 6592aa8da1..278a3e10ce 100644 --- a/packages/components/containers/organization/groups/AddSubdomainModal.tsx +++ b/packages/components/containers/organization/groups/AddSubdomainModal.tsx @@ -4,18 +4,13 @@ import { c } from 'ttag'; import { addSubdomain } from '@proton/account/groups/actions'; import { Button, Href } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useApi, - useEventManager, - useFormErrors, -} from '@proton/components'; +import { InputFieldTwo, useApi, useEventManager, useFormErrors } from '@proton/components'; import { InputFieldStacked } from '@proton/components/components/inputFieldStacked'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { BRAND_NAME } from '@proton/shared/lib/constants'; import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; diff --git a/packages/components/containers/organization/groups/DiscardGroupChangesPrompt.tsx b/packages/components/containers/organization/groups/DiscardGroupChangesPrompt.tsx index 211f0407f1..914d6706c8 100644 --- a/packages/components/containers/organization/groups/DiscardGroupChangesPrompt.tsx +++ b/packages/components/containers/organization/groups/DiscardGroupChangesPrompt.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalStateProps } from '@proton/components'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; interface Props { diff --git a/packages/components/containers/organization/groups/EditGroup.tsx b/packages/components/containers/organization/groups/EditGroup.tsx index e1eb8ba3e3..d1aa1bccdc 100644 --- a/packages/components/containers/organization/groups/EditGroup.tsx +++ b/packages/components/containers/organization/groups/EditGroup.tsx @@ -4,9 +4,10 @@ import { Form, FormikProvider } from 'formik'; import { c } from 'ttag'; import { Button, CircleLoader, Panel, PanelHeader } from '@proton/atoms'; -import { InputFieldTwo, TextAreaTwo, useModalState } from '@proton/components/components'; +import { InputFieldTwo, TextAreaTwo } from '@proton/components/components'; import { InputFieldStacked } from '@proton/components/components/inputFieldStacked'; import InputFieldStackedGroup from '@proton/components/components/inputFieldStacked/InputFieldStackedGroup'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { useNotifications } from '@proton/components/hooks'; diff --git a/packages/components/containers/organization/groups/GroupAddressDomainSelect.tsx b/packages/components/containers/organization/groups/GroupAddressDomainSelect.tsx index b1e1a9dde0..ea08683ca3 100644 --- a/packages/components/containers/organization/groups/GroupAddressDomainSelect.tsx +++ b/packages/components/containers/organization/groups/GroupAddressDomainSelect.tsx @@ -1,12 +1,13 @@ import { useCallback } from 'react'; -import { useModalState, usePopperAnchor } from '@proton/components'; +import { usePopperAnchor } from '@proton/components'; import Dropdown from '@proton/components/components/dropdown/Dropdown'; import DropdownButton from '@proton/components/components/dropdown/DropdownButton'; import DropdownMenu from '@proton/components/components/dropdown/DropdownMenu'; import DropdownMenuButton from '@proton/components/components/dropdown/DropdownMenuButton'; import { DropdownSizeUnit } from '@proton/components/components/dropdown/utils'; import Icon from '@proton/components/components/icon/Icon'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { Domain } from '@proton/shared/lib/interfaces'; import AddSubdomainModal from './AddSubdomainModal'; diff --git a/packages/components/containers/organization/groups/GroupItemActionPrompt.tsx b/packages/components/containers/organization/groups/GroupItemActionPrompt.tsx index f45858ccfd..ebddd2e372 100644 --- a/packages/components/containers/organization/groups/GroupItemActionPrompt.tsx +++ b/packages/components/containers/organization/groups/GroupItemActionPrompt.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalStateProps } from '@proton/components'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import useLoading from '@proton/hooks/useLoading'; diff --git a/packages/components/containers/organization/groups/GroupItemMoreOptionsDropdown.tsx b/packages/components/containers/organization/groups/GroupItemMoreOptionsDropdown.tsx index 2e0ea95d2e..ecf94ba9e1 100644 --- a/packages/components/containers/organization/groups/GroupItemMoreOptionsDropdown.tsx +++ b/packages/components/containers/organization/groups/GroupItemMoreOptionsDropdown.tsx @@ -1,11 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { useModalStateObject, usePopperAnchor } from '@proton/components/components'; +import { usePopperAnchor } from '@proton/components/components'; import Dropdown from '@proton/components/components/dropdown/Dropdown'; import DropdownMenu from '@proton/components/components/dropdown/DropdownMenu'; import DropdownMenuButton from '@proton/components/components/dropdown/DropdownMenuButton'; import Icon from '@proton/components/components/icon/Icon'; +import { useModalStateObject } from '@proton/components/components/modalTwo/useModalState'; import GroupItemActionPrompt from './GroupItemActionPrompt'; diff --git a/packages/components/containers/organization/logoUpload/LightLabellingFeatureModal.tsx b/packages/components/containers/organization/logoUpload/LightLabellingFeatureModal.tsx index f2125d70d4..f6ecb4ec11 100644 --- a/packages/components/containers/organization/logoUpload/LightLabellingFeatureModal.tsx +++ b/packages/components/containers/organization/logoUpload/LightLabellingFeatureModal.tsx @@ -2,12 +2,13 @@ import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; import { FeatureCode, useFeature } from '@proton/features'; import illustration from '@proton/styles/assets/img/illustrations/light-labelling-feature-modal.svg'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter } from '../../../components'; - interface Props extends ModalProps {} const LightLabellingFeatureModal = ({ open, ...rest }: Props) => { diff --git a/packages/components/containers/organization/logoUpload/OrganizationLogoModal.tsx b/packages/components/containers/organization/logoUpload/OrganizationLogoModal.tsx index d6c6029aad..63303b8b46 100644 --- a/packages/components/containers/organization/logoUpload/OrganizationLogoModal.tsx +++ b/packages/components/containers/organization/logoUpload/OrganizationLogoModal.tsx @@ -8,6 +8,11 @@ import Dropzone from '@proton/components/components/dropzone/Dropzone'; import Form from '@proton/components/components/form/Form'; import Icon from '@proton/components/components/icon/Icon'; import FileInput from '@proton/components/components/input/FileInput'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import metrics, { observeApiError } from '@proton/metrics'; import { updateOrganizationLogo, updateOrganizationSettings } from '@proton/shared/lib/api/organization'; @@ -20,14 +25,7 @@ import type { Organization } from '@proton/shared/lib/interfaces'; import clsx from '@proton/utils/clsx'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../../components'; +import { useFormErrors } from '../../../components'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import SidebarPreview from './SidebarPreview'; import useOrgLogoUploadTelemetry from './useOrgLogoUploadTelemetry'; diff --git a/packages/components/containers/organization/logoUpload/OrganizationLogoRemovalModal.tsx b/packages/components/containers/organization/logoUpload/OrganizationLogoRemovalModal.tsx index 04df707f4e..8d912d09ac 100644 --- a/packages/components/containers/organization/logoUpload/OrganizationLogoRemovalModal.tsx +++ b/packages/components/containers/organization/logoUpload/OrganizationLogoRemovalModal.tsx @@ -1,15 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - Form, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '@proton/components'; +import { Form, useFormErrors } from '@proton/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useApi, useEventManager, useNotifications } from '@proton/components/hooks'; import { useLoading } from '@proton/hooks'; import metrics, { observeApiError } from '@proton/metrics'; diff --git a/packages/components/containers/organization/logoUpload/OrganizationLogoTipsModal.tsx b/packages/components/containers/organization/logoUpload/OrganizationLogoTipsModal.tsx index 451a6a3243..447cf7e85f 100644 --- a/packages/components/containers/organization/logoUpload/OrganizationLogoTipsModal.tsx +++ b/packages/components/containers/organization/logoUpload/OrganizationLogoTipsModal.tsx @@ -1,13 +1,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '@proton/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import OrganizationLogoTips from './OrganizationLogoTips'; diff --git a/packages/components/containers/organization/sso/ConfigureSamlModal.tsx b/packages/components/containers/organization/sso/ConfigureSamlModal.tsx index ff691f6a51..92bbf3a51a 100644 --- a/packages/components/containers/organization/sso/ConfigureSamlModal.tsx +++ b/packages/components/containers/organization/sso/ConfigureSamlModal.tsx @@ -7,6 +7,11 @@ import { Button, Href } from '@proton/atoms'; import Dropzone from '@proton/components/components/dropzone/Dropzone'; import Form from '@proton/components/components/form/Form'; import RadioGroup from '@proton/components/components/input/RadioGroup'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import TextArea from '@proton/components/components/v2/input/TextArea'; import { useApi, useEventManager, useNotifications } from '@proton/components/hooks'; import useLoading from '@proton/hooks/useLoading'; @@ -17,15 +22,7 @@ import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; import type { Domain } from '@proton/shared/lib/interfaces'; import dragAndDrop from '@proton/styles/assets/img/illustrations/drag-and-drop-img.svg'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, useFormErrors } from '../../../components'; import type { IdentityProviderEndpointsContentProps } from './IdentityProviderEndpointsContent'; import IdentityProviderEndpointsContent from './IdentityProviderEndpointsContent'; import UploadedXmlFile from './UploadedXmlFile'; diff --git a/packages/components/containers/organization/sso/DomainVerificationState.tsx b/packages/components/containers/organization/sso/DomainVerificationState.tsx index 84a29db010..4047c21f60 100644 --- a/packages/components/containers/organization/sso/DomainVerificationState.tsx +++ b/packages/components/containers/organization/sso/DomainVerificationState.tsx @@ -1,8 +1,8 @@ import { c } from 'ttag'; import { InlineLinkButton } from '@proton/atoms'; -import { useModalState } from '@proton/components/components'; import Icon, { type IconName } from '@proton/components/components/icon/Icon'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { Domain } from '@proton/shared/lib/interfaces'; import { DOMAIN_STATE } from '@proton/shared/lib/interfaces'; import clsx from '@proton/utils/clsx'; diff --git a/packages/components/containers/organization/sso/RemoveSSOModal.tsx b/packages/components/containers/organization/sso/RemoveSSOModal.tsx index 2f75cf1185..e3415306fe 100644 --- a/packages/components/containers/organization/sso/RemoveSSOModal.tsx +++ b/packages/components/containers/organization/sso/RemoveSSOModal.tsx @@ -1,16 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useApi, - useEventManager, - useNotifications, -} from '@proton/components'; +import { useApi, useEventManager, useNotifications } from '@proton/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import { removeSAMLConfig } from '@proton/shared/lib/api/samlSSO'; import type { SSO } from '@proton/shared/lib/interfaces'; diff --git a/packages/components/containers/organization/sso/RemoveSSOSection.tsx b/packages/components/containers/organization/sso/RemoveSSOSection.tsx index 6b0d45fdf9..4c998bf2e0 100644 --- a/packages/components/containers/organization/sso/RemoveSSOSection.tsx +++ b/packages/components/containers/organization/sso/RemoveSSOSection.tsx @@ -1,9 +1,9 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { Domain, SSO } from '@proton/shared/lib/interfaces'; -import { useModalState } from '../../../components'; import { SettingsParagraph, SettingsSection } from '../../account'; import RemoveSSOModal from './RemoveSSOModal'; diff --git a/packages/components/containers/organization/sso/SetupSSODomainModal.tsx b/packages/components/containers/organization/sso/SetupSSODomainModal.tsx index 7db0c51549..de2ae304f5 100644 --- a/packages/components/containers/organization/sso/SetupSSODomainModal.tsx +++ b/packages/components/containers/organization/sso/SetupSSODomainModal.tsx @@ -6,6 +6,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import metrics, { observeApiError } from '@proton/metrics'; import { addDomain, getDomain } from '@proton/shared/lib/api/domains'; @@ -15,15 +20,7 @@ import type { Domain } from '@proton/shared/lib/interfaces'; import { VERIFY_STATE } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, useFormErrors } from '../../../components'; import { useApi, useEventManager } from '../../../hooks'; import TXTSection from './TXTSection'; diff --git a/packages/components/containers/organization/sso/SsoPage.tsx b/packages/components/containers/organization/sso/SsoPage.tsx index 7a7df362e5..ba0fb44588 100644 --- a/packages/components/containers/organization/sso/SsoPage.tsx +++ b/packages/components/containers/organization/sso/SsoPage.tsx @@ -3,14 +3,15 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Info from '@proton/components/components/link/Info'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { PromotionBanner } from '@proton/components/containers/banner/PromotionBanner'; import TestSamlModal from '@proton/components/containers/organization/sso/TestSamlModal'; import { PLANS } from '@proton/shared/lib/constants'; import type { Domain, SSO } from '@proton/shared/lib/interfaces'; import securityUpsellSvg from '@proton/styles/assets/img/illustrations/security-upsell.svg'; -import type { ModalStateProps } from '../../../components'; -import { InputFieldTwo, useModalState } from '../../../components'; +import { InputFieldTwo } from '../../../components'; import { useCustomDomains, useOrganization, useSamlSSO, useUser } from '../../../hooks'; import { SettingsLayout, diff --git a/packages/components/containers/organization/sso/TXTRecordModal.tsx b/packages/components/containers/organization/sso/TXTRecordModal.tsx index 6abd681c13..0492720841 100644 --- a/packages/components/containers/organization/sso/TXTRecordModal.tsx +++ b/packages/components/containers/organization/sso/TXTRecordModal.tsx @@ -1,19 +1,17 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import { getDomain } from '@proton/shared/lib/api/domains'; import type { Domain } from '@proton/shared/lib/interfaces'; import { VERIFY_STATE } from '@proton/shared/lib/interfaces'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import { verifyDomain } from '../../domains/DomainModal'; import TXTSection from './TXTSection'; diff --git a/packages/components/containers/organization/sso/TestSamlModal.tsx b/packages/components/containers/organization/sso/TestSamlModal.tsx index c4ebf49653..771e6184fd 100644 --- a/packages/components/containers/organization/sso/TestSamlModal.tsx +++ b/packages/components/containers/organization/sso/TestSamlModal.tsx @@ -3,13 +3,11 @@ import { useEffect, useRef, useState } from 'react'; import { c } from 'ttag'; import { Button, CircleLoader } from '@proton/atoms'; -import { - type ModalProps, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, -} from '@proton/components/components/modalTwo'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { InputFieldTwo } from '@proton/components/components/v2'; import useFormErrors from '@proton/components/components/v2/useFormErrors'; import { ExternalSSOError, handleExternalSSOLogin } from '@proton/components/containers/login/loginActions'; diff --git a/packages/components/containers/organization/sso/scim/DisableSCIMModal.tsx b/packages/components/containers/organization/sso/scim/DisableSCIMModal.tsx index adb905c25c..09c663cbb3 100644 --- a/packages/components/containers/organization/sso/scim/DisableSCIMModal.tsx +++ b/packages/components/containers/organization/sso/scim/DisableSCIMModal.tsx @@ -1,12 +1,15 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import useLoading from '@proton/hooks/useLoading'; import { BRAND_NAME } from '@proton/shared/lib/constants'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../../../components'; import getBoldFormattedText from '../../../../helpers/getBoldFormattedText'; interface Props extends Omit { diff --git a/packages/components/containers/organization/sso/scim/SCIMSettingsSection.tsx b/packages/components/containers/organization/sso/scim/SCIMSettingsSection.tsx index 9dff871110..1f82786312 100644 --- a/packages/components/containers/organization/sso/scim/SCIMSettingsSection.tsx +++ b/packages/components/containers/organization/sso/scim/SCIMSettingsSection.tsx @@ -9,6 +9,7 @@ import { disableSCIMAction, setupSCIMAction } from '@proton/account/samlSSO/acti import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useLoading from '@proton/hooks/useLoading'; import { baseUseDispatch } from '@proton/react-redux-store'; import type { ProtonThunkArguments } from '@proton/redux-shared-store-types'; @@ -16,7 +17,6 @@ import { VPN_APP_NAME } from '@proton/shared/lib/constants'; import type { Domain } from '@proton/shared/lib/interfaces'; import { DOMAIN_STATE } from '@proton/shared/lib/interfaces'; -import { useModalState } from '../../../../components'; import getBoldFormattedText from '../../../../helpers/getBoldFormattedText'; import { useApi, useNotifications } from '../../../../hooks'; import { diff --git a/packages/components/containers/organization/sso/scim/SetupSCIMModal.tsx b/packages/components/containers/organization/sso/scim/SetupSCIMModal.tsx index 50859ab6e2..ae47b2f7f8 100644 --- a/packages/components/containers/organization/sso/scim/SetupSCIMModal.tsx +++ b/packages/components/containers/organization/sso/scim/SetupSCIMModal.tsx @@ -2,15 +2,13 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { VPN_APP_NAME } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../../components'; import ReadonlyFieldWithCopy from '../ReadonlyFieldWithCopy'; export interface SCIMConfiguration { diff --git a/packages/components/containers/organization/useOrganizationModals.tsx b/packages/components/containers/organization/useOrganizationModals.tsx index 5e1bfd34dc..9628d41d2b 100644 --- a/packages/components/containers/organization/useOrganizationModals.tsx +++ b/packages/components/containers/organization/useOrganizationModals.tsx @@ -5,6 +5,7 @@ import { c, msgid } from 'ttag'; import { getPrivatizeError } from '@proton/account/organizationKey/actions'; import { Button, Card, Href } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { MEMBER_ROLE } from '@proton/shared/lib/constants'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import type { Member } from '@proton/shared/lib/interfaces'; @@ -18,7 +19,6 @@ import { getOrganizationKeyInfo, } from '@proton/shared/lib/organization/helper'; -import { useModalState } from '../../components'; import { useAddresses, useMembers, useNotifications, useOrganization, useOrganizationKey, useUser } from '../../hooks'; import ActivatePasswordlessOrganizationKey from './ActivatePasswordlessOrganizationKey'; import AdministratorList from './AdministratorList'; diff --git a/packages/components/containers/password/AuthModal.tsx b/packages/components/containers/password/AuthModal.tsx index 2730724f98..c436928bf4 100644 --- a/packages/components/containers/password/AuthModal.tsx +++ b/packages/components/containers/password/AuthModal.tsx @@ -5,18 +5,13 @@ import { flushSync } from 'react-dom'; import { c } from 'ttag'; import { Button, InlineLinkButton } from '@proton/atoms'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - type ModalProps, - PasswordInputTwo, - Tabs, - useFormErrors, -} from '@proton/components/components'; +import { InputFieldTwo, PasswordInputTwo, Tabs, useFormErrors } from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { useLoading } from '@proton/hooks'; import { PASSWORD_WRONG_ERROR, getInfo } from '@proton/shared/lib/api/auth'; import { getApiError } from '@proton/shared/lib/api/helpers/apiErrorHelper'; diff --git a/packages/components/containers/payments/CreditsModal.tsx b/packages/components/containers/payments/CreditsModal.tsx index 6dc3065315..922b775daa 100644 --- a/packages/components/containers/payments/CreditsModal.tsx +++ b/packages/components/containers/payments/CreditsModal.tsx @@ -7,6 +7,11 @@ import PrimaryButton from '@proton/components/components/button/PrimaryButton'; import Form from '@proton/components/components/form/Form'; import useDebounceInput from '@proton/components/components/input/useDebounceInput'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Price from '@proton/components/components/price/Price'; import { useAutomaticCurrency, usePaymentFacade } from '@proton/components/payments/client-extensions'; import { useChargebeeContext } from '@proton/components/payments/client-extensions/useChargebeeContext'; @@ -31,8 +36,6 @@ import { ChargebeeEnabled } from '@proton/shared/lib/interfaces'; import { getSentryError } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useConfig, useEventManager, useNotifications, useSubscription, useUser } from '../../hooks'; import { ChargebeePaypalWrapper } from '../../payments/chargebee/ChargebeeWrapper'; import AmountRow from './AmountRow'; diff --git a/packages/components/containers/payments/CreditsSection.tsx b/packages/components/containers/payments/CreditsSection.tsx index 105effaed7..54b661d02b 100644 --- a/packages/components/containers/payments/CreditsSection.tsx +++ b/packages/components/containers/payments/CreditsSection.tsx @@ -5,6 +5,8 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import Price from '@proton/components/components/price/Price'; import { isSplittedUser } from '@proton/payments'; import { getAppHref } from '@proton/shared/lib/apps/helper'; @@ -13,8 +15,6 @@ import { isElectronApp } from '@proton/shared/lib/helpers/desktop'; import { isManagedExternally } from '@proton/shared/lib/helpers/subscription'; import { BillingPlatform, ChargebeeEnabled } from '@proton/shared/lib/interfaces'; -import { useModalTwoStatic } from '../../components'; -import { useModalState } from '../../components/modalTwo'; import { usePaymentStatus, useSubscription, useUser } from '../../hooks'; import { SettingsParagraph, SettingsSection } from '../account'; import { openLinkInBrowser } from '../desktop/openExternalLink'; diff --git a/packages/components/containers/payments/DowngradeModal.tsx b/packages/components/containers/payments/DowngradeModal.tsx index dce4cc466f..14b187c2ee 100644 --- a/packages/components/containers/payments/DowngradeModal.tsx +++ b/packages/components/containers/payments/DowngradeModal.tsx @@ -2,11 +2,10 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { MAIL_APP_NAME, VPN_APP_NAME } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../components'; - export interface DowngradeModalProps extends ModalProps { hasMail: boolean; hasVpn: boolean; diff --git a/packages/components/containers/payments/EditCardModal.tsx b/packages/components/containers/payments/EditCardModal.tsx index 10c864b5c9..d01d399f9e 100644 --- a/packages/components/containers/payments/EditCardModal.tsx +++ b/packages/components/containers/payments/EditCardModal.tsx @@ -4,6 +4,11 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { usePaymentFacade } from '@proton/components/payments/client-extensions'; import { useChargebeeContext } from '@proton/components/payments/client-extensions/useChargebeeContext'; import { useLoading } from '@proton/hooks'; @@ -25,8 +30,6 @@ import { captureMessage } from '@proton/shared/lib/helpers/sentry'; import { getSentryError } from '@proton/shared/lib/keys'; import noop from '@proton/utils/noop'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import { useApi, useEventManager, useNotifications, useSubscription, useUser } from '../../hooks'; import { ChargebeeCreditCardWrapper } from '../../payments/chargebee/ChargebeeWrapper'; import CreditCard from './CreditCard'; diff --git a/packages/components/containers/payments/LossLoyaltyModal.tsx b/packages/components/containers/payments/LossLoyaltyModal.tsx index 5e61cb5270..a0929e7577 100644 --- a/packages/components/containers/payments/LossLoyaltyModal.tsx +++ b/packages/components/containers/payments/LossLoyaltyModal.tsx @@ -1,13 +1,12 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { BRAND_NAME, VPN_APP_NAME } from '@proton/shared/lib/constants'; import humanSize from '@proton/shared/lib/helpers/humanSize'; import type { Organization } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../components'; - interface Props extends ModalProps { organization: Organization; onConfirm: () => void; diff --git a/packages/components/containers/payments/MemberDowngradeModal.tsx b/packages/components/containers/payments/MemberDowngradeModal.tsx index de858cfeec..32ea664450 100644 --- a/packages/components/containers/payments/MemberDowngradeModal.tsx +++ b/packages/components/containers/payments/MemberDowngradeModal.tsx @@ -5,20 +5,17 @@ import { c } from 'ttag'; import { Button, Card } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import { BRAND_NAME } from '@proton/shared/lib/constants'; import { requiredValidator } from '@proton/shared/lib/helpers/formValidators'; import type { Organization } from '@proton/shared/lib/interfaces'; import { getOrganizationDenomination } from '@proton/shared/lib/organization/helper'; -import type { ModalProps } from '../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - useFormErrors, -} from '../../components'; +import { InputFieldTwo, useFormErrors } from '../../components'; interface Props extends ModalProps { organization: Organization; diff --git a/packages/components/containers/payments/PassLaunchOfferDowngradeModal.tsx b/packages/components/containers/payments/PassLaunchOfferDowngradeModal.tsx index e1a264cdcb..cfdf7c09de 100644 --- a/packages/components/containers/payments/PassLaunchOfferDowngradeModal.tsx +++ b/packages/components/containers/payments/PassLaunchOfferDowngradeModal.tsx @@ -1,13 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Price from '@proton/components/components/price/Price'; import Prompt from '@proton/components/components/prompt/Prompt'; import { PASS_APP_NAME, PLANS, PLAN_NAMES } from '@proton/shared/lib/constants'; import type { Subscription } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../components'; - interface Props extends ModalProps { subscription: Subscription; onConfirm: () => void; diff --git a/packages/components/containers/payments/PayPalModal.tsx b/packages/components/containers/payments/PayPalModal.tsx index 5c6aec1237..4f7eff5e9c 100644 --- a/packages/components/containers/payments/PayPalModal.tsx +++ b/packages/components/containers/payments/PayPalModal.tsx @@ -3,6 +3,7 @@ import { useEffect, useRef } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { ChargebeePaypalWrapper } from '@proton/components/payments/chargebee/ChargebeeWrapper'; import { ensureTokenChargeable, usePaymentFacade } from '@proton/components/payments/client-extensions'; @@ -12,7 +13,6 @@ import { PAYMENT_METHOD_TYPES } from '@proton/payments'; import { createTokenV4, setPaymentMethodV4 } from '@proton/shared/lib/api/payments'; import { BRAND_NAME } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../components'; import { useApi, useEventManager, useNotifications, useUser } from '../../hooks'; const PAYMENT_AUTHORIZATION_AMOUNT = 100; diff --git a/packages/components/containers/payments/RenewToggle.tsx b/packages/components/containers/payments/RenewToggle.tsx index 59ededad2c..be0dc8d8ca 100644 --- a/packages/components/containers/payments/RenewToggle.tsx +++ b/packages/components/containers/payments/RenewToggle.tsx @@ -5,12 +5,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import Toggle from '@proton/components/components/toggle/Toggle'; import { Autopay } from '@proton/payments'; import { getHasConsumerVpnPlan } from '@proton/shared/lib/helpers/subscription'; -import type { ModalProps } from '../../components/modalTwo'; import { useModalTwo } from '../../components/modalTwo/useModalTwo'; import { useSubscription } from '../../hooks'; diff --git a/packages/components/containers/payments/methods/PaymentMethodsSection.tsx b/packages/components/containers/payments/methods/PaymentMethodsSection.tsx index ebd13bf058..096f73f26b 100644 --- a/packages/components/containers/payments/methods/PaymentMethodsSection.tsx +++ b/packages/components/containers/payments/methods/PaymentMethodsSection.tsx @@ -4,6 +4,7 @@ import type { ButtonProps } from '@proton/atoms'; import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useChargebeeEnabledCache } from '@proton/components/payments/client-extensions/useChargebeeContext'; import { usePollEvents } from '@proton/components/payments/client-extensions/usePollEvents'; import useLoading from '@proton/hooks/useLoading'; @@ -12,7 +13,6 @@ import { APPS, EVENT_ACTIONS } from '@proton/shared/lib/constants'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import { ChargebeeEnabled } from '@proton/shared/lib/interfaces'; -import { useModalState } from '../../../components'; import { useConfig, useMozillaCheck, usePaymentMethods, useSubscription, useUser } from '../../../hooks'; import { SettingsParagraph, SettingsSection } from '../../account'; import MozillaInfoPanel from '../../account/MozillaInfoPanel'; diff --git a/packages/components/containers/payments/subscription/AutomaticSubscriptionModal.tsx b/packages/components/containers/payments/subscription/AutomaticSubscriptionModal.tsx index ea585ecd68..53e37f3f2e 100644 --- a/packages/components/containers/payments/subscription/AutomaticSubscriptionModal.tsx +++ b/packages/components/containers/payments/subscription/AutomaticSubscriptionModal.tsx @@ -9,13 +9,13 @@ import { useConfig, useLastSubscriptionEnd, useLoad, - useModalState, usePaymentStatus, usePlans, useSubscription, useSubscriptionModal, useUser, } from '@proton/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import { blackFriday2023DriveFreeConfig, diff --git a/packages/components/containers/payments/subscription/CalendarDowngradeModal.tsx b/packages/components/containers/payments/subscription/CalendarDowngradeModal.tsx index 4ce01dfc85..5af2f796e7 100644 --- a/packages/components/containers/payments/subscription/CalendarDowngradeModal.tsx +++ b/packages/components/containers/payments/subscription/CalendarDowngradeModal.tsx @@ -1,12 +1,12 @@ import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { MAX_CALENDARS_FREE } from '@proton/shared/lib/calendar/constants'; import { getCalendarsSettingsPath } from '@proton/shared/lib/calendar/settingsRoutes'; import { APPS, BRAND_NAME, CALENDAR_APP_NAME, MAIL_SHORT_APP_NAME } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../../components'; import { AppLink } from '../../../components'; const getText = (isDowngrade: boolean) => { diff --git a/packages/components/containers/payments/subscription/FeedbackDowngradeModal.tsx b/packages/components/containers/payments/subscription/FeedbackDowngradeModal.tsx index b0be5a0299..2459669ccc 100644 --- a/packages/components/containers/payments/subscription/FeedbackDowngradeModal.tsx +++ b/packages/components/containers/payments/subscription/FeedbackDowngradeModal.tsx @@ -5,6 +5,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { ModalTwoPromiseHandlers } from '@proton/components/components/modalTwo/useModalTwo'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; @@ -15,16 +20,7 @@ import type { UserModel } from '@proton/shared/lib/interfaces'; import isTruthy from '@proton/utils/isTruthy'; import shuffle from '@proton/utils/shuffle'; -import type { ModalProps } from '../../../components'; -import { - InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - TextAreaTwo, - useFormErrors, -} from '../../../components'; +import { InputFieldTwo, TextAreaTwo, useFormErrors } from '../../../components'; import { useConfig } from '../../../hooks'; import useCancellationTelemetry from './cancellationFlow/useCancellationTelemetry'; diff --git a/packages/components/containers/payments/subscription/HighlightPlanDowngradeModal.tsx b/packages/components/containers/payments/subscription/HighlightPlanDowngradeModal.tsx index 3393d4d391..6f9cbfa4a4 100644 --- a/packages/components/containers/payments/subscription/HighlightPlanDowngradeModal.tsx +++ b/packages/components/containers/payments/subscription/HighlightPlanDowngradeModal.tsx @@ -3,6 +3,11 @@ import { c, msgid } from 'ttag'; import { Button, Card } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import getBoldFormattedText from '@proton/components/helpers/getBoldFormattedText'; import type { ProductParam } from '@proton/shared/lib/apps/product'; import { BRAND_NAME, type FreeSubscription, PLANS } from '@proton/shared/lib/constants'; @@ -11,13 +16,6 @@ import humanSize from '@proton/shared/lib/helpers/humanSize'; import { type FreePlanDefault, type PlansMap, type Subscription, type UserModel } from '@proton/shared/lib/interfaces'; import { getSpace } from '@proton/shared/lib/user/storage'; -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; import type { ShortPlan } from '../features/interface'; import { getFreePassPlan, getFreePlan } from '../features/plan'; import SubscriptionCancelPlan from './SubscriptionCancelPlan'; diff --git a/packages/components/containers/payments/subscription/InAppPurchaseModal.tsx b/packages/components/containers/payments/subscription/InAppPurchaseModal.tsx index 8048c7e59c..f59d644130 100644 --- a/packages/components/containers/payments/subscription/InAppPurchaseModal.tsx +++ b/packages/components/containers/payments/subscription/InAppPurchaseModal.tsx @@ -3,8 +3,11 @@ import { useEffect } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { FreeSubscription } from '@proton/shared/lib/constants'; import { isFreeSubscription } from '@proton/shared/lib/constants'; import type { Subscription } from '@proton/shared/lib/interfaces'; diff --git a/packages/components/containers/payments/subscription/PendingInvitationModal.tsx b/packages/components/containers/payments/subscription/PendingInvitationModal.tsx index ac2d7e3955..15903d416a 100644 --- a/packages/components/containers/payments/subscription/PendingInvitationModal.tsx +++ b/packages/components/containers/payments/subscription/PendingInvitationModal.tsx @@ -1,14 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalStateProps } from '@proton/components/components'; -import { - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useSettingsLink, -} from '@proton/components/components'; +import { useSettingsLink } from '@proton/components/components'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import { useApi, useConfig, useEventManager, useGetOrganization, useNotifications } from '@proton/components/hooks'; import { useLoading } from '@proton/hooks'; import { CacheType } from '@proton/redux-utilities'; diff --git a/packages/components/containers/payments/subscription/PendingInvitationModalErrors.tsx b/packages/components/containers/payments/subscription/PendingInvitationModalErrors.tsx index 3265478281..5cc8feba99 100644 --- a/packages/components/containers/payments/subscription/PendingInvitationModalErrors.tsx +++ b/packages/components/containers/payments/subscription/PendingInvitationModalErrors.tsx @@ -2,8 +2,8 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import { BugModal, useUser } from '@proton/components'; -import { useModalState } from '@proton/components/components'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { APPS, BRAND_NAME } from '@proton/shared/lib/constants'; import humanSize from '@proton/shared/lib/helpers/humanSize'; import type { AcceptInvitationValidation, PendingInvitation } from '@proton/shared/lib/interfaces'; diff --git a/packages/components/containers/payments/subscription/SubscriptionModalProvider.tsx b/packages/components/containers/payments/subscription/SubscriptionModalProvider.tsx index c1222dd161..a174dc7940 100644 --- a/packages/components/containers/payments/subscription/SubscriptionModalProvider.tsx +++ b/packages/components/containers/payments/subscription/SubscriptionModalProvider.tsx @@ -1,6 +1,11 @@ import type { ReactNode } from 'react'; import { createContext, useContext, useRef } from 'react'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { BilledUserModal } from '@proton/components/payments/client-extensions/billed-user'; import type { APP_NAMES } from '@proton/shared/lib/constants'; import { invokeInboxDesktopIPC } from '@proton/shared/lib/desktop/ipcHelpers'; @@ -11,7 +16,6 @@ import { FREE_PLAN } from '@proton/shared/lib/subscription/freePlans'; import clsx from '@proton/utils/clsx'; import noop from '@proton/utils/noop'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, useModalState } from '../../../components'; import { useOrganization, usePaymentStatus, usePlans, useSubscription, useUser } from '../../../hooks'; import { useHasInboxDesktopInAppPayments } from '../../desktop/useHasInboxDesktopInAppPayments'; import { useRedirectToAccountApp } from '../../desktop/useRedirectToAccountApp'; diff --git a/packages/components/containers/payments/subscription/SubscriptionSubmitButton.tsx b/packages/components/containers/payments/subscription/SubscriptionSubmitButton.tsx index 7473ce14d9..edc46627a7 100644 --- a/packages/components/containers/payments/subscription/SubscriptionSubmitButton.tsx +++ b/packages/components/containers/payments/subscription/SubscriptionSubmitButton.tsx @@ -1,7 +1,8 @@ import { c } from 'ttag'; -import { useConfig, useModalState } from '@proton/components'; +import { useConfig } from '@proton/components'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Price from '@proton/components/components/price/Price'; import { isChargebeePaymentProcessor } from '@proton/components/payments/react-extensions/helpers'; import type { PaymentProcessorType } from '@proton/components/payments/react-extensions/interface'; diff --git a/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionModal.tsx b/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionModal.tsx index d9038145ac..9cd85edeff 100644 --- a/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionModal.tsx +++ b/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionModal.tsx @@ -3,14 +3,9 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; import { Form, InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, TextAreaTwo, useApi, useConfig, @@ -18,6 +13,11 @@ import { useFormErrors, useUser, } from '@proton/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import Prompt from '@proton/components/components/prompt/Prompt'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; diff --git a/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionSection.tsx b/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionSection.tsx index ddfe34632f..0007582e14 100644 --- a/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionSection.tsx +++ b/packages/components/containers/payments/subscription/cancelB2bSubscription/CancelB2bSubscriptionSection.tsx @@ -1,7 +1,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { useModalState } from '@proton/components/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { SettingsParagraph, SettingsSection } from '@proton/components/containers'; import { useSubscription } from '@proton/components/hooks'; diff --git a/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionLoadingModal.tsx b/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionLoadingModal.tsx index de7ab0b5fc..f4f0c93330 100644 --- a/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionLoadingModal.tsx +++ b/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionLoadingModal.tsx @@ -1,8 +1,9 @@ import { c } from 'ttag'; import { CircleLoader } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent } from '@proton/components/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; const CancelSubscriptionLoadingModal = (props: ModalProps) => { return ( diff --git a/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionModal.tsx b/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionModal.tsx index 2b3c7abd9f..060edd86aa 100644 --- a/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionModal.tsx +++ b/packages/components/containers/payments/subscription/cancelSubscription/CancelSubscriptionModal.tsx @@ -1,12 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import Time from '@proton/components/components/time/Time'; import { getPlanTitle } from '@proton/shared/lib/helpers/subscription'; import type { SubscriptionModel } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../../../components'; import type { ModalTwoPromiseHandlers } from '../../../../components/modalTwo/useModalTwo'; import type { CancelSubscriptionResult } from './types'; diff --git a/packages/components/containers/payments/subscription/cancelSubscription/useCancelSubscriptionFlow.tsx b/packages/components/containers/payments/subscription/cancelSubscription/useCancelSubscriptionFlow.tsx index 254b92505f..36b7fd86e7 100644 --- a/packages/components/containers/payments/subscription/cancelSubscription/useCancelSubscriptionFlow.tsx +++ b/packages/components/containers/payments/subscription/cancelSubscription/useCancelSubscriptionFlow.tsx @@ -1,6 +1,7 @@ import { c } from 'ttag'; -import { useModalState } from '@proton/components/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; +import { useModalTwoPromise } from '@proton/components/components/modalTwo/useModalTwo'; import { isSplittedUser, onSessionMigrationPaymentsVersion } from '@proton/payments'; import type { PaymentsVersion } from '@proton/shared/lib/api/payments'; import { changeRenewState, deleteSubscription } from '@proton/shared/lib/api/payments'; @@ -22,7 +23,6 @@ import { Renew } from '@proton/shared/lib/interfaces'; import { FREE_PLAN } from '@proton/shared/lib/subscription/freePlans'; import { hasPaidMail } from '@proton/shared/lib/user/helpers'; -import { useModalTwoPromise } from '../../../../components/modalTwo/useModalTwo'; import { useApi, useEventManager, diff --git a/packages/components/containers/payments/subscription/cancellationFlow/CancelConfirmationModal.tsx b/packages/components/containers/payments/subscription/cancellationFlow/CancelConfirmationModal.tsx index c84d44716d..3ffe5771f0 100644 --- a/packages/components/containers/payments/subscription/cancellationFlow/CancelConfirmationModal.tsx +++ b/packages/components/containers/payments/subscription/cancellationFlow/CancelConfirmationModal.tsx @@ -1,10 +1,13 @@ import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components'; import Icon from '@proton/components/components/icon/Icon'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import StripedItem from '@proton/components/components/stripedList/StripedItem'; import { StripedList } from '@proton/components/components/stripedList/StripedList'; diff --git a/packages/components/containers/payments/subscription/cancellationFlow/CancelRedirectionModal.tsx b/packages/components/containers/payments/subscription/cancellationFlow/CancelRedirectionModal.tsx index 092863cbd6..00e7c8cd66 100644 --- a/packages/components/containers/payments/subscription/cancellationFlow/CancelRedirectionModal.tsx +++ b/packages/components/containers/payments/subscription/cancellationFlow/CancelRedirectionModal.tsx @@ -1,8 +1,8 @@ import { c } from 'ttag'; import { ButtonLike } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { PLANS } from '@proton/shared/lib/constants'; diff --git a/packages/components/containers/payments/subscription/cancellationFlow/CancellationReminderSection.tsx b/packages/components/containers/payments/subscription/cancellationFlow/CancellationReminderSection.tsx index fa09a74961..13f2b1b800 100644 --- a/packages/components/containers/payments/subscription/cancellationFlow/CancellationReminderSection.tsx +++ b/packages/components/containers/payments/subscription/cancellationFlow/CancellationReminderSection.tsx @@ -3,16 +3,10 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; -import { - SettingsSection, - useAppTitle, - useModalState, - useSubscription, - useUser, - useVPNServersCount, -} from '@proton/components'; +import { SettingsSection, useAppTitle, useSubscription, useUser, useVPNServersCount } from '@proton/components'; import Icon from '@proton/components/components/icon/Icon'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { APP_NAMES } from '@proton/shared/lib/constants'; import { getStaticURL } from '@proton/shared/lib/helpers/url'; diff --git a/packages/components/containers/payments/subscription/cancellationReminder/CancellationReminderModal.tsx b/packages/components/containers/payments/subscription/cancellationReminder/CancellationReminderModal.tsx index 16d000896c..50c33718de 100644 --- a/packages/components/containers/payments/subscription/cancellationReminder/CancellationReminderModal.tsx +++ b/packages/components/containers/payments/subscription/cancellationReminder/CancellationReminderModal.tsx @@ -2,10 +2,13 @@ import { format, fromUnixTime } from 'date-fns'; import { c } from 'ttag'; import { ButtonLike } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components'; import Icon from '@proton/components/components/icon/Icon'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import StripedItem from '@proton/components/components/stripedList/StripedItem'; import { StripedList } from '@proton/components/components/stripedList/StripedList'; import { FeatureCode } from '@proton/components/containers/features'; diff --git a/packages/components/containers/payments/subscription/panels/PendingInvitationsPanel.tsx b/packages/components/containers/payments/subscription/panels/PendingInvitationsPanel.tsx index 07ca5bf1d6..abaee4a3df 100644 --- a/packages/components/containers/payments/subscription/panels/PendingInvitationsPanel.tsx +++ b/packages/components/containers/payments/subscription/panels/PendingInvitationsPanel.tsx @@ -3,7 +3,7 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { useModalState } from '@proton/components/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useGetUserInvitations } from '@proton/components/hooks'; import useUid from '@proton/components/hooks/useUid'; import { CacheType } from '@proton/redux-utilities'; diff --git a/packages/components/containers/recovery/DataRecoverySection.tsx b/packages/components/containers/recovery/DataRecoverySection.tsx index c1ab4738f1..0b97df13bf 100644 --- a/packages/components/containers/recovery/DataRecoverySection.tsx +++ b/packages/components/containers/recovery/DataRecoverySection.tsx @@ -3,6 +3,7 @@ import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import { useGetUserSettings } from '@proton/components/hooks/useUserSettings'; import { useLoading } from '@proton/hooks'; @@ -13,7 +14,6 @@ import type { UserSettings } from '@proton/shared/lib/interfaces'; import { MNEMONIC_STATUS } from '@proton/shared/lib/interfaces'; import { syncDeviceRecovery } from '@proton/shared/lib/recoveryFile/deviceRecovery'; -import { useModalState } from '../../components'; import { useApi, useAuthentication, diff --git a/packages/components/containers/recovery/OverviewSection.tsx b/packages/components/containers/recovery/OverviewSection.tsx index 923ac034f3..9be8e42f7a 100644 --- a/packages/components/containers/recovery/OverviewSection.tsx +++ b/packages/components/containers/recovery/OverviewSection.tsx @@ -1,10 +1,10 @@ import { useInactiveKeys } from '@proton/account'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useKTVerifier from '@proton/components/containers/keyTransparency/useKTVerifier'; import { reactivateKeysProcess } from '@proton/shared/lib/keys'; import { useFlag } from '@proton/unleash'; import noop from '@proton/utils/noop'; -import { useModalState } from '../../components'; import { useAddresses, useAddressesKeys, diff --git a/packages/components/containers/recovery/SessionRecoverySection.tsx b/packages/components/containers/recovery/SessionRecoverySection.tsx index 9f424a5f70..ef77f0f332 100644 --- a/packages/components/containers/recovery/SessionRecoverySection.tsx +++ b/packages/components/containers/recovery/SessionRecoverySection.tsx @@ -1,12 +1,12 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Toggle from '@proton/components/components/toggle/Toggle'; import useLoading from '@proton/hooks/useLoading'; import metrics, { observeApiError } from '@proton/metrics'; import { updateSessionAccountRecovery } from '@proton/shared/lib/api/sessionRecovery'; -import { useModalState } from '../../components'; import { useApi, useAvailableRecoveryMethods, diff --git a/packages/components/containers/recovery/VoidRecoveryFilesModal.tsx b/packages/components/containers/recovery/VoidRecoveryFilesModal.tsx index 977e7e2528..ec42854e18 100644 --- a/packages/components/containers/recovery/VoidRecoveryFilesModal.tsx +++ b/packages/components/containers/recovery/VoidRecoveryFilesModal.tsx @@ -1,11 +1,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { useLoading } from '@proton/hooks'; import { deleteRecoverySecrets } from '@proton/shared/lib/api/settingsRecovery'; -import type { ModalProps } from '../../components'; import { useApi, useEventManager, useNotifications } from '../../hooks'; interface Props extends Omit { diff --git a/packages/components/containers/recovery/email/ConfirmRemoveEmailModal.tsx b/packages/components/containers/recovery/email/ConfirmRemoveEmailModal.tsx index 76a5cabdf1..9e4125437f 100644 --- a/packages/components/containers/recovery/email/ConfirmRemoveEmailModal.tsx +++ b/packages/components/containers/recovery/email/ConfirmRemoveEmailModal.tsx @@ -2,14 +2,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; - -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; interface Props extends ModalProps { onConfirm: () => void; diff --git a/packages/components/containers/recovery/email/RecoveryEmail.tsx b/packages/components/containers/recovery/email/RecoveryEmail.tsx index 81cbb5f13b..beefbc10a2 100644 --- a/packages/components/containers/recovery/email/RecoveryEmail.tsx +++ b/packages/components/containers/recovery/email/RecoveryEmail.tsx @@ -6,6 +6,7 @@ import { c } from 'ttag'; import type { Input } from '@proton/atoms'; import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useLoading from '@proton/hooks/useLoading'; import { updateEmail } from '@proton/shared/lib/api/settings'; import { emailValidator } from '@proton/shared/lib/helpers/formValidators'; @@ -14,7 +15,7 @@ import { SETTINGS_STATUS } from '@proton/shared/lib/interfaces'; import clsx from '@proton/utils/clsx'; import isTruthy from '@proton/utils/isTruthy'; -import { InputFieldTwo, useFormErrors, useModalState } from '../../../components'; +import { InputFieldTwo, useFormErrors } from '../../../components'; import type { InputFieldProps } from '../../../components/v2/field/InputField'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import ConfirmRemoveEmailModal from './ConfirmRemoveEmailModal'; diff --git a/packages/components/containers/recovery/email/VerifyRecoveryEmailModal.tsx b/packages/components/containers/recovery/email/VerifyRecoveryEmailModal.tsx index 1ee4662ded..2a323bf0c3 100644 --- a/packages/components/containers/recovery/email/VerifyRecoveryEmailModal.tsx +++ b/packages/components/containers/recovery/email/VerifyRecoveryEmailModal.tsx @@ -3,11 +3,11 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { postVerifySend } from '@proton/shared/lib/api/verify'; import type { UserSettings } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../../components'; import { useApi, useNotifications } from '../../../hooks'; export const getVerificationSentText = (address: string) => { diff --git a/packages/components/containers/recovery/phone/ConfirmRemovePhoneModal.tsx b/packages/components/containers/recovery/phone/ConfirmRemovePhoneModal.tsx index b5e8149352..ed1f782102 100644 --- a/packages/components/containers/recovery/phone/ConfirmRemovePhoneModal.tsx +++ b/packages/components/containers/recovery/phone/ConfirmRemovePhoneModal.tsx @@ -2,14 +2,11 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Alert from '@proton/components/components/alert/Alert'; - -import type { ModalProps } from '../../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, -} from '../../../components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; interface Props extends ModalProps { onConfirm: () => void; diff --git a/packages/components/containers/recovery/phone/RecoveryPhone.tsx b/packages/components/containers/recovery/phone/RecoveryPhone.tsx index ba6a7b3947..dee014dde4 100644 --- a/packages/components/containers/recovery/phone/RecoveryPhone.tsx +++ b/packages/components/containers/recovery/phone/RecoveryPhone.tsx @@ -5,13 +5,14 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useLoading from '@proton/hooks/useLoading'; import { updatePhone } from '@proton/shared/lib/api/settings'; import type { UserSettings } from '@proton/shared/lib/interfaces'; import { SETTINGS_STATUS } from '@proton/shared/lib/interfaces'; import clsx from '@proton/utils/clsx'; -import { InputFieldTwo, PhoneInput, useFormErrors, useModalState } from '../../../components'; +import { InputFieldTwo, PhoneInput, useFormErrors } from '../../../components'; import type { InputFieldProps } from '../../../components/v2/field/InputField'; import { useApi, useEventManager, useNotifications } from '../../../hooks'; import ConfirmRemovePhoneModal from './ConfirmRemovePhoneModal'; diff --git a/packages/components/containers/recovery/phone/VerifyRecoveryPhoneModal.tsx b/packages/components/containers/recovery/phone/VerifyRecoveryPhoneModal.tsx index d2b49f42c1..11a03a4988 100644 --- a/packages/components/containers/recovery/phone/VerifyRecoveryPhoneModal.tsx +++ b/packages/components/containers/recovery/phone/VerifyRecoveryPhoneModal.tsx @@ -3,11 +3,11 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; import Prompt from '@proton/components/components/prompt/Prompt'; import { postVerifyPhone } from '@proton/shared/lib/api/verify'; import type { UserSettings } from '@proton/shared/lib/interfaces'; -import type { ModalProps } from '../../../components'; import { useApi } from '../../../hooks'; interface Props extends ModalProps { diff --git a/packages/components/containers/referral/modals/ReferralModal.tsx b/packages/components/containers/referral/modals/ReferralModal.tsx index 90fee76dac..abc89cfde9 100644 --- a/packages/components/containers/referral/modals/ReferralModal.tsx +++ b/packages/components/containers/referral/modals/ReferralModal.tsx @@ -4,17 +4,12 @@ import { format } from 'date-fns'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - FeatureCode, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - ReferralFeaturesList, - useFeature, - useSettingsLink, -} from '@proton/components'; +import { FeatureCode, ReferralFeaturesList, useFeature, useSettingsLink } from '@proton/components'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import { PLANS, PLAN_NAMES } from '@proton/shared/lib/constants'; import { dateLocale } from '@proton/shared/lib/i18n'; import emptyMailboxSvg from '@proton/styles/assets/img/illustrations/empty-mailbox.svg'; diff --git a/packages/components/containers/security/ExternalPGPSettingsSection.tsx b/packages/components/containers/security/ExternalPGPSettingsSection.tsx index 9dcc9a53b6..d7c8da1787 100644 --- a/packages/components/containers/security/ExternalPGPSettingsSection.tsx +++ b/packages/components/containers/security/ExternalPGPSettingsSection.tsx @@ -2,6 +2,7 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Info from '@proton/components/components/link/Info'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import type { PromptProps } from '@proton/components/components/prompt/Prompt'; import Prompt from '@proton/components/components/prompt/Prompt'; import Toggle from '@proton/components/components/toggle/Toggle'; @@ -11,7 +12,6 @@ import { BRAND_NAME } from '@proton/shared/lib/constants'; import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import { ATTACH_PUBLIC_KEY, DEFAULT_MAILSETTINGS, SIGN } from '@proton/shared/lib/mail/mailSettings'; -import { useModalState } from '../../components'; import { useApi, useEventManager, useMailSettings, useNotifications } from '../../hooks'; import { SettingsParagraph, SettingsSection } from '../account'; import SettingsLayout from '../account/SettingsLayout'; diff --git a/packages/components/containers/sessions/SessionsSection.tsx b/packages/components/containers/sessions/SessionsSection.tsx index b68a5d2dd3..d945d16a93 100644 --- a/packages/components/containers/sessions/SessionsSection.tsx +++ b/packages/components/containers/sessions/SessionsSection.tsx @@ -3,6 +3,7 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; @@ -15,7 +16,7 @@ import { querySessions, revokeOtherSessions, revokeSession } from '@proton/share import { getKnowledgeBaseUrl } from '@proton/shared/lib/helpers/url'; import noop from '@proton/utils/noop'; -import { Pagination, useModalState, usePagination } from '../../components'; +import { Pagination, usePagination } from '../../components'; import { useApi, useAuthentication, useNotifications } from '../../hooks'; import { SettingsParagraph, SettingsSectionWide } from '../account'; import SessionAction from './SessionAction'; diff --git a/packages/components/containers/smtp/SMTPSubmissionSection.tsx b/packages/components/containers/smtp/SMTPSubmissionSection.tsx index f59a8745f4..3ae5fa279a 100644 --- a/packages/components/containers/smtp/SMTPSubmissionSection.tsx +++ b/packages/components/containers/smtp/SMTPSubmissionSection.tsx @@ -12,12 +12,12 @@ import { useActiveBreakpoint, useAddresses, useApi, - useModalState, useNotifications, useOrganization, useUser, } from '@proton/components'; import Loader from '@proton/components/components/loader/Loader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import Prompt from '@proton/components/components/prompt/Prompt'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; diff --git a/packages/components/containers/smtp/SMTPTokenModal.tsx b/packages/components/containers/smtp/SMTPTokenModal.tsx index 3ce8d002a9..872e64fe21 100644 --- a/packages/components/containers/smtp/SMTPTokenModal.tsx +++ b/packages/components/containers/smtp/SMTPTokenModal.tsx @@ -3,20 +3,14 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button, Href } from '@proton/atoms'; -import type { ModalProps } from '@proton/components'; -import { - Form, - InputFieldTwo, - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useApi, - useFormErrors, - useNotifications, -} from '@proton/components'; +import { Form, InputFieldTwo, useApi, useFormErrors, useNotifications } from '@proton/components'; import Copy from '@proton/components/components/button/Copy'; import PrimaryButton from '@proton/components/components/button/PrimaryButton'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { useLoading } from '@proton/hooks'; diff --git a/packages/components/containers/support/BugModal.tsx b/packages/components/containers/support/BugModal.tsx index e4a631cfd5..ccc54f4bbc 100644 --- a/packages/components/containers/support/BugModal.tsx +++ b/packages/components/containers/support/BugModal.tsx @@ -11,16 +11,16 @@ import { CollapsibleHeaderIconButton, Form, InputFieldTwo, - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoFooter as ModalFooter, - ModalTwoHeader as ModalHeader, - type ModalProps, TextAreaTwo, useFormErrors, } from '@proton/components'; import { DropdownSizeUnit } from '@proton/components/components/dropdown/utils'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import { reportBug } from '@proton/shared/lib/api/reports'; diff --git a/packages/components/containers/support/FreeUserLiveChatModal.tsx b/packages/components/containers/support/FreeUserLiveChatModal.tsx index a49c1d404c..bbe841b183 100644 --- a/packages/components/containers/support/FreeUserLiveChatModal.tsx +++ b/packages/components/containers/support/FreeUserLiveChatModal.tsx @@ -3,15 +3,13 @@ import { c } from 'ttag'; import { Button, ButtonLike } from '@proton/atoms'; import Icon from '@proton/components/components/icon/Icon'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import Modal from '@proton/components/components/modalTwo/Modal'; +import ModalContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalHeader from '@proton/components/components/modalTwo/ModalHeader'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { PLANS, PLAN_NAMES } from '@proton/shared/lib/constants'; -import type { ModalProps } from '../../components'; -import { - ModalTwo as Modal, - ModalTwoContent as ModalContent, - ModalTwoHeader as ModalHeader, - useModalState, -} from '../../components'; import AuthenticatedBugModal from '../support/AuthenticatedBugModal'; export interface Props { diff --git a/packages/components/containers/themes/ThemesModal.tsx b/packages/components/containers/themes/ThemesModal.tsx index 51684ec29b..170fc6c0cf 100644 --- a/packages/components/containers/themes/ThemesModal.tsx +++ b/packages/components/containers/themes/ThemesModal.tsx @@ -2,12 +2,15 @@ import { c } from 'ttag'; import { Button } from '@proton/atoms'; import Info from '@proton/components/components/link/Info'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import Toggle from '@proton/components/components/toggle/Toggle'; import { BRAND_NAME } from '@proton/shared/lib/constants'; import { ColorScheme, ThemeModeSetting, getThemes } from '@proton/shared/lib/themes/themes'; -import type { ModalProps } from '../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '../../components'; import ThemeCards from './ThemeCards'; import { useTheme } from './ThemeProvider'; import ThemeSyncModeCard from './ThemeSyncModeCard'; diff --git a/packages/components/containers/topBanners/PendingInvitationTopBanner.tsx b/packages/components/containers/topBanners/PendingInvitationTopBanner.tsx index 1806af0e62..5d16a6e6fa 100644 --- a/packages/components/containers/topBanners/PendingInvitationTopBanner.tsx +++ b/packages/components/containers/topBanners/PendingInvitationTopBanner.tsx @@ -1,6 +1,7 @@ import { c } from 'ttag'; -import { useModalState, useSettingsLink } from '@proton/components/components'; +import { useSettingsLink } from '@proton/components/components'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import useUid from '@proton/components/hooks/useUid'; import type { APP_NAMES } from '@proton/shared/lib/constants'; import { APPS, BRAND_NAME } from '@proton/shared/lib/constants'; diff --git a/packages/components/containers/topBanners/SessionRecoveryBanners.tsx b/packages/components/containers/topBanners/SessionRecoveryBanners.tsx index 7226d0fdab..0abcd6adf4 100644 --- a/packages/components/containers/topBanners/SessionRecoveryBanners.tsx +++ b/packages/components/containers/topBanners/SessionRecoveryBanners.tsx @@ -2,9 +2,9 @@ import { c, msgid } from 'ttag'; import { InlineLinkButton } from '@proton/atoms'; import SettingsLink from '@proton/components/components/link/SettingsLink'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { APPS } from '@proton/shared/lib/constants'; -import { useModalState } from '../../components'; import { useConfig, useIsSessionRecoveryInitiatedByCurrentSession, diff --git a/packages/components/containers/vpn/ProtonVPNClientsSection/ProtonVPNClientsSection.tsx b/packages/components/containers/vpn/ProtonVPNClientsSection/ProtonVPNClientsSection.tsx index b4ca726c86..395d8221a3 100644 --- a/packages/components/containers/vpn/ProtonVPNClientsSection/ProtonVPNClientsSection.tsx +++ b/packages/components/containers/vpn/ProtonVPNClientsSection/ProtonVPNClientsSection.tsx @@ -5,12 +5,13 @@ import { c } from 'ttag'; import { Button, ButtonLike, Href } from '@proton/atoms'; import Copy from '@proton/components/components/button/Copy'; import DropdownMenuLink from '@proton/components/components/dropdown/DropdownMenuLink'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; import { getWelcomeToText } from '@proton/shared/lib/apps/text'; import { VPN_APP_NAME } from '@proton/shared/lib/constants'; import onboardingVPNWelcome from '@proton/styles/assets/img/onboarding/vpn-welcome.svg'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent } from '../../../components'; import DownloadClientCard from '../../../components/downloadClientCard/DownloadClientCard'; import { useNotifications, useWelcomeFlags } from '../../../hooks'; import { SettingsParagraph, SettingsSectionWide } from '../../account'; diff --git a/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardConfigurationSection.tsx b/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardConfigurationSection.tsx index 4c35fbca25..1507c7964a 100644 --- a/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardConfigurationSection.tsx +++ b/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardConfigurationSection.tsx @@ -13,6 +13,7 @@ import Radio from '@proton/components/components/input/Radio'; import TextArea from '@proton/components/components/input/TextArea'; import Info from '@proton/components/components/link/Info'; import ConfirmModal from '@proton/components/components/modal/Confirm'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import Option from '@proton/components/components/option/Option'; import SelectTwo from '@proton/components/components/selectTwo/SelectTwo'; import Toggle from '@proton/components/components/toggle/Toggle'; @@ -21,7 +22,7 @@ import { base64StringToUint8Array, uint8ArrayToBase64String } from '@proton/shar import { readableTime } from '@proton/shared/lib/helpers/time'; import type { Logical } from '@proton/shared/lib/vpn/Logical'; -import { ErrorButton, InputFieldTwo, useModalTwoStatic } from '../../../components'; +import { ErrorButton, InputFieldTwo } from '../../../components'; import Details from '../../../components/container/Details'; import Summary from '../../../components/container/Summary'; import { getObjectKeys } from '../../../helpers'; diff --git a/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardCreationModal.tsx b/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardCreationModal.tsx index d24c156822..0cbc7388e7 100644 --- a/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardCreationModal.tsx +++ b/packages/components/containers/vpn/WireGuardConfigurationSection/WireGuardCreationModal.tsx @@ -6,9 +6,13 @@ import { Button } from '@proton/atoms'; import Form from '@proton/components/components/form/Form'; import TextArea from '@proton/components/components/input/TextArea'; import Loader from '@proton/components/components/loader/Loader'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; -import type { ModalProps } from '../../../components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader, QRCode, Tabs } from '../../../components'; +import { QRCode, Tabs } from '../../../components'; export interface WireGuardCreationModalProps extends ModalProps { text?: string; diff --git a/packages/components/containers/vpn/gateways/GatewayAddServersModal.tsx b/packages/components/containers/vpn/gateways/GatewayAddServersModal.tsx index c54f33ef4f..37f0dabb58 100644 --- a/packages/components/containers/vpn/gateways/GatewayAddServersModal.tsx +++ b/packages/components/containers/vpn/gateways/GatewayAddServersModal.tsx @@ -3,9 +3,12 @@ import { useMemo, useState } from 'react'; import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components'; -import type { ModalStateProps } from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { ModalStateProps } from '@proton/components/components/modalTwo/useModalState'; import type { CountryOptions } from '../../../helpers/countries'; import { GatewayCountrySelection } from './GatewayCountrySelection'; diff --git a/packages/components/containers/vpn/gateways/GatewayModal.tsx b/packages/components/containers/vpn/gateways/GatewayModal.tsx index 797ef397bb..99cee3bf68 100644 --- a/packages/components/containers/vpn/gateways/GatewayModal.tsx +++ b/packages/components/containers/vpn/gateways/GatewayModal.tsx @@ -3,15 +3,13 @@ import { useMemo, useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useFormErrors, -} from '@proton/components/components'; +import { useFormErrors } from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { CountryOptions } from '../../../helpers/countries'; import { GatewayCountrySelection } from './GatewayCountrySelection'; diff --git a/packages/components/containers/vpn/gateways/GatewayRenameModal.tsx b/packages/components/containers/vpn/gateways/GatewayRenameModal.tsx index 61e1ca3ec5..6405883fa0 100644 --- a/packages/components/containers/vpn/gateways/GatewayRenameModal.tsx +++ b/packages/components/containers/vpn/gateways/GatewayRenameModal.tsx @@ -3,15 +3,13 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useFormErrors, -} from '@proton/components/components'; +import { useFormErrors } from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { GatewayDto } from './GatewayDto'; import { GatewayNameField } from './GatewayNameField'; diff --git a/packages/components/containers/vpn/gateways/GatewayServersModal.tsx b/packages/components/containers/vpn/gateways/GatewayServersModal.tsx index a896ba0e9f..6af7d8159c 100644 --- a/packages/components/containers/vpn/gateways/GatewayServersModal.tsx +++ b/packages/components/containers/vpn/gateways/GatewayServersModal.tsx @@ -3,16 +3,14 @@ import { useState } from 'react'; import { c, msgid } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { - ModalTwo, - ModalTwoContent, - ModalTwoFooter, - ModalTwoHeader, - useModalTwoStatic, -} from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; import Icon from '@proton/components/components/icon/Icon'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import Cell from '@proton/components/components/table/Cell'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; diff --git a/packages/components/containers/vpn/gateways/GatewayUsersModal.tsx b/packages/components/containers/vpn/gateways/GatewayUsersModal.tsx index 37fad890c5..da2cb7ebc6 100644 --- a/packages/components/containers/vpn/gateways/GatewayUsersModal.tsx +++ b/packages/components/containers/vpn/gateways/GatewayUsersModal.tsx @@ -3,9 +3,12 @@ import { useState } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import type { ModalProps } from '@proton/components/components'; -import { ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components'; import Form from '@proton/components/components/form/Form'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; import type { GatewayDto } from './GatewayDto'; import type { GatewayModel } from './GatewayModel'; diff --git a/packages/components/containers/vpn/gateways/GatewaysSection.tsx b/packages/components/containers/vpn/gateways/GatewaysSection.tsx index 422e2f5cfa..b5c16af25e 100644 --- a/packages/components/containers/vpn/gateways/GatewaysSection.tsx +++ b/packages/components/containers/vpn/gateways/GatewaysSection.tsx @@ -4,6 +4,7 @@ import { c, msgid } from 'ttag'; import { Button, Href } from '@proton/atoms'; import Loader from '@proton/components/components/loader/Loader'; +import { useModalTwoStatic } from '@proton/components/components/modalTwo/useModalTwo'; import Table from '@proton/components/components/table/Table'; import TableBody from '@proton/components/components/table/TableBody'; import TableCell from '@proton/components/components/table/TableCell'; @@ -16,7 +17,6 @@ import gatewaySvg from '@proton/styles/assets/img/illustrations/gateway.svg'; import gatewaysEmptyStateAdminsSvg from '@proton/styles/assets/img/illustrations/gateways-empty-state-admins.svg'; import gatewaysEmptyStateUsersSvg from '@proton/styles/assets/img/illustrations/gateways-empty-state-users.svg'; -import { useModalTwoStatic } from '../../../components'; import SettingsSectionWide from '../../../containers/account/SettingsSectionWide'; import { EmptyViewContainer } from '../../../containers/app'; import { SUBSCRIPTION_STEPS, useSubscriptionModal } from '../../../containers/payments'; diff --git a/packages/components/hooks/useLinkHandler.tsx b/packages/components/hooks/useLinkHandler.tsx index 8fce50519e..6931e8097a 100644 --- a/packages/components/hooks/useLinkHandler.tsx +++ b/packages/components/hooks/useLinkHandler.tsx @@ -3,13 +3,13 @@ import { useEffect, useState } from 'react'; import { c } from 'ttag'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { PROTON_DOMAINS } from '@proton/shared/lib/constants'; import { getSecondLevelDomain } from '@proton/shared/lib/helpers/url'; import type { MailSettings } from '@proton/shared/lib/interfaces'; import { CONFIRM_LINK } from '@proton/shared/lib/mail/mailSettings'; import isTruthy from '@proton/utils/isTruthy'; -import { useModalState } from '../components'; import LinkConfirmationModal from '../components/notifications/LinkConfirmationModal/LinkConfirmationModal'; import { getHostname, isExternal, isSubDomain, punycodeUrl } from '../helpers/url'; import { useHandler, useNotifications } from './index'; diff --git a/packages/components/index.ts b/packages/components/index.ts index b3407676ca..1753b296f2 100644 --- a/packages/components/index.ts +++ b/packages/components/index.ts @@ -130,6 +130,20 @@ export { default as FormModal } from './components/modal/FormModal'; export { default as HeaderModal } from './components/modal/Header'; export { default as InnerModal } from './components/modal/Inner'; export { default as PreviewPDFModal } from './components/modal/PreviewPDFModal'; +export { default as BasicModal } from './components/modalTwo/BasicModal'; +export { ModalContext, default as ModalTwo } from './components/modalTwo/Modal'; +export type { ModalOwnProps, ModalProps, ModalSize } from './components/modalTwo/Modal'; +export { default as ModalContent, default as ModalTwoContent } from './components/modalTwo/ModalContent'; +export type { ModalContentProps } from './components/modalTwo/ModalContent'; +export { default as ModalTwoFooter } from './components/modalTwo/ModalFooter'; +export { default as ModalTwoHeader } from './components/modalTwo/ModalHeader'; +export { + default as useModalState, + useModalStateObject, + useModalStateWithData, +} from './components/modalTwo/useModalState'; +export type { ModalPropsWithData, ModalStateProps, ModalStateReturnObj } from './components/modalTwo/useModalState'; +export { useModalTwo, useModalTwoPromise, useModalTwoStatic } from './components/modalTwo/useModalTwo'; export { default as Option } from './components/option/Option'; export { default as Price } from './components/price/Price'; export { default as CircularProgress } from './components/progress/CircularProgress'; diff --git a/packages/components/payments/chargebee/ChargebeeIframe.tsx b/packages/components/payments/chargebee/ChargebeeIframe.tsx index 923d381282..fb1986fb6d 100644 --- a/packages/components/payments/chargebee/ChargebeeIframe.tsx +++ b/packages/components/payments/chargebee/ChargebeeIframe.tsx @@ -27,7 +27,9 @@ import { isUnhandledErrorMessage, paypalAuthorizedMessageType, } from '@proton/chargebee/lib'; -import { ModalTwo, ModalTwoContent, useModalState } from '@proton/components/components'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import useModalState from '@proton/components/components/modalTwo/useModalState'; import { useApi, useNotifications } from '@proton/components/hooks'; import { type ChargebeeCardProcessorHook } from '@proton/components/payments/react-extensions/useChargebeeCard'; import { type ChargebeePaypalProcessorHook } from '@proton/components/payments/react-extensions/useChargebeePaypal'; diff --git a/packages/components/payments/client-extensions/billed-user/BilledUserModal.tsx b/packages/components/payments/client-extensions/billed-user/BilledUserModal.tsx index 403394f8a3..84d97d8af0 100644 --- a/packages/components/payments/client-extensions/billed-user/BilledUserModal.tsx +++ b/packages/components/payments/client-extensions/billed-user/BilledUserModal.tsx @@ -3,8 +3,13 @@ import { useEffect } from 'react'; import { c } from 'ttag'; import { Button } from '@proton/atoms'; -import { ModalProps, ModalTwo, ModalTwoContent, ModalTwoFooter, ModalTwoHeader } from '@proton/components/components'; -import { User, isBilledUser } from '@proton/shared/lib/interfaces'; +import type { ModalProps } from '@proton/components/components/modalTwo/Modal'; +import ModalTwo from '@proton/components/components/modalTwo/Modal'; +import ModalTwoContent from '@proton/components/components/modalTwo/ModalContent'; +import ModalTwoFooter from '@proton/components/components/modalTwo/ModalFooter'; +import ModalTwoHeader from '@proton/components/components/modalTwo/ModalHeader'; +import type { User } from '@proton/shared/lib/interfaces'; +import { isBilledUser } from '@proton/shared/lib/interfaces'; import { billedUserWarning } from './billedUserWarning'; -- 2.11.4.GIT