101 lines
3.5 KiB
TypeScript
101 lines
3.5 KiB
TypeScript
import { WindowTitle } from "@saleor/components/WindowTitle";
|
|
import useNavigator from "@saleor/hooks/useNavigator";
|
|
import useNotifier from "@saleor/hooks/useNotifier";
|
|
import React from "react";
|
|
import { useIntl } from "react-intl";
|
|
|
|
import { getMutationState, maybe } from "../../misc";
|
|
import WebhooksDetailsPage from "../components/WebhooksDetailsPage";
|
|
import { TypedWebhookUpdate } from "../mutations";
|
|
import { TypedServiceListQuery, TypedWebhooksDetailsQuery } from "../queries";
|
|
import { webhooksListUrl, WebhooksListUrlQueryParams } from "../urls";
|
|
|
|
export interface WebhooksDetailsProps {
|
|
id: string;
|
|
params: WebhooksListUrlQueryParams;
|
|
}
|
|
|
|
export const WebhooksDetails: React.StatelessComponent<
|
|
WebhooksDetailsProps
|
|
> = ({ id }) => {
|
|
const navigate = useNavigator();
|
|
const notify = useNotifier();
|
|
const intl = useIntl();
|
|
|
|
return (
|
|
<TypedWebhookUpdate>
|
|
{(webhookUpdate, webhookUpdateOpts) => (
|
|
<TypedWebhooksDetailsQuery variables={{ id }}>
|
|
{WebhookDetails => {
|
|
const formTransitionState = getMutationState(
|
|
webhookUpdateOpts.called,
|
|
webhookUpdateOpts.loading,
|
|
maybe(() => webhookUpdateOpts.data.webhookUpdate.errors)
|
|
);
|
|
|
|
const formErrors = maybe(
|
|
() => webhookUpdateOpts.data.webhookUpdate.errors,
|
|
[]
|
|
);
|
|
|
|
if (formErrors.length) {
|
|
formErrors.map(error => {
|
|
notify({
|
|
text: error.message
|
|
});
|
|
});
|
|
} else {
|
|
if (webhookUpdateOpts.data) {
|
|
notify({
|
|
text: intl.formatMessage({
|
|
defaultMessage: "Succesfully updated plugin settings",
|
|
description: "plugin success message"
|
|
})
|
|
});
|
|
}
|
|
}
|
|
|
|
return (
|
|
<TypedServiceListQuery variables={{ first: 99 }}>
|
|
{({ data }) => (
|
|
<>
|
|
<WindowTitle
|
|
title={maybe(() => WebhookDetails.data.webhook.name)}
|
|
/>
|
|
<WebhooksDetailsPage
|
|
disabled={WebhookDetails.loading}
|
|
errors={formErrors}
|
|
saveButtonBarState={formTransitionState}
|
|
webhook={maybe(() => WebhookDetails.data.webhook)}
|
|
services={maybe(() =>
|
|
data.serviceAccounts.edges.map(edge => edge.node)
|
|
)}
|
|
onBack={() => navigate(webhooksListUrl())}
|
|
onSubmit={data => {
|
|
webhookUpdate({
|
|
variables: {
|
|
id,
|
|
input: {
|
|
events: data.events,
|
|
isActive: data.isActive,
|
|
name: data.name,
|
|
secretKey: data.secretKey,
|
|
serviceAccount: data.serviceAccount,
|
|
targetUrl: data.targetUrl
|
|
}
|
|
}
|
|
});
|
|
}}
|
|
/>
|
|
</>
|
|
)}
|
|
</TypedServiceListQuery>
|
|
);
|
|
}}
|
|
</TypedWebhooksDetailsQuery>
|
|
)}
|
|
</TypedWebhookUpdate>
|
|
);
|
|
};
|
|
WebhooksDetails.displayName = "WebhooksDetails";
|
|
export default WebhooksDetails;
|