@vicacha-devs/strapi-plugin-bookings 0.0.0-stage → 1.0.0

package/dist/admin/SettingsPage-Xas3gvn4.mjs

@@ -0,0 +1,410 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Button, Tabs, Box, Flex, Typography, Field, NumberInput, TextInput, Checkbox } from "@strapi/design-system";
+import { useFetchClient, useNotification, Layouts } from "@strapi/strapi/admin";
+import { useCallback, useState, useEffect } from "react";
+import { useIntl } from "react-intl";
+import { PLUGIN_ID } from "./index.mjs";
+import { g as getTranslation } from "./getTranslation-CZAJyMSt.mjs";
+const SLOT_NUMBER_FIELDS = [
+  {
+    name: "defaultSlotDurationMinutes",
+    labelId: "settings.defaultSlotDurationMinutes",
+    labelDefault: "Slot Duration (Minutes)",
+    hintId: "settings.defaultSlotDurationMinutesHint",
+    hintDefault: "Standard length of each bookable appointment slot.",
+    placeholderId: "settings.defaultSlotDurationMinutes.placeholder",
+    placeholderDefault: "e.g., 60",
+    min: 5,
+    fallback: 60
+  },
+  {
+    name: "defaultCapacityPerSlot",
+    labelId: "settings.defaultCapacityPerSlot",
+    labelDefault: "Default Capacity Per Slot",
+    hintId: "settings.defaultCapacityPerSlotHint",
+    hintDefault: "Concurrent reservations allowed per time slot.",
+    placeholderId: "settings.defaultCapacityPerSlot.placeholder",
+    placeholderDefault: "e.g., 1",
+    min: 1,
+    fallback: 1
+  },
+  {
+    name: "defaultBufferBeforeMinutes",
+    labelId: "settings.defaultBufferBeforeMinutes",
+    labelDefault: "Buffer Before (Minutes)",
+    hintId: "settings.defaultBufferBeforeMinutesHint",
+    hintDefault: "Preparation gap blocked before each booking starts.",
+    placeholderId: "settings.defaultBufferBeforeMinutes.placeholder",
+    placeholderDefault: "e.g., 0",
+    min: 0,
+    fallback: 0
+  },
+  {
+    name: "defaultBufferAfterMinutes",
+    labelId: "settings.defaultBufferAfterMinutes",
+    labelDefault: "Buffer After (Minutes)",
+    hintId: "settings.defaultBufferAfterMinutesHint",
+    hintDefault: "Cooldown gap blocked after each booking ends.",
+    placeholderId: "settings.defaultBufferAfterMinutes.placeholder",
+    placeholderDefault: "e.g., 0",
+    min: 0,
+    fallback: 0
+  },
+  {
+    name: "defaultMinLeadTimeHours",
+    labelId: "settings.defaultMinLeadTimeHours",
+    labelDefault: "Minimum Lead Time (Hours)",
+    hintId: "settings.defaultMinLeadTimeHoursHint",
+    hintDefault: "Minimum notice required before a slot can be booked.",
+    placeholderId: "settings.defaultMinLeadTimeHours.placeholder",
+    placeholderDefault: "e.g., 2",
+    min: 0,
+    fallback: 2
+  },
+  {
+    name: "defaultMaxAdvanceDays",
+    labelId: "settings.defaultMaxAdvanceDays",
+    labelDefault: "Max Advance Horizon (Days)",
+    hintId: "settings.defaultMaxAdvanceDaysHint",
+    hintDefault: "How far in advance visitors may schedule bookings.",
+    placeholderId: "settings.defaultMaxAdvanceDays.placeholder",
+    placeholderDefault: "e.g., 90",
+    min: 1,
+    fallback: 90
+  }
+];
+const SettingsPage = () => {
+  const { formatMessage } = useIntl();
+  const { get, put } = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const t = useCallback(
+    (id, defaultMessage) => formatMessage({ id: getTranslation(id), defaultMessage }),
+    [formatMessage]
+  );
+  const [settings, setSettings] = useState({
+    theme: "breeze",
+    defaultLocale: "es",
+    secondaryCalendarLanguage: "local",
+    defaultTimezone: "America/Bogota",
+    defaultSlotDurationMinutes: 60,
+    defaultBufferBeforeMinutes: 0,
+    defaultBufferAfterMinutes: 0,
+    defaultCapacityPerSlot: 1,
+    defaultMinLeadTimeHours: 2,
+    defaultMaxAdvanceDays: 90,
+    defaultRequiresApproval: false,
+    sendEmailNotifications: true,
+    secondaryCalendars: [],
+    sources: []
+  });
+  const [loading, setLoading] = useState(true);
+  const [loadError, setLoadError] = useState(false);
+  const [saving, setSaving] = useState(false);
+  useEffect(() => {
+    let isMounted = true;
+    const load = async () => {
+      setLoading(true);
+      try {
+        const res = await get(
+          `/${PLUGIN_ID}/settings`
+        );
+        if (!isMounted) return;
+        if (res.data?.data) {
+          setSettings(res.data.data);
+          setLoadError(false);
+        }
+      } catch {
+        if (!isMounted) return;
+        setLoadError(true);
+        toggleNotification({
+          type: "danger",
+          message: t("settings.loadError", "Failed to load bookings settings")
+        });
+      } finally {
+        if (isMounted) {
+          setLoading(false);
+        }
+      }
+    };
+    void load();
+    return () => {
+      isMounted = false;
+    };
+  }, [get, toggleNotification, t]);
+  const handleSave = async () => {
+    if (loadError || loading) return;
+    setSaving(true);
+    try {
+      const res = await put(
+        `/${PLUGIN_ID}/settings`,
+        settings
+      );
+      if (res.data?.data) {
+        setSettings(res.data.data);
+      }
+      toggleNotification({
+        type: "success",
+        message: t("settings.saved", "Bookings settings saved successfully")
+      });
+    } catch {
+      toggleNotification({
+        type: "danger",
+        message: t("settings.saveError", "Failed to save bookings settings")
+      });
+    } finally {
+      setSaving(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: t("settings.title", "Bookings & Availability Settings"),
+        subtitle: t(
+          "settings.subtitle",
+          "Configure default slot durations, capacity limits, buffer times, lead times, and reservation approval rules. Visual calendar themes and secondary calendars are managed centrally in Calendar Settings."
+        ),
+        primaryAction: /* @__PURE__ */ jsx(
+          Button,
+          {
+            loading: saving,
+            disabled: loading || loadError || saving,
+            onClick: handleSave,
+            children: t("settings.save", "Save Settings")
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsxs(Tabs.Root, { defaultValue: "slots", children: [
+      /* @__PURE__ */ jsxs(
+        Tabs.List,
+        {
+          "aria-label": t("settings.title", "Bookings & Availability Settings"),
+          children: [
+            /* @__PURE__ */ jsx(Tabs.Trigger, { value: "slots", children: t("settings.defaultsHeading", "Default Slot & Scheduling Rules") }),
+            /* @__PURE__ */ jsx(Tabs.Trigger, { value: "approvals", children: t(
+              "settings.approvalsHeading",
+              "Approval Workflow & Email Notifications"
+            ) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(Tabs.Content, { value: "slots", children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          background: "neutral0",
+          hasRadius: true,
+          shadow: "tableShadow",
+          padding: 6,
+          style: {
+            border: "1px solid rgba(128, 128, 128, 0.22)",
+            borderTopLeftRadius: 0,
+            borderTopRightRadius: 0
+          },
+          children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t(
+              "settings.defaultsHeading",
+              "Default Slot & Scheduling Rules"
+            ) }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  display: "grid",
+                  gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
+                  gap: 16
+                },
+                children: SLOT_NUMBER_FIELDS.map((field) => /* @__PURE__ */ jsxs(
+                  Field.Root,
+                  {
+                    name: field.name,
+                    hint: t(field.hintId, field.hintDefault),
+                    children: [
+                      /* @__PURE__ */ jsx(Field.Label, { children: t(field.labelId, field.labelDefault) }),
+                      /* @__PURE__ */ jsx(
+                        NumberInput,
+                        {
+                          placeholder: t(
+                            field.placeholderId,
+                            field.placeholderDefault
+                          ),
+                          value: settings[field.name],
+                          onValueChange: (v) => {
+                            const num = Number(v ?? field.fallback);
+                            const safe = Number.isFinite(num) ? Math.max(field.min, Math.trunc(num)) : field.fallback;
+                            setSettings((prev) => ({
+                              ...prev,
+                              [field.name]: safe
+                            }));
+                          }
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Field.Hint, {})
+                    ]
+                  },
+                  field.name
+                ))
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  display: "grid",
+                  gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+                  gap: 16
+                },
+                children: /* @__PURE__ */ jsxs(
+                  Field.Root,
+                  {
+                    name: "defaultTimezone",
+                    hint: t(
+                      "settings.defaultTimezoneHint",
+                      "IANA timezone used to evaluate daily operating windows."
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx(Field.Label, { children: t(
+                        "settings.defaultTimezone",
+                        "Operating Hours Timezone (IANA)"
+                      ) }),
+                      /* @__PURE__ */ jsx(
+                        TextInput,
+                        {
+                          placeholder: t(
+                            "settings.defaultTimezone.placeholder",
+                            "e.g., America/Bogota"
+                          ),
+                          value: settings.defaultTimezone ?? "",
+                          onChange: (e) => setSettings((prev) => ({
+                            ...prev,
+                            defaultTimezone: e.target.value
+                          }))
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Field.Hint, {})
+                    ]
+                  }
+                )
+              }
+            )
+          ] })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Tabs.Content, { value: "approvals", children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          background: "neutral0",
+          hasRadius: true,
+          shadow: "tableShadow",
+          padding: 6,
+          style: {
+            border: "1px solid rgba(128, 128, 128, 0.22)",
+            borderTopLeftRadius: 0,
+            borderTopRightRadius: 0
+          },
+          children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t(
+              "settings.approvalsHeading",
+              "Approval Workflow & Email Notifications"
+            ) }),
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                style: {
+                  display: "grid",
+                  gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+                  gap: 16
+                },
+                children: [
+                  /* @__PURE__ */ jsxs(
+                    Box,
+                    {
+                      padding: 4,
+                      background: "neutral100",
+                      hasRadius: true,
+                      style: { border: "1px solid rgba(128, 128, 128, 0.18)" },
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Checkbox,
+                          {
+                            checked: settings.defaultRequiresApproval,
+                            onCheckedChange: (checked) => setSettings((prev) => ({
+                              ...prev,
+                              defaultRequiresApproval: Boolean(checked)
+                            })),
+                            children: t(
+                              "settings.requiresApproval",
+                              "Require Manual Admin Approval"
+                            )
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(Box, { paddingTop: 2, children: /* @__PURE__ */ jsxs(Typography, { variant: "pi", textColor: "neutral600", children: [
+                          t(
+                            "settings.requiresApprovalHintPrefix",
+                            "Places new visitor reservations in"
+                          ),
+                          " ",
+                          /* @__PURE__ */ jsx(
+                            "code",
+                            {
+                              style: {
+                                fontFamily: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace",
+                                fontSize: "0.88em",
+                                padding: "2px 6px",
+                                borderRadius: 4,
+                                background: "rgba(128, 128, 128, 0.16)",
+                                border: "1px solid rgba(128, 128, 128, 0.25)"
+                              },
+                              children: "pending"
+                            }
+                          ),
+                          " ",
+                          t(
+                            "settings.requiresApprovalHintSuffix",
+                            "status until confirmed by staff."
+                          )
+                        ] }) })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Box,
+                    {
+                      padding: 4,
+                      background: "neutral100",
+                      hasRadius: true,
+                      style: { border: "1px solid rgba(128, 128, 128, 0.18)" },
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Checkbox,
+                          {
+                            checked: settings.sendEmailNotifications,
+                            onCheckedChange: (checked) => setSettings((prev) => ({
+                              ...prev,
+                              sendEmailNotifications: Boolean(checked)
+                            })),
+                            children: t(
+                              "settings.sendEmailNotifications",
+                              "Send Confirmation & Status Update Emails"
+                            )
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(Box, { paddingTop: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+                          "settings.sendEmailNotificationsHint",
+                          "Automatically notifies visitors when their booking is created, approved, or rescheduled."
+                        ) }) })
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          ] })
+        }
+      ) })
+    ] }) })
+  ] });
+};
+export {
+  SettingsPage
+};