@ampless/admin 0.2.0-alpha.2 → 0.2.0-alpha.20

package/dist/chunk-QXJIIBUQ.js

@@ -0,0 +1,21 @@
+'use client';
+import {
+  MediaUploader
+} from "./chunk-5Q6KVRZ2.js";
+import {
+  useT
+} from "./chunk-XY4JWSMS.js";
+
+// src/components/media-view.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function MediaPage() {
+  const t = useT();
+  return /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-7xl p-4 md:p-8", children: [
+    /* @__PURE__ */ jsx("h1", { className: "mb-6 text-2xl font-bold md:mb-8 md:text-3xl", children: t("media.title") }),
+    /* @__PURE__ */ jsx(MediaUploader, {})
+  ] });
+}
+
+export {
+  MediaPage
+};

package/dist/chunk-S66L5CDS.js

@@ -0,0 +1,335 @@
+'use client';
+import {
+  useT
+} from "./chunk-XY4JWSMS.js";
+
+// src/components/image-upload-dialog.tsx
+import { useEffect, useRef, useState } from "react";
+import ReactCrop, { centerCrop, makeAspectCrop } from "react-image-crop";
+import "react-image-crop/dist/ReactCrop.css";
+import { shouldSkipProcessing } from "ampless/media";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+  Button,
+  Input,
+  Label
+} from "@ampless/runtime/ui";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var ASPECTS = {
+  free: void 0,
+  "1:1": 1,
+  "4:3": 4 / 3,
+  "16:9": 16 / 9,
+  "3:2": 3 / 2
+};
+var ASPECT_CHOICES = ["free", "1:1", "4:3", "16:9", "3:2"];
+var FORMAT_CHOICES = ["auto", "webp", "jpeg"];
+var MAX_DIMENSION_PRESETS = [640, 1024, 1600, 2400, 4e3];
+var MIN_DIMENSION = 100;
+var MAX_DIMENSION_CEILING = 8e3;
+function clampMaxDimension(value, fallback) {
+  if (!Number.isFinite(value) || value <= 0) return fallback;
+  return Math.min(MAX_DIMENSION_CEILING, Math.max(MIN_DIMENSION, Math.round(value)));
+}
+function clampQuality(value) {
+  if (!Number.isFinite(value)) return 0.85;
+  return Math.min(1, Math.max(0, value));
+}
+function resolveFormat(choice, inputMime, losslessForPng) {
+  if (choice === "auto") {
+    return {
+      format: "webp",
+      lossless: losslessForPng && inputMime === "image/png"
+    };
+  }
+  return { format: choice, lossless: false };
+}
+function buildInitialCrop(naturalWidth, naturalHeight, aspect) {
+  if (aspect) {
+    return centerCrop(
+      makeAspectCrop({ unit: "%", width: 100 }, aspect, naturalWidth, naturalHeight),
+      naturalWidth,
+      naturalHeight
+    );
+  }
+  return { unit: "%", x: 0, y: 0, width: 100, height: 100 };
+}
+function ImageUploadDialog({
+  file,
+  remaining,
+  busy = false,
+  defaults,
+  onConfirm,
+  onSkip,
+  onCancel
+}) {
+  const t = useT();
+  const defaultMaxDimension = defaults?.maxDimension ?? 2400;
+  const defaultQuality = defaults?.quality ?? 0.85;
+  const losslessForPng = defaults?.losslessForPng ?? true;
+  const [original, setOriginal] = useState(false);
+  const [aspect, setAspect] = useState("free");
+  const [crop, setCrop] = useState(void 0);
+  const [percentCrop, setPercentCrop] = useState(null);
+  const [naturalSize, setNaturalSize] = useState(null);
+  const [formatChoice, setFormatChoice] = useState("auto");
+  const [losslessOverride, setLosslessOverride] = useState(null);
+  const [quality, setQuality] = useState(defaultQuality);
+  const [maxDimension, setMaxDimension] = useState(defaultMaxDimension);
+  const [previewUrl, setPreviewUrl] = useState(null);
+  const imgRef = useRef(null);
+  useEffect(() => {
+    setOriginal(false);
+    setAspect("free");
+    setCrop(void 0);
+    setPercentCrop(null);
+    setNaturalSize(null);
+    setFormatChoice("auto");
+    setLosslessOverride(null);
+    setQuality(defaultQuality);
+    setMaxDimension(defaultMaxDimension);
+  }, [file, defaultQuality, defaultMaxDimension]);
+  useEffect(() => {
+    if (!naturalSize) return;
+    const next = buildInitialCrop(naturalSize.width, naturalSize.height, ASPECTS[aspect]);
+    setCrop(next);
+    setPercentCrop(next);
+  }, [aspect, naturalSize]);
+  useEffect(() => {
+    if (!file) {
+      setPreviewUrl(null);
+      return;
+    }
+    const url = URL.createObjectURL(file);
+    setPreviewUrl(url);
+    return () => URL.revokeObjectURL(url);
+  }, [file]);
+  if (!file) return null;
+  const isImage = file.type.startsWith("image/");
+  const passthrough = !isImage || shouldSkipProcessing(file.type);
+  const showCropper = !passthrough && !original;
+  const { format, lossless: autoLossless } = resolveFormat(formatChoice, file.type, losslessForPng);
+  const lossless = losslessOverride ?? autoLossless;
+  const showLosslessToggle = !original && !passthrough && format === "webp";
+  const showQualitySlider = !original && !passthrough && (format === "jpeg" || format === "webp" && !lossless);
+  function handleImageLoad(e) {
+    const { naturalWidth, naturalHeight } = e.currentTarget;
+    setNaturalSize({ width: naturalWidth, height: naturalHeight });
+    const initial = buildInitialCrop(naturalWidth, naturalHeight, ASPECTS[aspect]);
+    setCrop(initial);
+    setPercentCrop(initial);
+  }
+  function handleConfirm() {
+    if (!file || busy) return;
+    if (original || passthrough) {
+      onConfirm(file, { original: true });
+      return;
+    }
+    let cropArea = void 0;
+    if (percentCrop && naturalSize) {
+      const x = Math.round(percentCrop.x / 100 * naturalSize.width);
+      const y = Math.round(percentCrop.y / 100 * naturalSize.height);
+      const width = Math.round(percentCrop.width / 100 * naturalSize.width);
+      const height = Math.round(percentCrop.height / 100 * naturalSize.height);
+      if (width > 0 && height > 0 && (x !== 0 || y !== 0 || width !== naturalSize.width || height !== naturalSize.height)) {
+        cropArea = { x, y, width, height };
+      }
+    }
+    onConfirm(file, {
+      crop: cropArea,
+      maxDimension: clampMaxDimension(maxDimension, defaultMaxDimension),
+      format,
+      quality: clampQuality(quality),
+      lossless: format === "webp" ? lossless : false
+    });
+  }
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open: true,
+      onOpenChange: (open) => {
+        if (open) return;
+        onCancel();
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-h-[90vh] max-w-4xl overflow-y-auto", children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { className: "truncate", children: file.name }),
+          /* @__PURE__ */ jsxs(DialogDescription, { children: [
+            remaining > 1 ? t("media.dialog.remaining", { count: remaining }) : `${formatBytes(file.size)} \xB7 ${file.type || "unknown"}`,
+            busy && t("media.dialog.uploading")
+          ] })
+        ] }),
+        previewUrl && showCropper && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center rounded-md bg-black/90 p-2", children: /* @__PURE__ */ jsx(
+          ReactCrop,
+          {
+            crop,
+            aspect: ASPECTS[aspect],
+            minWidth: 20,
+            minHeight: 20,
+            onChange: (_pixel, percent) => {
+              setCrop(percent);
+              setPercentCrop(percent);
+            },
+            children: /* @__PURE__ */ jsx(
+              "img",
+              {
+                ref: imgRef,
+                src: previewUrl,
+                alt: "preview",
+                className: "block max-h-[60vh] max-w-full",
+                onLoad: handleImageLoad
+              }
+            )
+          }
+        ) }),
+        previewUrl && !showCropper && isImage && /* @__PURE__ */ jsx("div", { className: "flex h-48 items-center justify-center rounded-md bg-muted", children: /* @__PURE__ */ jsx("img", { src: previewUrl, alt: "preview", className: "max-h-full max-w-full object-contain" }) }),
+        !isImage && // Non-image upload: skip the broken-img preview. Show the
+        // file's name / size / mime so the admin can confirm before
+        // committing the bytes to S3.
+        /* @__PURE__ */ jsxs("div", { className: "flex h-32 flex-col items-center justify-center gap-1 rounded-md bg-muted text-sm text-muted-foreground", children: [
+          /* @__PURE__ */ jsx("span", { className: "font-medium", children: file.name }),
+          /* @__PURE__ */ jsxs("span", { className: "font-mono text-xs", children: [
+            formatBytes(file.size),
+            " \xB7 ",
+            file.type || "unknown"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "checkbox",
+                checked: original,
+                disabled: busy,
+                onChange: (e) => setOriginal(e.target.checked)
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { children: t("media.dialog.useOriginal") }),
+            passthrough && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: t("media.dialog.passthroughNote") })
+          ] }),
+          !original && !passthrough && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { children: t("media.dialog.aspectRatio") }),
+              /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: ASPECT_CHOICES.map((choice) => /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: aspect === choice ? "default" : "outline",
+                  size: "sm",
+                  disabled: busy,
+                  onClick: () => setAspect(choice),
+                  children: choice
+                },
+                choice
+              )) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { children: t("media.dialog.outputFormat") }),
+              /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: FORMAT_CHOICES.map((choice) => /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: formatChoice === choice ? "default" : "outline",
+                  size: "sm",
+                  disabled: busy,
+                  onClick: () => {
+                    setFormatChoice(choice);
+                    setLosslessOverride(null);
+                  },
+                  children: choice
+                },
+                choice
+              )) })
+            ] }),
+            showLosslessToggle && /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "checkbox",
+                  checked: lossless,
+                  disabled: busy,
+                  onChange: (e) => setLosslessOverride(e.target.checked)
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { children: t("media.dialog.losslessWebp") })
+            ] }),
+            showQualitySlider && /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx(Label, { children: t("media.dialog.quality", { value: Math.round(quality * 100) }) }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "range",
+                  min: 50,
+                  max: 100,
+                  step: 1,
+                  disabled: busy,
+                  value: Math.round(quality * 100),
+                  onChange: (e) => setQuality(Number(e.target.value) / 100),
+                  className: "mt-2 w-full"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "max-w-xs", children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: "maxDimension", children: t("media.dialog.maxDimension") }),
+              /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: MAX_DIMENSION_PRESETS.map((preset) => /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: maxDimension === preset ? "default" : "outline",
+                  size: "sm",
+                  disabled: busy,
+                  onClick: () => setMaxDimension(preset),
+                  children: preset
+                },
+                preset
+              )) }),
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  id: "maxDimension",
+                  type: "number",
+                  className: "mt-2",
+                  min: MIN_DIMENSION,
+                  max: MAX_DIMENSION_CEILING,
+                  disabled: busy,
+                  value: maxDimension,
+                  onChange: (e) => setMaxDimension(Number(e.target.value) || defaultMaxDimension)
+                }
+              )
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", type: "button", onClick: onCancel, children: t("media.dialog.cancelAll") }),
+          /* @__PURE__ */ jsx(Button, { variant: "outline", type: "button", disabled: busy, onClick: onSkip, children: t("media.dialog.skip") }),
+          /* @__PURE__ */ jsx(Button, { type: "button", disabled: busy, onClick: handleConfirm, children: busy ? t("media.dialog.uploadingButton") : t("media.dialog.upload") })
+        ] })
+      ] })
+    }
+  );
+}
+function formatBytes(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / 1024 / 1024).toFixed(1)} MB`;
+}
+
+// src/lib/admin-config-client.ts
+var cmsConfig = null;
+function setAdminCmsConfigClient(config) {
+  cmsConfig = config;
+}
+function getMediaProcessingDefaults() {
+  return cmsConfig?.media?.processing;
+}
+
+export {
+  ImageUploadDialog,
+  setAdminCmsConfigClient,
+  getMediaProcessingDefaults
+};

package/dist/chunk-SRNH2IVA.js

@@ -0,0 +1,149 @@
+'use client';
+import {
+  useT
+} from "./chunk-XY4JWSMS.js";
+
+// src/components/users-list-view.tsx
+import { useEffect, useState } from "react";
+import { generateClient } from "aws-amplify/api";
+import {
+  Button,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow
+} from "@ampless/runtime/ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function isAdminRole(value) {
+  return value === "admin" || value === "editor" || value === "none";
+}
+function UsersListView({ currentUserId }) {
+  const t = useT();
+  const [users, setUsers] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [loadError, setLoadError] = useState(null);
+  const [rows, setRows] = useState({});
+  useEffect(() => {
+    const client = generateClient();
+    client.queries.listAdminUsers().then(({ data, errors }) => {
+      if (errors && errors.length > 0) {
+        const msg = errors[0]?.message ?? "listAdminUsers failed";
+        console.error("[users-list-view] listAdminUsers errors:", errors);
+        setLoadError(msg);
+        return;
+      }
+      const list = data ?? [];
+      setUsers(list);
+      setRows(
+        Object.fromEntries(
+          list.map((u) => [u.userId, { selected: u.role, saving: false, error: null }])
+        )
+      );
+    }).catch((err) => {
+      console.error("[users-list-view] listAdminUsers threw:", err);
+      setLoadError(err instanceof Error ? err.message : String(err));
+    }).finally(() => setLoading(false));
+  }, []);
+  function updateRow(userId, patch) {
+    setRows((prev) => ({
+      ...prev,
+      [userId]: { ...prev[userId], ...patch }
+    }));
+  }
+  async function save(userId) {
+    const row = rows[userId];
+    if (!row) return;
+    updateRow(userId, { saving: true, error: null });
+    try {
+      const client = generateClient();
+      const { data, errors } = await client.mutations.setAdminUserRole({
+        userId,
+        role: row.selected
+      });
+      if (errors && errors.length > 0) {
+        const msg = errors[0]?.message ?? "setAdminUserRole failed";
+        console.error("[users-list-view] setAdminUserRole errors:", errors);
+        updateRow(userId, { saving: false, error: msg });
+        return;
+      }
+      if (data) {
+        setUsers(
+          (prev) => (prev ?? []).map((u) => u.userId === userId ? data : u)
+        );
+        updateRow(userId, { saving: false, selected: data.role, error: null });
+      } else {
+        updateRow(userId, { saving: false });
+      }
+    } catch (err) {
+      console.error("[users-list-view] setAdminUserRole threw:", err);
+      updateRow(userId, {
+        saving: false,
+        error: err instanceof Error ? err.message : String(err)
+      });
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-7xl p-4 md:p-8", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-6 md:mb-8", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold md:text-3xl", children: t("users.list.title") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: t("users.list.description") })
+    ] }),
+    loading ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: t("users.list.loading") }) : loadError ? /* @__PURE__ */ jsxs("p", { className: "text-sm text-destructive", children: [
+      t("users.list.error"),
+      ": ",
+      loadError
+    ] }) : !users || users.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: t("users.list.empty") }) : /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-md border", children: /* @__PURE__ */ jsxs(Table, { children: [
+      /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+        /* @__PURE__ */ jsx(TableHead, { children: t("users.list.columnEmail") }),
+        /* @__PURE__ */ jsx(TableHead, { children: t("users.list.columnRole") }),
+        /* @__PURE__ */ jsx(TableHead, { className: "w-[1%] whitespace-nowrap", children: t("users.list.columnActions") })
+      ] }) }),
+      /* @__PURE__ */ jsx(TableBody, { children: users.map((u) => {
+        const row = rows[u.userId];
+        if (!row) return null;
+        const isSelf = u.userId === currentUserId;
+        const dirty = row.selected !== u.role;
+        return /* @__PURE__ */ jsxs(TableRow, { children: [
+          /* @__PURE__ */ jsx(TableCell, { className: "font-medium", children: u.email || u.userId }),
+          /* @__PURE__ */ jsxs(TableCell, { children: [
+            /* @__PURE__ */ jsxs(
+              "select",
+              {
+                className: "rounded-md border bg-background px-2 py-1.5 text-sm disabled:cursor-not-allowed disabled:opacity-60",
+                value: row.selected,
+                disabled: isSelf || row.saving,
+                onChange: (e) => {
+                  const next = e.target.value;
+                  if (isAdminRole(next)) {
+                    updateRow(u.userId, { selected: next });
+                  }
+                },
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "admin", children: t("users.list.roleAdmin") }),
+                  /* @__PURE__ */ jsx("option", { value: "editor", children: t("users.list.roleEditor") }),
+                  /* @__PURE__ */ jsx("option", { value: "none", children: t("users.list.roleNone") })
+                ]
+              }
+            ),
+            isSelf && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: t("users.list.cannotEditSelf") }),
+            row.error && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-destructive", children: row.error })
+          ] }),
+          /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "sm",
+              disabled: isSelf || row.saving || !dirty,
+              onClick: () => save(u.userId),
+              children: row.saving ? t("users.list.saving") : t("users.list.save")
+            }
+          ) })
+        ] }, u.userId);
+      }) })
+    ] }) })
+  ] });
+}
+
+export {
+  UsersListView
+};

package/dist/chunk-TZWSXAHD.js

@@ -0,0 +1,32 @@
+'use client';
+import {
+  ADMIN_SITE_COOKIE
+} from "./chunk-7IR4F7GA.js";
+
+// src/lib/admin-site-client.ts
+import { DEFAULT_SITE_ID, isMultiSite } from "ampless";
+var cmsConfig = null;
+function setAdminCmsConfig(config) {
+  cmsConfig = config;
+}
+function readAdminSiteIdFromCookie() {
+  if (!cmsConfig) return DEFAULT_SITE_ID;
+  if (!isMultiSite(cmsConfig)) return DEFAULT_SITE_ID;
+  const sites = cmsConfig.sites ?? {};
+  if (typeof document !== "undefined") {
+    const match = document.cookie.match(
+      new RegExp(`(?:^|;\\s*)${ADMIN_SITE_COOKIE}=([^;]+)`)
+    );
+    if (match) {
+      const v = decodeURIComponent(match[1]);
+      if (sites[v]) return v;
+    }
+  }
+  const first = Object.keys(sites)[0];
+  return first ?? DEFAULT_SITE_ID;
+}
+
+export {
+  setAdminCmsConfig,
+  readAdminSiteIdFromCookie
+};

package/dist/chunk-VXEVLHGL.js

@@ -0,0 +1,10 @@
+'use server';
+// src/lib/theme-actions.ts
+import { updateTag } from "next/cache";
+async function invalidateSiteSettingsCache(siteId) {
+  updateTag(`site-settings:${siteId}`);
+}
+
+export {
+  invalidateSiteSettingsCache
+};