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

Add webhook delele to list

Browse source
This commit is contained in:
Krzysztof Bialoglowicz 2019-10-10 08:09:29 +02:00
parent 834addf3c0
commit d802ae90ce
3 changed files with 83 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/webhooks/components/WebhooksList/WebhooksList.tsx
View file

@ -19,7 +19,7 @@ import { useIntl } from "react-intl";
import Skeleton from "@saleor/components/Skeleton"; import Skeleton from "@saleor/components/Skeleton";
import TablePagination from "@saleor/components/TablePagination"; import TablePagination from "@saleor/components/TablePagination";
import { maybe, renderCollection } from "@saleor/misc"; import { maybe, renderCollection, stopPropagation } from "@saleor/misc";
import { ListProps } from "@saleor/types"; import { ListProps } from "@saleor/types";
import { Webhooks_webhooks_edges_node } from "../../types/Webhooks"; import { Webhooks_webhooks_edges_node } from "../../types/Webhooks";
@ -125,15 +125,18 @@ const WebhooksList = withStyles(styles, { name: "PluginList" })(
)} )}
</TableCell> </TableCell>
<TableCell className={classes.colAction}> <TableCell className={classes.colAction}>
<div <IconButton
color="primary"
onClick={webhook ? onRowClick(webhook.id) : undefined} onClick={webhook ? onRowClick(webhook.id) : undefined}
> >
<EditIcon /> <EditIcon />
</div> </IconButton>
<IconButton <IconButton
color="primary" color="primary"
onClick={ onClick={
webhook ? () => onRemove(webhook.id) : undefined webhook
? stopPropagation(() => onRemove(webhook.id))
: undefined
} }
> >
<DeleteIcon /> <DeleteIcon />

2
src/webhooks/components/WebhooksListPage/WebhooksListPage.tsx
View file

@ -13,7 +13,7 @@ import WebhooksList from "../WebhooksList/WebhooksList";
export interface WebhooksListPageProps extends PageListProps { export interface WebhooksListPageProps extends PageListProps {
webhooks: Webhooks_webhooks_edges_node[]; webhooks: Webhooks_webhooks_edges_node[];
onBack: () => void; onBack: () => void;
onRemove: () => void; onRemove: (id: string) => void;
} }
const WebhooksListPage: React.StatelessComponent<WebhooksListPageProps> = ({ const WebhooksListPage: React.StatelessComponent<WebhooksListPageProps> = ({

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

@ -20,8 +20,7 @@ import {
webhooksAddUrl, webhooksAddUrl,
webhooksListUrl, webhooksListUrl,
WebhooksListUrlQueryParams, WebhooksListUrlQueryParams,
webhooksUrl, webhooksUrl
WebhookUrlDialog
} from "../urls"; } from "../urls";
interface WebhooksListProps { interface WebhooksListProps {
@ -50,90 +49,85 @@ export const WebhooksList: React.StatelessComponent<WebhooksListProps> = ({
true true
); );
const openModal = (action: WebhookUrlDialog, id?: string) =>
navigate(
webhooksListUrl({
...params,
action,
id
})
);
const onWebhookDelete = (data: WebhookDelete) => {
if (data.webhookDelete.errors.length === 0) {
notify({
text: intl.formatMessage(commonMessages.savedChanges)
});
navigate(webhooksListUrl());
}
};
return ( return (
<TypedWebhooksListQuery displayLoader variables={paginationState}> <TypedWebhooksListQuery displayLoader variables={paginationState}>
{({ data, loading }) => ( {({ data, loading, refetch }) => {
<TypedWebhookDelete onCompleted={onWebhookDelete}> const onWebhookDelete = (data: WebhookDelete) => {
{(webhookDelete, webhookDeleteOpts) => { if (data.webhookDelete.errors.length === 0) {
const { loadNextPage, loadPreviousPage, pageInfo } = paginate( notify({
maybe(() => data.webhooks.pageInfo), text: intl.formatMessage(commonMessages.savedChanges)
paginationState, });
params navigate(webhooksListUrl());
); refetch();
const handleRemove = (id: string) => }
navigate( };
webhooksListUrl({ return (
...params, <TypedWebhookDelete onCompleted={onWebhookDelete}>
action: "remove", {(webhookDelete, webhookDeleteOpts) => {
id const { loadNextPage, loadPreviousPage, pageInfo } = paginate(
}) maybe(() => data.webhooks.pageInfo),
paginationState,
params
); );
const handleRemoveConfirm = () => const handleRemove = (id: string) => {
webhookDelete({ navigate(
variables: { webhooksListUrl({
id ...params,
} action: "remove",
}); id
})
);
};
const handleRemoveConfirm = () => {
webhookDelete({
variables: {
id: params.id
}
});
};
const deleteTransitionState = getMutationState( const deleteTransitionState = getMutationState(
webhookDeleteOpts.called, webhookDeleteOpts.called,
webhookDeleteOpts.loading, webhookDeleteOpts.loading,
maybe(() => webhookDeleteOpts.data.webhookDelete.errors) maybe(() => webhookDeleteOpts.data.webhookDelete.errors)
); );
return ( return (
<> <>
<WebhooksListPage <WebhooksListPage
disabled={loading} disabled={loading}
settings={settings} settings={settings}
webhooks={maybe(() => webhooks={maybe(() =>
data.webhooks.edges.map(edge => edge.node) data.webhooks.edges.map(edge => edge.node)
)} )}
pageInfo={pageInfo} pageInfo={pageInfo}
onAdd={() => navigate(webhooksAddUrl)} onAdd={() => navigate(webhooksAddUrl)}
onBack={() => navigate(configurationMenuUrl)} onBack={() => navigate(configurationMenuUrl)}
onNextPage={loadNextPage} onNextPage={loadNextPage}
onPreviousPage={loadPreviousPage} onPreviousPage={loadPreviousPage}
onRemove={handleRemove} onRemove={handleRemove}
onUpdateListSettings={updateListSettings} onUpdateListSettings={updateListSettings}
onRowClick={id => () => navigate(webhooksUrl(id))} onRowClick={id => () => navigate(webhooksUrl(id))}
/> />
<WebhookDeleteDialog <WebhookDeleteDialog
confirmButtonState={deleteTransitionState} confirmButtonState={deleteTransitionState}
name={maybe( name={maybe(
() => () =>
data.webhooks.edges.find( data.webhooks.edges.find(
edge => edge.node.id === params.id edge => edge.node.id === params.id
).node.name, ).node.name,
"..." "..."
)} )}
onClose={closeModal} onClose={closeModal}
onConfirm={handleRemoveConfirm} onConfirm={handleRemoveConfirm}
open={params.action === "remove"} open={params.action === "remove"}
/> />
</> </>
); );
}} }}
</TypedWebhookDelete> </TypedWebhookDelete>
)} );
}}
</TypedWebhooksListQuery> </TypedWebhooksListQuery>
); );
}; };