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

Fix types

Browse source
This commit is contained in:
dominik-zeglen 2019-11-22 16:52:19 +01:00
parent e6dfd5c3e5
commit 340e00f030
2 changed files with 267 additions and 270 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -21,7 +21,7 @@ import { ListViews } from "@saleor/types";
import OrderDraftListPage from "../../components/OrderDraftListPage"; import OrderDraftListPage from "../../components/OrderDraftListPage";
import { import {
TypedOrderDraftBulkCancelMutation, TypedOrderDraftBulkCancelMutation,
TypedOrderDraftCreateMutation useOrderDraftCreateMutation
} from "../../mutations"; } from "../../mutations";
import { TypedOrderDraftListQuery } from "../../queries"; import { TypedOrderDraftListQuery } from "../../queries";
import { OrderDraftBulkCancel } from "../../types/OrderDraftBulkCancel"; import { OrderDraftBulkCancel } from "../../types/OrderDraftBulkCancel";
@ -58,6 +58,19 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
); );
const intl = useIntl(); const intl = useIntl();
const handleCreateOrderCreateSuccess = (data: OrderDraftCreate) => {
notify({
text: intl.formatMessage({
defaultMessage: "Order draft succesfully created"
})
});
navigate(orderUrl(data.draftOrderCreate.order.id));
};
const [createOrder] = useOrderDraftCreateMutation({
onCompleted: handleCreateOrderCreateSuccess
});
const tabs = getFilterTabs(); const tabs = getFilterTabs();
const currentTab = const currentTab =
@ -88,15 +101,6 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
true true
); );
const handleCreateOrderCreateSuccess = (data: OrderDraftCreate) => {
notify({
text: intl.formatMessage({
defaultMessage: "Order draft succesfully created"
})
});
navigate(orderUrl(data.draftOrderCreate.order.id));
};
const openModal = (action: OrderDraftListUrlDialog, ids?: string[]) => const openModal = (action: OrderDraftListUrlDialog, ids?: string[]) =>
navigate( navigate(
orderDraftListUrl({ orderDraftListUrl({
@ -137,140 +141,133 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
); );
return ( return (
<TypedOrderDraftCreateMutation onCompleted={handleCreateOrderCreateSuccess}> <TypedOrderDraftListQuery displayLoader variables={queryVariables}>
{createOrder => ( {({ data, loading, refetch }) => {
<TypedOrderDraftListQuery displayLoader variables={queryVariables}> const { loadNextPage, loadPreviousPage, pageInfo } = paginate(
{({ data, loading, refetch }) => { maybe(() => data.draftOrders.pageInfo),
const { loadNextPage, loadPreviousPage, pageInfo } = paginate( paginationState,
maybe(() => data.draftOrders.pageInfo), params
paginationState, );
params
);
const handleOrderDraftBulkCancel = (data: OrderDraftBulkCancel) => { const handleOrderDraftBulkCancel = (data: OrderDraftBulkCancel) => {
if (data.draftOrderBulkDelete.errors.length === 0) { if (data.draftOrderBulkDelete.errors.length === 0) {
notify({ notify({
text: intl.formatMessage({ text: intl.formatMessage({
defaultMessage: "Deleted draft orders" defaultMessage: "Deleted draft orders"
}) })
});
refetch();
reset();
closeModal();
}
};
return (
<TypedOrderDraftBulkCancelMutation
onCompleted={handleOrderDraftBulkCancel}
>
{(orderDraftBulkDelete, orderDraftBulkDeleteOpts) => {
const bulkRemoveTransitionState = getMutationState(
orderDraftBulkDeleteOpts.called,
orderDraftBulkDeleteOpts.loading,
maybe(
() =>
orderDraftBulkDeleteOpts.data.draftOrderBulkDelete.errors
)
);
const onOrderDraftBulkDelete = () =>
orderDraftBulkDelete({
variables: {
ids: params.ids
}
}); });
refetch();
reset();
closeModal();
}
};
return ( return (
<TypedOrderDraftBulkCancelMutation <>
onCompleted={handleOrderDraftBulkCancel} <OrderDraftListPage
> currentTab={currentTab}
{(orderDraftBulkDelete, orderDraftBulkDeleteOpts) => { initialSearch={params.query || ""}
const bulkRemoveTransitionState = getMutationState( onSearchChange={query => changeFilterField({ query })}
orderDraftBulkDeleteOpts.called, onAll={() => navigate(orderDraftListUrl())}
orderDraftBulkDeleteOpts.loading, onTabChange={handleTabChange}
maybe( onTabDelete={() => openModal("delete-search")}
() => onTabSave={() => openModal("save-search")}
orderDraftBulkDeleteOpts.data.draftOrderBulkDelete tabs={tabs.map(tab => tab.name)}
.errors disabled={loading}
) settings={settings}
); orders={maybe(() =>
const onOrderDraftBulkDelete = () => data.draftOrders.edges.map(edge => edge.node)
orderDraftBulkDelete({ )}
variables: { pageInfo={pageInfo}
ids: params.ids onAdd={createOrder}
} onNextPage={loadNextPage}
}); onPreviousPage={loadPreviousPage}
onUpdateListSettings={updateListSettings}
return ( onRowClick={id => () => navigate(orderUrl(id))}
<> isChecked={isSelected}
<OrderDraftListPage selected={listElements.length}
currentTab={currentTab} toggle={toggle}
initialSearch={params.query || ""} toggleAll={toggleAll}
onSearchChange={query => changeFilterField({ query })} toolbar={
onAll={() => navigate(orderDraftListUrl())} <IconButton
onTabChange={handleTabChange} color="primary"
onTabDelete={() => openModal("delete-search")} onClick={() =>
onTabSave={() => openModal("save-search")} navigate(
tabs={tabs.map(tab => tab.name)} orderDraftListUrl({
disabled={loading} action: "remove",
settings={settings} ids: listElements
orders={maybe(() => })
data.draftOrders.edges.map(edge => edge.node) )
)}
pageInfo={pageInfo}
onAdd={createOrder}
onNextPage={loadNextPage}
onPreviousPage={loadPreviousPage}
onUpdateListSettings={updateListSettings}
onRowClick={id => () => navigate(orderUrl(id))}
isChecked={isSelected}
selected={listElements.length}
toggle={toggle}
toggleAll={toggleAll}
toolbar={
<IconButton
color="primary"
onClick={() =>
navigate(
orderDraftListUrl({
action: "remove",
ids: listElements
})
)
}
>
<DeleteIcon />
</IconButton>
} }
/>
<ActionDialog
confirmButtonState={bulkRemoveTransitionState}
onClose={closeModal}
onConfirm={onOrderDraftBulkDelete}
open={params.action === "remove"}
title={intl.formatMessage({
defaultMessage: "Delete Order Drafts",
description: "dialog header"
})}
variant="delete"
> >
<DialogContentText> <DeleteIcon />
<FormattedMessage </IconButton>
defaultMessage="Are you sure you want to delete {counter,plural,one{this order draft} other{{displayQuantity} orderDrafts}}?" }
description="dialog content" />
values={{ <ActionDialog
counter: maybe(() => params.ids.length), confirmButtonState={bulkRemoveTransitionState}
displayQuantity: ( onClose={closeModal}
<strong> onConfirm={onOrderDraftBulkDelete}
{maybe(() => params.ids.length)} open={params.action === "remove"}
</strong> title={intl.formatMessage({
) defaultMessage: "Delete Order Drafts",
}} description: "dialog header"
/> })}
</DialogContentText> variant="delete"
</ActionDialog> >
<SaveFilterTabDialog <DialogContentText>
open={params.action === "save-search"} <FormattedMessage
confirmButtonState="default" defaultMessage="Are you sure you want to delete {counter,plural,one{this order draft} other{{displayQuantity} orderDrafts}}?"
onClose={closeModal} description="dialog content"
onSubmit={handleTabSave} values={{
counter: maybe(() => params.ids.length),
displayQuantity: (
<strong>{maybe(() => params.ids.length)}</strong>
)
}}
/> />
<DeleteFilterTabDialog </DialogContentText>
open={params.action === "delete-search"} </ActionDialog>
confirmButtonState="default" <SaveFilterTabDialog
onClose={closeModal} open={params.action === "save-search"}
onSubmit={handleTabDelete} confirmButtonState="default"
tabName={maybe(() => tabs[currentTab - 1].name, "...")} onClose={closeModal}
/> onSubmit={handleTabSave}
</> />
); <DeleteFilterTabDialog
}} open={params.action === "delete-search"}
</TypedOrderDraftBulkCancelMutation> confirmButtonState="default"
); onClose={closeModal}
}} onSubmit={handleTabDelete}
</TypedOrderDraftListQuery> tabName={maybe(() => tabs[currentTab - 1].name, "...")}
)} />
</TypedOrderDraftCreateMutation> </>
);
}}
</TypedOrderDraftBulkCancelMutation>
);
}}
</TypedOrderDraftListQuery>
); );
}; };

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

@ -21,7 +21,7 @@ import OrderBulkCancelDialog from "../../components/OrderBulkCancelDialog";
import OrderListPage from "../../components/OrderListPage/OrderListPage"; import OrderListPage from "../../components/OrderListPage/OrderListPage";
import { import {
TypedOrderBulkCancelMutation, TypedOrderBulkCancelMutation,
TypedOrderDraftCreateMutation useOrderDraftCreateMutation
} from "../../mutations"; } from "../../mutations";
import { TypedOrderListQuery } from "../../queries"; import { TypedOrderListQuery } from "../../queries";
import { OrderBulkCancel } from "../../types/OrderBulkCancel"; import { OrderBulkCancel } from "../../types/OrderBulkCancel";
@ -62,6 +62,19 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
); );
const intl = useIntl(); const intl = useIntl();
const handleCreateOrderCreateSuccess = (data: OrderDraftCreate) => {
notify({
text: intl.formatMessage({
defaultMessage: "Order draft succesfully created"
})
});
navigate(orderUrl(data.draftOrderCreate.order.id));
};
const [createOrder] = useOrderDraftCreateMutation({
onCompleted: handleCreateOrderCreateSuccess
});
const tabs = getFilterTabs(); const tabs = getFilterTabs();
const currentTab = const currentTab =
@ -130,15 +143,6 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
const paginationState = createPaginationState(settings.rowNumber, params); const paginationState = createPaginationState(settings.rowNumber, params);
const currencySymbol = maybe(() => shop.defaultCurrency, "USD"); const currencySymbol = maybe(() => shop.defaultCurrency, "USD");
const handleCreateOrderCreateSuccess = (data: OrderDraftCreate) => {
notify({
text: intl.formatMessage({
defaultMessage: "Order draft succesfully created"
})
});
navigate(orderUrl(data.draftOrderCreate.order.id));
};
const queryVariables = React.useMemo( const queryVariables = React.useMemo(
() => ({ () => ({
...paginationState, ...paginationState,
@ -148,131 +152,127 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
); );
return ( return (
<TypedOrderDraftCreateMutation onCompleted={handleCreateOrderCreateSuccess}> <TypedOrderListQuery displayLoader variables={queryVariables}>
{createOrder => ( {({ data, loading, refetch }) => {
<TypedOrderListQuery displayLoader variables={queryVariables}> const { loadNextPage, loadPreviousPage, pageInfo } = paginate(
{({ data, loading, refetch }) => { maybe(() => data.orders.pageInfo),
const { loadNextPage, loadPreviousPage, pageInfo } = paginate( paginationState,
maybe(() => data.orders.pageInfo), params
paginationState, );
params
);
const handleOrderBulkCancel = (data: OrderBulkCancel) => { const handleOrderBulkCancel = (data: OrderBulkCancel) => {
if (data.orderBulkCancel.errors.length === 0) { if (data.orderBulkCancel.errors.length === 0) {
notify({ notify({
text: intl.formatMessage({ text: intl.formatMessage({
defaultMessage: "Orders cancelled" defaultMessage: "Orders cancelled"
}) })
});
reset();
refetch();
closeModal();
}
};
return (
<TypedOrderBulkCancelMutation onCompleted={handleOrderBulkCancel}>
{(orderBulkCancel, orderBulkCancelOpts) => {
const orderBulkCancelTransitionState = getMutationState(
orderBulkCancelOpts.called,
orderBulkCancelOpts.loading,
maybe(() => orderBulkCancelOpts.data.orderBulkCancel.errors)
);
const onOrderBulkCancel = (restock: boolean) =>
orderBulkCancel({
variables: {
ids: params.ids,
restock
}
}); });
reset();
refetch();
closeModal();
}
};
return ( return (
<TypedOrderBulkCancelMutation onCompleted={handleOrderBulkCancel}> <>
{(orderBulkCancel, orderBulkCancelOpts) => { <OrderListPage
const orderBulkCancelTransitionState = getMutationState( currencySymbol={currencySymbol}
orderBulkCancelOpts.called, settings={settings}
orderBulkCancelOpts.loading, filtersList={createFilterChips(
maybe(() => orderBulkCancelOpts.data.orderBulkCancel.errors) params,
); {
const onOrderBulkCancel = (restock: boolean) => formatDate
orderBulkCancel({ },
variables: { changeFilterField,
ids: params.ids, intl
restock )}
} currentTab={currentTab}
}); disabled={loading}
orders={maybe(() =>
return ( data.orders.edges.map(edge => edge.node)
<> )}
<OrderListPage pageInfo={pageInfo}
currencySymbol={currencySymbol} onAdd={createOrder}
settings={settings} onNextPage={loadNextPage}
filtersList={createFilterChips( onPreviousPage={loadPreviousPage}
params, onUpdateListSettings={updateListSettings}
{ onRowClick={id => () => navigate(orderUrl(id))}
formatDate isChecked={isSelected}
}, selected={listElements.length}
changeFilterField, toggle={toggle}
intl toggleAll={toggleAll}
)} toolbar={
currentTab={currentTab} <Button
disabled={loading} color="primary"
orders={maybe(() => onClick={() => openModal("cancel", listElements)}
data.orders.edges.map(edge => edge.node) >
)} <FormattedMessage
pageInfo={pageInfo} defaultMessage="Cancel"
onAdd={createOrder} description="cancel orders, button"
onNextPage={loadNextPage} />
onPreviousPage={loadPreviousPage} </Button>
onUpdateListSettings={updateListSettings} }
onRowClick={id => () => navigate(orderUrl(id))} onSearchChange={query => changeFilterField({ query })}
isChecked={isSelected} onFilterAdd={data =>
selected={listElements.length} changeFilterField(createFilter(params, data))
toggle={toggle} }
toggleAll={toggleAll} onTabSave={() => openModal("save-search")}
toolbar={ onTabDelete={() => openModal("delete-search")}
<Button onTabChange={handleTabChange}
color="primary" initialSearch={params.query || ""}
onClick={() => openModal("cancel", listElements)} tabs={getFilterTabs().map(tab => tab.name)}
> onAll={() =>
<FormattedMessage changeFilters({
defaultMessage="Cancel" status: undefined
description="cancel orders, button" })
/> }
</Button> />
} <OrderBulkCancelDialog
onSearchChange={query => changeFilterField({ query })} confirmButtonState={orderBulkCancelTransitionState}
onFilterAdd={data => numberOfOrders={maybe(
changeFilterField(createFilter(params, data)) () => params.ids.length.toString(),
} "..."
onTabSave={() => openModal("save-search")} )}
onTabDelete={() => openModal("delete-search")} onClose={closeModal}
onTabChange={handleTabChange} onConfirm={onOrderBulkCancel}
initialSearch={params.query || ""} open={params.action === "cancel"}
tabs={getFilterTabs().map(tab => tab.name)} />
onAll={() => <SaveFilterTabDialog
changeFilters({ open={params.action === "save-search"}
status: undefined confirmButtonState="default"
}) onClose={closeModal}
} onSubmit={handleFilterTabSave}
/> />
<OrderBulkCancelDialog <DeleteFilterTabDialog
confirmButtonState={orderBulkCancelTransitionState} open={params.action === "delete-search"}
numberOfOrders={maybe( confirmButtonState="default"
() => params.ids.length.toString(), onClose={closeModal}
"..." onSubmit={handleFilterTabDelete}
)} tabName={maybe(() => tabs[currentTab - 1].name, "...")}
onClose={closeModal} />
onConfirm={onOrderBulkCancel} </>
open={params.action === "cancel"} );
/> }}
<SaveFilterTabDialog </TypedOrderBulkCancelMutation>
open={params.action === "save-search"} );
confirmButtonState="default" }}
onClose={closeModal} </TypedOrderListQuery>
onSubmit={handleFilterTabSave}
/>
<DeleteFilterTabDialog
open={params.action === "delete-search"}
confirmButtonState="default"
onClose={closeModal}
onSubmit={handleFilterTabDelete}
tabName={maybe(() => tabs[currentTab - 1].name, "...")}
/>
</>
);
}}
</TypedOrderBulkCancelMutation>
);
}}
</TypedOrderListQuery>
)}
</TypedOrderDraftCreateMutation>
); );
}; };