strapi-plugin-comments 2.3.1 → 3.0.0-beta.0

package/dist/_chunks/index-CTjupB9v.js

@@ -0,0 +1,375 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const index$2 = require("./index-fAgatqD0.js");
+const admin = require("@strapi/strapi/admin");
+const reactQuery = require("@tanstack/react-query");
+const index$1 = require("./index-BVj8EXjI.js");
+const React = require("react");
+const styled = require("styled-components");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const styled__default = /* @__PURE__ */ _interopDefault(styled);
+const RenderIf = ({
+  children,
+  condition
+}) => {
+  return condition ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children }) : null;
+};
+const useSettingsAPI = (callbacksMutation = {}) => {
+  const api = index$1.useAPI();
+  const updateSettingsMutation = reactQuery.useMutation({
+    mutationFn: api.settings.update,
+    onSuccess: callbacksMutation.updateSettingsMutationSuccess,
+    onError: callbacksMutation.updateSettingsMutationError
+  });
+  const restoreSettingsMutation = reactQuery.useMutation({
+    mutationFn: api.settings.restore,
+    onSuccess: callbacksMutation.restoreSettingsMutationSuccess,
+    onError: callbacksMutation.restoreSettingsMutationError
+  });
+  const restartStrapiMutation = reactQuery.useMutation({
+    mutationFn: api.settings.restart,
+    onSuccess: callbacksMutation.restartStrapiMutationSuccess,
+    onError: callbacksMutation.restartStrapiMutationError
+  });
+  const config = reactQuery.useQuery({
+    queryKey: api.config.getKey(),
+    queryFn: api.config.query
+  });
+  const collectionTypes = reactQuery.useQuery({
+    queryKey: api.contentTypeBuilder.all.getKey(),
+    queryFn: api.contentTypeBuilder.all.query
+  });
+  const roles = reactQuery.useQuery({
+    queryKey: api.roles.getKey(),
+    queryFn: api.roles.query
+  });
+  return React.useMemo(() => ({
+    config,
+    collectionTypes,
+    roles,
+    restoreSettingsMutation,
+    updateSettingsMutation,
+    restartStrapiMutation
+  }), [
+    config,
+    roles,
+    collectionTypes,
+    restoreSettingsMutation,
+    updateSettingsMutation,
+    restartStrapiMutation
+  ]);
+};
+const boxDefaultProps = {
+  background: "neutral0",
+  hasRadius: true,
+  shadow: "filterShadow",
+  padding: 6,
+  width: "100%"
+};
+const StyledAlert = styled__default.default(index$2.Alert)(() => ({
+  "[role]": {
+    flexDirection: "column"
+  }
+}));
+const Settings = () => {
+  admin.useTracking();
+  const formRef = React.useRef(null);
+  const { toggleNotification } = admin.useNotification();
+  const [isRestartRequired, setIsRestartRequired] = React.useState(false);
+  const { isLoadingForPermissions, canSettingsChange } = index$1.usePermissions();
+  const queryClient2 = reactQuery.useQueryClient();
+  const api = index$1.useAPI();
+  const {
+    config,
+    collectionTypes,
+    roles,
+    restoreSettingsMutation,
+    updateSettingsMutation,
+    restartStrapiMutation
+  } = useSettingsAPI({
+    restoreSettingsMutationSuccess: () => {
+      queryClient2.invalidateQueries({
+        queryKey: api.config.getKey(),
+        exact: false
+      });
+      setIsRestartRequired(true);
+      toggleNotification({
+        message: index$1.getMessage("page.settings.actions.restore.success"),
+        type: "success"
+      });
+    },
+    restartStrapiMutationSuccess: () => {
+      setIsRestartRequired(false);
+    },
+    updateSettingsMutationSuccess: () => {
+      queryClient2.invalidateQueries({
+        queryKey: api.config.getKey(),
+        exact: false
+      });
+      setIsRestartRequired(true);
+    }
+  });
+  const onTriggerSubmit = React.useCallback(() => {
+    formRef.current?.requestSubmit();
+  }, []);
+  const onSubmit = React.useCallback((values) => {
+    updateSettingsMutation.mutate({
+      ...values,
+      blockedAuthorProps: values.blockedAuthorProps.split(",").map((prop) => prop.trim())
+    });
+  }, [updateSettingsMutation]);
+  if (config.status !== "success" || collectionTypes.status !== "success" || roles.status !== "success" || isLoadingForPermissions) {
+    return index$1.getMessage("page.settings.loading");
+  }
+  const allCollections = collectionTypes.data.filter((ct) => ct.uid.includes("api::"));
+  const enabledCollections = config.data.enabledCollections.filter((uid) => allCollections.some((ct) => ct.uid === uid));
+  const badWords = index$1.lodashExports.isNil(config.data.badWords) ? true : config.data?.badWords;
+  const gqlAuthEnabled = Boolean(config.data.gql?.auth || null);
+  const moderatorRoles = config.data.moderatorRoles.filter((role) => roles.data.filter((r) => r.code === role));
+  const clientUrl = config.data.client?.url;
+  const clientEmail = config.data.client?.contactEmail;
+  const blockedAuthorProps = config.data.blockedAuthorProps ?? [];
+  const onDiscardRestart = () => setIsRestartRequired(false);
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(admin.Page.Title, { children: "Comments - settings" }),
+    /* @__PURE__ */ jsxRuntime.jsxs(admin.Page.Main, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        admin.Layouts.Header,
+        {
+          title: index$1.getMessage("page.settings.header.title"),
+          subtitle: index$1.getMessage("page.settings.header.description"),
+          as: "h2",
+          primaryAction: /* @__PURE__ */ jsxRuntime.jsx(RenderIf, { condition: canSettingsChange, children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Button, { type: "submit", startIcon: /* @__PURE__ */ jsxRuntime.jsx(index$2.ForwardRef$4p, {}), onClick: onTriggerSubmit, children: index$1.getMessage("page.settings.actions.submit") }) })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(admin.Layouts.Content, { children: [
+        isRestartRequired && /* @__PURE__ */ jsxRuntime.jsx(index$2.Box, { marginBottom: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
+          StyledAlert,
+          {
+            closeLabel: index$1.getMessage("page.settings.actions.restart.alert.cancel"),
+            title: index$1.getMessage("page.settings.actions.restart.alert.title"),
+            onClose: onDiscardRestart,
+            action: /* @__PURE__ */ jsxRuntime.jsx(index$2.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Button, { onClick: restartStrapiMutation.mutate, startIcon: /* @__PURE__ */ jsxRuntime.jsx(index$2.ForwardRef$1f, {}), children: index$1.getMessage("page.settings.actions.restart") }) }),
+            children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Box, { marginTop: 4, children: index$1.getMessage("page.settings.actions.restart.alert.description") })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          admin.Form,
+          {
+            method: "POST",
+            ref: formRef,
+            onSubmit,
+            initialValues: {
+              enabledCollections,
+              moderatorRoles,
+              badWords,
+              clientEmail,
+              clientUrl,
+              gqlAuthEnabled,
+              approvalFlow: config.data.approvalFlow,
+              entryLabel: config.data.entryLabel,
+              blockedAuthorProps: blockedAuthorProps.join(", ")
+            },
+            children: ({ values, onChange }) => /* @__PURE__ */ jsxRuntime.jsxs(index$2.Flex, { gap: 4, direction: "column", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(index$2.Box, { ...boxDefaultProps, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { variant: "delta", as: "h2", children: index$1.getMessage("page.settings.section.general") }),
+                /* @__PURE__ */ jsxRuntime.jsxs(index$2.Grid.Root, { gap: 4, marginTop: 4, width: "100%", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Field.Root, { width: "100%", hint: index$1.getMessage("page.settings.form.enabledCollections.hint"), children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { htmlFor: "enabledCollections", children: index$1.getMessage("page.settings.form.enabledCollections.label") }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      index$2.MultiSelect,
+                      {
+                        withTags: true,
+                        name: "enabledCollections",
+                        value: values.enabledCollections,
+                        onChange: (value) => {
+                          onChange("enabledCollections", value);
+                        },
+                        children: allCollections.map((collection) => /* @__PURE__ */ jsxRuntime.jsx(index$2.MultiSelectOption, { value: collection.uid, children: collection.schema.displayName }, collection.uid))
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                  ] }) }),
+                  values.enabledCollections.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Grid.Root, { gap: 4, width: "100%", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { children: index$1.getMessage("page.settings.form.contentTypesSettings.label") }) }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Accordion.Root, { style: { width: "100%" }, children: index$1.lodashExports.orderBy(values.enabledCollections).map((uid) => {
+                      const collection = allCollections.find((ct) => ct.uid === uid);
+                      if (collection) {
+                        const { schema: { displayName, attributes } } = collection;
+                        const stringAttributes = Object.keys(attributes).filter((key) => attributes[key].type === "string");
+                        return /* @__PURE__ */ jsxRuntime.jsxs(index$2.Accordion.Item, { value: uid, children: [
+                          /* @__PURE__ */ jsxRuntime.jsx(index$2.Accordion.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Accordion.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { variant: "epsilon", as: "h3", children: displayName }) }) }),
+                          /* @__PURE__ */ jsxRuntime.jsx(index$2.Accordion.Content, { children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Grid.Root, { padding: 6, gap: 4, children: [
+                            /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+                              index$2.Field.Root,
+                              {
+                                width: "100%",
+                                hint: index$1.getMessage({
+                                  id: "page.settings.form.approvalFlow.hint",
+                                  props: { name: displayName }
+                                }),
+                                children: [
+                                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { children: index$1.getMessage("page.settings.form.approvalFlow.label") }),
+                                  /* @__PURE__ */ jsxRuntime.jsx(
+                                    index$2.SwitchImpl,
+                                    {
+                                      visibleLabels: true,
+                                      onLabel: index$1.getMessage("components.toogle.enabled"),
+                                      offLabel: index$1.getMessage("components.toogle.disabled"),
+                                      checked: values.approvalFlow.includes(uid),
+                                      onCheckedChange: (checked) => {
+                                        onChange("approvalFlow", checked ? [...values.approvalFlow, uid] : values.approvalFlow.filter((c) => c !== uid));
+                                      }
+                                    }
+                                  ),
+                                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                                ]
+                              }
+                            ) }),
+                            /* @__PURE__ */ jsxRuntime.jsx(RenderIf, { condition: stringAttributes.length > 0, children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+                              index$2.Field.Root,
+                              {
+                                width: "100%",
+                                hint: index$1.getMessage("page.settings.form.entryLabel.hint"),
+                                children: [
+                                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { children: index$1.getMessage("page.settings.form.entryLabel.label") }),
+                                  /* @__PURE__ */ jsxRuntime.jsx(
+                                    index$2.MultiSelect,
+                                    {
+                                      withTags: true,
+                                      placeholder: index$1.getMessage("page.settings.form.entryLabel.placeholder"),
+                                      name: "enabledCollections",
+                                      value: values.entryLabel[uid] ?? [],
+                                      onChange: (value) => {
+                                        onChange("entryLabel", { ...values.entryLabel, [uid]: value });
+                                      },
+                                      children: stringAttributes.map((attr) => /* @__PURE__ */ jsxRuntime.jsx(index$2.MultiSelectOption, { value: attr, children: attr }, attr))
+                                    }
+                                  ),
+                                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                                ]
+                              }
+                            ) }) })
+                          ] }) })
+                        ] }, uid);
+                      }
+                      return null;
+                    }) }) })
+                  ] }) })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs(index$2.Box, { ...boxDefaultProps, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { variant: "delta", as: "h2", children: index$1.getMessage("page.settings.section.additional") }),
+                /* @__PURE__ */ jsxRuntime.jsxs(index$2.Grid.Root, { gap: 4, marginTop: 4, width: "100%", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Field.Root, { width: "100%", hint: index$1.getMessage("page.settings.form.enabledCollections.hint"), children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { htmlFor: "enabledCollections", children: index$1.getMessage("page.settings.form.enabledCollections.label") }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      index$2.Toggle,
+                      {
+                        name: "badWords",
+                        checked: values.badWords,
+                        onChange,
+                        onLabel: index$1.getMessage("components.toogle.enabled"),
+                        offLabel: index$1.getMessage("components.toogle.disabled"),
+                        width: "100%"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Field.Root, { width: "100%", hint: index$1.getMessage("page.settings.form.author.blockedProps.hint"), children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { htmlFor: "enabledCollections", children: index$1.getMessage("page.settings.form.author.blockedProps.label") }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Input, { name: "blockedProps", onChange }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Field.Root, { width: "100%", hint: index$1.getMessage("page.settings.form.gqlAuth.hint"), children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { children: index$1.getMessage("page.settings.form.gqlAuth.label") }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      index$2.Toggle,
+                      {
+                        name: "gqlAuthEnabled",
+                        checked: values.gqlAuthEnabled,
+                        onChange,
+                        onLabel: index$1.getMessage("components.toogle.enabled"),
+                        offLabel: index$1.getMessage("components.toogle.disabled"),
+                        width: "100%"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                  ] }) })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs(index$2.Box, { ...boxDefaultProps, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { variant: "delta", as: "h2", children: index$1.getMessage("page.settings.section.client") }),
+                /* @__PURE__ */ jsxRuntime.jsxs(index$2.Grid.Root, { gap: 4, marginTop: 4, width: "100%", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Field.Root, { width: "100%", hint: index$1.getMessage("page.settings.form.client.url.hint"), children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { children: index$1.getMessage("page.settings.form.client.url.label") }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Input, { name: "clientUrl", onChange }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Field.Root, { width: "100%", hint: index$1.getMessage("page.settings.form.client.email.hint"), children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { children: index$1.getMessage("page.settings.form.client.email.label") }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Input, { name: "clientEmail", onChange }),
+                    /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                  ] }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Grid.Item, { xs: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(
+                    index$2.Field.Root,
+                    {
+                      width: "100%",
+                      hint: index$1.getMessage("page.settings.form.moderatorRoles.hint"),
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Label, { children: index$1.getMessage("page.settings.form.moderatorRoles.label") }),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          index$2.MultiSelect,
+                          {
+                            withTags: true,
+                            placeholder: index$1.getMessage("page.settings.form.moderatorRoles.placeholder"),
+                            name: "enabledCollections",
+                            value: values.moderatorRoles,
+                            onChange: (value) => {
+                              onChange("moderatorRoles", value);
+                            },
+                            children: roles.data.map((role) => /* @__PURE__ */ jsxRuntime.jsx(index$2.MultiSelectOption, { value: role.code, children: role.name }, role.code))
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsx(index$2.Field.Hint, {})
+                      ]
+                    }
+                  ) })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(RenderIf, { condition: canSettingsChange, children: /* @__PURE__ */ jsxRuntime.jsx(index$2.Box, { ...boxDefaultProps, children: /* @__PURE__ */ jsxRuntime.jsxs(index$2.Flex, { gap: 4, direction: "column", alignItems: "flex-start", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(index$2.Flex, { gap: 2, direction: "column", alignItems: "flex-start", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { variant: "delta", as: "h2", children: index$1.getMessage("page.settings.section.restore") }),
+                  /* @__PURE__ */ jsxRuntime.jsx(index$2.Typography, { variant: "pi", as: "h4", children: index$1.getMessage("page.settings.section.restore.subtitle") })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  index$1.ConfirmationDialog,
+                  {
+                    Trigger: ({ onClick }) => /* @__PURE__ */ jsxRuntime.jsx(
+                      index$2.Button,
+                      {
+                        variant: "danger-light",
+                        startIcon: /* @__PURE__ */ jsxRuntime.jsx(index$2.ForwardRef$51, {}),
+                        onClick,
+                        children: index$1.getMessage("page.settings.actions.restore")
+                      }
+                    ),
+                    onConfirm: restoreSettingsMutation.mutate,
+                    title: index$1.getMessage("page.settings.actions.restore.confirmation.header"),
+                    labelConfirm: index$1.getMessage("page.settings.actions.restore.confirmation.button.confirm"),
+                    iconConfirm: /* @__PURE__ */ jsxRuntime.jsx(index$2.ForwardRef$51, {}),
+                    children: index$1.getMessage("page.settings.actions.restore.confirmation.description")
+                  }
+                )
+              ] }) }) })
+            ] })
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+new reactQuery.QueryClient();
+const index = () => /* @__PURE__ */ jsxRuntime.jsx(index$1.CommonProviders, { children: /* @__PURE__ */ jsxRuntime.jsx(Settings, {}) });
+exports.default = index;