@strapi/admin 4.16.2 → 4.17.0

package/dist/_chunks/index-91df57b1.mjs

@@ -1,826 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import React__default, { useState, useEffect } from "react";
-import { RawTable, Flex, FieldLabel, Loader, RawThead, RawTr, RawTh, VisuallyHidden, Typography, RawTbody, RawTd, Checkbox, BaseCheckbox, CreatableCombobox, ComboboxOption, Box, Grid, GridItem, TextInput, TextButton, HeaderLayout, Button, ContentLayout, Main } from "@strapi/design-system";
-import { RemoveRoundedButton, pxToRem, Form, Link, useNotification, useAPIErrorHandler, useFetchClient, LoadingIndicatorPage, SettingsPageTitle } from "@strapi/helper-plugin";
-import { useQueryClient, useQuery, useMutation } from "react-query";
-import { useRouteMatch, useHistory } from "react-router-dom";
-import { u as useContentTypes } from "./useContentTypes-53b449bb.mjs";
-import { Plus, Loader as Loader$1, Check, Cross, Play, ArrowLeft } from "@strapi/icons";
-import { useFormikContext, FieldArray, Field, useFormik, FormikProvider } from "formik";
-import PropTypes from "prop-types";
-import { useIntl } from "react-intl";
-import { p as useEnterprise } from "./index-8933483b.mjs";
-import styled from "styled-components";
-import * as yup from "yup";
-const formatValue = (value) => value.reduce((acc, curr) => {
-  const key = curr.split(".")[0];
-  if (!acc[key]) {
-    acc[key] = [];
-  }
-  acc[key].push(curr);
-  return acc;
-}, {});
-const StyledTable = styled(RawTable)`
-  tbody tr:nth-child(odd) {
-    background: ${({ theme }) => theme.colors.neutral100};
-  }
-
-  thead th span {
-    color: ${({ theme }) => theme.colors.neutral500};
-  }
-
-  td,
-  th {
-    padding-block-start: ${({ theme }) => theme.spaces[3]};
-    padding-block-end: ${({ theme }) => theme.spaces[3]};
-    width: 10%;
-    vertical-align: middle;
-    text-align: center;
-  }
-
-  tbody tr td:first-child {
-    /**
-     * Add padding to the start of the first column to avoid the checkbox appearing
-     * too close to the edge of the table
-     */
-    padding-inline-start: ${({ theme }) => theme.spaces[2]};
-  }
-`;
-const getCEHeaders = (isDraftAndPublish) => {
-  const headers = [
-    { id: "Settings.webhooks.events.create", defaultMessage: "Create" },
-    { id: "Settings.webhooks.events.update", defaultMessage: "Update" },
-    { id: "app.utils.delete", defaultMessage: "Delete" }
-  ];
-  if (isDraftAndPublish) {
-    headers.push({ id: "app.utils.publish", defaultMessage: "Publish" });
-    headers.push({ id: "app.utils.unpublish", defaultMessage: "Unpublish" });
-  }
-  return headers;
-};
-const getCEEvents = (isDraftAndPublish) => {
-  const entryEvents = ["entry.create", "entry.update", "entry.delete"];
-  if (isDraftAndPublish) {
-    entryEvents.push("entry.publish", "entry.unpublish");
-  }
-  return {
-    entry: entryEvents,
-    media: ["media.create", "media.update", "media.delete"]
-  };
-};
-const WebhookEventContext = React.createContext();
-const Root = ({ children }) => {
-  const { formatMessage } = useIntl();
-  const { collectionTypes, isLoading } = useContentTypes();
-  const isDraftAndPublish = React.useMemo(
-    () => collectionTypes.some((ct) => ct.options.draftAndPublish === true),
-    [collectionTypes]
-  );
-  const label = formatMessage({
-    id: "Settings.webhooks.form.events",
-    defaultMessage: "Events"
-  });
-  return /* @__PURE__ */ jsx(WebhookEventContext.Provider, { value: { isDraftAndPublish }, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
-    /* @__PURE__ */ jsx(FieldLabel, { "aria-hidden": true, children: label }),
-    isLoading && /* @__PURE__ */ jsx(Loader, { children: formatMessage({
-      id: "Settings.webhooks.events.isLoading",
-      defaultMessage: "Events loading"
-    }) }),
-    /* @__PURE__ */ jsx(StyledTable, { "aria-label": label, children })
-  ] }) });
-};
-Root.propTypes = {
-  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired
-};
-const Headers = ({ getHeaders = getCEHeaders }) => {
-  const { isDraftAndPublish } = React.useContext(WebhookEventContext);
-  const { formatMessage } = useIntl();
-  const headers = getHeaders(isDraftAndPublish);
-  return /* @__PURE__ */ jsx(RawThead, { children: /* @__PURE__ */ jsxs(RawTr, { children: [
-    /* @__PURE__ */ jsx(RawTh, { children: /* @__PURE__ */ jsx(VisuallyHidden, { children: formatMessage({
-      id: "Settings.webhooks.event.select",
-      defaultMessage: "Select event"
-    }) }) }),
-    headers.map((header) => {
-      if (["app.utils.publish", "app.utils.unpublish"].includes(header.id)) {
-        return /* @__PURE__ */ jsx(
-          RawTh,
-          {
-            title: formatMessage({
-              id: "Settings.webhooks.event.publish-tooltip",
-              defaultMessage: "This event only exists for content with draft & publish enabled"
-            }),
-            children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral600", children: formatMessage(header) })
-          },
-          header.id
-        );
-      }
-      return /* @__PURE__ */ jsx(RawTh, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral600", children: formatMessage(header) }) }, header.id);
-    })
-  ] }) });
-};
-Headers.defaultProps = {
-  getHeaders: getCEHeaders
-};
-Headers.propTypes = {
-  getHeaders: PropTypes.func
-};
-const Body = ({ providedEvents }) => {
-  const { isDraftAndPublish } = React.useContext(WebhookEventContext);
-  const events = providedEvents || getCEEvents(isDraftAndPublish);
-  const { values, handleChange: onChange } = useFormikContext();
-  const inputName = "events";
-  const inputValue = values.events;
-  const disabledEvents = [];
-  const formattedValue = formatValue(inputValue);
-  const handleSelect = ({ target: { name, value } }) => {
-    let set = new Set(inputValue);
-    if (value) {
-      set.add(name);
-    } else {
-      set.delete(name);
-    }
-    onChange({ target: { name: inputName, value: Array.from(set) } });
-  };
-  const handleSelectAll = ({ target: { name, value } }) => {
-    let set = new Set(inputValue);
-    if (value) {
-      events[name].forEach((event) => {
-        if (!disabledEvents.includes(event)) {
-          set.add(event);
-        }
-      });
-    } else {
-      events[name].forEach((event) => set.delete(event));
-    }
-    onChange({ target: { name: inputName, value: Array.from(set) } });
-  };
-  return /* @__PURE__ */ jsx(RawTbody, { children: Object.entries(events).map(([event, value]) => {
-    return /* @__PURE__ */ jsx(
-      EventRow,
-      {
-        disabledEvents,
-        name: event,
-        events: value,
-        inputValue: formattedValue[event],
-        handleSelect,
-        handleSelectAll
-      },
-      event
-    );
-  }) });
-};
-Body.defaultProps = {
-  providedEvents: null
-};
-Body.propTypes = {
-  providedEvents: PropTypes.object
-};
-const removeHyphensAndTitleCase = (str) => str.replace(/-/g, " ").split(" ").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
-const EventRow = ({ disabledEvents, name, events, inputValue, handleSelect, handleSelectAll }) => {
-  const { formatMessage } = useIntl();
-  const enabledCheckboxes = events.filter((event) => !disabledEvents.includes(event));
-  const hasSomeCheckboxSelected = inputValue.length > 0;
-  const areAllCheckboxesSelected = inputValue.length === enabledCheckboxes.length;
-  const onChangeAll = ({ target: { name: name2 } }) => {
-    const valueToSet = !areAllCheckboxesSelected;
-    handleSelectAll({
-      target: { name: name2, value: valueToSet }
-    });
-  };
-  const targetColumns = 5;
-  return /* @__PURE__ */ jsxs(RawTr, { children: [
-    /* @__PURE__ */ jsx(RawTd, { children: /* @__PURE__ */ jsx(
-      Checkbox,
-      {
-        indeterminate: hasSomeCheckboxSelected && !areAllCheckboxesSelected,
-        "aria-label": formatMessage({
-          id: "global.select-all-entries",
-          defaultMessage: "Select all entries"
-        }),
-        name,
-        onChange: onChangeAll,
-        value: areAllCheckboxesSelected,
-        children: removeHyphensAndTitleCase(name)
-      }
-    ) }),
-    events.map((event) => {
-      return /* @__PURE__ */ jsx(RawTd, { children: /* @__PURE__ */ jsx(
-        BaseCheckbox,
-        {
-          disabled: disabledEvents.includes(event),
-          "aria-label": event,
-          name: event,
-          value: inputValue.includes(event),
-          onValueChange: (value) => handleSelect({ target: { name: event, value } })
-        }
-      ) }, event);
-    }),
-    events.length < targetColumns && /* @__PURE__ */ jsx(RawTd, { colSpan: targetColumns - events.length })
-  ] });
-};
-EventRow.defaultProps = {
-  disabledEvents: [],
-  events: [],
-  inputValue: [],
-  handleSelect() {
-  },
-  handleSelectAll() {
-  }
-};
-EventRow.propTypes = {
-  disabledEvents: PropTypes.array,
-  events: PropTypes.array,
-  inputValue: PropTypes.array,
-  handleSelect: PropTypes.func,
-  handleSelectAll: PropTypes.func,
-  name: PropTypes.string.isRequired
-};
-const EventTable = { Root, Headers, Body, EventRow };
-function EventTableCE() {
-  return /* @__PURE__ */ jsxs(EventTable.Root, { children: [
-    /* @__PURE__ */ jsx(EventTable.Headers, {}),
-    /* @__PURE__ */ jsx(EventTable.Body, {})
-  ] });
-}
-const HTTP_HEADERS = [
-  "A-IM",
-  "Accept",
-  "Accept-Charset",
-  "Accept-Encoding",
-  "Accept-Language",
-  "Accept-Datetime",
-  "Access-Control-Request-Method",
-  "Access-Control-Request-Headers",
-  "Authorization",
-  "Cache-Control",
-  "Connection",
-  "Content-Length",
-  "Content-Type",
-  "Cookie",
-  "Date",
-  "Expect",
-  "Forwarded",
-  "From",
-  "Host",
-  "If-Match",
-  "If-Modified-Since",
-  "If-None-Match",
-  "If-Range",
-  "If-Unmodified-Since",
-  "Max-Forwards",
-  "Origin",
-  "Pragma",
-  "Proxy-Authorization",
-  "Range",
-  "Referer",
-  "TE",
-  "User-Agent",
-  "Upgrade",
-  "Via",
-  "Warning"
-];
-const Combobox = ({ name, onChange, value, ...props }) => {
-  const {
-    values: { headers }
-  } = useFormikContext();
-  const [options, setOptions] = useState(HTTP_HEADERS);
-  useEffect(() => {
-    setOptions(
-      HTTP_HEADERS.filter(
-        (key) => !headers?.some((header) => header.key !== value && header.key === key)
-      )
-    );
-  }, [headers, value]);
-  const handleChange = (value2) => {
-    onChange({ target: { name, value: value2 } });
-  };
-  const handleCreateOption = (value2) => {
-    setOptions((prev) => [...prev, value2]);
-    handleChange(value2);
-  };
-  return /* @__PURE__ */ jsx(
-    CreatableCombobox,
-    {
-      ...props,
-      onClear: () => handleChange(""),
-      onChange: handleChange,
-      onCreateOption: handleCreateOption,
-      placeholder: "",
-      value,
-      children: options.map((key) => /* @__PURE__ */ jsx(ComboboxOption, { value: key, children: key }, key))
-    }
-  );
-};
-Combobox.defaultProps = {
-  value: void 0
-};
-Combobox.propTypes = {
-  name: PropTypes.string.isRequired,
-  onChange: PropTypes.func.isRequired,
-  value: PropTypes.string
-};
-const HeadersInput = () => {
-  const { formatMessage } = useIntl();
-  const { values, errors } = useFormikContext();
-  return /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
-    /* @__PURE__ */ jsx(FieldLabel, { children: formatMessage({
-      id: "Settings.webhooks.form.headers",
-      defaultMessage: "Headers"
-    }) }),
-    /* @__PURE__ */ jsx(Box, { padding: 8, background: "neutral100", hasRadius: true, children: /* @__PURE__ */ jsx(
-      FieldArray,
-      {
-        validateOnChange: false,
-        name: "headers",
-        render: ({ push, remove }) => /* @__PURE__ */ jsxs(Grid, { gap: 4, children: [
-          values.headers.map((header, index) => (
-            // eslint-disable-next-line
-            /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
-              /* @__PURE__ */ jsx(GridItem, { col: 6, children: /* @__PURE__ */ jsx(
-                Field,
-                {
-                  as: Combobox,
-                  name: `headers.${index}.key`,
-                  "aria-label": `row ${index + 1} key`,
-                  label: formatMessage({
-                    id: "Settings.webhooks.key",
-                    defaultMessage: "Key"
-                  }),
-                  error: errors.headers?.[index]?.key && errors.headers[index].key
-                }
-              ) }),
-              /* @__PURE__ */ jsx(GridItem, { col: 6, children: /* @__PURE__ */ jsxs(Flex, { alignItems: "flex-end", children: [
-                /* @__PURE__ */ jsx(Box, { style: { flex: 1 }, children: /* @__PURE__ */ jsx(
-                  Field,
-                  {
-                    as: TextInput,
-                    name: `headers.${index}.value`,
-                    "aria-label": `row ${index + 1} value`,
-                    label: formatMessage({
-                      id: "Settings.webhooks.value",
-                      defaultMessage: "Value"
-                    }),
-                    error: errors.headers?.[index]?.value && errors.headers[index].value
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(
-                  Flex,
-                  {
-                    paddingLeft: 2,
-                    style: { alignSelf: "center" },
-                    paddingTop: errors.headers?.[index]?.value ? 0 : 5,
-                    children: /* @__PURE__ */ jsx(
-                      RemoveRoundedButton,
-                      {
-                        disabled: values.headers.length === 1,
-                        onClick: () => remove(index),
-                        label: formatMessage(
-                          {
-                            id: "Settings.webhooks.headers.remove",
-                            defaultMessage: "Remove header row {number}"
-                          },
-                          { number: index + 1 }
-                        )
-                      }
-                    )
-                  }
-                )
-              ] }) })
-            ] }, `${index}.${header.key}`)
-          )),
-          /* @__PURE__ */ jsx(GridItem, { col: 12, children: /* @__PURE__ */ jsx(
-            TextButton,
-            {
-              type: "button",
-              onClick: () => {
-                push({ key: "", value: "" });
-              },
-              startIcon: /* @__PURE__ */ jsx(Plus, {}),
-              children: formatMessage({
-                id: "Settings.webhooks.create.header",
-                defaultMessage: "Create new header"
-              })
-            }
-          ) })
-        ] })
-      }
-    ) })
-  ] });
-};
-const Icon = styled.svg(
-  ({ theme, color }) => `
-  width: ${12 / 16}rem;
-  height: ${12 / 16}rem;
-
-  path {
-    fill: ${theme.colors[color]};
-  }
-`
-);
-const Status = ({ isPending, statusCode }) => {
-  const { formatMessage } = useIntl();
-  if (isPending) {
-    return /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
-      /* @__PURE__ */ jsx(Icon, { as: Loader$1 }),
-      /* @__PURE__ */ jsx(Typography, { children: formatMessage({ id: "Settings.webhooks.trigger.pending", defaultMessage: "pending" }) })
-    ] });
-  }
-  if (statusCode >= 200 && statusCode < 300) {
-    return /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
-      /* @__PURE__ */ jsx(Icon, { as: Check, color: "success700" }),
-      /* @__PURE__ */ jsx(Typography, { children: formatMessage({ id: "Settings.webhooks.trigger.success", defaultMessage: "success" }) })
-    ] });
-  }
-  if (statusCode >= 300) {
-    return /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
-      /* @__PURE__ */ jsx(Icon, { as: Cross, color: "danger700" }),
-      /* @__PURE__ */ jsxs(Typography, { children: [
-        formatMessage({ id: "Settings.error", defaultMessage: "error" }),
-        " ",
-        statusCode
-      ] })
-    ] });
-  }
-  return null;
-};
-Status.propTypes = {
-  isPending: PropTypes.bool.isRequired,
-  statusCode: PropTypes.number
-};
-Status.defaultProps = {
-  statusCode: void 0
-};
-const Message = ({ statusCode, message }) => {
-  const { formatMessage } = useIntl();
-  if (statusCode >= 200 && statusCode < 300) {
-    return /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", ellipsis: true, children: formatMessage({
-      id: "Settings.webhooks.trigger.success.label",
-      defaultMessage: "Trigger succeeded"
-    }) }) });
-  }
-  if (statusCode >= 300) {
-    return /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsx(Flex, { maxWidth: pxToRem(250), justifyContent: "flex-end", title: message, children: /* @__PURE__ */ jsx(Typography, { ellipsis: true, textColor: "neutral600", children: message }) }) });
-  }
-  return null;
-};
-Message.propTypes = {
-  statusCode: PropTypes.number,
-  message: PropTypes.string
-};
-Message.defaultProps = {
-  statusCode: void 0,
-  message: void 0
-};
-const CancelButton = ({ onCancel }) => {
-  const { formatMessage } = useIntl();
-  return /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsx("button", { onClick: onCancel, type: "button", children: /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
-    /* @__PURE__ */ jsx(Typography, { textColor: "neutral400", children: formatMessage({ id: "Settings.webhooks.trigger.cancel", defaultMessage: "cancel" }) }),
-    /* @__PURE__ */ jsx(Icon, { as: Cross, color: "neutral400" })
-  ] }) }) });
-};
-CancelButton.propTypes = { onCancel: PropTypes.func.isRequired };
-const TriggerContainer = ({ isPending, onCancel, response }) => {
-  const { statusCode, message } = response;
-  const { formatMessage } = useIntl();
-  return /* @__PURE__ */ jsx(Box, { background: "neutral0", padding: 5, shadow: "filterShadow", hasRadius: true, children: /* @__PURE__ */ jsxs(Grid, { gap: 4, style: { alignItems: "center" }, children: [
-    /* @__PURE__ */ jsx(GridItem, { col: 3, children: /* @__PURE__ */ jsx(Typography, { children: formatMessage({
-      id: "Settings.webhooks.trigger.test",
-      defaultMessage: "Test-trigger"
-    }) }) }),
-    /* @__PURE__ */ jsx(GridItem, { col: 3, children: /* @__PURE__ */ jsx(Status, { isPending, statusCode }) }),
-    /* @__PURE__ */ jsx(GridItem, { col: 6, children: !isPending ? /* @__PURE__ */ jsx(Message, { statusCode, message }) : /* @__PURE__ */ jsx(CancelButton, { onCancel }) })
-  ] }) });
-};
-TriggerContainer.defaultProps = {
-  isPending: false,
-  onCancel() {
-  },
-  response: {}
-};
-TriggerContainer.propTypes = {
-  isPending: PropTypes.bool,
-  onCancel: PropTypes.func,
-  response: PropTypes.object
-};
-const NAME_REGEX = /(^$)|(^[A-Za-z][_0-9A-Za-z ]*$)/;
-const URL_REGEX = /(^$)|((https?:\/\/.*)(d*)\/?(.*))/;
-const makeWebhookValidationSchema = ({ formatMessage }) => yup.object().shape({
-  name: yup.string().required(
-    formatMessage({
-      id: "Settings.webhooks.validation.name.required",
-      defaultMessage: "Name is required"
-    })
-  ).matches(
-    NAME_REGEX,
-    formatMessage({
-      id: "Settings.webhooks.validation.name.regex",
-      defaultMessage: "The name must start with a letter and only contain letters, numbers, spaces and underscores"
-    })
-  ),
-  url: yup.string().required(
-    formatMessage({
-      id: "Settings.webhooks.validation.url.required",
-      defaultMessage: "Url is required"
-    })
-  ).matches(
-    URL_REGEX,
-    formatMessage({
-      id: "Settings.webhooks.validation.url.regex",
-      defaultMessage: "The value must be a valid Url"
-    })
-  ),
-  headers: yup.lazy((array) => {
-    let baseSchema = yup.array();
-    if (array.length === 1) {
-      const { key, value } = array[0];
-      if (!key && !value) {
-        return baseSchema;
-      }
-    }
-    return baseSchema.of(
-      yup.object().shape({
-        key: yup.string().required(
-          formatMessage({
-            id: "Settings.webhooks.validation.key",
-            defaultMessage: "Key is required"
-          })
-        ),
-        value: yup.string().required(
-          formatMessage({
-            id: "Settings.webhooks.validation.value",
-            defaultMessage: "Value is required"
-          })
-        )
-      })
-    );
-  }),
-  events: yup.array()
-});
-const WebhookForm = ({
-  handleSubmit,
-  triggerWebhook,
-  isCreating,
-  isTriggering,
-  triggerResponse,
-  data
-}) => {
-  const { formatMessage } = useIntl();
-  const [showTriggerResponse, setShowTriggerResponse] = useState(false);
-  const EventTable2 = useEnterprise(
-    EventTableCE,
-    async () => (await import("./index-28dd9303.mjs")).EventTableEE
-  );
-  const mapHeaders = (headers) => {
-    if (!Object.keys(headers).length) {
-      return [{ key: "", value: "" }];
-    }
-    return Object.entries(headers).map(([key, value]) => ({ key, value }));
-  };
-  const formik = useFormik({
-    initialValues: {
-      name: data?.name || "",
-      url: data?.url || "",
-      headers: mapHeaders(data?.headers || {}),
-      events: data?.events || []
-    },
-    onSubmit(values, { resetForm, setSubmitting }) {
-      handleSubmit(values);
-      resetForm({ values });
-      setSubmitting(false);
-    },
-    validationSchema: makeWebhookValidationSchema({ formatMessage }),
-    validateOnChange: false,
-    validateOnBlur: false
-  });
-  if (!EventTable2) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(FormikProvider, { value: formik, children: /* @__PURE__ */ jsxs(Form, { onSubmit: formik.handleSubmit, children: [
-    /* @__PURE__ */ jsx(
-      HeaderLayout,
-      {
-        primaryAction: /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              onClick: () => {
-                triggerWebhook();
-                setShowTriggerResponse(true);
-              },
-              variant: "tertiary",
-              startIcon: /* @__PURE__ */ jsx(Play, {}),
-              disabled: isCreating || isTriggering,
-              size: "L",
-              children: formatMessage({
-                id: "Settings.webhooks.trigger",
-                defaultMessage: "Trigger"
-              })
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              startIcon: /* @__PURE__ */ jsx(Check, {}),
-              type: "submit",
-              size: "L",
-              disabled: !formik.dirty,
-              loading: formik.isSubmitting,
-              children: formatMessage({
-                id: "global.save",
-                defaultMessage: "Save"
-              })
-            }
-          )
-        ] }),
-        title: isCreating ? formatMessage({
-          id: "Settings.webhooks.create",
-          defaultMessage: "Create a webhook"
-        }) : data?.name,
-        navigationAction: /* @__PURE__ */ jsx(Link, { startIcon: /* @__PURE__ */ jsx(ArrowLeft, {}), to: "/settings/webhooks", children: formatMessage({
-          id: "global.back",
-          defaultMessage: "Back"
-        }) })
-      }
-    ),
-    /* @__PURE__ */ jsx(ContentLayout, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
-      showTriggerResponse && /* @__PURE__ */ jsx(
-        TriggerContainer,
-        {
-          isPending: isTriggering,
-          response: triggerResponse,
-          onCancel: () => setShowTriggerResponse(false)
-        }
-      ),
-      /* @__PURE__ */ jsx(Box, { background: "neutral0", padding: 8, shadow: "filterShadow", hasRadius: true, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 6, children: [
-        /* @__PURE__ */ jsxs(Grid, { gap: 6, children: [
-          /* @__PURE__ */ jsx(GridItem, { col: 6, children: /* @__PURE__ */ jsx(
-            Field,
-            {
-              as: TextInput,
-              name: "name",
-              error: formik?.errors?.name && formik.errors.name,
-              label: formatMessage({
-                id: "global.name",
-                defaultMessage: "Name"
-              }),
-              required: true
-            }
-          ) }),
-          /* @__PURE__ */ jsx(GridItem, { col: 12, children: /* @__PURE__ */ jsx(
-            Field,
-            {
-              as: TextInput,
-              name: "url",
-              error: formik?.errors?.url && formik.errors.url,
-              label: formatMessage({
-                id: "Settings.roles.form.input.url",
-                defaultMessage: "Url"
-              }),
-              required: true
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ jsx(HeadersInput, {}),
-        /* @__PURE__ */ jsx(EventTable2, {})
-      ] }) })
-    ] }) })
-  ] }) });
-};
-WebhookForm.propTypes = {
-  data: PropTypes.object,
-  handleSubmit: PropTypes.func.isRequired,
-  triggerWebhook: PropTypes.func.isRequired,
-  isCreating: PropTypes.bool.isRequired,
-  isTriggering: PropTypes.bool.isRequired,
-  triggerResponse: PropTypes.object
-};
-WebhookForm.defaultProps = {
-  data: void 0,
-  triggerResponse: void 0
-};
-const cleanData = (data) => ({
-  ...data,
-  headers: data.headers.reduce((acc, { key, value }) => {
-    if (key !== "") {
-      acc[key] = value;
-    }
-    return acc;
-  }, {})
-});
-const EditView = () => {
-  const {
-    params: { id }
-  } = useRouteMatch("/settings/webhooks/:id");
-  const isCreating = id === "create";
-  const { replace } = useHistory();
-  const toggleNotification = useNotification();
-  const { formatAPIError } = useAPIErrorHandler();
-  const queryClient = useQueryClient();
-  const { isLoading: isLoadingForModels } = useContentTypes();
-  const { put, get, post } = useFetchClient();
-  const {
-    isLoading,
-    data: webhookData,
-    error: webhookError
-  } = useQuery(
-    ["webhooks", id],
-    async () => {
-      const {
-        data: { data }
-      } = await get(`/admin/webhooks/${id}`);
-      return data;
-    },
-    {
-      enabled: !isCreating
-    }
-  );
-  React.useEffect(() => {
-    if (webhookError) {
-      toggleNotification({
-        type: "warning",
-        message: formatAPIError(webhookError)
-      });
-    }
-  }, [webhookError, toggleNotification, formatAPIError]);
-  const {
-    isLoading: isTriggering,
-    data: triggerResponse,
-    isIdle: isTriggerIdle,
-    mutate
-  } = useMutation(() => post(`/admin/webhooks/${id}/trigger`));
-  const triggerWebhook = () => mutate(null, {
-    onError(error) {
-      toggleNotification({
-        type: "warning",
-        message: formatAPIError(error)
-      });
-    }
-  });
-  const createWebhookMutation = useMutation((body) => post("/admin/webhooks", body));
-  const updateWebhookMutation = useMutation(({ id: id2, body }) => put(`/admin/webhooks/${id2}`, body));
-  const handleSubmit = async (data) => {
-    if (isCreating) {
-      createWebhookMutation.mutate(cleanData(data), {
-        onSuccess({ data: result }) {
-          toggleNotification({
-            type: "success",
-            message: { id: "Settings.webhooks.created" }
-          });
-          replace(`/settings/webhooks/${result.data.id}`);
-        },
-        onError(error) {
-          toggleNotification({
-            type: "warning",
-            message: formatAPIError(error)
-          });
-        }
-      });
-      return;
-    }
-    updateWebhookMutation.mutate(
-      { id, body: cleanData(data) },
-      {
-        onSuccess() {
-          queryClient.invalidateQueries(["webhooks", id]);
-          toggleNotification({
-            type: "success",
-            message: { id: "notification.form.success.fields" }
-          });
-        },
-        onError(error) {
-          toggleNotification({
-            type: "warning",
-            message: formatAPIError(error)
-          });
-        }
-      }
-    );
-  };
-  if (isLoading || isLoadingForModels) {
-    return /* @__PURE__ */ jsx(LoadingIndicatorPage, {});
-  }
-  return /* @__PURE__ */ jsxs(Main, { children: [
-    /* @__PURE__ */ jsx(SettingsPageTitle, { name: "Webhooks" }),
-    /* @__PURE__ */ jsx(
-      WebhookForm,
-      {
-        ...{
-          data: webhookData,
-          handleSubmit,
-          triggerWebhook,
-          isCreating,
-          isTriggering,
-          isTriggerIdle,
-          triggerResponse: triggerResponse?.data.data
-        }
-      }
-    )
-  ] });
-};
-export {
-  EditView as E,
-  EventTable as a
-};
-//# sourceMappingURL=index-91df57b1.mjs.map