djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Do not use getMutationState explicitly

Browse source
This commit is contained in:
dominik-zeglen 2019-12-06 18:11:46 +01:00
parent fad6dfe22a
commit 6b62f5cc40
56 changed files with 2127 additions and 2904 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/attributes/views/AttributeCreate/AttributeCreate.tsx
View file

@ -4,7 +4,7 @@ import slugify from "slugify";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ReorderEvent, UserError } from "@saleor/types";
import {
add,
@ -131,14 +131,7 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ params }) => {
return (
<AttributeCreateMutation onCompleted={handleCreate}>
{(attributeCreate, attributeCreateOpts) => {
const createTransitionState = getMutationState(
attributeCreateOpts.called,
attributeCreateOpts.loading,
maybe(() => attributeCreateOpts.data.attributeCreate.errors)
);
return (
{(attributeCreate, attributeCreateOpts) => (
<>
<AttributePage
attribute={null}
@ -169,7 +162,7 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ params }) => {
onValueDelete={id => openModal("remove-value", id)}
onValueReorder={handleValueReorder}
onValueUpdate={id => openModal("edit-value", id)}
saveButtonBarState={createTransitionState}
saveButtonBarState={attributeCreateOpts.state}
values={values.map((value, valueIndex) => ({
__typename: "AttributeValue" as "AttributeValue",
id: valueIndex.toString(),
@ -211,8 +204,7 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ params }) => {
</>
)}
</>
);
}}
)}
</AttributeCreateMutation>
);
};

62
src/attributes/views/AttributeDetails/AttributeDetails.tsx
View file

@ -4,7 +4,7 @@ import { useIntl } from "react-intl";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ReorderEvent } from "@saleor/types";
import { move } from "@saleor/utils/lists";
import AttributeDeleteDialog from "../../components/AttributeDeleteDialog";
@ -135,52 +135,6 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ id, params }) => {
onCompleted={handleValueReorderMutation}
>
{attributeValueReorder => {
const deleteTransitionState = getMutationState(
attributeDeleteOpts.called,
attributeDeleteOpts.loading,
maybe(
() =>
attributeDeleteOpts.data.attributeDelete
.errors
)
);
const deleteValueTransitionState = getMutationState(
attributeValueDeleteOpts.called,
attributeValueDeleteOpts.loading,
maybe(
() =>
attributeValueDeleteOpts.data
.attributeValueDelete.errors
)
);
const updateTransitionState = getMutationState(
attributeUpdateOpts.called,
attributeUpdateOpts.loading,
maybe(
() =>
attributeUpdateOpts.data.attributeUpdate
.errors
)
);
const updateValueTransitionState = getMutationState(
attributeValueUpdateOpts.called,
attributeValueUpdateOpts.loading,
maybe(
() =>
attributeValueUpdateOpts.data
.attributeValueUpdate.errors
)
);
const createValueTransitionState = getMutationState(
attributeValueCreateOpts.called,
attributeValueCreateOpts.loading,
maybe(
() =>
attributeValueCreateOpts.data
.attributeValueCreate.errors
)
);
const handleValueReorder = ({
newIndex,
oldIndex
@ -252,7 +206,9 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ id, params }) => {
onValueUpdate={id =>
openModal("edit-value", id)
}
saveButtonBarState={updateTransitionState}
saveButtonBarState={
attributeUpdateOpts.state
}
values={maybe(
() => data.attribute.values
)}
@ -263,7 +219,9 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ id, params }) => {
() => data.attribute.name,
"..."
)}
confirmButtonState={deleteTransitionState}
confirmButtonState={
attributeDeleteOpts.state
}
onClose={closeModal}
onConfirm={() =>
attributeDelete({
@ -288,7 +246,7 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ id, params }) => {
)}
useName={true}
confirmButtonState={
deleteValueTransitionState
attributeValueDeleteOpts.state
}
onClose={closeModal}
onConfirm={() =>
@ -302,7 +260,7 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ id, params }) => {
<AttributeValueEditDialog
attributeValue={null}
confirmButtonState={
createValueTransitionState
attributeValueCreateOpts.state
}
disabled={loading}
errors={maybe(
@ -329,7 +287,7 @@ const AttributeDetails: React.FC<AttributeDetailsProps> = ({ id, params }) => {
)
)}
confirmButtonState={
updateValueTransitionState
attributeValueUpdateOpts.state
}
disabled={loading}
errors={maybe(

18
src/attributes/views/AttributeList/AttributeList.tsx
View file

@ -23,7 +23,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import { PAGINATE_BY } from "../../../config";
import useBulkActions from "../../../hooks/useBulkActions";
import { getMutationState, maybe } from "../../../misc";
import { maybe } from "../../../misc";
import AttributeBulkDeleteDialog from "../../components/AttributeBulkDeleteDialog";
import AttributeListPage from "../../components/AttributeListPage";
import { AttributeBulkDeleteMutation } from "../../mutations";
@ -145,16 +145,7 @@ const AttributeList: React.FC<AttributeListProps> = ({ params }) => {
return (
<AttributeBulkDeleteMutation onCompleted={handleBulkDelete}>
{(attributeBulkDelete, attributeBulkDeleteOpts) => {
const bulkDeleteMutationState = getMutationState(
attributeBulkDeleteOpts.called,
attributeBulkDeleteOpts.loading,
maybe(
() => attributeBulkDeleteOpts.data.attributeBulkDelete.errors
)
);
return (
{(attributeBulkDelete, attributeBulkDeleteOpts) => (
<>
<AttributeListPage
attributes={maybe(() =>
@ -189,7 +180,7 @@ const AttributeList: React.FC<AttributeListProps> = ({ params }) => {
}
/>
<AttributeBulkDeleteDialog
confirmButtonState={bulkDeleteMutationState}
confirmButtonState={attributeBulkDeleteOpts.state}
open={
params.action === "remove" &&
maybe(() => params.ids.length > 0)
@ -214,8 +205,7 @@ const AttributeList: React.FC<AttributeListProps> = ({ params }) => {
tabName={maybe(() => tabs[currentTab - 1].name, "...")}
/>
</>
);
}}
)}
</AttributeBulkDeleteMutation>
);
}}

10
src/categories/views/CategoryCreate.tsx
View file

@ -4,7 +4,7 @@ import { useIntl } from "react-intl";
import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import CategoryCreatePage from "../components/CategoryCreatePage";
import { useCategoryCreateMutation } from "../mutations";
import { CategoryCreate } from "../types/CategoryCreate";
@ -41,12 +41,6 @@ export const CategoryCreateView: React.FC<CategoryCreateViewProps> = ({
[]
);
const formTransitionState = getMutationState(
createCategoryResult.called,
createCategoryResult.loading,
errors
);
return (
<>
<WindowTitle
@ -56,7 +50,7 @@ export const CategoryCreateView: React.FC<CategoryCreateViewProps> = ({
})}
/>
<CategoryCreatePage
saveButtonBarState={formTransitionState}
saveButtonBarState={createCategoryResult.state}
errors={errors}
disabled={createCategoryResult.loading}
onBack={() =>

42
src/categories/views/CategoryDetails.tsx
View file

@ -14,7 +14,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import { commonMessages } from "@saleor/intl";
import { PAGINATE_BY } from "../../config";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { TypedProductBulkDeleteMutation } from "../../products/mutations";
import { productBulkDelete } from "../../products/types/productBulkDelete";
import { productAddUrl, productUrl } from "../../products/urls";
@ -147,17 +147,6 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
})
);
const formTransitionState = getMutationState(
updateResult.called,
updateResult.loading,
maybe(() => updateResult.data.categoryUpdate.errors)
);
const removeDialogTransitionState = getMutationState(
deleteResult.called,
deleteResult.loading,
maybe(() => deleteResult.data.categoryDelete.errors)
);
const handleBulkProductDelete = (data: productBulkDelete) => {
if (data.productBulkDelete.errors.length === 0) {
closeModal();
@ -181,19 +170,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
<>
<WindowTitle title={maybe(() => data.category.name)} />
<TypedProductBulkDeleteMutation onCompleted={handleBulkProductDelete}>
{(productBulkDelete, productBulkDeleteOpts) => {
const categoryBulkDeleteMutationState = getMutationState(
categoryBulkDeleteOpts.called,
categoryBulkDeleteOpts.loading,
maybe(() => categoryBulkDeleteOpts.data.categoryBulkDelete.errors)
);
const productBulkDeleteMutationState = getMutationState(
productBulkDeleteOpts.called,
productBulkDeleteOpts.loading,
maybe(() => productBulkDeleteOpts.data.productBulkDelete.errors)
);
return (
{(productBulkDelete, productBulkDeleteOpts) => (
<>
<CategoryUpdatePage
changeTab={changeTab}
@ -256,7 +233,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
products={maybe(() =>
data.category.products.edges.map(edge => edge.node)
)}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateResult.state}
subcategories={maybe(() =>
data.category.children.edges.map(edge => edge.node)
)}
@ -282,7 +259,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
toggleAll={toggleAll}
/>
<ActionDialog
confirmButtonState={removeDialogTransitionState}
confirmButtonState={deleteResult.state}
onClose={closeModal}
onConfirm={() => deleteCategory({ variables: { id } })}
open={params.action === "delete"}
@ -297,9 +274,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
defaultMessage="Are you sure you want to delete {categoryName}?"
values={{
categoryName: (
<strong>
{maybe(() => data.category.name, "...")}
</strong>
<strong>{maybe(() => data.category.name, "...")}</strong>
)
}}
/>
@ -313,7 +288,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
params.action === "delete-categories" &&
maybe(() => params.ids.length > 0)
}
confirmButtonState={categoryBulkDeleteMutationState}
confirmButtonState={categoryBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={() =>
categoryBulkDelete({
@ -343,7 +318,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
</ActionDialog>
<ActionDialog
open={params.action === "delete-products"}
confirmButtonState={productBulkDeleteMutationState}
confirmButtonState={productBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={() =>
productBulkDelete({
@ -369,8 +344,7 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
</DialogContentText>
</ActionDialog>
</>
);
}}
)}
</TypedProductBulkDeleteMutation>
</>
);

10
src/categories/views/CategoryList/CategoryList.tsx
View file

@ -15,7 +15,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import { CategoryListPage } from "../../components/CategoryListPage/CategoryListPage";
import { useCategoryBulkDeleteMutation } from "../../mutations";
@ -148,12 +148,6 @@ export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
onCompleted: handleCategoryBulkDelete
});
const bulkDeleteState = getMutationState(
categoryBulkDeleteOpts.called,
categoryBulkDeleteOpts.loading,
maybe(() => categoryBulkDeleteOpts.data.categoryBulkDelete.errors)
);
return (
<>
<CategoryListPage
@ -199,7 +193,7 @@ export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
}
/>
<ActionDialog
confirmButtonState={bulkDeleteState}
confirmButtonState={categoryBulkDeleteOpts.state}
onClose={() =>
navigate(
categoryListUrl({

22
src/collections/views/CollectionCreate.tsx
View file

@ -4,7 +4,7 @@ import { useIntl } from "react-intl";
import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { CollectionCreateInput } from "../../types/globalTypes";
import CollectionCreatePage from "../components/CollectionCreatePage/CollectionCreatePage";
import { TypedCollectionCreateMutation } from "../mutations";
@ -38,13 +38,7 @@ export const CollectionCreate: React.FC = () => {
};
return (
<TypedCollectionCreateMutation onCompleted={handleCollectionCreateSuccess}>
{(createCollection, { called, data, loading }) => {
const formTransitionState = getMutationState(
called,
loading,
maybe(() => data.collectionCreate.errors)
);
return (
{(createCollection, createCollectionOpts) => (
<>
<WindowTitle
title={intl.formatMessage({
@ -53,9 +47,12 @@ export const CollectionCreate: React.FC = () => {
})}
/>
<CollectionCreatePage
errors={maybe(() => data.collectionCreate.errors, [])}
errors={maybe(
() => createCollectionOpts.data.collectionCreate.errors,
[]
)}
onBack={() => navigate(collectionListUrl())}
disabled={loading}
disabled={createCollectionOpts.loading}
onSubmit={formData =>
createCollection({
variables: {
@ -73,11 +70,10 @@ export const CollectionCreate: React.FC = () => {
}
})
}
saveButtonBarState={formTransitionState}
saveButtonBarState={createCollectionOpts.state}
/>
</>
);
}}
)}
</TypedCollectionCreateMutation>
);
};

33
src/collections/views/CollectionDetails.tsx
View file

@ -195,31 +195,6 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
.homepageCollectionUpdate.errors
)
);
const assignTransitionState = getMutationState(
assignProduct.opts.called,
assignProduct.opts.loading,
maybe(
() => assignProduct.opts.data.collectionAddProducts.errors
)
);
const unassignTransitionState = getMutationState(
unassignProduct.opts.called,
unassignProduct.opts.loading,
maybe(
() =>
unassignProduct.opts.data.collectionRemoveProducts.errors
)
);
const removeTransitionState = getMutationState(
removeCollection.opts.called,
removeCollection.opts.loading,
maybe(() => removeCollection.opts.data.collectionDelete.errors)
);
const imageRemoveTransitionState = getMutationState(
updateCollection.opts.called,
updateCollection.opts.loading,
maybe(() => updateCollection.opts.data.collectionUpdate.errors)
);
const { loadNextPage, loadPreviousPage, pageInfo } = paginate(
maybe(() => data.collection.products.pageInfo),
@ -288,7 +263,7 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
toggleAll={toggleAll}
/>
<AssignProductDialog
confirmButtonState={assignTransitionState}
confirmButtonState={assignProduct.opts.state}
open={params.action === "assign"}
onFetch={search}
loading={result.loading}
@ -307,7 +282,7 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
)}
/>
<ActionDialog
confirmButtonState={removeTransitionState}
confirmButtonState={removeCollection.opts.state}
onClose={closeModal}
onConfirm={() => removeCollection.mutate({ id })}
open={params.action === "remove"}
@ -331,7 +306,7 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
</DialogContentText>
</ActionDialog>
<ActionDialog
confirmButtonState={unassignTransitionState}
confirmButtonState={unassignProduct.opts.state}
onClose={closeModal}
onConfirm={() =>
unassignProduct.mutate({
@ -359,7 +334,7 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
</DialogContentText>
</ActionDialog>
<ActionDialog
confirmButtonState={imageRemoveTransitionState}
confirmButtonState={updateCollection.opts.state}
onClose={closeModal}
onConfirm={() =>
updateCollection.mutate({

50
src/collections/views/CollectionList/CollectionList.tsx
View file

@ -18,7 +18,7 @@ import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import CollectionListPage from "../../components/CollectionListPage/CollectionListPage";
import {
@ -167,28 +167,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
<TypedCollectionBulkPublish
onCompleted={handleCollectionBulkPublish}
>
{(collectionBulkPublish, collectionBulkPublishOpts) => {
const bulkDeleteTransitionState = getMutationState(
collectionBulkDeleteOpts.called,
collectionBulkDeleteOpts.loading,
maybe(
() =>
collectionBulkDeleteOpts.data.collectionBulkDelete
.errors
)
);
const bulkPublishTransitionState = getMutationState(
collectionBulkPublishOpts.called,
collectionBulkPublishOpts.loading,
maybe(
() =>
collectionBulkPublishOpts.data.collectionBulkPublish
.errors
)
);
return (
{(collectionBulkPublish, collectionBulkPublishOpts) => (
<>
<CollectionListPage
currentTab={currentTab}
@ -214,9 +193,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
<>
<Button
color="primary"
onClick={() =>
openModal("unpublish", listElements)
}
onClick={() => openModal("unpublish", listElements)}
>
<FormattedMessage
defaultMessage="Unpublish"
@ -251,7 +228,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
maybe(() => params.ids.length > 0)
}
onClose={closeModal}
confirmButtonState={bulkPublishTransitionState}
confirmButtonState={collectionBulkPublishOpts.state}
onConfirm={() =>
collectionBulkPublish({
variables: {
@ -272,9 +249,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
values={{
counter: maybe(() => params.ids.length),
displayQuantity: (
<strong>
{maybe(() => params.ids.length)}
</strong>
<strong>{maybe(() => params.ids.length)}</strong>
)
}}
/>
@ -286,7 +261,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
maybe(() => params.ids.length > 0)
}
onClose={closeModal}
confirmButtonState={bulkPublishTransitionState}
confirmButtonState={collectionBulkPublishOpts.state}
onConfirm={() =>
collectionBulkPublish({
variables: {
@ -307,9 +282,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
values={{
counter: maybe(() => params.ids.length),
displayQuantity: (
<strong>
{maybe(() => params.ids.length)}
</strong>
<strong>{maybe(() => params.ids.length)}</strong>
)
}}
/>
@ -321,7 +294,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
maybe(() => params.ids.length > 0)
}
onClose={closeModal}
confirmButtonState={bulkDeleteTransitionState}
confirmButtonState={collectionBulkDeleteOpts.state}
onConfirm={() =>
collectionBulkDelete({
variables: {
@ -341,9 +314,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
values={{
counter: maybe(() => params.ids.length),
displayQuantity: (
<strong>
{maybe(() => params.ids.length)}
</strong>
<strong>{maybe(() => params.ids.length)}</strong>
)
}}
/>
@ -363,8 +334,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
tabName={maybe(() => tabs[currentTab - 1].name, "...")}
/>
</>
);
}}
)}
</TypedCollectionBulkPublish>
)}
</TypedCollectionBulkDelete>

47
src/customers/views/CustomerAddresses.tsx
View file

@ -8,7 +8,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import CustomerAddressDialog from "../components/CustomerAddressDialog";
import CustomerAddressListPage from "../components/CustomerAddressListPage";
import {
@ -97,39 +97,6 @@ const CustomerAddresses: React.FC<CustomerAddressesProps> = ({
{(removeCustomerAddress, removeCustomerAddressOpts) => (
<TypedCustomerAddressesQuery variables={{ id }}>
{customerData => {
const createAddressTransitionState = getMutationState(
createCustomerAddressOpts.called,
createCustomerAddressOpts.loading,
maybe(
() =>
createCustomerAddressOpts.data.addressCreate
.errors,
[]
)
);
const updateAddressTransitionState = getMutationState(
updateCustomerAddressOpts.called,
updateCustomerAddressOpts.loading,
maybe(
() =>
updateCustomerAddressOpts.data.addressUpdate
.errors,
[]
)
);
const removeAddressTransitionState = getMutationState(
removeCustomerAddressOpts.called,
removeCustomerAddressOpts.loading,
maybe(
() =>
removeCustomerAddressOpts.data.addressDelete
.errors,
[]
)
);
const countryChoices = maybe(
() =>
shop.countries.map(country => ({
@ -161,7 +128,9 @@ const CustomerAddresses: React.FC<CustomerAddressesProps> = ({
/>
<CustomerAddressDialog
address={undefined}
confirmButtonState={createAddressTransitionState}
confirmButtonState={
createCustomerAddressOpts.state
}
countries={countryChoices}
errors={maybe(
() =>
@ -187,7 +156,9 @@ const CustomerAddresses: React.FC<CustomerAddressesProps> = ({
addr => addr.id === params.id
)
)}
confirmButtonState={updateAddressTransitionState}
confirmButtonState={
updateCustomerAddressOpts.state
}
countries={countryChoices}
errors={maybe(
() =>
@ -214,7 +185,9 @@ const CustomerAddresses: React.FC<CustomerAddressesProps> = ({
defaultMessage: "Delete Address",
description: "dialog header"
})}
confirmButtonState={removeAddressTransitionState}
confirmButtonState={
removeCustomerAddressOpts.state
}
onClose={closeModal}
onConfirm={() =>
removeCustomerAddress({

23
src/customers/views/CustomerDetails.tsx
View file

@ -7,7 +7,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { orderListUrl, orderUrl } from "../../orders/urls";
import CustomerDetailsPage from "../components/CustomerDetailsPage/CustomerDetailsPage";
import {
@ -67,19 +67,7 @@ export const CustomerDetailsView: React.FC<CustomerDetailsViewProps> = ({
variables={{ id }}
require={["user"]}
>
{customerDetails => {
const formTransitionState = getMutationState(
updateCustomerOpts.called,
updateCustomerOpts.loading,
maybe(() => updateCustomerOpts.data.customerUpdate.errors)
);
const removeTransitionState = getMutationState(
removeCustomerOpts.called,
removeCustomerOpts.loading,
maybe(() => removeCustomerOpts.data.customerDelete.errors)
);
return (
{customerDetails => (
<>
<WindowTitle
title={maybe(() => customerDetails.data.user.email)}
@ -94,7 +82,7 @@ export const CustomerDetailsView: React.FC<CustomerDetailsViewProps> = ({
errors={maybe(
() => updateCustomerOpts.data.customerUpdate.errors
)}
saveButtonBar={formTransitionState}
saveButtonBar={updateCustomerOpts.state}
onAddressManageClick={() =>
navigate(customerAddressesUrl(id))
}
@ -130,7 +118,7 @@ export const CustomerDetailsView: React.FC<CustomerDetailsViewProps> = ({
}
/>
<ActionDialog
confirmButtonState={removeTransitionState}
confirmButtonState={removeCustomerOpts.state}
onClose={() => navigate(customerUrl(id), true)}
onConfirm={() => removeCustomer()}
title={intl.formatMessage({
@ -158,8 +146,7 @@ export const CustomerDetailsView: React.FC<CustomerDetailsViewProps> = ({
</DialogContentText>
</ActionDialog>
</>
);
}}
)}
</TypedCustomerDetailsQuery>
)}
</TypedUpdateCustomerMutation>

18
src/customers/views/CustomerList/CustomerList.tsx
View file

@ -17,7 +17,7 @@ import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import CustomerListPage from "../../components/CustomerListPage";
import { TypedBulkRemoveCustomers } from "../../mutations";
@ -147,16 +147,7 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
return (
<TypedBulkRemoveCustomers onCompleted={handleBulkCustomerDelete}>
{(bulkRemoveCustomers, bulkRemoveCustomersOpts) => {
const removeTransitionState = getMutationState(
bulkRemoveCustomersOpts.called,
bulkRemoveCustomersOpts.loading,
maybe(
() => bulkRemoveCustomersOpts.data.customerBulkDelete.errors
)
);
return (
{(bulkRemoveCustomers, bulkRemoveCustomersOpts) => (
<>
<CustomerListPage
currentTab={currentTab}
@ -204,7 +195,7 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
maybe(() => params.ids.length > 0)
}
onClose={closeModal}
confirmButtonState={removeTransitionState}
confirmButtonState={bulkRemoveCustomersOpts.state}
onConfirm={() =>
bulkRemoveCustomers({
variables: {
@ -244,8 +235,7 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
tabName={maybe(() => tabs[currentTab - 1].name, "...")}
/>
</>
);
}}
)}
</TypedBulkRemoveCustomers>
);
}}

16
src/discounts/views/SaleCreate.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { sectionNames } from "@saleor/intl";
import { decimal, getMutationState, joinDateTime, maybe } from "../../misc";
import { decimal, joinDateTime, maybe } from "../../misc";
import { DiscountValueTypeEnum, SaleType } from "../../types/globalTypes";
import SaleCreatePage from "../components/SaleCreatePage";
import { TypedSaleCreate } from "../mutations";
@ -38,14 +38,7 @@ export const SaleDetails: React.FC = () => {
return (
<TypedSaleCreate onCompleted={handleSaleCreate}>
{(saleCreate, saleCreateOpts) => {
const formTransitionState = getMutationState(
saleCreateOpts.called,
saleCreateOpts.loading,
maybe(() => saleCreateOpts.data.saleCreate.errors)
);
return (
{(saleCreate, saleCreateOpts) => (
<>
<WindowTitle title={intl.formatMessage(sectionNames.sales)} />
<SaleCreatePage
@ -71,11 +64,10 @@ export const SaleDetails: React.FC = () => {
}
})
}
saveButtonBarState={formTransitionState}
saveButtonBarState={saleCreateOpts.state}
/>
</>
);
}}
)}
</TypedSaleCreate>
);
};

52
src/discounts/views/SaleDetails.tsx
View file

@ -22,7 +22,7 @@ import useCollectionSearch from "@saleor/searches/useCollectionSearch";
import useProductSearch from "@saleor/searches/useProductSearch";
import { categoryUrl } from "../../categories/urls";
import { collectionUrl } from "../../collections/urls";
import { decimal, getMutationState, joinDateTime, maybe } from "../../misc";
import { decimal, joinDateTime, maybe } from "../../misc";
import { productUrl } from "../../products/urls";
import { DiscountValueTypeEnum, SaleType } from "../../types/globalTypes";
import SaleDetailsPage, {
@ -169,34 +169,6 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
SaleDetailsPageTab.collections
? maybe(() => data.sale.collections.pageInfo)
: maybe(() => data.sale.products.pageInfo);
const formTransitionState = getMutationState(
saleUpdateOpts.called,
saleUpdateOpts.loading,
maybe(() => saleUpdateOpts.data.saleUpdate.errors)
);
const assignTransitionState = getMutationState(
saleCataloguesAddOpts.called,
saleCataloguesAddOpts.loading,
maybe(
() =>
saleCataloguesAddOpts.data.saleCataloguesAdd
.errors
)
);
const unassignTransitionState = getMutationState(
saleCataloguesRemoveOpts.called,
saleCataloguesRemoveOpts.loading,
maybe(
() =>
saleCataloguesRemoveOpts.data.saleCataloguesRemove
.errors
)
);
const removeTransitionState = getMutationState(
saleDeleteOpts.called,
saleDeleteOpts.loading,
maybe(() => saleDeleteOpts.data.saleDelete.errors)
);
const handleCategoriesUnassign = (ids: string[]) =>
saleCataloguesRemove({
@ -308,7 +280,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
})
}
onRemove={() => openModal("remove")}
saveButtonBarState={formTransitionState}
saveButtonBarState={saleUpdateOpts.state}
categoryListToolbar={
<Button
color="primary"
@ -360,7 +332,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
toggleAll={toggleAll}
/>
<AssignProductDialog
confirmButtonState={assignTransitionState}
confirmButtonState={saleCataloguesAddOpts.state}
open={params.action === "assign-product"}
onFetch={searchProducts}
loading={searchProductsOpts.loading}
@ -394,7 +366,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
suggestedCategory => suggestedCategory.id
)
)}
confirmButtonState={assignTransitionState}
confirmButtonState={saleCataloguesAddOpts.state}
open={params.action === "assign-category"}
onFetch={searchCategories}
loading={searchCategoriesOpts.loading}
@ -421,7 +393,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
suggestedCategory => suggestedCategory.id
)
)}
confirmButtonState={assignTransitionState}
confirmButtonState={saleCataloguesAddOpts.state}
open={params.action === "assign-collection"}
onFetch={searchCollections}
loading={searchCollectionsOpts.loading}
@ -449,7 +421,9 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
defaultMessage: "Unassign Categories From Sale",
description: "dialog header"
})}
confirmButtonState={unassignTransitionState}
confirmButtonState={
saleCataloguesRemoveOpts.state
}
onClose={closeModal}
onConfirm={() =>
handleCategoriesUnassign(params.ids)
@ -480,7 +454,9 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
"Unassign Collections From Sale",
description: "dialog header"
})}
confirmButtonState={unassignTransitionState}
confirmButtonState={
saleCataloguesRemoveOpts.state
}
onClose={closeModal}
onConfirm={() =>
handleCollectionsUnassign(params.ids)
@ -510,7 +486,9 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
defaultMessage: "Unassign Products From Sale",
description: "dialog header"
})}
confirmButtonState={unassignTransitionState}
confirmButtonState={
saleCataloguesRemoveOpts.state
}
onClose={closeModal}
onConfirm={() =>
handleProductsUnassign(params.ids)
@ -537,7 +515,7 @@ export const SaleDetails: React.FC<SaleDetailsProps> = ({ id, params }) => {
defaultMessage: "Delete Sale",
description: "dialog header"
})}
confirmButtonState={removeTransitionState}
confirmButtonState={saleDeleteOpts.state}
onClose={closeModal}
variant="delete"
onConfirm={() =>

9
src/discounts/views/SaleList/SaleList.tsx
View file

@ -19,7 +19,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import useShop from "@saleor/hooks/useShop";
import { commonMessages, sectionNames } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import SaleListPage from "../../components/SaleListPage";
import { TypedSaleBulkDelete } from "../../mutations";
@ -153,11 +153,6 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
return (
<TypedSaleBulkDelete onCompleted={handleSaleBulkDelete}>
{(saleBulkDelete, saleBulkDeleteOpts) => {
const bulkRemoveTransitionState = getMutationState(
saleBulkDeleteOpts.called,
saleBulkDeleteOpts.loading,
maybe(() => saleBulkDeleteOpts.data.saleBulkDelete.errors)
);
const onSaleBulkDelete = () =>
saleBulkDelete({
variables: {
@ -208,7 +203,7 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
}
/>
<ActionDialog
confirmButtonState={bulkRemoveTransitionState}
confirmButtonState={saleBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={onSaleBulkDelete}
open={params.action === "remove" && canOpenBulkActionDialog}

16
src/discounts/views/VoucherCreate.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { sectionNames } from "@saleor/intl";
import { decimal, getMutationState, joinDateTime, maybe } from "../../misc";
import { decimal, joinDateTime, maybe } from "../../misc";
import {
DiscountValueTypeEnum,
VoucherTypeEnum
@ -36,14 +36,7 @@ export const VoucherDetails: React.FC = () => {
return (
<TypedVoucherCreate onCompleted={handleVoucherCreate}>
{(voucherCreate, voucherCreateOpts) => {
const formTransitionState = getMutationState(
voucherCreateOpts.called,
voucherCreateOpts.loading,
maybe(() => voucherCreateOpts.data.voucherCreate.errors)
);
return (
{(voucherCreate, voucherCreateOpts) => (
<>
<WindowTitle title={intl.formatMessage(sectionNames.vouchers)} />
<VoucherCreatePage
@ -92,11 +85,10 @@ export const VoucherDetails: React.FC = () => {
}
})
}
saveButtonBarState={formTransitionState}
saveButtonBarState={voucherCreateOpts.state}
/>
</>
);
}}
)}
</TypedVoucherCreate>
);
};

64
src/discounts/views/VoucherDetails.tsx
View file

@ -22,7 +22,7 @@ import useCollectionSearch from "@saleor/searches/useCollectionSearch";
import useProductSearch from "@saleor/searches/useProductSearch";
import { categoryUrl } from "../../categories/urls";
import { collectionUrl } from "../../collections/urls";
import { decimal, getMutationState, joinDateTime, maybe } from "../../misc";
import { decimal, joinDateTime, maybe } from "../../misc";
import { productUrl } from "../../products/urls";
import {
DiscountValueTypeEnum,
@ -171,38 +171,6 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
VoucherDetailsPageTab.collections
? maybe(() => data.voucher.collections.pageInfo)
: maybe(() => data.voucher.products.pageInfo);
const formTransitionState = getMutationState(
voucherUpdateOpts.called,
voucherUpdateOpts.loading,
maybe(
() => voucherUpdateOpts.data.voucherUpdate.errors
)
);
const assignTransitionState = getMutationState(
voucherCataloguesAddOpts.called,
voucherCataloguesAddOpts.loading,
maybe(
() =>
voucherCataloguesAddOpts.data.voucherCataloguesAdd
.errors
)
);
const unassignTransitionState = getMutationState(
voucherCataloguesRemoveOpts.called,
voucherCataloguesRemoveOpts.loading,
maybe(
() =>
voucherCataloguesRemoveOpts.data
.voucherCataloguesRemove.errors
)
);
const removeTransitionState = getMutationState(
voucherDeleteOpts.called,
voucherDeleteOpts.loading,
maybe(
() => voucherDeleteOpts.data.voucherDelete.errors
)
);
const handleCategoriesUnassign = (ids: string[]) =>
voucherCataloguesRemove({
@ -387,7 +355,7 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
})
}
onRemove={() => openModal("remove")}
saveButtonBarState={formTransitionState}
saveButtonBarState={voucherUpdateOpts.state}
categoryListToolbar={
<Button
color="primary"
@ -446,7 +414,9 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
suggestedCategory => suggestedCategory.id
)
)}
confirmButtonState={assignTransitionState}
confirmButtonState={
voucherCataloguesAddOpts.state
}
open={params.action === "assign-category"}
onFetch={searchCategories}
loading={searchCategoriesOpts.loading}
@ -473,7 +443,9 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
suggestedCategory => suggestedCategory.id
)
)}
confirmButtonState={assignTransitionState}
confirmButtonState={
voucherCataloguesAddOpts.state
}
open={params.action === "assign-collection"}
onFetch={searchCollections}
loading={searchCollectionsOpts.loading}
@ -493,7 +465,7 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
}
/>
<DiscountCountrySelectDialog
confirmButtonState={formTransitionState}
confirmButtonState={voucherUpdateOpts.state}
countries={maybe(() => shop.countries, [])}
onClose={() => navigate(voucherUrl(id))}
onConfirm={formData =>
@ -516,7 +488,9 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
)}
/>
<AssignProductDialog
confirmButtonState={assignTransitionState}
confirmButtonState={
voucherCataloguesAddOpts.state
}
open={params.action === "assign-product"}
onFetch={searchProducts}
loading={searchProductsOpts.loading}
@ -552,7 +526,9 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
"Unassign Categories From Voucher",
description: "dialog header"
})}
confirmButtonState={unassignTransitionState}
confirmButtonState={
voucherCataloguesRemoveOpts.state
}
onClose={closeModal}
onConfirm={() =>
handleCategoriesUnassign(params.ids)
@ -583,7 +559,9 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
"Unassign Collections From Voucher",
description: "dialog header"
})}
confirmButtonState={unassignTransitionState}
confirmButtonState={
voucherCataloguesRemoveOpts.state
}
onClose={closeModal}
onConfirm={() =>
handleCollectionsUnassign(params.ids)
@ -614,7 +592,9 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
"Unassign Products From Voucher",
description: "dialog header"
})}
confirmButtonState={unassignTransitionState}
confirmButtonState={
voucherCataloguesRemoveOpts.state
}
onClose={closeModal}
onConfirm={() =>
handleProductsUnassign(params.ids)
@ -641,7 +621,7 @@ export const VoucherDetails: React.FC<VoucherDetailsProps> = ({
defaultMessage: "Delete Voucher",
description: "dialog header"
})}
confirmButtonState={removeTransitionState}
confirmButtonState={voucherDeleteOpts.state}
onClose={closeModal}
variant="delete"
onConfirm={() =>

10
src/discounts/views/VoucherList/VoucherList.tsx
View file

@ -19,7 +19,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import useShop from "@saleor/hooks/useShop";
import { commonMessages, sectionNames } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import VoucherListPage from "../../components/VoucherListPage";
import { TypedVoucherBulkDelete } from "../../mutations";
@ -153,17 +153,13 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
return (
<TypedVoucherBulkDelete onCompleted={handleVoucherBulkDelete}>
{(voucherBulkDelete, voucherBulkDeleteOpts) => {
const bulkRemoveTransitionState = getMutationState(
voucherBulkDeleteOpts.called,
voucherBulkDeleteOpts.loading,
maybe(() => voucherBulkDeleteOpts.data.voucherBulkDelete.errors)
);
const onVoucherBulkDelete = () =>
voucherBulkDelete({
variables: {
ids: params.ids
}
});
return (
<>
<WindowTitle
@ -211,7 +207,7 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
}
/>
<ActionDialog
confirmButtonState={bulkRemoveTransitionState}
confirmButtonState={voucherBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={onVoucherBulkDelete}
open={params.action === "remove" && canOpenBulkActionDialog}

41
src/navigation/views/MenuDetails/index.tsx
View file

@ -11,7 +11,7 @@ import useCollectionSearch from "@saleor/searches/useCollectionSearch";
import usePageSearch from "@saleor/searches/usePageSearch";
import { categoryUrl } from "../../../categories/urls";
import { collectionUrl } from "../../../collections/urls";
import { getMutationState, maybe } from "../../../misc";
import { maybe } from "../../../misc";
import { pageUrl } from "../../../pages/urls";
import MenuDetailsPage, {
MenuDetailsSubmitData
@ -137,19 +137,6 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
onCompleted={data => handleUpdate(data, notify, refetch, intl)}
>
{(menuUpdate, menuUpdateOpts) => {
const deleteState = getMutationState(
menuDeleteOpts.called,
menuDeleteOpts.loading,
maybe(() => menuDeleteOpts.data.menuDelete.errors)
);
const updateState = getMutationState(
menuUpdateOpts.called,
menuUpdateOpts.loading,
maybe(() => menuUpdateOpts.data.menuUpdate.errors),
maybe(() => menuUpdateOpts.data.menuItemMove.errors)
);
// This is a workaround to let know <MenuDetailsPage />
// that it should clean operation stack if mutations
// were successful
@ -208,12 +195,12 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
)
}
onSubmit={handleSubmit}
saveButtonState={updateState}
saveButtonState={menuUpdateOpts.state}
/>
<ActionDialog
open={params.action === "remove"}
onClose={closeModal}
confirmButtonState={deleteState}
confirmButtonState={menuDeleteOpts.state}
onConfirm={() => menuDelete({ variables: { id } })}
variant="delete"
title={intl.formatMessage({
@ -253,15 +240,6 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
menuItemCreate({ variables });
};
const formTransitionState = getMutationState(
menuItemCreateOpts.called,
menuItemCreateOpts.loading,
maybe(
() =>
menuItemCreateOpts.data.menuItemCreate.errors
)
);
return (
<MenuItemDialog
open={params.action === "add-item"}
@ -277,7 +255,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
categorySearch.result.loading ||
collectionSearch.result.loading
}
confirmButtonState={formTransitionState}
confirmButtonState={menuItemCreateOpts.state}
disabled={menuItemCreateOpts.loading}
onClose={closeModal}
onSubmit={handleSubmit}
@ -310,15 +288,6 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
)
);
const formTransitionState = getMutationState(
menuItemUpdateOpts.called,
menuItemUpdateOpts.loading,
maybe(
() =>
menuItemUpdateOpts.data.menuItemUpdate.errors
)
);
const initialFormData: MenuItemDialogFormData = {
id: maybe(() => getItemId(menuItem)),
name: maybe(() => menuItem.name, "..."),
@ -347,7 +316,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
categorySearch.result.loading ||
collectionSearch.result.loading
}
confirmButtonState={formTransitionState}
confirmButtonState={menuItemUpdateOpts.state}
disabled={menuItemUpdateOpts.loading}
onClose={closeModal}
onSubmit={handleSubmit}

34
src/navigation/views/MenuList.tsx
View file

@ -13,7 +13,7 @@ import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { buttonMessages, commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import MenuCreateDialog from "../components/MenuCreateDialog";
import MenuListPage from "../components/MenuListPage";
@ -107,28 +107,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
<MenuDeleteMutation onCompleted={handleDelete}>
{(menuDelete, menuDeleteOpts) => (
<MenuBulkDeleteMutation onCompleted={handleBulkDelete}>
{(menuBulkDelete, menuBulkDeleteOpts) => {
const createTransitionState = getMutationState(
menuCreateOpts.called,
menuCreateOpts.loading,
maybe(() => menuCreateOpts.data.menuCreate.errors)
);
const deleteTransitionState = getMutationState(
menuDeleteOpts.called,
menuDeleteOpts.loading,
maybe(() => menuDeleteOpts.data.menuDelete.errors)
);
const bulkDeleteTransitionState = getMutationState(
menuBulkDeleteOpts.called,
menuBulkDeleteOpts.loading,
maybe(
() => menuBulkDeleteOpts.data.menuBulkDelete.errors
)
);
return (
{(menuBulkDelete, menuBulkDeleteOpts) => (
<>
<MenuListPage
disabled={loading}
@ -180,7 +159,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
/>
<MenuCreateDialog
open={params.action === "add"}
confirmButtonState={createTransitionState}
confirmButtonState={menuCreateOpts.state}
disabled={menuCreateOpts.loading}
onClose={closeModal}
onConfirm={formData =>
@ -192,7 +171,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
<ActionDialog
open={params.action === "remove"}
onClose={closeModal}
confirmButtonState={deleteTransitionState}
confirmButtonState={menuDeleteOpts.state}
onConfirm={() =>
menuDelete({
variables: {
@ -229,7 +208,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
maybe(() => params.ids.length > 0)
}
onClose={closeModal}
confirmButtonState={bulkDeleteTransitionState}
confirmButtonState={menuBulkDeleteOpts.state}
onConfirm={() =>
menuBulkDelete({
variables: {
@ -266,8 +245,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
</DialogContentText>
</ActionDialog>
</>
);
}}
)}
</MenuBulkDeleteMutation>
)}
</MenuDeleteMutation>

29
src/orders/views/OrderDetails/index.tsx
View file

@ -153,16 +153,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
orderDraftCancel,
orderDraftFinalize,
orderPaymentMarkAsPaid
}) => {
const finalizeTransitionState = getMutationState(
orderDraftFinalize.opts.called,
orderDraftFinalize.opts.loading,
maybe(
() =>
orderDraftFinalize.opts.data.draftOrderComplete.errors
)
);
return (
}) => (
<>
{maybe(() => order.status !== OrderStatus.DRAFT) ? (
<>
@ -204,8 +195,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
onPaymentCapture={() => openModal("capture")}
onPaymentVoid={() => openModal("void")}
onPaymentRefund={() => openModal("refund")}
onProductClick={id => () =>
navigate(productUrl(id))}
onProductClick={id => () => navigate(productUrl(id))}
onBillingAddressEdit={() =>
openModal("edit-billing-address")
}
@ -241,8 +231,8 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
orderPaymentMarkAsPaid.opts.loading,
maybe(
() =>
orderPaymentMarkAsPaid.opts.data
.orderMarkAsPaid.errors
orderPaymentMarkAsPaid.opts.data.orderMarkAsPaid
.errors
)
)}
onClose={closeModal}
@ -290,8 +280,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
orderPaymentRefund.opts.loading,
maybe(
() =>
orderPaymentRefund.opts.data.orderRefund
.errors
orderPaymentRefund.opts.data.orderRefund.errors
)
)}
initial={maybe(() => order.total.gross.amount)}
@ -474,7 +463,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
orderNumber={maybe(() => order.number)}
/>
<OrderDraftFinalizeDialog
confirmButtonState={finalizeTransitionState}
confirmButtonState={orderDraftFinalize.opts.state}
onClose={closeModal}
onConfirm={() => orderDraftFinalize.mutate({ id })}
open={params.action === "finalize"}
@ -523,8 +512,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
open={params.action === "add-order-line"}
hasMore={maybe(
() =>
variantSearchOpts.data.search.pageInfo
.hasNextPage
variantSearchOpts.data.search.pageInfo.hasNextPage
)}
products={maybe(() =>
variantSearchOpts.data.search.edges.map(
@ -609,8 +597,7 @@ export const OrderDetails: React.FC<OrderDetailsProps> = ({ id, params }) => {
}
/>
</>
);
}}
)}
</OrderOperations>
)}
</OrderDetailsMessages>

12
src/orders/views/OrderDraftList/OrderDraftList.tsx
View file

@ -16,7 +16,7 @@ import useNotifier from "@saleor/hooks/useNotifier";
import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import OrderDraftListPage from "../../components/OrderDraftListPage";
import {
@ -167,14 +167,6 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
onCompleted={handleOrderDraftBulkCancel}
>
{(orderDraftBulkDelete, orderDraftBulkDeleteOpts) => {
const bulkRemoveTransitionState = getMutationState(
orderDraftBulkDeleteOpts.called,
orderDraftBulkDeleteOpts.loading,
maybe(
() =>
orderDraftBulkDeleteOpts.data.draftOrderBulkDelete.errors
)
);
const onOrderDraftBulkDelete = () =>
orderDraftBulkDelete({
variables: {
@ -225,7 +217,7 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
}
/>
<ActionDialog
confirmButtonState={bulkRemoveTransitionState}
confirmButtonState={orderDraftBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={onOrderDraftBulkDelete}
open={params.action === "remove"}

9
src/orders/views/OrderList/OrderList.tsx
View file

@ -15,7 +15,7 @@ import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import useShop from "@saleor/hooks/useShop";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import OrderBulkCancelDialog from "../../components/OrderBulkCancelDialog";
import OrderListPage from "../../components/OrderListPage/OrderListPage";
@ -176,11 +176,6 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
return (
<TypedOrderBulkCancelMutation onCompleted={handleOrderBulkCancel}>
{(orderBulkCancel, orderBulkCancelOpts) => {
const orderBulkCancelTransitionState = getMutationState(
orderBulkCancelOpts.called,
orderBulkCancelOpts.loading,
maybe(() => orderBulkCancelOpts.data.orderBulkCancel.errors)
);
const onOrderBulkCancel = (restock: boolean) =>
orderBulkCancel({
variables: {
@ -244,7 +239,7 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
}
/>
<OrderBulkCancelDialog
confirmButtonState={orderBulkCancelTransitionState}
confirmButtonState={orderBulkCancelOpts.state}
numberOfOrders={maybe(
() => params.ids.length.toString(),
"..."

16
src/pages/views/PageCreate.tsx
View file

@ -4,7 +4,7 @@ import { useIntl } from "react-intl";
import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import PageDetailsPage from "../components/PageDetailsPage";
import { TypedPageCreate } from "../mutations";
import { PageCreate as PageCreateData } from "../types/PageCreate";
@ -32,14 +32,7 @@ export const PageCreate: React.FC<PageCreateProps> = () => {
return (
<TypedPageCreate onCompleted={handlePageCreate}>
{(pageCreate, pageCreateOpts) => {
const formTransitionState = getMutationState(
pageCreateOpts.called,
pageCreateOpts.loading,
maybe(() => pageCreateOpts.data.pageCreate.errors)
);
return (
{(pageCreate, pageCreateOpts) => (
<>
<WindowTitle
title={intl.formatMessage({
@ -50,7 +43,7 @@ export const PageCreate: React.FC<PageCreateProps> = () => {
<PageDetailsPage
disabled={pageCreateOpts.loading}
errors={maybe(() => pageCreateOpts.data.pageCreate.errors, [])}
saveButtonBarState={formTransitionState}
saveButtonBarState={pageCreateOpts.state}
page={null}
onBack={() => navigate(pageListUrl())}
onRemove={() => undefined}
@ -77,8 +70,7 @@ export const PageCreate: React.FC<PageCreateProps> = () => {
}
/>
</>
);
}}
)}
</TypedPageCreate>
);
};

28
src/pages/views/PageDetails.tsx
View file

@ -6,7 +6,7 @@ import ActionDialog from "@saleor/components/ActionDialog";
import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { PageInput } from "../../types/globalTypes";
import PageDetailsPage, { FormData } from "../components/PageDetailsPage";
import { TypedPageRemove, TypedPageUpdate } from "../mutations";
@ -56,19 +56,7 @@ export const PageDetails: React.FC<PageDetailsProps> = ({ id, params }) => {
<TypedPageUpdate>
{(pageUpdate, pageUpdateOpts) => (
<TypedPageDetailsQuery variables={{ id }}>
{pageDetails => {
const formTransitionState = getMutationState(
pageUpdateOpts.called,
pageUpdateOpts.loading,
maybe(() => pageUpdateOpts.data.pageUpdate.errors)
);
const removeTransitionState = getMutationState(
pageRemoveOpts.called,
pageRemoveOpts.loading,
maybe(() => pageRemoveOpts.data.pageDelete.errors)
);
return (
{pageDetails => (
<>
<WindowTitle
title={maybe(() => pageDetails.data.page.title)}
@ -79,7 +67,7 @@ export const PageDetails: React.FC<PageDetailsProps> = ({ id, params }) => {
() => pageUpdateOpts.data.pageUpdate.errors,
[]
)}
saveButtonBarState={formTransitionState}
saveButtonBarState={pageUpdateOpts.state}
page={maybe(() => pageDetails.data.page)}
onBack={() => navigate(pageListUrl())}
onRemove={() =>
@ -100,7 +88,7 @@ export const PageDetails: React.FC<PageDetailsProps> = ({ id, params }) => {
/>
<ActionDialog
open={params.action === "remove"}
confirmButtonState={removeTransitionState}
confirmButtonState={pageRemoveOpts.state}
title={intl.formatMessage({
defaultMessage: "Delete Page",
description: "dialog header"
@ -116,10 +104,7 @@ export const PageDetails: React.FC<PageDetailsProps> = ({ id, params }) => {
values={{
title: (
<strong>
{maybe(
() => pageDetails.data.page.title,
"..."
)}
{maybe(() => pageDetails.data.page.title, "...")}
</strong>
)
}}
@ -127,8 +112,7 @@ export const PageDetails: React.FC<PageDetailsProps> = ({ id, params }) => {
</DialogContentText>
</ActionDialog>
</>
);
}}
)}
</TypedPageDetailsQuery>
)}
</TypedPageUpdate>

34
src/pages/views/PageList.tsx
View file

@ -14,7 +14,7 @@ import useNotifier from "@saleor/hooks/useNotifier";
import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import PageListPage from "../components/PageListPage/PageListPage";
import { TypedPageBulkPublish, TypedPageBulkRemove } from "../mutations";
@ -107,20 +107,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
<TypedPageBulkRemove onCompleted={handlePageBulkRemove}>
{(bulkPageRemove, bulkPageRemoveOpts) => (
<TypedPageBulkPublish onCompleted={handlePageBulkPublish}>
{(bulkPagePublish, bulkPagePublishOpts) => {
const deleteTransitionState = getMutationState(
bulkPageRemoveOpts.called,
bulkPageRemoveOpts.loading,
maybe(() => bulkPageRemoveOpts.data.pageBulkDelete.errors)
);
const publishTransitionState = getMutationState(
bulkPagePublishOpts.called,
bulkPagePublishOpts.loading,
maybe(() => bulkPagePublishOpts.data.pageBulkPublish.errors)
);
return (
{(bulkPagePublish, bulkPagePublishOpts) => (
<>
<PageListPage
disabled={loading}
@ -139,9 +126,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
<>
<Button
color="primary"
onClick={() =>
openModal("unpublish", listElements)
}
onClick={() => openModal("unpublish", listElements)}
>
<FormattedMessage
defaultMessage="Unpublish"
@ -173,7 +158,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
<ActionDialog
open={params.action === "publish"}
onClose={closeModal}
confirmButtonState={publishTransitionState}
confirmButtonState={bulkPagePublishOpts.state}
onConfirm={() =>
bulkPagePublish({
variables: {
@ -194,9 +179,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
values={{
counter: maybe(() => params.ids.length),
displayQuantity: (
<strong>
{maybe(() => params.ids.length)}
</strong>
<strong>{maybe(() => params.ids.length)}</strong>
)
}}
/>
@ -205,7 +188,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
<ActionDialog
open={params.action === "unpublish"}
onClose={closeModal}
confirmButtonState={publishTransitionState}
confirmButtonState={bulkPagePublishOpts.state}
onConfirm={() =>
bulkPagePublish({
variables: {
@ -233,7 +216,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
<ActionDialog
open={params.action === "remove"}
onClose={closeModal}
confirmButtonState={deleteTransitionState}
confirmButtonState={bulkPageRemoveOpts.state}
onConfirm={() =>
bulkPageRemove({
variables: {
@ -259,8 +242,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
/>
</ActionDialog>
</>
);
}}
)}
</TypedPageBulkPublish>
)}
</TypedPageBulkRemove>

14
src/plugins/views/PluginsDetails.tsx
View file

@ -8,7 +8,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { ConfigurationItemInput } from "@saleor/types/globalTypes";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import PluginsDetailsPage from "../components/PluginsDetailsPage";
import PluginSecretFieldDialog from "../components/PluginSecretFieldDialog";
import { TypedPluginUpdate } from "../mutations";
@ -85,12 +85,6 @@ export const PluginsDetails: React.FC<PluginsDetailsProps> = ({
{pluginDetails => (
<TypedPluginUpdate onCompleted={handleUpdate}>
{(pluginUpdate, pluginUpdateOpts) => {
const formTransitionState = getMutationState(
pluginUpdateOpts.called,
pluginUpdateOpts.loading,
maybe(() => pluginUpdateOpts.data.pluginUpdate.errors)
);
const formErrors = maybe(
() => pluginUpdateOpts.data.pluginUpdate.errors,
[]
@ -120,7 +114,7 @@ export const PluginsDetails: React.FC<PluginsDetailsProps> = ({
disabled={pluginDetails.loading}
errors={formErrors}
saveButtonBarState={
!params.action ? formTransitionState : "default"
!params.action ? pluginUpdateOpts.state : "default"
}
plugin={maybe(() => pluginDetails.data.plugin)}
onBack={() => navigate(pluginsListUrl())}
@ -145,7 +139,7 @@ export const PluginsDetails: React.FC<PluginsDetailsProps> = ({
<>
<ActionDialog
confirmButtonState={
!!params.action ? formTransitionState : "default"
!!params.action ? pluginUpdateOpts.state : "default"
}
onClose={closeModal}
open={params.action === "clear" && !!params.field}
@ -161,7 +155,7 @@ export const PluginsDetails: React.FC<PluginsDetailsProps> = ({
</ActionDialog>
<PluginSecretFieldDialog
confirmButtonState={
!!params.action ? formTransitionState : "default"
!!params.action ? pluginUpdateOpts.state : "default"
}
field={maybe(() =>
pluginDetails.data.plugin.configuration.find(

19
src/productTypes/views/ProductTypeCreate.tsx
View file

@ -4,7 +4,7 @@ import { useIntl } from "react-intl";
import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import ProductTypeCreatePage, {
ProductTypeForm
} from "../components/ProductTypeCreatePage";
@ -30,11 +30,7 @@ export const ProductTypeCreate: React.FC = () => {
};
return (
<TypedProductTypeCreateMutation onCompleted={handleCreateSuccess}>
{(
createProductType,
{ called, loading, data: createProductTypeData }
) => {
const formTransitionState = getMutationState(loading, called);
{(createProductType, createProductTypeOpts) => {
const handleCreate = (formData: ProductTypeForm) =>
createProductType({
variables: {
@ -61,17 +57,16 @@ export const ProductTypeCreate: React.FC = () => {
<ProductTypeCreatePage
defaultWeightUnit={maybe(() => data.shop.defaultWeightUnit)}
disabled={loading}
errors={
createProductTypeData
? createProductTypeData.productTypeCreate.errors
: undefined
}
errors={maybe(
() => createProductTypeOpts.data.productTypeCreate.errors,
[]
)}
pageTitle={intl.formatMessage({
defaultMessage: "Create Product Type",
description: "header",
id: "productTypeCreatePageHeader"
})}
saveButtonBarState={formTransitionState}
saveButtonBarState={createProductTypeOpts.state}
taxTypes={maybe(() => data.taxTypes, [])}
onBack={() => navigate(productTypeListUrl())}
onSubmit={handleCreate}

13
src/productTypes/views/ProductTypeList/ProductTypeList.tsx
View file

@ -19,7 +19,7 @@ import usePaginator, {
import { commonMessages } from "@saleor/intl";
import { ListViews } from "@saleor/types";
import { configurationMenuUrl } from "../../../configuration";
import { getMutationState, maybe } from "../../../misc";
import { maybe } from "../../../misc";
import ProductTypeListPage from "../../components/ProductTypeListPage";
import { TypedProductTypeBulkDeleteMutation } from "../../mutations";
import { TypedProductTypeListQuery } from "../../queries";
@ -155,15 +155,6 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
onCompleted={handleProductTypeBulkDelete}
>
{(productTypeBulkDelete, productTypeBulkDeleteOpts) => {
const bulkRemoveTransitionState = getMutationState(
productTypeBulkDeleteOpts.called,
productTypeBulkDeleteOpts.loading,
maybe(
() =>
productTypeBulkDeleteOpts.data.productTypeBulkDelete.errors
)
);
const onProductTypeBulkDelete = () =>
productTypeBulkDelete({
variables: {
@ -212,7 +203,7 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
}
/>
<ActionDialog
confirmButtonState={bulkRemoveTransitionState}
confirmButtonState={productTypeBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={onProductTypeBulkDelete}
open={params.action === "remove"}

44
src/productTypes/views/ProductTypeUpdate/index.tsx
View file

@ -9,7 +9,7 @@ import useBulkActions from "@saleor/hooks/useBulkActions";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import AssignAttributeDialog from "@saleor/productTypes/components/AssignAttributeDialog";
import { ReorderEvent } from "@saleor/types";
import { AttributeTypeEnum } from "@saleor/types/globalTypes";
@ -190,38 +190,6 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
const loading = updateProductType.opts.loading || dataLoading;
const assignTransactionState = getMutationState(
assignAttribute.opts.called,
assignAttribute.opts.loading,
maybe(
() => assignAttribute.opts.data.attributeAssign.errors
)
);
const unassignTransactionState = getMutationState(
unassignAttribute.opts.called,
unassignAttribute.opts.loading,
maybe(
() => unassignAttribute.opts.data.attributeUnassign.errors
)
);
const deleteTransactionState = getMutationState(
deleteProductType.opts.called,
deleteProductType.opts.loading,
maybe(
() => deleteProductType.opts.data.productTypeDelete.errors
)
);
const formTransitionState = getMutationState(
updateProductType.opts.called,
updateProductType.opts.loading,
maybe(
() => updateProductType.opts.data.productTypeUpdate.errors
)
);
const handleAttributeReorder = (
event: ReorderEvent,
type: AttributeTypeEnum
@ -252,7 +220,7 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
errors={errors.formErrors}
pageTitle={maybe(() => data.productType.name)}
productType={maybe(() => data.productType)}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateProductType.opts.state}
taxTypes={maybe(() => data.taxTypes, [])}
onAttributeAdd={type =>
navigate(
@ -345,7 +313,7 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
edge => edge.node
)
)}
confirmButtonState={assignTransactionState}
confirmButtonState={assignAttribute.opts.state}
errors={maybe(
() =>
assignAttribute.opts.data.attributeAssign.errors.map(
@ -387,7 +355,7 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
/>
))}
<ProductTypeDeleteDialog
confirmButtonState={deleteTransactionState}
confirmButtonState={deleteProductType.opts.state}
name={maybe(() => data.productType.name, "...")}
open={params.action === "remove"}
onClose={() => navigate(productTypeUrl(id))}
@ -395,7 +363,7 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
/>
<ProductTypeBulkAttributeUnassignDialog
attributeQuantity={maybe(() => params.ids.length)}
confirmButtonState={unassignTransactionState}
confirmButtonState={unassignAttribute.opts.state}
onClose={closeModal}
onConfirm={handleBulkAttributeUnassign}
open={params.action === "unassign-attributes"}
@ -414,7 +382,7 @@ export const ProductTypeUpdate: React.FC<ProductTypeUpdateProps> = ({
.name,
"..."
)}
confirmButtonState={unassignTransactionState}
confirmButtonState={unassignAttribute.opts.state}
onClose={closeModal}
onConfirm={handleAttributeUnassign}
open={params.action === "unassign-attribute"}

25
src/products/views/ProductCreate.tsx
View file

@ -9,7 +9,7 @@ import useShop from "@saleor/hooks/useShop";
import useCategorySearch from "@saleor/searches/useCategorySearch";
import useCollectionSearch from "@saleor/searches/useCollectionSearch";
import useProductTypeSearch from "@saleor/searches/useProductTypeSearch";
import { decimal, getMutationState, maybe } from "../../misc";
import { decimal, maybe } from "../../misc";
import ProductCreatePage, {
ProductCreatePageSubmitData
} from "../components/ProductCreatePage";
@ -70,14 +70,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = () => {
return (
<TypedProductCreateMutation onCompleted={handleSuccess}>
{(
productCreate,
{
called: productCreateCalled,
data: productCreateData,
loading: productCreateDataLoading
}
) => {
{(productCreate, productCreateOpts) => {
const handleSubmit = (formData: ProductCreatePageSubmitData) => {
productCreate({
variables: {
@ -108,11 +101,6 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = () => {
});
};
const formTransitionState = getMutationState(
productCreateCalled,
productCreateDataLoading,
maybe(() => productCreateData.productCreate.errors)
);
return (
<>
<WindowTitle
@ -131,8 +119,11 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = () => {
() => searchCollectionOpts.data.search.edges,
[]
).map(edge => edge.node)}
disabled={productCreateDataLoading}
errors={maybe(() => productCreateData.productCreate.errors, [])}
disabled={productCreateOpts.loading}
errors={maybe(
() => productCreateOpts.data.productCreate.errors,
[]
)}
fetchCategories={searchCategory}
fetchCollections={searchCollection}
fetchProductTypes={searchProductTypes}
@ -145,7 +136,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = () => {
)}
onBack={handleBack}
onSubmit={handleSubmit}
saveButtonBarState={formTransitionState}
saveButtonBarState={productCreateOpts.state}
fetchMoreCategories={{
hasMore: maybe(
() => searchCategoryOpts.data.search.pageInfo.hasNextPage

16
src/products/views/ProductImage.tsx
View file

@ -5,7 +5,7 @@ import { FormattedMessage, useIntl } from "react-intl";
import ActionDialog from "@saleor/components/ActionDialog";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import ProductImagePage from "../components/ProductImagePage";
import {
TypedProductImageDeleteMutation,
@ -68,16 +68,6 @@ export const ProductImage: React.FC<ProductImageProps> = ({
};
const image = data && data.product && data.product.mainImage;
const formTransitionState = getMutationState(
updateResult.called,
updateResult.loading,
maybe(() => updateResult.data.productImageUpdate.errors)
);
const deleteTransitionState = getMutationState(
deleteResult.called,
deleteResult.loading,
[]
);
return (
<>
<ProductImagePage
@ -95,7 +85,7 @@ export const ProductImage: React.FC<ProductImageProps> = ({
}
onRowClick={handleImageClick}
onSubmit={handleUpdate}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateResult.state}
/>
<ActionDialog
onClose={() =>
@ -108,7 +98,7 @@ export const ProductImage: React.FC<ProductImageProps> = ({
description: "dialog header"
})}
variant="delete"
confirmButtonState={deleteTransitionState}
confirmButtonState={deleteResult.state}
>
<DialogContentText>
<FormattedMessage defaultMessage="Are you sure you want to delete this image?" />

41
src/products/views/ProductList/ProductList.tsx
View file

@ -21,7 +21,7 @@ import usePaginator, {
} from "@saleor/hooks/usePaginator";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ProductListVariables } from "@saleor/products/types/ProductList";
import { ListViews } from "@saleor/types";
import { getSortUrlVariables } from "@saleor/utils/sort";
@ -216,27 +216,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
<TypedProductBulkPublishMutation
onCompleted={handleBulkPublish}
>
{(productBulkPublish, productBulkPublishOpts) => {
const bulkDeleteMutationState = getMutationState(
productBulkDeleteOpts.called,
productBulkDeleteOpts.loading,
maybe(
() =>
productBulkDeleteOpts.data.productBulkDelete.errors
)
);
const bulkPublishMutationState = getMutationState(
productBulkPublishOpts.called,
productBulkPublishOpts.loading,
maybe(
() =>
productBulkPublishOpts.data.productBulkPublish
.errors
)
);
return (
{(productBulkPublish, productBulkPublishOpts) => (
<>
<ProductListPage
activeAttributeSortId={params.attributeId}
@ -259,9 +239,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
}
gridAttributes={maybe(
() =>
attributes.data.grid.edges.map(
edge => edge.node
),
attributes.data.grid.edges.map(edge => edge.node),
[]
)}
totalGridAttributes={maybe(
@ -366,9 +344,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
selected={listElements.length}
toggle={toggle}
toggleAll={toggleAll}
onSearchChange={query =>
changeFilterField({ query })
}
onSearchChange={query => changeFilterField({ query })}
onFilterAdd={filter =>
changeFilterField(createFilter(filter))
}
@ -380,7 +356,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
/>
<ActionDialog
open={params.action === "delete"}
confirmButtonState={bulkDeleteMutationState}
confirmButtonState={productBulkDeleteOpts.state}
onClose={closeModal}
onConfirm={() =>
productBulkDelete({
@ -410,7 +386,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
</ActionDialog>
<ActionDialog
open={params.action === "publish"}
confirmButtonState={bulkPublishMutationState}
confirmButtonState={productBulkPublishOpts.state}
onClose={closeModal}
onConfirm={() =>
productBulkPublish({
@ -442,7 +418,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
</ActionDialog>
<ActionDialog
open={params.action === "unpublish"}
confirmButtonState={bulkPublishMutationState}
confirmButtonState={productBulkPublishOpts.state}
onClose={closeModal}
onConfirm={() =>
productBulkPublish({
@ -489,8 +465,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
)}
/>
</>
);
}}
)}
</TypedProductBulkPublishMutation>
)}
</TypedProductBulkDeleteMutation>

19
src/products/views/ProductUpdate/ProductUpdate.tsx
View file

@ -206,21 +206,6 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
updateSimpleProduct.opts.data.productVariantUpdate.errors
)
);
const deleteTransitionState = getMutationState(
deleteProduct.opts.called,
deleteProduct.opts.loading,
maybe(() => deleteProduct.opts.data.productDelete.errors)
);
const bulkProductVariantDeleteTransitionState = getMutationState(
bulkProductVariantDelete.opts.called,
bulkProductVariantDelete.opts.loading,
maybe(
() =>
bulkProductVariantDelete.opts.data.productVariantBulkDelete
.errors
)
);
const categories = maybe(
() => searchCategoriesOpts.data.search.edges,
@ -308,7 +293,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
<ActionDialog
open={params.action === "remove"}
onClose={() => navigate(productUrl(id), true)}
confirmButtonState={deleteTransitionState}
confirmButtonState={deleteProduct.opts.state}
onConfirm={() => deleteProduct.mutate({ id })}
variant="delete"
title={intl.formatMessage({
@ -329,7 +314,7 @@ export const ProductUpdate: React.FC<ProductUpdateProps> = ({ id, params }) => {
<ActionDialog
open={params.action === "remove-variants"}
onClose={() => navigate(productUrl(id), true)}
confirmButtonState={bulkProductVariantDeleteTransitionState}
confirmButtonState={bulkProductVariantDelete.opts.state}
onConfirm={() =>
bulkProductVariantDelete.mutate({
ids: params.ids

20
src/products/views/ProductVariant.tsx
View file

@ -6,7 +6,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { decimal, getMutationState, maybe } from "../../misc";
import { decimal, maybe } from "../../misc";
import ProductVariantDeleteDialog from "../components/ProductVariantDeleteDialog";
import ProductVariantPage, {
ProductVariantPageSubmitData
@ -77,19 +77,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
updateVariant.opts.loading ||
assignImage.opts.loading ||
unassignImage.opts.loading;
const formTransitionState = getMutationState(
updateVariant.opts.called,
updateVariant.opts.loading,
maybe(
() =>
updateVariant.opts.data.productVariantUpdate.productErrors
)
);
const removeTransitionState = getMutationState(
deleteVariant.opts.called,
deleteVariant.opts.loading,
maybe(() => deleteVariant.opts.data.productVariantDelete.errors)
);
const handleImageSelect = (id: string) => () => {
if (variant) {
if (
@ -114,7 +102,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
<WindowTitle title={maybe(() => data.productVariant.name)} />
<ProductVariantPage
errors={errors}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateVariant.opts.state}
loading={disableFormSave}
placeholderImage={placeholderImg}
variant={variant}
@ -150,7 +138,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
}}
/>
<ProductVariantDeleteDialog
confirmButtonState={removeTransitionState}
confirmButtonState={deleteVariant.opts.state}
onClose={() =>
navigate(productVariantEditUrl(productId, variantId))
}

12
src/products/views/ProductVariantCreate.tsx
View file

@ -5,7 +5,7 @@ import { WindowTitle } from "@saleor/components/WindowTitle";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { decimal, getMutationState, maybe } from "../../misc";
import { decimal, maybe } from "../../misc";
import ProductVariantCreatePage, {
ProductVariantCreatePageSubmitData
} from "../components/ProductVariantCreatePage";
@ -77,14 +77,6 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({ productId }) => {
const disableForm = productLoading || variantCreateResult.loading;
const formTransitionstate = getMutationState(
variantCreateResult.called,
variantCreateResult.loading,
maybe(
() =>
variantCreateResult.data.productVariantCreate.productErrors
)
);
return (
<>
<WindowTitle
@ -110,7 +102,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({ productId }) => {
onBack={handleBack}
onSubmit={handleSubmit}
onVariantClick={handleVariantClick}
saveButtonBarState={formTransitionstate}
saveButtonBarState={variantCreateResult.state}
/>
</>
);

10
src/services/views/ServiceCreate/ServiceCreate.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ServiceCreateMutation } from "@saleor/services/mutations";
import { ServiceCreate as ServiceCreateData } from "@saleor/services/types/ServiceCreate";
import ServiceCreatePage, {
@ -51,12 +51,6 @@ export const ServiceCreate: React.FC<ServiceCreateProps> = ({ setToken }) => {
}
});
const formTransitionState = getMutationState(
serviceCreateOpts.called,
serviceCreateOpts.loading,
maybe(() => serviceCreateOpts.data.serviceAccountCreate.errors)
);
return (
<>
<WindowTitle
@ -74,7 +68,7 @@ export const ServiceCreate: React.FC<ServiceCreateProps> = ({ setToken }) => {
onBack={handleBack}
onSubmit={handleSubmit}
permissions={maybe(() => shop.permissions)}
saveButtonBarState={formTransitionState}
saveButtonBarState={serviceCreateOpts.state}
/>
</>
);

50
src/services/views/ServiceDetails/ServiceDetails.tsx
View file

@ -7,7 +7,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import ServiceDeleteDialog from "@saleor/services/components/ServiceDeleteDialog";
import ServiceTokenCreateDialog from "@saleor/services/components/ServiceTokenCreateDialog";
import ServiceTokenDeleteDialog from "@saleor/services/components/ServiceTokenDeleteDialog";
@ -162,46 +162,6 @@ export const ServiceDetails: React.FC<OrderListProps> = ({
}
});
const formTransitionState = getMutationState(
updateServiceOpts.called,
updateServiceOpts.loading,
maybe(
() =>
updateServiceOpts.data.serviceAccountUpdate
.errors
)
);
const deleteTransitionState = getMutationState(
deleteServiceOpts.called,
deleteServiceOpts.loading,
maybe(
() =>
deleteServiceOpts.data.serviceAccountDelete
.errors
)
);
const createTokenTransitionState = getMutationState(
createTokenOpts.called,
createTokenOpts.loading,
maybe(
() =>
createTokenOpts.data.serviceAccountTokenCreate
.errors
)
);
const deleteTokenTransitionState = getMutationState(
deleteTokenOpts.called,
deleteTokenOpts.loading,
maybe(
() =>
deleteTokenOpts.data.serviceAccountTokenDelete
.errors
)
);
return (
<>
<WindowTitle
@ -223,10 +183,10 @@ export const ServiceDetails: React.FC<OrderListProps> = ({
}
permissions={maybe(() => shop.permissions)}
service={maybe(() => data.serviceAccount)}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateServiceOpts.state}
/>
<ServiceDeleteDialog
confirmButtonState={deleteTransitionState}
confirmButtonState={deleteServiceOpts.state}
name={maybe(
() => data.serviceAccount.name,
"..."
@ -236,7 +196,7 @@ export const ServiceDetails: React.FC<OrderListProps> = ({
open={params.action === "remove"}
/>
<ServiceTokenCreateDialog
confirmButtonState={createTokenTransitionState}
confirmButtonState={createTokenOpts.state}
onClose={closeModal}
onCreate={handleTokenCreate}
open={params.action === "create-token"}
@ -247,7 +207,7 @@ export const ServiceDetails: React.FC<OrderListProps> = ({
)}
/>
<ServiceTokenDeleteDialog
confirmButtonState={deleteTokenTransitionState}
confirmButtonState={deleteTokenOpts.state}
name={maybe(() => {
const token = data.serviceAccount.tokens.find(
token => token.id === params.id

10
src/services/views/ServiceList/ServiceList.tsx
View file

@ -14,7 +14,7 @@ import SaveFilterTabDialog, {
} from "@saleor/components/SaveFilterTabDialog";
import { configurationMenuUrl } from "@saleor/configuration";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ServiceDeleteMutation } from "@saleor/services/mutations";
import { ServiceDelete } from "@saleor/services/types/ServiceDelete";
import { ListViews } from "@saleor/types";
@ -154,12 +154,6 @@ export const ServiceList: React.FC<ServiceListProps> = ({ params }) => {
}
});
const removeTransitionState = getMutationState(
deleteServiceOpts.called,
deleteServiceOpts.loading,
maybe(() => deleteServiceOpts.data.serviceAccountDelete.errors)
);
return (
<>
<ServiceListPage
@ -186,7 +180,7 @@ export const ServiceList: React.FC<ServiceListProps> = ({ params }) => {
onRemove={handleRemove}
/>
<ServiceDeleteDialog
confirmButtonState={removeTransitionState}
confirmButtonState={deleteServiceOpts.state}
name={maybe(
() =>
data.serviceAccounts.edges.find(

16
src/shipping/views/ShippingZoneCreate.tsx
View file

@ -5,7 +5,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import ShippingZoneCreatePage from "../components/ShippingZoneCreatePage";
import { TypedCreateShippingZone } from "../mutations";
import { CreateShippingZone } from "../types/CreateShippingZone";
@ -27,14 +27,7 @@ const ShippingZoneCreate: React.FC<{}> = () => {
};
return (
<TypedCreateShippingZone onCompleted={onShippingZoneCreate}>
{(createShippingZone, createShippingZoneOpts) => {
const formTransitionState = getMutationState(
createShippingZoneOpts.called,
createShippingZoneOpts.loading,
maybe(() => createShippingZoneOpts.data.shippingZoneCreate.errors, [])
);
return (
{(createShippingZone, createShippingZoneOpts) => (
<ShippingZoneCreatePage
countries={maybe(() => shop.countries, [])}
disabled={createShippingZoneOpts.loading}
@ -49,10 +42,9 @@ const ShippingZoneCreate: React.FC<{}> = () => {
}
})
}
saveButtonBarState={formTransitionState}
saveButtonBarState={createShippingZoneOpts.state}
/>
);
}}
)}
</TypedCreateShippingZone>
);
};

63
src/shipping/views/ShippingZoneDetails/index.tsx
View file

@ -4,7 +4,7 @@ import { useIntl } from "react-intl";
import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../../misc";
import { maybe } from "../../../misc";
import { ShippingMethodTypeEnum } from "../../../types/globalTypes";
import ShippingZoneDetailsPage from "../../components/ShippingZoneDetailsPage";
import { TypedShippingZone } from "../../queries";
@ -91,47 +91,7 @@ const ShippingZoneDetails: React.FC<ShippingZoneDetailsProps> = ({
>
{ops => (
<TypedShippingZone variables={{ id }}>
{({ data, loading }) => {
const formTransitionState = getMutationState(
ops.shippingZoneUpdate.opts.called,
ops.shippingZoneUpdate.opts.loading,
maybe(
() => ops.shippingZoneUpdate.opts.data.shippingZoneUpdate.errors
)
);
const createRateTransitionState = getMutationState(
ops.shippingRateCreate.opts.called,
ops.shippingRateCreate.opts.loading,
maybe(
() =>
ops.shippingRateCreate.opts.data.shippingPriceCreate.errors
)
);
const deleteRateTransitionState = getMutationState(
ops.shippingRateDelete.opts.called,
ops.shippingRateDelete.opts.loading,
maybe(
() =>
ops.shippingRateDelete.opts.data.shippingPriceDelete.errors
)
);
const updateRateTransitionState = getMutationState(
ops.shippingRateUpdate.opts.called,
ops.shippingRateUpdate.opts.loading,
maybe(
() =>
ops.shippingRateUpdate.opts.data.shippingPriceUpdate.errors
)
);
const deleteZoneTransitionState = getMutationState(
ops.shippingZoneDelete.opts.called,
ops.shippingZoneDelete.opts.loading,
maybe(
() => ops.shippingZoneDelete.opts.data.shippingZoneDelete.errors
)
);
return (
{({ data, loading }) => (
<>
<ShippingZoneDetailsPage
disabled={loading}
@ -210,24 +170,25 @@ const ShippingZoneDetails: React.FC<ShippingZoneDetailsProps> = ({
})
)
}
saveButtonBarState={formTransitionState}
saveButtonBarState={ops.shippingZoneUpdate.opts.state}
shippingZone={maybe(() => data.shippingZone)}
/>
<ShippingZoneDetailsDialogs
assignCountryTransitionState={formTransitionState}
createRateTransitionState={createRateTransitionState}
deleteRateTransitionState={deleteRateTransitionState}
deleteZoneTransitionState={deleteZoneTransitionState}
assignCountryTransitionState={ops.shippingZoneUpdate.opts.state}
createRateTransitionState={ops.shippingRateCreate.opts.state}
deleteRateTransitionState={ops.shippingRateDelete.opts.state}
deleteZoneTransitionState={ops.shippingZoneDelete.opts.state}
id={id}
ops={ops}
params={params}
shippingZone={maybe(() => data.shippingZone)}
unassignCountryTransitionState={formTransitionState}
updateRateTransitionState={updateRateTransitionState}
unassignCountryTransitionState={
ops.shippingZoneUpdate.opts.state
}
updateRateTransitionState={ops.shippingRateUpdate.opts.state}
/>
</>
);
}}
)}
</TypedShippingZone>
)}
</ShippingZoneOperations>

28
src/shipping/views/ShippingZonesList.tsx
View file

@ -16,7 +16,7 @@ import usePaginator, {
import useShop from "@saleor/hooks/useShop";
import useUser from "@saleor/hooks/useUser";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import ShippingZonesListPage from "../components/ShippingZonesListPage";
import {
@ -111,26 +111,6 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
onCompleted={handleBulkDeleteShippingZone}
>
{(bulkDeleteShippingZone, bulkDeleteShippingZoneOpts) => {
const deleteTransitionState = getMutationState(
deleteShippingZoneOpts.called,
deleteShippingZoneOpts.loading,
maybe(
() =>
deleteShippingZoneOpts.data.shippingZoneDelete
.errors
)
);
const bulkDeleteTransitionState = getMutationState(
bulkDeleteShippingZoneOpts.called,
bulkDeleteShippingZoneOpts.loading,
maybe(
() =>
bulkDeleteShippingZoneOpts.data
.shippingZoneBulkDelete.errors
)
);
const {
loadNextPage,
loadPreviousPage,
@ -202,7 +182,7 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
<ActionDialog
open={params.action === "remove"}
confirmButtonState={deleteTransitionState}
confirmButtonState={deleteShippingZoneOpts.state}
variant="delete"
title={intl.formatMessage({
defaultMessage: "Delete Shipping Zone",
@ -236,7 +216,9 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
</ActionDialog>
<ActionDialog
open={params.action === "remove-many"}
confirmButtonState={bulkDeleteTransitionState}
confirmButtonState={
bulkDeleteShippingZoneOpts.state
}
variant="delete"
title={intl.formatMessage({
defaultMessage: "Delete Shipping Zones",

22
src/siteSettings/views/index.tsx
View file

@ -7,7 +7,7 @@ import { commonMessages, sectionNames } from "@saleor/intl";
import { useIntl } from "react-intl";
import { configurationMenuUrl } from "../../configuration";
import { findInEnum, getMutationState, maybe } from "../../misc";
import { findInEnum, maybe } from "../../misc";
import { AuthorizationKeyType, CountryCode } from "../../types/globalTypes";
import SiteSettingsKeyDialog, {
SiteSettingsKeyDialogForm
@ -166,24 +166,6 @@ export const SiteSettings: React.FC<SiteSettingsProps> = ({ params }) => {
});
};
const formTransitionState = getMutationState(
updateShopSettingsOpts.called,
updateShopSettingsOpts.loading,
[
...maybe(
() =>
updateShopSettingsOpts.data.shopDomainUpdate.errors,
[]
),
...maybe(
() =>
updateShopSettingsOpts.data.shopSettingsUpdate
.errors,
[]
)
]
);
return (
<>
<WindowTitle
@ -207,7 +189,7 @@ export const SiteSettings: React.FC<SiteSettingsProps> = ({ params }) => {
})
}
onSubmit={handleUpdateShopSettings}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateShopSettingsOpts.state}
/>
<SiteSettingsKeyDialog
errors={maybe(

36
src/staff/views/StaffDetails.tsx
View file

@ -9,7 +9,7 @@ import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import useUser from "@saleor/hooks/useUser";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import StaffDetailsPage from "../components/StaffDetailsPage/StaffDetailsPage";
import {
TypedStaffAvatarDeleteMutation,
@ -63,12 +63,6 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
onCompleted: handleChangePassword
});
const changePasswordTransitionState = getMutationState(
changePasswordOpts.called,
changePasswordOpts.loading,
maybe(() => changePasswordOpts.data.passwordChange.errors)
);
return (
<TypedStaffMemberDetailsQuery
displayLoader
@ -122,24 +116,6 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
onCompleted={handleStaffMemberAvatarDelete}
>
{(deleteStaffAvatar, deleteAvatarResult) => {
const formTransitionState = getMutationState(
updateResult.called,
updateResult.loading,
maybe(() => updateResult.data.staffUpdate.errors)
);
const deleteTransitionState = getMutationState(
deleteResult.called,
deleteResult.loading,
maybe(() => deleteResult.data.staffDelete.errors)
);
const deleteAvatarTransitionState = getMutationState(
deleteAvatarResult.called,
deleteAvatarResult.loading,
maybe(
() =>
deleteAvatarResult.data.userAvatarDelete.errors
)
);
const isUserSameAsViewer = maybe(
() => user.user.id === data.user.id,
true
@ -201,7 +177,7 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
}
permissions={maybe(() => shop.permissions)}
staffMember={maybe(() => data.user)}
saveButtonBarState={formTransitionState}
saveButtonBarState={updateResult.state}
/>
<ActionDialog
open={params.action === "remove"}
@ -209,7 +185,7 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
defaultMessage: "delete Staff User",
description: "dialog header"
})}
confirmButtonState={deleteTransitionState}
confirmButtonState={deleteResult.state}
variant="delete"
onClose={closeModal}
onConfirm={deleteStaffMember}
@ -229,7 +205,7 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
defaultMessage: "Delete Staff User Avatar",
description: "dialog header"
})}
confirmButtonState={deleteAvatarTransitionState}
confirmButtonState={deleteAvatarResult.state}
variant="delete"
onClose={closeModal}
onConfirm={deleteStaffAvatar}
@ -248,9 +224,7 @@ export const StaffDetails: React.FC<OrderListProps> = ({ id, params }) => {
</DialogContentText>
</ActionDialog>
<StaffPasswordResetDialog
confirmButtonState={
changePasswordTransitionState
}
confirmButtonState={changePasswordOpts.state}
errors={maybe(
() =>
changePasswordOpts.data.passwordChange

9
src/staff/views/StaffList/StaffList.tsx
View file

@ -18,7 +18,7 @@ import { APP_MOUNT_URI } from "@saleor/config";
import { configurationMenuUrl } from "@saleor/configuration";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import StaffAddMemberDialog, {
FormData as AddStaffMemberForm
@ -158,11 +158,6 @@ export const StaffList: React.FC<StaffListProps> = ({ params }) => {
}
}
});
const addTransitionState = getMutationState(
addStaffMemberData.called,
addStaffMemberData.loading,
maybe(() => addStaffMemberData.data.staffCreate.errors)
);
const { loadNextPage, loadPreviousPage, pageInfo } = paginate(
maybe(() => data.staffUsers.pageInfo),
@ -201,7 +196,7 @@ export const StaffList: React.FC<StaffListProps> = ({ params }) => {
onRowClick={id => () => navigate(staffMemberDetailsUrl(id))}
/>
<StaffAddMemberDialog
confirmButtonState={addTransitionState}
confirmButtonState={addStaffMemberData.state}
errors={maybe(
() => addStaffMemberData.data.staffCreate.errors,
[]

21
src/taxes/views/CountryList.tsx
View file

@ -5,7 +5,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import { commonMessages } from "@saleor/intl";
import { configurationMenuUrl } from "../../configuration";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import CountryListPage from "../components/CountryListPage";
import { TypedFetchTaxes, TypedUpdateTaxSettings } from "../mutations";
import { TypedCountryListQuery } from "../queries";
@ -42,16 +42,7 @@ export const CountryList: React.FC = () => {
<TypedFetchTaxes onCompleted={handleFetchTaxes}>
{(fetchTaxes, fetchTaxesOpts) => (
<TypedCountryListQuery displayLoader={true}>
{({ data, loading }) => {
const updateTaxSettingsTransitionState = getMutationState(
updateTaxSettingsOpts.called,
updateTaxSettingsOpts.loading,
maybe(
() => updateTaxSettingsOpts.data.shopSettingsUpdate.errors
)
);
return (
{({ data, loading }) => (
<CountryListPage
disabled={
loading ||
@ -64,8 +55,7 @@ export const CountryList: React.FC = () => {
updateTaxSettings({
variables: {
input: {
chargeTaxesOnShipping:
formData.chargeTaxesOnShipping,
chargeTaxesOnShipping: formData.chargeTaxesOnShipping,
displayGrossPrices: formData.showGross,
includeTaxesInPrices: formData.includeTax
}
@ -73,7 +63,7 @@ export const CountryList: React.FC = () => {
})
}
onTaxFetch={fetchTaxes}
saveButtonBarState={updateTaxSettingsTransitionState}
saveButtonBarState={updateTaxSettingsOpts.state}
shop={maybe(() => ({
...data.shop,
countries: data.shop.countries.filter(
@ -81,8 +71,7 @@ export const CountryList: React.FC = () => {
)
}))}
/>
);
}}
)}
</TypedCountryListQuery>
)}
</TypedFetchTaxes>

13
src/translations/views/TranslationsCategories.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { LanguageCodeEnum, TranslationInput } from "../../types/globalTypes";
import TranslationsCategoriesPage, {
fieldNames
@ -84,15 +84,6 @@ const TranslationsCategories: React.FC<TranslationsCategoriesProps> = ({
});
};
const saveButtonState = getMutationState(
updateTranslationsOpts.called,
updateTranslationsOpts.loading,
maybe(
() => updateTranslationsOpts.data.categoryTranslate.errors,
[]
)
);
return (
<TranslationsCategoriesPage
activeField={params.activeField}
@ -101,7 +92,7 @@ const TranslationsCategories: React.FC<TranslationsCategoriesProps> = ({
}
languageCode={languageCode}
languages={maybe(() => shop.languages, [])}
saveButtonState={saveButtonState}
saveButtonState={updateTranslationsOpts.state}
onBack={() =>
navigate(
languageEntitiesUrl(languageCode, {

13
src/translations/views/TranslationsCollections.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { LanguageCodeEnum, TranslationInput } from "../../types/globalTypes";
import TranslationsCollectionsPage, {
fieldNames
@ -86,15 +86,6 @@ const TranslationsCollections: React.FC<TranslationsCollectionsProps> = ({
});
};
const saveButtonState = getMutationState(
updateTranslationsOpts.called,
updateTranslationsOpts.loading,
maybe(
() => updateTranslationsOpts.data.collectionTranslate.errors,
[]
)
);
return (
<TranslationsCollectionsPage
activeField={params.activeField}
@ -104,7 +95,7 @@ const TranslationsCollections: React.FC<TranslationsCollectionsProps> = ({
}
languageCode={languageCode}
languages={maybe(() => shop.languages, [])}
saveButtonState={saveButtonState}
saveButtonState={updateTranslationsOpts.state}
onEdit={onEdit}
onDiscard={onDiscard}
onBack={() =>

10
src/translations/views/TranslationsPages.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import {
LanguageCodeEnum,
PageTranslationInput
@ -87,12 +87,6 @@ const TranslationsPages: React.FC<TranslationsPagesProps> = ({
});
};
const saveButtonState = getMutationState(
updateTranslationsOpts.called,
updateTranslationsOpts.loading,
maybe(() => updateTranslationsOpts.data.pageTranslate.errors, [])
);
return (
<TranslationsPagesPage
activeField={params.activeField}
@ -101,7 +95,7 @@ const TranslationsPages: React.FC<TranslationsPagesProps> = ({
}
languageCode={languageCode}
languages={maybe(() => shop.languages, [])}
saveButtonState={saveButtonState}
saveButtonState={updateTranslationsOpts.state}
onBack={() =>
navigate(
languageEntitiesUrl(languageCode, {

4
src/translations/views/TranslationsProductTypes.tsx
View file

@ -114,9 +114,9 @@ const TranslationsProductTypes: React.FC<TranslationsProductTypesProps> = ({
const saveButtonState = getMutationState(
updateAttributeTranslationsOpts.called ||
updateAttributeTranslationsOpts.called,
updateAttributeValueTranslationsOpts.called,
updateAttributeTranslationsOpts.loading ||
updateAttributeTranslationsOpts.loading,
updateAttributeValueTranslationsOpts.loading,
maybe(
() =>
updateAttributeTranslationsOpts.data.attributeTranslate

13
src/translations/views/TranslationsProducts.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import { LanguageCodeEnum, TranslationInput } from "../../types/globalTypes";
import TranslationsProductsPage, {
fieldNames
@ -84,15 +84,6 @@ const TranslationsProducts: React.FC<TranslationsProductsProps> = ({
});
};
const saveButtonState = getMutationState(
updateTranslationsOpts.called,
updateTranslationsOpts.loading,
maybe(
() => updateTranslationsOpts.data.productTranslate.errors,
[]
)
);
return (
<TranslationsProductsPage
activeField={params.activeField}
@ -101,7 +92,7 @@ const TranslationsProducts: React.FC<TranslationsProductsProps> = ({
}
languageCode={languageCode}
languages={maybe(() => shop.languages, [])}
saveButtonState={saveButtonState}
saveButtonState={updateTranslationsOpts.state}
onBack={() =>
navigate(
languageEntitiesUrl(languageCode, {

10
src/translations/views/TranslationsSales.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import {
LanguageCodeEnum,
NameTranslationInput
@ -81,12 +81,6 @@ const TranslationsSales: React.FC<TranslationsSalesProps> = ({
});
};
const saveButtonState = getMutationState(
updateTranslationsOpts.called,
updateTranslationsOpts.loading,
maybe(() => updateTranslationsOpts.data.saleTranslate.errors, [])
);
return (
<TranslationsSalesPage
activeField={params.activeField}
@ -95,7 +89,7 @@ const TranslationsSales: React.FC<TranslationsSalesProps> = ({
}
languages={maybe(() => shop.languages, [])}
languageCode={languageCode}
saveButtonState={saveButtonState}
saveButtonState={updateTranslationsOpts.state}
onBack={() =>
navigate(
languageEntitiesUrl(languageCode, {

13
src/translations/views/TranslationsVouchers.tsx
View file

@ -6,7 +6,7 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useShop from "@saleor/hooks/useShop";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import {
LanguageCodeEnum,
NameTranslationInput
@ -81,15 +81,6 @@ const TranslationsVouchers: React.FC<TranslationsVouchersProps> = ({
});
};
const saveButtonState = getMutationState(
updateTranslationsOpts.called,
updateTranslationsOpts.loading,
maybe(
() => updateTranslationsOpts.data.voucherTranslate.errors,
[]
)
);
return (
<TranslationsVouchersPage
activeField={params.activeField}
@ -98,7 +89,7 @@ const TranslationsVouchers: React.FC<TranslationsVouchersProps> = ({
}
languages={maybe(() => shop.languages, [])}
languageCode={languageCode}
saveButtonState={saveButtonState}
saveButtonState={updateTranslationsOpts.state}
onBack={() =>
navigate(
languageEntitiesUrl(languageCode, {

10
src/webhooks/views/WebhooksCreate.tsx
View file

@ -8,7 +8,7 @@ import { WebhookEventTypeEnum } from "@saleor/types/globalTypes";
import { WebhookCreate as WebhookCreateData } from "@saleor/webhooks/types/WebhookCreate";
import React from "react";
import { useIntl } from "react-intl";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import WebhookCreatePage, { FormData } from "../components/WebhookCreatePage";
import { TypedWebhookCreate } from "../mutations";
import {
@ -63,12 +63,6 @@ export const WebhooksCreate: React.FC<WebhooksCreateProps> = () => {
}
});
const formTransitionState = getMutationState(
webhookCreateOpts.called,
webhookCreateOpts.loading,
maybe(() => webhookCreateOpts.data.webhookCreate.webhookErrors)
);
return (
<>
<WindowTitle
@ -89,7 +83,7 @@ export const WebhooksCreate: React.FC<WebhooksCreateProps> = () => {
)}
onBack={handleBack}
onSubmit={handleSubmit}
saveButtonBarState={formTransitionState}
saveButtonBarState={webhookCreateOpts.state}
/>
</>
);

20
src/webhooks/views/WebhooksDetails.tsx
View file

@ -11,7 +11,7 @@ import { WebhookEventTypeEnum } from "@saleor/types/globalTypes";
import WebhookDeleteDialog from "@saleor/webhooks/components/WebhookDeleteDialog";
import { WebhookDelete } from "@saleor/webhooks/types/WebhookDelete";
import { WebhookUpdate } from "@saleor/webhooks/types/WebhookUpdate";
import { getMutationState, maybe } from "../../misc";
import { maybe } from "../../misc";
import WebhooksDetailsPage from "../components/WebhooksDetailsPage";
import { TypedWebhookDelete, TypedWebhookUpdate } from "../mutations";
import { TypedWebhooksDetailsQuery } from "../queries";
@ -85,14 +85,6 @@ export const WebhooksDetails: React.FC<WebhooksDetailsProps> = ({
{(webhookDelete, webhookDeleteOpts) => (
<TypedWebhooksDetailsQuery variables={{ id }}>
{webhookDetails => {
const formTransitionState = getMutationState(
webhookUpdateOpts.called,
webhookUpdateOpts.loading,
maybe(
() => webhookUpdateOpts.data.webhookUpdate.webhookErrors
)
);
const handleRemoveConfirm = () =>
webhookDelete({
variables: {
@ -105,12 +97,6 @@ export const WebhooksDetails: React.FC<WebhooksDetailsProps> = ({
[]
);
const deleteTransitionState = getMutationState(
webhookDeleteOpts.called,
webhookDeleteOpts.loading,
maybe(() => webhookDeleteOpts.data.webhookDelete.errors)
);
return (
<>
<WindowTitle
@ -119,7 +105,7 @@ export const WebhooksDetails: React.FC<WebhooksDetailsProps> = ({
<WebhooksDetailsPage
disabled={webhookDetails.loading}
errors={formErrors}
saveButtonBarState={formTransitionState}
saveButtonBarState={webhookUpdateOpts.state}
webhook={maybe(() => webhookDetails.data.webhook)}
fetchServiceAccounts={searchServiceAccount}
services={maybe(() =>
@ -148,7 +134,7 @@ export const WebhooksDetails: React.FC<WebhooksDetailsProps> = ({
}}
/>
<WebhookDeleteDialog
confirmButtonState={deleteTransitionState}
confirmButtonState={webhookDeleteOpts.state}
name={maybe(
() => webhookDetails.data.webhook.name,
"..."

10
src/webhooks/views/WebhooksList.tsx
View file

@ -10,7 +10,7 @@ import usePaginator, {
createPaginationState
} from "@saleor/hooks/usePaginator";
import { commonMessages } from "@saleor/intl";
import { getMutationState, maybe } from "@saleor/misc";
import { maybe } from "@saleor/misc";
import { ListViews } from "@saleor/types";
import WebhookDeleteDialog from "@saleor/webhooks/components/WebhookDeleteDialog";
import { WebhookDelete } from "@saleor/webhooks/types/WebhookDelete";
@ -150,12 +150,6 @@ export const WebhooksList: React.FC<WebhooksListProps> = ({ params }) => {
});
};
const deleteTransitionState = getMutationState(
webhookDeleteOpts.called,
webhookDeleteOpts.loading,
maybe(() => webhookDeleteOpts.data.webhookDelete.errors)
);
return (
<>
<WebhooksListPage
@ -182,7 +176,7 @@ export const WebhooksList: React.FC<WebhooksListProps> = ({ params }) => {
onRowClick={id => () => navigate(webhooksUrl(id))}
/>
<WebhookDeleteDialog
confirmButtonState={deleteTransitionState}
confirmButtonState={webhookDeleteOpts.state}
name={maybe(
() =>
data.webhooks.edges.find(