From adf3342d5ca835cc647cef222cac247e82584d7c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pawe=C5=82=20Chy=C5=82a?= Date: Tue, 30 May 2023 09:42:22 +0200 Subject: [PATCH] Replace ConfirmButton from old macaw (#3647) * New ConfirmButton component * Update macaw ui * Remove old confim button * New confirm button * Replace all place with new confirm button * Remove ConfirmButtonTransitionState use from mcaw * Does not change button width when showing loader and success state * Test ConfirmButton * Remove story, update tests * WIP change pull_request to push for chromatic * Revert "WIP change pull_request to push for chromatic" This reverts commit 8f0909bf54f185898a7f1d236f072d6544fd5d86. * Add comments * Remove css prop from DialogTable * Make confirm button larger in order send refund --- .../AppActivateDialog/AppActivateDialog.tsx | 2 +- .../AppDeactivateDialog.tsx | 2 +- .../AppDeleteDialog/AppDeleteDialog.tsx | 2 +- .../AppInProgressDeleteDialog.tsx | 2 +- .../AttributeBulkDeleteDialog.tsx | 2 +- .../AttributeDeleteDialog.tsx | 2 +- .../AttributePage/AttributePage.tsx | 2 +- .../AttributeValueDeleteDialog.tsx | 2 +- .../AttributeValueEditDialog.tsx | 6 +- .../CategoryCreatePage/CategoryCreatePage.tsx | 2 +- .../CategoryUpdatePage/CategoryUpdatePage.tsx | 2 +- .../ChannelDeleteDialog.tsx | 2 +- .../ChannelPickerDialog.tsx | 3 +- .../ChannelDetailsPage/ChannelDetailsPage.tsx | 2 +- .../CollectionCreatePage.tsx | 2 +- .../CollectionDetailsPage.tsx | 2 +- src/components/ActionDialog/ActionDialog.tsx | 2 +- src/components/ActionDialog/DialogButtons.tsx | 6 +- .../AssignAttributeDialog.tsx | 7 +- .../AssignContainerDialog.tsx | 4 +- .../AssignProductDialog.tsx | 6 +- .../AssignVariantDialog.tsx | 6 +- .../AttributeUnassignDialog.tsx | 2 +- src/components/BackButton.tsx | 5 +- .../BulkAttributeUnassignDialog.tsx | 6 +- .../ChannelsAvailabilityDialog.tsx | 11 +- src/components/ConfirmButton.tsx | 33 ---- .../ConfirmButton/ConfirmButton.test.tsx | 132 +++++++++++++++ .../ConfirmButton/ConfirmButton.tsx | 153 ++++++++++++++++++ src/components/ConfirmButton/index.ts | 1 + .../DeleteFilterTabDialog.tsx | 2 +- .../SaveFilterTabDialog.tsx | 4 +- .../TypeDeleteWarningDialog.tsx | 7 +- .../TypeDeleteWarningDialogContent.tsx | 2 +- .../CustomAppCreatePage.tsx | 2 +- .../CustomAppDetailsPage.tsx | 3 +- .../TokenCreateDialog/TokenCreateDialog.tsx | 6 +- .../TokenDeleteDialog/TokenDeleteDialog.tsx | 2 +- .../WebhookDeleteDialog.tsx | 2 +- .../WebhookDetailsPage/WebhookDetailsPage.tsx | 2 +- .../CustomerAddressDialog.tsx | 7 +- .../CustomerCreatePage/CustomerCreatePage.tsx | 2 +- .../CustomerDetailsPage.tsx | 2 +- .../DiscountCountrySelectDialog.tsx | 6 +- .../SaleCreatePage/SaleCreatePage.tsx | 2 +- .../SaleDetailsPage/SaleDetailsPage.tsx | 2 +- .../VoucherCreatePage/VoucherCreatePage.tsx | 2 +- .../VoucherDetailsPage/VoucherDetailsPage.tsx | 2 +- .../GiftCardBulkCreateDialogForm.tsx | 2 +- .../GiftCardCreateDialogForm.tsx | 2 +- .../GiftCardExportDialogContent.tsx | 2 +- .../BulkEnableDisableSection.tsx | 102 ++++++------ src/misc.ts | 3 +- .../MenuCreateDialog/MenuCreateDialog.tsx | 6 +- .../MenuDetailsPage/MenuDetailsPage.tsx | 2 +- .../MenuItemDialog/MenuItemDialog.tsx | 6 +- .../OrderAddressFields/OrderAddressFields.tsx | 2 +- .../OrderBulkCancelDialog.tsx | 2 +- .../OrderCancelDialog/OrderCancelDialog.tsx | 6 +- .../OrderCustomerAddressesEditDialog.tsx | 7 +- .../OrderCustomerAddressesSearch.tsx | 11 +- .../OrderCustomerChangeDialog.tsx | 2 +- .../OrderDetailsPage/OrderDetailsPage.tsx | 2 +- .../OrderDiscountCommonModal.tsx | 7 +- .../OrderDraftCancelDialog.tsx | 2 +- .../OrderDraftPage/OrderDraftPage.tsx | 2 +- .../OrderFulfillPage/OrderFulfillPage.tsx | 2 +- .../OrderFulfillStockExceededDialog.tsx | 16 +- .../OrderFulfillmentApproveDialog.tsx | 6 +- .../OrderFulfillmentCancelDialog.tsx | 7 +- .../OrderFulfillmentTrackingDialog.tsx | 6 +- .../OrderGrantRefundPage.tsx | 2 +- .../components/RefundCard.tsx | 6 +- .../OrderInvoiceEmailSendDialog.tsx | 6 +- .../OrderManualTransactionForm.tsx | 2 +- .../components/SubmitButton.tsx | 4 +- .../OrderManualTransactionForm/hooks.test.ts | 2 +- .../OrderManualTransactionForm/hooks.ts | 2 +- .../OrderMarkAsPaidDialog.tsx | 2 +- .../OrderPaymentDialog/OrderPaymentDialog.tsx | 6 +- .../OrderPaymentVoidDialog.tsx | 6 +- .../OrderProductAddDialog.tsx | 6 +- .../OrderReturnPage/OrderReturnPage.tsx | 2 +- .../components/SubmitCard/SubmitCard.tsx | 6 +- .../OrderSendRefundPage/OrderSendRefund.tsx | 2 +- .../components/TransactionCard.tsx | 2 +- .../components/OrderSendRefundPage/styles.ts | 1 + .../OrderSettingsPage/OrderSettingsPage.tsx | 2 +- .../OrderShippingMethodEditDialog.tsx | 7 +- .../OrderTransactionActionDialog.tsx | 7 +- .../PageTypeBulkDeleteDialog.tsx | 2 +- .../PageTypeCreatePage/PageTypeCreatePage.tsx | 3 +- .../PageTypeDetailsPage.tsx | 3 +- .../PageDetailsPage/PageDetailsPage.tsx | 2 +- .../PageTypePickerDialog.tsx | 2 +- .../AssignMembersDialog.tsx | 7 +- .../MembersErrorDialog/MembersErrorDialog.tsx | 2 +- .../PermissionGroupCreatePage.tsx | 2 +- .../PermissionGroupDeleteDialog.tsx | 2 +- .../PermissionGroupDetailsPage.tsx | 2 +- .../UnassignMembersDialog.tsx | 2 +- .../PluginSecretFieldDialog.tsx | 6 +- .../PluginsDetailsPage/PluginsDetailsPage.tsx | 2 +- .../ProductTypeCreatePage.tsx | 2 +- .../ProductTypeDetailsPage.tsx | 2 +- .../OrderDiscountProvider.tsx | 2 +- .../OrderLineDiscountProvider.tsx | 2 +- .../ProductCreatePage.stories.tsx | 2 +- .../ProductCreatePage/ProductCreatePage.tsx | 2 +- .../ProductExportDialog.tsx | 6 +- .../ProductMediaPage/ProductMediaPage.tsx | 3 +- .../ProductTypePickerDialog.tsx | 2 +- .../ProductUpdatePage/ProductUpdatePage.tsx | 2 +- .../ProductVariantCreatePage.tsx | 2 +- .../ProductVariantDeleteDialog.tsx | 7 +- .../ProductVariantEndPreorderDialog.tsx | 6 +- .../ProductVariantMediaSelectDialog.tsx | 2 +- .../ProductVariantPage/ProductVariantPage.tsx | 2 +- .../DeleteShippingRateDialog.tsx | 12 +- .../ShippingMethodProductsAddDialog.tsx | 7 +- .../ShippingZoneAddWarehouseDialog.tsx | 7 +- .../ShippingZoneCountriesAssignDialog.tsx | 6 +- .../ShippingZoneCreatePage.tsx | 2 +- .../ShippingZoneDetailsPage.tsx | 2 +- .../ShippingZonePostalCodeRangeDialog.tsx | 7 +- .../ShippingZoneRatesCreatePage.tsx | 2 +- .../ShippingZoneRatesPage.tsx | 2 +- .../UnassignDialog/UnassignDialog.tsx | 2 +- .../SiteSettingsPage/SiteSettingsPage.tsx | 3 +- .../StaffAddMemberDialog.tsx | 7 +- .../StaffDetailsPage/StaffDetailsPage.tsx | 2 +- .../StaffPasswordResetDialog.tsx | 6 +- .../pages/TaxChannelsPage/TaxChannelsPage.tsx | 2 +- .../pages/TaxClassesPage/TaxClassesPage.tsx | 2 +- .../TaxCountriesPage/TaxCountriesPage.tsx | 2 +- .../TranslationFields/TranslationFields.tsx | 8 +- .../TranslationFieldsLong.tsx | 2 +- .../TranslationFieldsRich.tsx | 2 +- .../TranslationFieldsSave.tsx | 9 +- .../TranslationFieldsShort.tsx | 2 +- src/translations/types.ts | 5 +- src/types.ts | 2 +- .../WarehouseCreatePage.tsx | 2 +- .../WarehouseDeleteDialog.tsx | 2 +- .../WarehouseDetailsPage.tsx | 2 +- 145 files changed, 633 insertions(+), 303 deletions(-) delete mode 100644 src/components/ConfirmButton.tsx create mode 100644 src/components/ConfirmButton/ConfirmButton.test.tsx create mode 100644 src/components/ConfirmButton/ConfirmButton.tsx create mode 100644 src/components/ConfirmButton/index.ts diff --git a/src/apps/components/AppActivateDialog/AppActivateDialog.tsx b/src/apps/components/AppActivateDialog/AppActivateDialog.tsx index e9ccef525..1cc3850cc 100644 --- a/src/apps/components/AppActivateDialog/AppActivateDialog.tsx +++ b/src/apps/components/AppActivateDialog/AppActivateDialog.tsx @@ -1,8 +1,8 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { buttonMessages } from "@dashboard/intl"; import { getStringOrPlaceholder } from "@dashboard/misc"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/apps/components/AppDeactivateDialog/AppDeactivateDialog.tsx b/src/apps/components/AppDeactivateDialog/AppDeactivateDialog.tsx index 2082cfa41..0e2a5e1bc 100644 --- a/src/apps/components/AppDeactivateDialog/AppDeactivateDialog.tsx +++ b/src/apps/components/AppDeactivateDialog/AppDeactivateDialog.tsx @@ -1,8 +1,8 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { buttonMessages } from "@dashboard/intl"; import { getStringOrPlaceholder } from "@dashboard/misc"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/apps/components/AppDeleteDialog/AppDeleteDialog.tsx b/src/apps/components/AppDeleteDialog/AppDeleteDialog.tsx index 0887f3453..e63e6d280 100644 --- a/src/apps/components/AppDeleteDialog/AppDeleteDialog.tsx +++ b/src/apps/components/AppDeleteDialog/AppDeleteDialog.tsx @@ -1,7 +1,7 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { getStringOrPlaceholder } from "@dashboard/misc"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/apps/components/AppInProgressDeleteDialog/AppInProgressDeleteDialog.tsx b/src/apps/components/AppInProgressDeleteDialog/AppInProgressDeleteDialog.tsx index e434747dd..e7a39db53 100644 --- a/src/apps/components/AppInProgressDeleteDialog/AppInProgressDeleteDialog.tsx +++ b/src/apps/components/AppInProgressDeleteDialog/AppInProgressDeleteDialog.tsx @@ -1,7 +1,7 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { getStringOrPlaceholder } from "@dashboard/misc"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/attributes/components/AttributeBulkDeleteDialog/AttributeBulkDeleteDialog.tsx b/src/attributes/components/AttributeBulkDeleteDialog/AttributeBulkDeleteDialog.tsx index 223ca0075..fe79c026a 100644 --- a/src/attributes/components/AttributeBulkDeleteDialog/AttributeBulkDeleteDialog.tsx +++ b/src/attributes/components/AttributeBulkDeleteDialog/AttributeBulkDeleteDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/attributes/components/AttributeDeleteDialog/AttributeDeleteDialog.tsx b/src/attributes/components/AttributeDeleteDialog/AttributeDeleteDialog.tsx index f05a0bd2a..865ab041b 100644 --- a/src/attributes/components/AttributeDeleteDialog/AttributeDeleteDialog.tsx +++ b/src/attributes/components/AttributeDeleteDialog/AttributeDeleteDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/attributes/components/AttributePage/AttributePage.tsx b/src/attributes/components/AttributePage/AttributePage.tsx index 80fc12344..70c7b5e09 100644 --- a/src/attributes/components/AttributePage/AttributePage.tsx +++ b/src/attributes/components/AttributePage/AttributePage.tsx @@ -2,6 +2,7 @@ import { attributeListUrl } from "@dashboard/attributes/urls"; import { ATTRIBUTE_TYPES_WITH_DEDICATED_VALUES } from "@dashboard/attributes/utils/data"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata/Metadata"; @@ -23,7 +24,6 @@ import { maybe } from "@dashboard/misc"; import { ListSettings, ReorderAction } from "@dashboard/types"; import { mapEdgesToItems, mapMetadataItemToInput } from "@dashboard/utils/maps"; import useMetadataChangeTrigger from "@dashboard/utils/metadata/useMetadataChangeTrigger"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; import slugify from "slugify"; diff --git a/src/attributes/components/AttributeValueDeleteDialog/AttributeValueDeleteDialog.tsx b/src/attributes/components/AttributeValueDeleteDialog/AttributeValueDeleteDialog.tsx index 5f794b19e..6f3b5faef 100644 --- a/src/attributes/components/AttributeValueDeleteDialog/AttributeValueDeleteDialog.tsx +++ b/src/attributes/components/AttributeValueDeleteDialog/AttributeValueDeleteDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/attributes/components/AttributeValueEditDialog/AttributeValueEditDialog.tsx b/src/attributes/components/AttributeValueEditDialog/AttributeValueEditDialog.tsx index c290a8391..31185fa02 100644 --- a/src/attributes/components/AttributeValueEditDialog/AttributeValueEditDialog.tsx +++ b/src/attributes/components/AttributeValueEditDialog/AttributeValueEditDialog.tsx @@ -1,6 +1,9 @@ import { getAttributeValueErrorMessage } from "@dashboard/attributes/errors"; import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { AttributeErrorFragment, @@ -16,7 +19,6 @@ import { DialogTitle, TextField, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx b/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx index 5bb25083d..313011b33 100644 --- a/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx +++ b/src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx @@ -1,12 +1,12 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { CardSpacer } from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata"; import Savebar from "@dashboard/components/Savebar"; import { SeoForm } from "@dashboard/components/SeoForm"; import { ProductErrorFragment } from "@dashboard/graphql"; import useNavigator from "@dashboard/hooks/useNavigator"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { Box } from "@saleor/macaw-ui/next"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx b/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx index 85b6487bf..3b5c13ada 100644 --- a/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx +++ b/src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx @@ -7,6 +7,7 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { Button } from "@dashboard/components/Button"; import { CardSpacer } from "@dashboard/components/CardSpacer"; import CardTitle from "@dashboard/components/CardTitle"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata/Metadata"; import Savebar from "@dashboard/components/Savebar"; @@ -16,7 +17,6 @@ import { CategoryDetailsQuery, ProductErrorFragment } from "@dashboard/graphql"; import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; import { Card } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { sprinkles } from "@saleor/macaw-ui/next"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/channels/components/ChannelDeleteDialog/ChannelDeleteDialog.tsx b/src/channels/components/ChannelDeleteDialog/ChannelDeleteDialog.tsx index 3337b42f1..b33aa8db5 100644 --- a/src/channels/components/ChannelDeleteDialog/ChannelDeleteDialog.tsx +++ b/src/channels/components/ChannelDeleteDialog/ChannelDeleteDialog.tsx @@ -1,4 +1,5 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { Choices, SingleSelectField, @@ -6,7 +7,6 @@ import { import useStateFromProps from "@dashboard/hooks/useStateFromProps"; import { buttonMessages } from "@dashboard/intl"; import { Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { defineMessages, useIntl } from "react-intl"; diff --git a/src/channels/components/ChannelPickerDialog/ChannelPickerDialog.tsx b/src/channels/components/ChannelPickerDialog/ChannelPickerDialog.tsx index fb33d0c20..a1e9d1fb0 100644 --- a/src/channels/components/ChannelPickerDialog/ChannelPickerDialog.tsx +++ b/src/channels/components/ChannelPickerDialog/ChannelPickerDialog.tsx @@ -1,10 +1,11 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { Choice } from "@dashboard/components/SingleSelectField"; import useChoiceSearch from "@dashboard/hooks/useChoiceSearch"; import useModalDialogOpen from "@dashboard/hooks/useModalDialogOpen"; import useStateFromProps from "@dashboard/hooks/useStateFromProps"; import { MenuItem } from "@material-ui/core"; -import { Autocomplete, ConfirmButtonTransitionState } from "@saleor/macaw-ui"; +import { Autocomplete } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx b/src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx index bd51f3af7..95fb2791f 100644 --- a/src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx +++ b/src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx @@ -5,6 +5,7 @@ import { channelsListUrl } from "@dashboard/channels/urls"; import { validateChannelFormData } from "@dashboard/channels/validation"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import RequirePermissions from "@dashboard/components/RequirePermissions"; @@ -30,7 +31,6 @@ import useStateFromProps from "@dashboard/hooks/useStateFromProps"; import { FetchMoreProps, RelayToFlat } from "@dashboard/types"; import createSingleAutocompleteSelectHandler from "@dashboard/utils/handlers/singleAutocompleteSelectChangeHandler"; import { mapCountriesToChoices } from "@dashboard/utils/maps"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React, { useState } from "react"; import { useIntl } from "react-intl"; diff --git a/src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx b/src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx index 2310da075..7e76bc46b 100644 --- a/src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx +++ b/src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx @@ -3,6 +3,7 @@ import { collectionListUrl } from "@dashboard/collections/urls"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { CardSpacer } from "@dashboard/components/CardSpacer"; import ChannelsAvailabilityCard from "@dashboard/components/ChannelsAvailabilityCard"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata"; import Savebar from "@dashboard/components/Savebar"; @@ -14,7 +15,6 @@ import { } from "@dashboard/graphql"; import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx b/src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx index b7ce7a7be..e7c64dba8 100644 --- a/src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx +++ b/src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx @@ -3,6 +3,7 @@ import { collectionListUrl } from "@dashboard/collections/urls"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { CardSpacer } from "@dashboard/components/CardSpacer"; import ChannelsAvailabilityCard from "@dashboard/components/ChannelsAvailabilityCard"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata/Metadata"; import Savebar from "@dashboard/components/Savebar"; @@ -15,7 +16,6 @@ import { } from "@dashboard/graphql"; import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/components/ActionDialog/ActionDialog.tsx b/src/components/ActionDialog/ActionDialog.tsx index 62095db8c..ff4d038a7 100644 --- a/src/components/ActionDialog/ActionDialog.tsx +++ b/src/components/ActionDialog/ActionDialog.tsx @@ -1,6 +1,6 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogProps } from "@dashboard/types"; import { Dialog, DialogContent, DialogTitle } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import DialogButtons from "./DialogButtons"; diff --git a/src/components/ActionDialog/DialogButtons.tsx b/src/components/ActionDialog/DialogButtons.tsx index 3200c4cab..e29949597 100644 --- a/src/components/ActionDialog/DialogButtons.tsx +++ b/src/components/ActionDialog/DialogButtons.tsx @@ -1,11 +1,11 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { buttonMessages } from "@dashboard/intl"; import { DialogActions } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; import BackButton from "../BackButton"; -import ConfirmButton from "../ConfirmButton"; +import { ConfirmButton } from "../ConfirmButton/ConfirmButton"; import { ActionDialogVariant } from "./types"; interface DialogButtonsProps { @@ -46,7 +46,7 @@ const DialogButtons: React.FC = props => { disabled={disabled} transitionState={confirmButtonState} onClick={onConfirm} - error={variant === "delete"} + variant={variant === "delete" ? "error" : "primary"} data-test-id="submit" > {confirmButtonLabel || diff --git a/src/components/AssignAttributeDialog/AssignAttributeDialog.tsx b/src/components/AssignAttributeDialog/AssignAttributeDialog.tsx index fcae9571c..71ef3891f 100644 --- a/src/components/AssignAttributeDialog/AssignAttributeDialog.tsx +++ b/src/components/AssignAttributeDialog/AssignAttributeDialog.tsx @@ -1,5 +1,8 @@ import Checkbox from "@dashboard/components/Checkbox"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import ResponsiveTable from "@dashboard/components/ResponsiveTable"; import TableRowLink from "@dashboard/components/TableRowLink"; import { AvailableAttributeFragment } from "@dashboard/graphql"; @@ -23,7 +26,7 @@ import { TextField, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState, makeStyles } from "@saleor/macaw-ui"; +import { makeStyles } from "@saleor/macaw-ui"; import clsx from "clsx"; import React from "react"; import InfiniteScroll from "react-infinite-scroll-component"; diff --git a/src/components/AssignContainerDialog/AssignContainerDialog.tsx b/src/components/AssignContainerDialog/AssignContainerDialog.tsx index e6fcd11a4..493188c35 100644 --- a/src/components/AssignContainerDialog/AssignContainerDialog.tsx +++ b/src/components/AssignContainerDialog/AssignContainerDialog.tsx @@ -1,3 +1,4 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import ResponsiveTable from "@dashboard/components/ResponsiveTable"; import TableRowLink from "@dashboard/components/TableRowLink"; import useSearchQuery from "@dashboard/hooks/useSearchQuery"; @@ -13,13 +14,12 @@ import { TableCell, TextField, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import InfiniteScroll from "react-infinite-scroll-component"; import BackButton from "../BackButton"; import Checkbox from "../Checkbox"; -import ConfirmButton from "../ConfirmButton"; +import { ConfirmButton } from "../ConfirmButton"; import { useStyles } from "./styles"; export interface AssignContainerDialogFormData { diff --git a/src/components/AssignProductDialog/AssignProductDialog.tsx b/src/components/AssignProductDialog/AssignProductDialog.tsx index 63212446d..0f61ec321 100644 --- a/src/components/AssignProductDialog/AssignProductDialog.tsx +++ b/src/components/AssignProductDialog/AssignProductDialog.tsx @@ -1,4 +1,7 @@ -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import ResponsiveTable from "@dashboard/components/ResponsiveTable"; import TableCellAvatar from "@dashboard/components/TableCellAvatar"; import TableRowLink from "@dashboard/components/TableRowLink"; @@ -18,7 +21,6 @@ import { TableCell, TextField, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React, { useEffect } from "react"; import InfiniteScroll from "react-infinite-scroll-component"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/components/AssignVariantDialog/AssignVariantDialog.tsx b/src/components/AssignVariantDialog/AssignVariantDialog.tsx index 9e7193604..52134eb7d 100644 --- a/src/components/AssignVariantDialog/AssignVariantDialog.tsx +++ b/src/components/AssignVariantDialog/AssignVariantDialog.tsx @@ -1,4 +1,7 @@ -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Money from "@dashboard/components/Money"; import ResponsiveTable from "@dashboard/components/ResponsiveTable"; import TableCellAvatar from "@dashboard/components/TableCellAvatar"; @@ -19,7 +22,6 @@ import { TextField, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import InfiniteScroll from "react-infinite-scroll-component"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/components/AttributeUnassignDialog/AttributeUnassignDialog.tsx b/src/components/AttributeUnassignDialog/AttributeUnassignDialog.tsx index 921370ffc..d3c4cbfad 100644 --- a/src/components/AttributeUnassignDialog/AttributeUnassignDialog.tsx +++ b/src/components/AttributeUnassignDialog/AttributeUnassignDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/components/BackButton.tsx b/src/components/BackButton.tsx index e74d7573d..025570998 100644 --- a/src/components/BackButton.tsx +++ b/src/components/BackButton.tsx @@ -1,6 +1,5 @@ -import { Button } from "@dashboard/components/Button"; import { buttonMessages } from "@dashboard/intl"; -import { ButtonProps } from "@saleor/macaw-ui"; +import { Button, ButtonProps } from "@saleor/macaw-ui/next"; import React, { ReactNode } from "react"; import { FormattedMessage } from "react-intl"; @@ -9,7 +8,7 @@ interface BackButtonProps extends ButtonProps { } const BackButton: React.FC = ({ children, ...props }) => ( - ); diff --git a/src/components/BulkAttributeUnassignDialog/BulkAttributeUnassignDialog.tsx b/src/components/BulkAttributeUnassignDialog/BulkAttributeUnassignDialog.tsx index 7ea327bdd..523c4404e 100644 --- a/src/components/BulkAttributeUnassignDialog/BulkAttributeUnassignDialog.tsx +++ b/src/components/BulkAttributeUnassignDialog/BulkAttributeUnassignDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; @@ -16,7 +16,9 @@ export interface BulkAttributeUnassignDialogProps { onConfirm: () => void; } -const BulkAttributeUnassignDialog: React.FC = ({ +const BulkAttributeUnassignDialog: React.FC< + BulkAttributeUnassignDialogProps +> = ({ title, attributeQuantity, confirmButtonState, diff --git a/src/components/ChannelsAvailabilityDialog/ChannelsAvailabilityDialog.tsx b/src/components/ChannelsAvailabilityDialog/ChannelsAvailabilityDialog.tsx index 8fa83d21d..9cd9a037d 100644 --- a/src/components/ChannelsAvailabilityDialog/ChannelsAvailabilityDialog.tsx +++ b/src/components/ChannelsAvailabilityDialog/ChannelsAvailabilityDialog.tsx @@ -1,6 +1,6 @@ import { Channel } from "@dashboard/channels/utils"; import ActionDialog from "@dashboard/components/ActionDialog"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import React from "react"; import ChannelsAvailabilityDialogChannelsList from "../ChannelsAvailabilityDialogChannelsList"; @@ -23,7 +23,9 @@ export interface ChannelsAvailabilityDialogProps { toggleAll?: (items: Channel[], selected: number) => void; } -export const ChannelsAvailabilityDialog: React.FC = ({ +export const ChannelsAvailabilityDialog: React.FC< + ChannelsAvailabilityDialogProps +> = ({ isSelected, channels, confirmButtonState, @@ -37,9 +39,8 @@ export const ChannelsAvailabilityDialog: React.FC { - const { query, onQueryChange, filteredChannels } = useChannelsSearch( - channels, - ); + const { query, onQueryChange, filteredChannels } = + useChannelsSearch(channels); const hasChannels = channels.length > 0; const handleToggleAll = () => toggleAll(channels, selected); diff --git a/src/components/ConfirmButton.tsx b/src/components/ConfirmButton.tsx deleted file mode 100644 index 24d0be170..000000000 --- a/src/components/ConfirmButton.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import { buttonMessages, commonMessages } from "@dashboard/intl"; -import { - ConfirmButton as MacawConfirmButton, - ConfirmButtonLabels, - ConfirmButtonProps as MacawConfirmButtonProps, -} from "@saleor/macaw-ui"; -import React from "react"; -import { useIntl } from "react-intl"; - -export interface ConfirmButtonProps - extends Omit { - labels?: Partial; -} - -export const ConfirmButton: React.FC = ({ - labels = {}, - ...rest -}) => { - const intl = useIntl(); - - const defaultLabels: ConfirmButtonLabels = { - confirm: intl.formatMessage(buttonMessages.save), - error: intl.formatMessage(commonMessages.error), - }; - const componentLabels: ConfirmButtonLabels = { - ...defaultLabels, - ...labels, - }; - - return ; -}; -ConfirmButton.displayName = "ConfirmButton"; -export default ConfirmButton; diff --git a/src/components/ConfirmButton/ConfirmButton.test.tsx b/src/components/ConfirmButton/ConfirmButton.test.tsx new file mode 100644 index 000000000..7ab78718b --- /dev/null +++ b/src/components/ConfirmButton/ConfirmButton.test.tsx @@ -0,0 +1,132 @@ +import { + fireEvent, + render, + screen, + waitFor, + waitForElementToBeRemoved, +} from "@testing-library/react"; +import React from "react"; + +import { ConfirmButton } from "./ConfirmButton"; + +jest.mock("react-intl", () => ({ + useIntl: jest.fn(() => ({ + formatMessage: jest.fn(x => x.defaultMessage), + })), + defineMessages: jest.fn(x => x), + FormattedMessage: ({ defaultMessage }) => <>{defaultMessage}, +})); + +describe("ConfirmButton", () => { + it("should render a button with confirm label", () => { + render( + , + ); + + expect(screen.getByRole("button")).toBeInTheDocument(); + expect(screen.getByRole("button")).toHaveTextContent("Confirm"); + }); + + it("should render a button with error label", () => { + render( + , + ); + + expect(screen.getByRole("button")).toBeInTheDocument(); + expect(screen.getByRole("button")).toHaveTextContent("Error"); + }); + + it("should render a button with loading spinner", () => { + render(); + + expect(screen.getByRole("button")).toBeInTheDocument(); + expect(screen.getByTestId("button-progress")).toBeInTheDocument(); + }); + + it("should render a button with success", () => { + render(); + + expect(screen.getByRole("button")).toBeInTheDocument(); + expect(screen.getByTestId("button-success")).toBeInTheDocument(); + }); + + it("should call onClick when clicked", () => { + const onClick = jest.fn(); + render(); + + fireEvent.click(screen.getByRole("button")); + + expect(onClick).toHaveBeenCalled(); + }); + + it("should render confirm label after success state", async () => { + const { rerender } = render( + , + ); + expect(screen.getByTestId("button-progress")).toBeInTheDocument(); + + rerender( + , + ); + + expect(screen.getByTestId("button-success")).toBeInTheDocument(); + + await waitForElementToBeRemoved( + () => screen.getByTestId("button-success"), + { + timeout: 5000, + }, + ); + + expect(screen.queryByTestId("button-success")).not.toBeInTheDocument(); + }); + + it("should render error label after error state", async () => { + const { rerender } = render( + , + ); + expect(screen.getByTestId("button-progress")).toBeInTheDocument(); + expect(screen.queryByText(/error/i)).not.toBeInTheDocument(); + + rerender( + , + ); + + await waitFor(() => { + expect(screen.getByText(/error/i)).toBeInTheDocument(); + }); + + expect(screen.queryByTestId("button-progress")).not.toBeInTheDocument(); + }); +}); diff --git a/src/components/ConfirmButton/ConfirmButton.tsx b/src/components/ConfirmButton/ConfirmButton.tsx new file mode 100644 index 000000000..a38aed018 --- /dev/null +++ b/src/components/ConfirmButton/ConfirmButton.tsx @@ -0,0 +1,153 @@ +import { buttonMessages, commonMessages } from "@dashboard/intl"; +import CircularProgress from "@material-ui/core/CircularProgress"; +import CheckIcon from "@material-ui/icons/Check"; +import { Button, ButtonProps, sprinkles } from "@saleor/macaw-ui/next"; +import React, { useEffect, useRef, useState } from "react"; +import { useIntl } from "react-intl"; + +const DEFAULT_NOTIFICATION_SHOW_TIME = 3000; + +export type ConfirmButtonTransitionState = + | "default" + | "loading" + | "success" + | "error"; + +export type ConfirmButtonLabels = Partial>; + +export interface ConfirmButtonProps extends ButtonProps { + labels?: ConfirmButtonLabels; + noTransition?: boolean; + transitionState: ConfirmButtonTransitionState; + onTransitionToDefault?: () => void; +} + +// Here you can find original implementation +// https://github.com/saleor/macaw-ui/blob/canary/legacy/src/ConfirmButton/ConfirmButton.tsx + +export const ConfirmButton = ({ + labels, + noTransition, + transitionState, + onTransitionToDefault, + onClick, + disabled, + children, + variant, + ...props +}: ConfirmButtonProps) => { + const intl = useIntl(); + const [displayCompletedActionState, setDisplayCompletedActionState] = + useState(false); + const timeout = useRef(); + + const isCompleted = noTransition + ? transitionState !== "default" + : displayCompletedActionState; + + const isError = transitionState === "error" && isCompleted; + + const defaultLabels: ConfirmButtonLabels = { + confirm: intl.formatMessage(buttonMessages.save), + error: intl.formatMessage(commonMessages.error), + }; + + const componentLabels: ConfirmButtonLabels = { + ...defaultLabels, + ...labels, + }; + + useEffect(() => { + if (!noTransition && transitionState === "loading") { + setDisplayCompletedActionState(true); + } + }, [transitionState, noTransition]); + + useEffect(() => { + if (noTransition) { + return; + } + + if ( + (["error", "success"] as ConfirmButtonTransitionState[]).includes( + transitionState, + ) + ) { + timeout.current = setTimeout(() => { + setDisplayCompletedActionState(false); + if (onTransitionToDefault) { + onTransitionToDefault(); + } + }, DEFAULT_NOTIFICATION_SHOW_TIME) as unknown as number; + } else if (transitionState === "loading") { + clearTimeout(timeout.current); + } + + return () => { + if (timeout.current) { + clearTimeout(timeout.current); + } + }; + }, [noTransition, transitionState, onTransitionToDefault]); + + const renderContent = () => { + if (transitionState === "loading") { + return ( + // TODO: Replace with new component when it will be ready https://github.com/saleor/macaw-ui/issues/443 + + ); + } + + if (transitionState === "success" && isCompleted) { + return ( + // TODO: Replace with new component when it will be ready https://github.com/saleor/macaw-ui/issues/443 + + ); + } + + return null; + }; + + const getByLabelText = () => { + if (isError) { + return componentLabels.error; + } + + return children || componentLabels.confirm; + }; + + return ( + + ); +}; diff --git a/src/components/ConfirmButton/index.ts b/src/components/ConfirmButton/index.ts new file mode 100644 index 000000000..b514a04cd --- /dev/null +++ b/src/components/ConfirmButton/index.ts @@ -0,0 +1 @@ +export * from "./ConfirmButton"; diff --git a/src/components/DeleteFilterTabDialog/DeleteFilterTabDialog.tsx b/src/components/DeleteFilterTabDialog/DeleteFilterTabDialog.tsx index 9b0de9611..b814091bd 100644 --- a/src/components/DeleteFilterTabDialog/DeleteFilterTabDialog.tsx +++ b/src/components/DeleteFilterTabDialog/DeleteFilterTabDialog.tsx @@ -1,6 +1,6 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { buttonMessages } from "@dashboard/intl"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/components/SaveFilterTabDialog/SaveFilterTabDialog.tsx b/src/components/SaveFilterTabDialog/SaveFilterTabDialog.tsx index 1b771507d..e4b01e4e6 100644 --- a/src/components/SaveFilterTabDialog/SaveFilterTabDialog.tsx +++ b/src/components/SaveFilterTabDialog/SaveFilterTabDialog.tsx @@ -1,3 +1,4 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { buttonMessages } from "@dashboard/intl"; import { Dialog, @@ -6,12 +7,11 @@ import { DialogTitle, TextField, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; import BackButton from "../BackButton"; -import ConfirmButton from "../ConfirmButton"; +import { ConfirmButton } from "../ConfirmButton"; import Form from "../Form"; export interface SaveFilterTabDialogFormData { diff --git a/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialog.tsx b/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialog.tsx index 16b900de0..06a5b3f5d 100644 --- a/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialog.tsx +++ b/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialog.tsx @@ -1,7 +1,7 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { getById } from "@dashboard/misc"; import ModalTitle from "@dashboard/orders/components/OrderDiscountCommonModal/ModalTitle"; import { Card, CardContent, CircularProgress, Modal } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; @@ -87,8 +87,9 @@ function TypeDeleteWarningDialog({ const singleItemSelectedId = typesToDelete[0]; - const singleItemSelectedName = typesData.find(getById(singleItemSelectedId)) - ?.name; + const singleItemSelectedName = typesData.find( + getById(singleItemSelectedId), + )?.name; return ( diff --git a/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialogContent.tsx b/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialogContent.tsx index d4ab2297a..7c90318d4 100644 --- a/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialogContent.tsx +++ b/src/components/TypeDeleteWarningDialog/TypeDeleteWarningDialogContent.tsx @@ -1,5 +1,5 @@ import CardSpacer from "@dashboard/components/CardSpacer"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { ConfirmButton } from "@dashboard/components/ConfirmButton"; import HorizontalSpacer from "@dashboard/components/HorizontalSpacer"; import useNavigator from "@dashboard/hooks/useNavigator"; import { CardContent } from "@material-ui/core"; diff --git a/src/custom-apps/components/CustomAppCreatePage/CustomAppCreatePage.tsx b/src/custom-apps/components/CustomAppCreatePage/CustomAppCreatePage.tsx index f78aadfd7..38bcbfedf 100644 --- a/src/custom-apps/components/CustomAppCreatePage/CustomAppCreatePage.tsx +++ b/src/custom-apps/components/CustomAppCreatePage/CustomAppCreatePage.tsx @@ -1,5 +1,6 @@ import AccountPermissions from "@dashboard/components/AccountPermissions"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Savebar from "@dashboard/components/Savebar"; @@ -13,7 +14,6 @@ import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; import { getFormErrors } from "@dashboard/utils/errors"; import getAppErrorMessage from "@dashboard/utils/errors/app"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/custom-apps/components/CustomAppDetailsPage/CustomAppDetailsPage.tsx b/src/custom-apps/components/CustomAppDetailsPage/CustomAppDetailsPage.tsx index 56a4fdfc2..8093691d7 100644 --- a/src/custom-apps/components/CustomAppDetailsPage/CustomAppDetailsPage.tsx +++ b/src/custom-apps/components/CustomAppDetailsPage/CustomAppDetailsPage.tsx @@ -1,6 +1,7 @@ import AccountPermissions from "@dashboard/components/AccountPermissions"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Savebar from "@dashboard/components/Savebar"; @@ -16,7 +17,7 @@ import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; import { getFormErrors } from "@dashboard/utils/errors"; import getAppErrorMessage from "@dashboard/utils/errors/app"; -import { Button, ConfirmButtonTransitionState } from "@saleor/macaw-ui"; +import { Button } from "@saleor/macaw-ui"; import React from "react"; import SVG from "react-inlinesvg"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/custom-apps/components/TokenCreateDialog/TokenCreateDialog.tsx b/src/custom-apps/components/TokenCreateDialog/TokenCreateDialog.tsx index dac1fa9e5..494ef2015 100644 --- a/src/custom-apps/components/TokenCreateDialog/TokenCreateDialog.tsx +++ b/src/custom-apps/components/TokenCreateDialog/TokenCreateDialog.tsx @@ -1,7 +1,10 @@ import BackButton from "@dashboard/components/BackButton"; import { Button } from "@dashboard/components/Button"; import CardSpacer from "@dashboard/components/CardSpacer"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import FormSpacer from "@dashboard/components/FormSpacer"; import { getApiUrl } from "@dashboard/config"; @@ -17,7 +20,6 @@ import { TextField, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/custom-apps/components/TokenDeleteDialog/TokenDeleteDialog.tsx b/src/custom-apps/components/TokenDeleteDialog/TokenDeleteDialog.tsx index 0fc480d6e..65b0097b7 100644 --- a/src/custom-apps/components/TokenDeleteDialog/TokenDeleteDialog.tsx +++ b/src/custom-apps/components/TokenDeleteDialog/TokenDeleteDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/custom-apps/components/WebhookDeleteDialog/WebhookDeleteDialog.tsx b/src/custom-apps/components/WebhookDeleteDialog/WebhookDeleteDialog.tsx index 54d490542..c6231477a 100644 --- a/src/custom-apps/components/WebhookDeleteDialog/WebhookDeleteDialog.tsx +++ b/src/custom-apps/components/WebhookDeleteDialog/WebhookDeleteDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/custom-apps/components/WebhookDetailsPage/WebhookDetailsPage.tsx b/src/custom-apps/components/WebhookDetailsPage/WebhookDetailsPage.tsx index 81901a880..326f09b08 100644 --- a/src/custom-apps/components/WebhookDetailsPage/WebhookDetailsPage.tsx +++ b/src/custom-apps/components/WebhookDetailsPage/WebhookDetailsPage.tsx @@ -1,4 +1,5 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import FormSpacer from "@dashboard/components/FormSpacer"; import { DetailPageLayout } from "@dashboard/components/Layouts"; @@ -20,7 +21,6 @@ import { } from "@dashboard/graphql"; import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { Box } from "@saleor/macaw-ui/next"; import { parse, print } from "graphql"; import React, { useEffect, useState } from "react"; diff --git a/src/customers/components/CustomerAddressDialog/CustomerAddressDialog.tsx b/src/customers/components/CustomerAddressDialog/CustomerAddressDialog.tsx index 01601e9fb..8a4195808 100644 --- a/src/customers/components/CustomerAddressDialog/CustomerAddressDialog.tsx +++ b/src/customers/components/CustomerAddressDialog/CustomerAddressDialog.tsx @@ -1,7 +1,10 @@ import AddressEdit from "@dashboard/components/AddressEdit"; import { createCountryHandler } from "@dashboard/components/AddressEdit/createCountryHandler"; import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { AccountErrorFragment, @@ -21,7 +24,7 @@ import { DialogContent, DialogTitle, } from "@material-ui/core"; -import { ConfirmButtonTransitionState, makeStyles } from "@saleor/macaw-ui"; +import { makeStyles } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage } from "react-intl"; diff --git a/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx b/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx index 79a679518..88f94a727 100644 --- a/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx +++ b/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx @@ -1,6 +1,7 @@ import { createCountryHandler } from "@dashboard/components/AddressEdit/createCountryHandler"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { CardSpacer } from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Savebar from "@dashboard/components/Savebar"; @@ -16,7 +17,6 @@ import useNavigator from "@dashboard/hooks/useNavigator"; import { extractMutationErrors } from "@dashboard/misc"; import createSingleAutocompleteSelectHandler from "@dashboard/utils/handlers/singleAutocompleteSelectChangeHandler"; import { mapCountriesToChoices } from "@dashboard/utils/maps"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/customers/components/CustomerDetailsPage/CustomerDetailsPage.tsx b/src/customers/components/CustomerDetailsPage/CustomerDetailsPage.tsx index 0eb752109..dddadbe65 100644 --- a/src/customers/components/CustomerDetailsPage/CustomerDetailsPage.tsx +++ b/src/customers/components/CustomerDetailsPage/CustomerDetailsPage.tsx @@ -7,6 +7,7 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { Backlink } from "@dashboard/components/Backlink"; import CardMenu from "@dashboard/components/CardMenu/CardMenu"; import { CardSpacer } from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata/Metadata"; @@ -29,7 +30,6 @@ import { sectionNames } from "@dashboard/intl"; import { orderListUrl } from "@dashboard/orders/urls"; import { mapEdgesToItems, mapMetadataItemToInput } from "@dashboard/utils/maps"; import useMetadataChangeTrigger from "@dashboard/utils/metadata/useMetadataChangeTrigger"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/discounts/components/DiscountCountrySelectDialog/DiscountCountrySelectDialog.tsx b/src/discounts/components/DiscountCountrySelectDialog/DiscountCountrySelectDialog.tsx index d9f55b3fa..0b0cc2787 100644 --- a/src/discounts/components/DiscountCountrySelectDialog/DiscountCountrySelectDialog.tsx +++ b/src/discounts/components/DiscountCountrySelectDialog/DiscountCountrySelectDialog.tsx @@ -1,6 +1,9 @@ import BackButton from "@dashboard/components/BackButton"; import Checkbox from "@dashboard/components/Checkbox"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import FormSpacer from "@dashboard/components/FormSpacer"; import Hr from "@dashboard/components/Hr"; @@ -19,7 +22,6 @@ import { TextField, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { filter } from "fuzzaldrin"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/discounts/components/SaleCreatePage/SaleCreatePage.tsx b/src/discounts/components/SaleCreatePage/SaleCreatePage.tsx index 81827b99a..79cc7207a 100644 --- a/src/discounts/components/SaleCreatePage/SaleCreatePage.tsx +++ b/src/discounts/components/SaleCreatePage/SaleCreatePage.tsx @@ -1,6 +1,7 @@ import { validateSalePrice } from "@dashboard/channels/utils"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import ChannelsAvailabilityCard from "@dashboard/components/ChannelsAvailabilityCard"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata, MetadataFormData } from "@dashboard/components/Metadata"; @@ -15,7 +16,6 @@ import { } from "@dashboard/graphql"; import { SubmitPromise } from "@dashboard/hooks/useForm"; import useMetadataChangeTrigger from "@dashboard/utils/metadata/useMetadataChangeTrigger"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx b/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx index 689b5cf4e..f004338fe 100644 --- a/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx +++ b/src/discounts/components/SaleDetailsPage/SaleDetailsPage.tsx @@ -2,6 +2,7 @@ import { ChannelSaleData, validateSalePrice } from "@dashboard/channels/utils"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; import ChannelsAvailabilityCard from "@dashboard/components/ChannelsAvailabilityCard"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata, MetadataFormData } from "@dashboard/components/Metadata"; @@ -24,7 +25,6 @@ import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; import { mapEdgesToItems, mapMetadataItemToInput } from "@dashboard/utils/maps"; import useMetadataChangeTrigger from "@dashboard/utils/metadata/useMetadataChangeTrigger"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { sprinkles } from "@saleor/macaw-ui/next"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx b/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx index ee48c1a48..bdcaf0591 100644 --- a/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx +++ b/src/discounts/components/VoucherCreatePage/VoucherCreatePage.tsx @@ -1,6 +1,7 @@ import { ChannelVoucherData } from "@dashboard/channels/utils"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import ChannelsAvailabilityCard from "@dashboard/components/ChannelsAvailabilityCard"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { Metadata } from "@dashboard/components/Metadata"; @@ -20,7 +21,6 @@ import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; import { validatePrice } from "@dashboard/products/utils/validation"; import useMetadataChangeTrigger from "@dashboard/utils/metadata/useMetadataChangeTrigger"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/discounts/components/VoucherDetailsPage/VoucherDetailsPage.tsx b/src/discounts/components/VoucherDetailsPage/VoucherDetailsPage.tsx index 5760ccee7..cca2d34c2 100644 --- a/src/discounts/components/VoucherDetailsPage/VoucherDetailsPage.tsx +++ b/src/discounts/components/VoucherDetailsPage/VoucherDetailsPage.tsx @@ -2,6 +2,7 @@ import { ChannelVoucherData } from "@dashboard/channels/utils"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; import ChannelsAvailabilityCard from "@dashboard/components/ChannelsAvailabilityCard"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import CountryList from "@dashboard/components/CountryList"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; @@ -30,7 +31,6 @@ import useNavigator from "@dashboard/hooks/useNavigator"; import { mapEdgesToItems, mapMetadataItemToInput } from "@dashboard/utils/maps"; import useMetadataChangeTrigger from "@dashboard/utils/metadata/useMetadataChangeTrigger"; import { Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/giftCards/GiftCardBulkCreateDialog/GiftCardBulkCreateDialogForm.tsx b/src/giftCards/GiftCardBulkCreateDialog/GiftCardBulkCreateDialogForm.tsx index 7efd49db4..d24d4101f 100644 --- a/src/giftCards/GiftCardBulkCreateDialog/GiftCardBulkCreateDialogForm.tsx +++ b/src/giftCards/GiftCardBulkCreateDialog/GiftCardBulkCreateDialogForm.tsx @@ -1,5 +1,6 @@ import DialogButtons from "@dashboard/components/ActionDialog/DialogButtons"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import VerticalSpacer from "@dashboard/components/VerticalSpacer"; import GiftCardTagInput from "@dashboard/giftCards/components/GiftCardTagInput"; import { @@ -14,7 +15,6 @@ import { TextField, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogForm.tsx b/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogForm.tsx index 67f99af6d..25d072ba2 100644 --- a/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogForm.tsx +++ b/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogForm.tsx @@ -1,5 +1,6 @@ import DialogButtons from "@dashboard/components/ActionDialog/DialogButtons"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import VerticalSpacer from "@dashboard/components/VerticalSpacer"; import GiftCardTagInput from "@dashboard/giftCards/components/GiftCardTagInput"; import { @@ -13,7 +14,6 @@ import { commonMessages } from "@dashboard/intl"; import Label from "@dashboard/orders/components/OrderHistory/Label"; import { getFormErrors } from "@dashboard/utils/errors"; import { DialogContent, Divider, TextField } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React, { useState } from "react"; import { useIntl } from "react-intl"; diff --git a/src/giftCards/GiftCardExportDialogContent/GiftCardExportDialogContent.tsx b/src/giftCards/GiftCardExportDialogContent/GiftCardExportDialogContent.tsx index c63da35bd..a8b1e9a73 100644 --- a/src/giftCards/GiftCardExportDialogContent/GiftCardExportDialogContent.tsx +++ b/src/giftCards/GiftCardExportDialogContent/GiftCardExportDialogContent.tsx @@ -1,4 +1,4 @@ -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { ConfirmButton } from "@dashboard/components/ConfirmButton"; import { Task } from "@dashboard/containers/BackgroundTasks/types"; import { useExportGiftCardsMutation, diff --git a/src/giftCards/GiftCardsList/GiftCardsListTable/GiftCardsListTableHeader/BulkEnableDisableSection.tsx b/src/giftCards/GiftCardsList/GiftCardsListTable/GiftCardsListTableHeader/BulkEnableDisableSection.tsx index 4b211fd61..ae9bd3571 100644 --- a/src/giftCards/GiftCardsList/GiftCardsListTable/GiftCardsListTableHeader/BulkEnableDisableSection.tsx +++ b/src/giftCards/GiftCardsList/GiftCardsListTable/GiftCardsListTableHeader/BulkEnableDisableSection.tsx @@ -1,4 +1,4 @@ -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { ConfirmButton } from "@dashboard/components/ConfirmButton"; import { IMessage } from "@dashboard/components/messages"; import { useGiftCardBulkActivateMutation, @@ -35,65 +35,61 @@ const BulkEnableDisableSection: React.FC = () => { .filter(getByIds(ids)) .every(({ isActive }) => !isActive); - const [ - activateGiftCards, - activateGiftCardsOpts, - ] = useGiftCardBulkActivateMutation({ - onCompleted: data => { - const { errors, count } = data?.giftCardBulkActivate; + const [activateGiftCards, activateGiftCardsOpts] = + useGiftCardBulkActivateMutation({ + onCompleted: data => { + const { errors, count } = data?.giftCardBulkActivate; - const notifierData: IMessage = !!errors?.length - ? { - status: "error", - text: intl.formatMessage(messages.errorActivateAlertText, { - count, - }), - } - : { - status: "success", - text: intl.formatMessage(messages.successActivateAlertText, { - count, - }), - }; + const notifierData: IMessage = !!errors?.length + ? { + status: "error", + text: intl.formatMessage(messages.errorActivateAlertText, { + count, + }), + } + : { + status: "success", + text: intl.formatMessage(messages.successActivateAlertText, { + count, + }), + }; - notify(notifierData); + notify(notifierData); - if (!errors.length) { - reset(); - } - }, - refetchQueries: [GIFT_CARD_LIST_QUERY], - }); + if (!errors.length) { + reset(); + } + }, + refetchQueries: [GIFT_CARD_LIST_QUERY], + }); - const [ - deactivateGiftCards, - deactivateGiftCardsOpts, - ] = useGiftCardBulkDeactivateMutation({ - onCompleted: data => { - const { errors, count } = data?.giftCardBulkDeactivate; + const [deactivateGiftCards, deactivateGiftCardsOpts] = + useGiftCardBulkDeactivateMutation({ + onCompleted: data => { + const { errors, count } = data?.giftCardBulkDeactivate; - const notifierData: IMessage = !!errors?.length - ? { - status: "error", - text: intl.formatMessage(messages.errorDeactivateAlertText, { - count, - }), - } - : { - status: "success", - text: intl.formatMessage(messages.successDeactivateAlertText, { - count, - }), - }; + const notifierData: IMessage = !!errors?.length + ? { + status: "error", + text: intl.formatMessage(messages.errorDeactivateAlertText, { + count, + }), + } + : { + status: "success", + text: intl.formatMessage(messages.successDeactivateAlertText, { + count, + }), + }; - notify(notifierData); + notify(notifierData); - if (!errors.length) { - reset(); - } - }, - refetchQueries: [GIFT_CARD_LIST_QUERY], - }); + if (!errors.length) { + reset(); + } + }, + refetchQueries: [GIFT_CARD_LIST_QUERY], + }); const handleActivateGiftCards = () => activateGiftCards({ variables: { ids } }); diff --git a/src/misc.ts b/src/misc.ts index 8a769bf5c..4f752d5c5 100644 --- a/src/misc.ts +++ b/src/misc.ts @@ -7,12 +7,13 @@ import { PaymentChargeStatusEnum, } from "@dashboard/graphql"; import { Node, SlugNode } from "@dashboard/types"; -import { ConfirmButtonTransitionState, ThemeType } from "@saleor/macaw-ui"; +import { ThemeType } from "@saleor/macaw-ui"; import { DefaultTheme, ThemeTokensValues } from "@saleor/macaw-ui/next"; import uniqBy from "lodash/uniqBy"; import moment from "moment-timezone"; import { IntlShape } from "react-intl"; +import { ConfirmButtonTransitionState } from "./components/ConfirmButton"; import { MultiAutocompleteChoiceType } from "./components/MultiAutocompleteSelectField"; import { AddressType, AddressTypeInput } from "./customers/types"; import { diff --git a/src/navigation/components/MenuCreateDialog/MenuCreateDialog.tsx b/src/navigation/components/MenuCreateDialog/MenuCreateDialog.tsx index 5a0280ea4..ae79b8ee8 100644 --- a/src/navigation/components/MenuCreateDialog/MenuCreateDialog.tsx +++ b/src/navigation/components/MenuCreateDialog/MenuCreateDialog.tsx @@ -1,5 +1,8 @@ import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { MenuErrorFragment } from "@dashboard/graphql"; import { buttonMessages } from "@dashboard/intl"; @@ -12,7 +15,6 @@ import { DialogTitle, TextField, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/navigation/components/MenuDetailsPage/MenuDetailsPage.tsx b/src/navigation/components/MenuDetailsPage/MenuDetailsPage.tsx index d5bbbdba5..ed61345de 100644 --- a/src/navigation/components/MenuDetailsPage/MenuDetailsPage.tsx +++ b/src/navigation/components/MenuDetailsPage/MenuDetailsPage.tsx @@ -1,5 +1,6 @@ import { Backlink } from "@dashboard/components/Backlink"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import Grid from "@dashboard/components/Grid"; import { DetailPageLayout } from "@dashboard/components/Layouts"; @@ -10,7 +11,6 @@ import useNavigator from "@dashboard/hooks/useNavigator"; import { sectionNames } from "@dashboard/intl"; import { menuListUrl } from "@dashboard/navigation/urls"; import { Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { Box } from "@saleor/macaw-ui/next"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/navigation/components/MenuItemDialog/MenuItemDialog.tsx b/src/navigation/components/MenuItemDialog/MenuItemDialog.tsx index 1190e4c4c..5ebfaa2b0 100644 --- a/src/navigation/components/MenuItemDialog/MenuItemDialog.tsx +++ b/src/navigation/components/MenuItemDialog/MenuItemDialog.tsx @@ -1,6 +1,9 @@ import AutocompleteSelectMenu from "@dashboard/components/AutocompleteSelectMenu"; import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import FormSpacer from "@dashboard/components/FormSpacer"; import { MenuErrorFragment, @@ -24,7 +27,6 @@ import { TextField, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import isUrl from "is-url"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderAddressFields/OrderAddressFields.tsx b/src/orders/components/OrderAddressFields/OrderAddressFields.tsx index f713a9d7f..1430b925d 100644 --- a/src/orders/components/OrderAddressFields/OrderAddressFields.tsx +++ b/src/orders/components/OrderAddressFields/OrderAddressFields.tsx @@ -1,3 +1,4 @@ +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { AddressFragment, CustomerAddressesQuery, @@ -6,7 +7,6 @@ import { } from "@dashboard/graphql"; import { SubmitPromise } from "@dashboard/hooks/useForm"; import { transformAddressToForm } from "@dashboard/misc"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import OrderCustomerAddressesEditDialog, { diff --git a/src/orders/components/OrderBulkCancelDialog/OrderBulkCancelDialog.tsx b/src/orders/components/OrderBulkCancelDialog/OrderBulkCancelDialog.tsx index c92346977..e65d0cdc9 100644 --- a/src/orders/components/OrderBulkCancelDialog/OrderBulkCancelDialog.tsx +++ b/src/orders/components/OrderBulkCancelDialog/OrderBulkCancelDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderCancelDialog/OrderCancelDialog.tsx b/src/orders/components/OrderCancelDialog/OrderCancelDialog.tsx index c21beb4ab..7fb721492 100644 --- a/src/orders/components/OrderCancelDialog/OrderCancelDialog.tsx +++ b/src/orders/components/OrderCancelDialog/OrderCancelDialog.tsx @@ -1,5 +1,8 @@ import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import FormSpacer from "@dashboard/components/FormSpacer"; import { OrderErrorFragment } from "@dashboard/graphql"; import useModalDialogErrors from "@dashboard/hooks/useModalDialogErrors"; @@ -12,7 +15,6 @@ import { DialogContentText, DialogTitle, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesEditDialog.tsx b/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesEditDialog.tsx index c4f6b24a1..84d79f903 100644 --- a/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesEditDialog.tsx +++ b/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesEditDialog.tsx @@ -1,5 +1,8 @@ import Checkbox from "@dashboard/components/Checkbox"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import FormSpacer from "@dashboard/components/FormSpacer"; import VerticalSpacer from "@dashboard/components/VerticalSpacer"; import { AddressTypeInput } from "@dashboard/customers/types"; @@ -25,7 +28,7 @@ import { FormControlLabel, Typography, } from "@material-ui/core"; -import { ConfirmButtonTransitionState, DialogHeader } from "@saleor/macaw-ui"; +import { DialogHeader } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, MessageDescriptor, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesSearch.tsx b/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesSearch.tsx index 8f8c578b9..733fa6886 100644 --- a/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesSearch.tsx +++ b/src/orders/components/OrderCustomerAddressesEditDialog/OrderCustomerAddressesSearch.tsx @@ -1,4 +1,7 @@ -import { ConfirmButton } from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import VerticalSpacer from "@dashboard/components/VerticalSpacer"; import CustomerAddressChoiceCard from "@dashboard/customers/components/CustomerAddressChoiceCard"; import { AddressFragment, AddressTypeEnum } from "@dashboard/graphql"; @@ -13,11 +16,7 @@ import { InputAdornment, TextField, } from "@material-ui/core"; -import { - Button, - ConfirmButtonTransitionState, - SearchIcon, -} from "@saleor/macaw-ui"; +import { Button, SearchIcon } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderCustomerChangeDialog/OrderCustomerChangeDialog.tsx b/src/orders/components/OrderCustomerChangeDialog/OrderCustomerChangeDialog.tsx index d83f07b36..3d6fcdf31 100644 --- a/src/orders/components/OrderCustomerChangeDialog/OrderCustomerChangeDialog.tsx +++ b/src/orders/components/OrderCustomerChangeDialog/OrderCustomerChangeDialog.tsx @@ -1,4 +1,4 @@ -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { ConfirmButton } from "@dashboard/components/ConfirmButton"; import FormSpacer from "@dashboard/components/FormSpacer"; import { buttonMessages } from "@dashboard/intl"; import { diff --git a/src/orders/components/OrderDetailsPage/OrderDetailsPage.tsx b/src/orders/components/OrderDetailsPage/OrderDetailsPage.tsx index e3d130cf7..9b47ac4bc 100644 --- a/src/orders/components/OrderDetailsPage/OrderDetailsPage.tsx +++ b/src/orders/components/OrderDetailsPage/OrderDetailsPage.tsx @@ -6,6 +6,7 @@ import { import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardMenu from "@dashboard/components/CardMenu"; import { CardSpacer } from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { useDevModeContext } from "@dashboard/components/DevModePanel/hooks"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; @@ -22,7 +23,6 @@ import { SubmitPromise } from "@dashboard/hooks/useForm"; import useNavigator from "@dashboard/hooks/useNavigator"; import { defaultGraphiQLQuery } from "@dashboard/orders/queries"; import { orderListUrl } from "@dashboard/orders/urls"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/orders/components/OrderDiscountCommonModal/OrderDiscountCommonModal.tsx b/src/orders/components/OrderDiscountCommonModal/OrderDiscountCommonModal.tsx index 4ffd4421e..21552a88d 100644 --- a/src/orders/components/OrderDiscountCommonModal/OrderDiscountCommonModal.tsx +++ b/src/orders/components/OrderDiscountCommonModal/OrderDiscountCommonModal.tsx @@ -1,6 +1,9 @@ import DialogButtons from "@dashboard/components/ActionDialog/DialogButtons"; import CardSpacer from "@dashboard/components/CardSpacer"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import PriceField from "@dashboard/components/PriceField"; import RadioGroupField from "@dashboard/components/RadioGroupField"; import { DiscountValueTypeEnum, MoneyFragment } from "@dashboard/graphql"; @@ -8,7 +11,7 @@ import { useUpdateEffect } from "@dashboard/hooks/useUpdateEffect"; import { buttonMessages } from "@dashboard/intl"; import { toFixed } from "@dashboard/utils/toFixed"; import { Card, CardContent, TextField, Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState, makeStyles } from "@saleor/macaw-ui"; +import { makeStyles } from "@saleor/macaw-ui"; import React, { ChangeEvent, useEffect, useRef, useState } from "react"; import { defineMessages, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderDraftCancelDialog/OrderDraftCancelDialog.tsx b/src/orders/components/OrderDraftCancelDialog/OrderDraftCancelDialog.tsx index a6a060755..713e3b683 100644 --- a/src/orders/components/OrderDraftCancelDialog/OrderDraftCancelDialog.tsx +++ b/src/orders/components/OrderDraftCancelDialog/OrderDraftCancelDialog.tsx @@ -1,10 +1,10 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import FormSpacer from "@dashboard/components/FormSpacer"; import { OrderErrorFragment } from "@dashboard/graphql"; import useModalDialogErrors from "@dashboard/hooks/useModalDialogErrors"; import getOrderErrorMessage from "@dashboard/utils/errors/order"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderDraftPage/OrderDraftPage.tsx b/src/orders/components/OrderDraftPage/OrderDraftPage.tsx index b4ece95d7..9d073f7d3 100644 --- a/src/orders/components/OrderDraftPage/OrderDraftPage.tsx +++ b/src/orders/components/OrderDraftPage/OrderDraftPage.tsx @@ -1,6 +1,7 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardMenu from "@dashboard/components/CardMenu"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DateTime } from "@dashboard/components/Date"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Savebar from "@dashboard/components/Savebar"; @@ -18,7 +19,6 @@ import OrderChannelSectionCard from "@dashboard/orders/components/OrderChannelSe import { orderDraftListUrl } from "@dashboard/orders/urls"; import { FetchMoreProps, RelayToFlat } from "@dashboard/types"; import { Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { Box } from "@saleor/macaw-ui/next"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx b/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx index 72b79c215..736033424 100644 --- a/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx +++ b/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx @@ -1,6 +1,7 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; import CardTitle from "@dashboard/components/CardTitle"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import ControlledCheckbox from "@dashboard/components/ControlledCheckbox"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; @@ -40,7 +41,6 @@ import { TableCell, TableHead, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import clsx from "clsx"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderFulfillStockExceededDialog/OrderFulfillStockExceededDialog.tsx b/src/orders/components/OrderFulfillStockExceededDialog/OrderFulfillStockExceededDialog.tsx index bf73f9edc..eb31febbb 100644 --- a/src/orders/components/OrderFulfillStockExceededDialog/OrderFulfillStockExceededDialog.tsx +++ b/src/orders/components/OrderFulfillStockExceededDialog/OrderFulfillStockExceededDialog.tsx @@ -1,5 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; import { CardSpacer } from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import ResponsiveTable from "@dashboard/components/ResponsiveTable"; import TableRowLink from "@dashboard/components/TableRowLink"; import { @@ -13,7 +14,6 @@ import { OrderFulfillStockFormsetData, } from "@dashboard/orders/utils/data"; import { TableBody, TableCell, TableHead, Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; @@ -30,15 +30,11 @@ export interface OrderFulfillStockExceededDialogProps { onClose(); } -const OrderFulfillStockExceededDialog: React.FC = props => { - const { - lines, - open, - formsetData, - confirmButtonState, - onClose, - onSubmit, - } = props; +const OrderFulfillStockExceededDialog: React.FC< + OrderFulfillStockExceededDialogProps +> = props => { + const { lines, open, formsetData, confirmButtonState, onClose, onSubmit } = + props; const intl = useIntl(); const classes = useStyles(props); diff --git a/src/orders/components/OrderFulfillmentApproveDialog/OrderFulfillmentApproveDialog.tsx b/src/orders/components/OrderFulfillmentApproveDialog/OrderFulfillmentApproveDialog.tsx index 10e243580..acbff8644 100644 --- a/src/orders/components/OrderFulfillmentApproveDialog/OrderFulfillmentApproveDialog.tsx +++ b/src/orders/components/OrderFulfillmentApproveDialog/OrderFulfillmentApproveDialog.tsx @@ -1,5 +1,8 @@ import { Button } from "@dashboard/components/Button"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import ControlledCheckbox from "@dashboard/components/ControlledCheckbox"; import Form from "@dashboard/components/Form"; import FormSpacer from "@dashboard/components/FormSpacer"; @@ -13,7 +16,6 @@ import { DialogContentText, DialogTitle, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderFulfillmentCancelDialog/OrderFulfillmentCancelDialog.tsx b/src/orders/components/OrderFulfillmentCancelDialog/OrderFulfillmentCancelDialog.tsx index c76814b06..03661af60 100644 --- a/src/orders/components/OrderFulfillmentCancelDialog/OrderFulfillmentCancelDialog.tsx +++ b/src/orders/components/OrderFulfillmentCancelDialog/OrderFulfillmentCancelDialog.tsx @@ -1,5 +1,8 @@ import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import FormSpacer from "@dashboard/components/FormSpacer"; import SingleAutocompleteSelectField from "@dashboard/components/SingleAutocompleteSelectField"; @@ -14,7 +17,7 @@ import { DialogContentText, DialogTitle, } from "@material-ui/core"; -import { ConfirmButtonTransitionState, makeStyles } from "@saleor/macaw-ui"; +import { makeStyles } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderFulfillmentTrackingDialog/OrderFulfillmentTrackingDialog.tsx b/src/orders/components/OrderFulfillmentTrackingDialog/OrderFulfillmentTrackingDialog.tsx index 51a1278c8..176830b2c 100644 --- a/src/orders/components/OrderFulfillmentTrackingDialog/OrderFulfillmentTrackingDialog.tsx +++ b/src/orders/components/OrderFulfillmentTrackingDialog/OrderFulfillmentTrackingDialog.tsx @@ -1,5 +1,8 @@ import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import FormSpacer from "@dashboard/components/FormSpacer"; import { OrderErrorFragment } from "@dashboard/graphql"; @@ -15,7 +18,6 @@ import { DialogTitle, TextField, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderGrantRefundPage/OrderGrantRefundPage.tsx b/src/orders/components/OrderGrantRefundPage/OrderGrantRefundPage.tsx index 5389c50b3..7bff30638 100644 --- a/src/orders/components/OrderGrantRefundPage/OrderGrantRefundPage.tsx +++ b/src/orders/components/OrderGrantRefundPage/OrderGrantRefundPage.tsx @@ -1,11 +1,11 @@ import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Skeleton from "@dashboard/components/Skeleton"; import { OrderDetailsGrantRefundFragment } from "@dashboard/graphql"; import { orderUrl } from "@dashboard/orders/urls"; import { Card, CardContent, TextField, Typography } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { Text } from "@saleor/macaw-ui/next"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderGrantRefundPage/components/RefundCard.tsx b/src/orders/components/OrderGrantRefundPage/components/RefundCard.tsx index b25928cc2..9308df9a5 100644 --- a/src/orders/components/OrderGrantRefundPage/components/RefundCard.tsx +++ b/src/orders/components/OrderGrantRefundPage/components/RefundCard.tsx @@ -1,6 +1,9 @@ import CardTitle from "@dashboard/components/CardTitle"; import Checkbox from "@dashboard/components/Checkbox"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import { formatMoneyAmount } from "@dashboard/components/Money"; import PriceField from "@dashboard/components/PriceField"; import Skeleton from "@dashboard/components/Skeleton"; @@ -9,7 +12,6 @@ import useLocale from "@dashboard/hooks/useLocale"; import { buttonMessages } from "@dashboard/intl"; import { Card, CardContent, Typography } from "@material-ui/core"; import { useId } from "@reach/auto-id"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { Button } from "@saleor/macaw-ui/next"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderInvoiceEmailSendDialog/OrderInvoiceEmailSendDialog.tsx b/src/orders/components/OrderInvoiceEmailSendDialog/OrderInvoiceEmailSendDialog.tsx index 83318cdca..4ded1e00e 100644 --- a/src/orders/components/OrderInvoiceEmailSendDialog/OrderInvoiceEmailSendDialog.tsx +++ b/src/orders/components/OrderInvoiceEmailSendDialog/OrderInvoiceEmailSendDialog.tsx @@ -1,5 +1,8 @@ import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { + ConfirmButton, + ConfirmButtonTransitionState, +} from "@dashboard/components/ConfirmButton"; import FormSpacer from "@dashboard/components/FormSpacer"; import { InvoiceErrorFragment, InvoiceFragment } from "@dashboard/graphql"; import { buttonMessages } from "@dashboard/intl"; @@ -12,7 +15,6 @@ import { DialogContentText, DialogTitle, } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/orders/components/OrderManualTransactionForm/OrderManualTransactionForm.tsx b/src/orders/components/OrderManualTransactionForm/OrderManualTransactionForm.tsx index 76ccc1481..7d698a986 100644 --- a/src/orders/components/OrderManualTransactionForm/OrderManualTransactionForm.tsx +++ b/src/orders/components/OrderManualTransactionForm/OrderManualTransactionForm.tsx @@ -1,4 +1,4 @@ -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import React from "react"; import { ManualTransactionContext } from "./context"; diff --git a/src/orders/components/OrderManualTransactionForm/components/SubmitButton.tsx b/src/orders/components/OrderManualTransactionForm/components/SubmitButton.tsx index 0da910fb5..3b434d3f7 100644 --- a/src/orders/components/OrderManualTransactionForm/components/SubmitButton.tsx +++ b/src/orders/components/OrderManualTransactionForm/components/SubmitButton.tsx @@ -1,4 +1,5 @@ -import ConfirmButton, { +import { + ConfirmButton, ConfirmButtonProps, } from "@dashboard/components/ConfirmButton"; import React from "react"; @@ -13,6 +14,7 @@ export const SubmitButton: React.FC< return ( = ({ +const ProductVariantEndPreorderDialog: React.FC< + ProductVariantEndPreorderDialogProps +> = ({ confirmButtonState, open, onClose, diff --git a/src/products/components/ProductVariantImageSelectDialog/ProductVariantMediaSelectDialog.tsx b/src/products/components/ProductVariantImageSelectDialog/ProductVariantMediaSelectDialog.tsx index ad0ec2269..91e7865ab 100644 --- a/src/products/components/ProductVariantImageSelectDialog/ProductVariantMediaSelectDialog.tsx +++ b/src/products/components/ProductVariantImageSelectDialog/ProductVariantMediaSelectDialog.tsx @@ -1,5 +1,5 @@ import BackButton from "@dashboard/components/BackButton"; -import ConfirmButton from "@dashboard/components/ConfirmButton"; +import { ConfirmButton } from "@dashboard/components/ConfirmButton"; import { ProductMediaFragment } from "@dashboard/graphql"; import useModalDialogOpen from "@dashboard/hooks/useModalDialogOpen"; import { buttonMessages } from "@dashboard/intl"; diff --git a/src/products/components/ProductVariantPage/ProductVariantPage.tsx b/src/products/components/ProductVariantPage/ProductVariantPage.tsx index 3176ac1eb..4b27aa8d2 100644 --- a/src/products/components/ProductVariantPage/ProductVariantPage.tsx +++ b/src/products/components/ProductVariantPage/ProductVariantPage.tsx @@ -11,6 +11,7 @@ import { VariantAttributeScope, } from "@dashboard/components/Attributes"; import CardSpacer from "@dashboard/components/CardSpacer"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Grid from "@dashboard/components/Grid"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import { MetadataFormData } from "@dashboard/components/Metadata"; @@ -30,7 +31,6 @@ import { VariantDetailsChannelsAvailabilityCard } from "@dashboard/products/comp import { productUrl } from "@dashboard/products/urls"; import { getSelectedMedia } from "@dashboard/products/utils/data"; import { FetchMoreProps, RelayToFlat, ReorderAction } from "@dashboard/types"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { defineMessages, useIntl } from "react-intl"; diff --git a/src/shipping/components/DeleteShippingRateDialog/DeleteShippingRateDialog.tsx b/src/shipping/components/DeleteShippingRateDialog/DeleteShippingRateDialog.tsx index 050405485..e625c68bf 100644 --- a/src/shipping/components/DeleteShippingRateDialog/DeleteShippingRateDialog.tsx +++ b/src/shipping/components/DeleteShippingRateDialog/DeleteShippingRateDialog.tsx @@ -1,7 +1,7 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { getStringOrPlaceholder } from "@dashboard/misc"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; @@ -13,13 +13,9 @@ export interface DeleteShippingRateDialogProps { handleConfirm: () => void; } -export const DeleteShippingRateDialog: React.FC = ({ - confirmButtonState, - onClose, - handleConfirm, - name, - open, -}) => { +export const DeleteShippingRateDialog: React.FC< + DeleteShippingRateDialogProps +> = ({ confirmButtonState, onClose, handleConfirm, name, open }) => { const intl = useIntl(); return ( { id?: string; diff --git a/src/types.ts b/src/types.ts index ea5cca33d..c70f20c1f 100644 --- a/src/types.ts +++ b/src/types.ts @@ -1,6 +1,6 @@ import { FetchResult, MutationResult } from "@apollo/client"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { UserPermissionFragment } from "@dashboard/graphql"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import { FilterElement, IFilter } from "./components/Filter"; import { MultiAutocompleteChoiceType } from "./components/MultiAutocompleteSelectField"; diff --git a/src/warehouses/components/WarehouseCreatePage/WarehouseCreatePage.tsx b/src/warehouses/components/WarehouseCreatePage/WarehouseCreatePage.tsx index 93a36d316..15893f370 100644 --- a/src/warehouses/components/WarehouseCreatePage/WarehouseCreatePage.tsx +++ b/src/warehouses/components/WarehouseCreatePage/WarehouseCreatePage.tsx @@ -2,6 +2,7 @@ import { createCountryHandler } from "@dashboard/components/AddressEdit/createCo import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; import CompanyAddressInput from "@dashboard/components/CompanyAddressInput"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Savebar from "@dashboard/components/Savebar"; @@ -17,7 +18,6 @@ import useStateFromProps from "@dashboard/hooks/useStateFromProps"; import createSingleAutocompleteSelectHandler from "@dashboard/utils/handlers/singleAutocompleteSelectChangeHandler"; import { mapCountriesToChoices } from "@dashboard/utils/maps"; import { warehouseListUrl } from "@dashboard/warehouses/urls"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl"; diff --git a/src/warehouses/components/WarehouseDeleteDialog/WarehouseDeleteDialog.tsx b/src/warehouses/components/WarehouseDeleteDialog/WarehouseDeleteDialog.tsx index 1e1daac8e..5f0ab1bc5 100644 --- a/src/warehouses/components/WarehouseDeleteDialog/WarehouseDeleteDialog.tsx +++ b/src/warehouses/components/WarehouseDeleteDialog/WarehouseDeleteDialog.tsx @@ -1,6 +1,6 @@ import ActionDialog from "@dashboard/components/ActionDialog"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import { DialogContentText } from "@material-ui/core"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { FormattedMessage, useIntl } from "react-intl"; diff --git a/src/warehouses/components/WarehouseDetailsPage/WarehouseDetailsPage.tsx b/src/warehouses/components/WarehouseDetailsPage/WarehouseDetailsPage.tsx index 33c5f8e75..db872dc5d 100644 --- a/src/warehouses/components/WarehouseDetailsPage/WarehouseDetailsPage.tsx +++ b/src/warehouses/components/WarehouseDetailsPage/WarehouseDetailsPage.tsx @@ -2,6 +2,7 @@ import { createCountryHandler } from "@dashboard/components/AddressEdit/createCo import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import CardSpacer from "@dashboard/components/CardSpacer"; import CompanyAddressInput from "@dashboard/components/CompanyAddressInput"; +import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton"; import Form from "@dashboard/components/Form"; import { DetailPageLayout } from "@dashboard/components/Layouts"; import Savebar from "@dashboard/components/Savebar"; @@ -19,7 +20,6 @@ import useStateFromProps from "@dashboard/hooks/useStateFromProps"; import createSingleAutocompleteSelectHandler from "@dashboard/utils/handlers/singleAutocompleteSelectChangeHandler"; import { mapCountriesToChoices, mapEdgesToItems } from "@dashboard/utils/maps"; import { warehouseListUrl } from "@dashboard/warehouses/urls"; -import { ConfirmButtonTransitionState } from "@saleor/macaw-ui"; import React from "react"; import { useIntl } from "react-intl";