@medusajs/loyalty-plugin 0.0.1

package/.medusa/server/src/admin/components/data-table.js

@@ -0,0 +1,249 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useDataTable, DataTable as DataTable$1, clx, Heading, Text, Button } from "@medusajs/ui";
+import { useState, useCallback } from "react";
+import { useSearchParams, useNavigate, Link } from "react-router-dom";
+import { useQueryParams } from "../hooks/common/use-query-params.js";
+import { ActionMenu } from "./action-menu.js";
+const DataTable = ({
+  data = [],
+  columns,
+  filters,
+  commands,
+  action,
+  actionMenu,
+  getRowId,
+  rowCount = 0,
+  enablePagination = true,
+  enableSearch = true,
+  autoFocusSearch = false,
+  rowHref,
+  heading,
+  subHeading,
+  prefix,
+  pageSize = 10,
+  emptyState,
+  rowSelection,
+  isLoading = false,
+  layout = "auto"
+}) => {
+  const enableFiltering = filters && filters.length > 0;
+  const enableCommands = commands && commands.length > 0;
+  const enableSorting = columns.some((column) => column.enableSorting);
+  const filterIds = (filters == null ? void 0 : filters.map((f) => f.id)) ?? [];
+  const prefixedFilterIds = filterIds.map((id) => getQueryParamKey(id, prefix));
+  const { offset, q, order, ...filterParams } = useQueryParams(
+    [
+      ...filterIds,
+      ...enableSorting ? ["order"] : [],
+      ...enableSearch ? ["q"] : [],
+      ...enablePagination ? ["offset"] : []
+    ],
+    prefix
+  );
+  const [_, setSearchParams] = useSearchParams();
+  const [search, setSearch] = useState(q ?? "");
+  const handleSearchChange = (value) => {
+    setSearch(value);
+    setSearchParams((prev) => {
+      if (value) {
+        prev.set(getQueryParamKey("q", prefix), value);
+      } else {
+        prev.delete(getQueryParamKey("q", prefix));
+      }
+      return prev;
+    });
+  };
+  const [pagination, setPagination] = useState(
+    offset ? parsePaginationState(offset, pageSize) : { pageIndex: 0, pageSize }
+  );
+  const handlePaginationChange = (value) => {
+    setPagination(value);
+    setSearchParams((prev) => {
+      if (value.pageIndex === 0) {
+        prev.delete(getQueryParamKey("offset", prefix));
+      } else {
+        prev.set(
+          getQueryParamKey("offset", prefix),
+          transformPaginationState(value).toString()
+        );
+      }
+      return prev;
+    });
+  };
+  const [filtering, setFiltering] = useState(
+    parseFilterState(filterIds, filterParams)
+  );
+  const handleFilteringChange = (value) => {
+    setFiltering(value);
+    setSearchParams((prev) => {
+      Array.from(prev.keys()).forEach((key) => {
+        if (prefixedFilterIds.includes(key) && !(key in value)) {
+          prev.delete(key);
+        }
+      });
+      Object.entries(value).forEach(([key, filter]) => {
+        if (prefixedFilterIds.includes(getQueryParamKey(key, prefix)) && filter) {
+          prev.set(getQueryParamKey(key, prefix), JSON.stringify(filter));
+        }
+      });
+      return prev;
+    });
+  };
+  const [sorting, setSorting] = useState(
+    order ? parseSortingState(order) : null
+  );
+  const handleSortingChange = (value) => {
+    setSorting(value);
+    setSearchParams((prev) => {
+      if (value) {
+        const valueToStore = transformSortingState(value);
+        prev.set(getQueryParamKey("order", prefix), valueToStore);
+      } else {
+        prev.delete(getQueryParamKey("order", prefix));
+      }
+      return prev;
+    });
+  };
+  const navigate = useNavigate();
+  const onRowClick = useCallback(
+    (event, row) => {
+      if (!rowHref) {
+        return;
+      }
+      const href = rowHref(row);
+      if (event.metaKey || event.ctrlKey || event.button === 1) {
+        window.open(href, "_blank", "noreferrer");
+        return;
+      }
+      if (event.shiftKey) {
+        window.open(href, void 0, "noreferrer");
+        return;
+      }
+      navigate(href);
+    },
+    [navigate, rowHref]
+  );
+  const instance = useDataTable({
+    data,
+    columns,
+    filters,
+    commands,
+    rowCount,
+    getRowId,
+    onRowClick: rowHref ? onRowClick : void 0,
+    pagination: enablePagination ? {
+      state: pagination,
+      onPaginationChange: handlePaginationChange
+    } : void 0,
+    filtering: enableFiltering ? {
+      state: filtering,
+      onFilteringChange: handleFilteringChange
+    } : void 0,
+    sorting: enableSorting ? {
+      state: sorting,
+      onSortingChange: handleSortingChange
+    } : void 0,
+    search: enableSearch ? {
+      state: search,
+      onSearchChange: handleSearchChange
+    } : void 0,
+    rowSelection,
+    isLoading
+  });
+  const shouldRenderHeading = heading || subHeading;
+  return /* @__PURE__ */ jsxs(
+    DataTable$1,
+    {
+      instance,
+      className: clx({
+        "h-full [&_tr]:last-of-type:!border-b": layout === "fill"
+      }),
+      children: [
+        /* @__PURE__ */ jsxs(DataTable$1.Toolbar, { className: "flex flex-col items-start justify-between gap-2 md:flex-row md:items-center", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between gap-2", children: [
+            shouldRenderHeading && /* @__PURE__ */ jsxs("div", { children: [
+              heading && /* @__PURE__ */ jsx(Heading, { children: heading }),
+              subHeading && /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: subHeading })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2 md:hidden", children: [
+              enableFiltering && /* @__PURE__ */ jsx(DataTable$1.FilterMenu, { tooltip: "Filter" }),
+              enableSorting && /* @__PURE__ */ jsx(DataTable$1.SortingMenu, { tooltip: "Sort" }),
+              actionMenu && /* @__PURE__ */ jsx(ActionMenu, { variant: "primary", ...actionMenu }),
+              action && /* @__PURE__ */ jsx(DataTableAction, { ...action })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center gap-2 md:justify-end", children: [
+            enableSearch && /* @__PURE__ */ jsx("div", { className: "w-full md:w-auto", children: /* @__PURE__ */ jsx(
+              DataTable$1.Search,
+              {
+                "data-modal-id": "modal-search-input",
+                placeholder: "Search",
+                autoFocus: autoFocusSearch
+              }
+            ) }),
+            /* @__PURE__ */ jsxs("div", { className: "hidden items-center gap-x-2 md:flex", children: [
+              enableFiltering && /* @__PURE__ */ jsx(DataTable$1.FilterMenu, { tooltip: "Filter" }),
+              enableSorting && /* @__PURE__ */ jsx(DataTable$1.SortingMenu, { tooltip: "Sort" }),
+              actionMenu && /* @__PURE__ */ jsx(ActionMenu, { ...actionMenu }),
+              action && /* @__PURE__ */ jsx(DataTableAction, { ...action })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(DataTable$1.Table, { emptyState }),
+        enablePagination && /* @__PURE__ */ jsx(DataTable$1.Pagination, {}),
+        enableCommands && /* @__PURE__ */ jsx(DataTable$1.CommandBar, { selectedLabel: (count) => `${count} selected` })
+      ]
+    }
+  );
+};
+function transformSortingState(value) {
+  return value.desc ? `-${value.id}` : value.id;
+}
+function parseSortingState(value) {
+  return value.startsWith("-") ? { id: value.slice(1), desc: true } : { id: value, desc: false };
+}
+function transformPaginationState(value) {
+  return value.pageIndex * value.pageSize;
+}
+function parsePaginationState(value, pageSize) {
+  const offset = parseInt(value);
+  return {
+    pageIndex: Math.floor(offset / pageSize),
+    pageSize
+  };
+}
+function parseFilterState(filterIds, value) {
+  if (!value) {
+    return {};
+  }
+  const filters = {};
+  for (const id of filterIds) {
+    const filterValue = value[id];
+    if (filterValue) {
+      filters[id] = JSON.parse(filterValue);
+    }
+  }
+  return filters;
+}
+function getQueryParamKey(key, prefix) {
+  return prefix ? `${prefix}_${key}` : key;
+}
+const DataTableAction = ({
+  label,
+  disabled,
+  ...props
+}) => {
+  const buttonProps = {
+    size: "small",
+    disabled: disabled ?? false,
+    type: "button",
+    variant: "secondary"
+  };
+  if ("to" in props) {
+    return /* @__PURE__ */ jsx(Button, { ...buttonProps, asChild: true, children: /* @__PURE__ */ jsx(Link, { to: props.to, children: label }) });
+  }
+  return /* @__PURE__ */ jsx(Button, { ...buttonProps, onClick: props.onClick, children: label });
+};
+export {
+  DataTable
+};

package/.medusa/server/src/admin/components/display-id.js

@@ -0,0 +1,18 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import copy from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/copy-to-clipboard/index.js";
+import { useState } from "react";
+import { Tooltip, clx, toast } from "@medusajs/ui";
+function DisplayId({ id, className }) {
+  const [open, setOpen] = useState(false);
+  const onClick = () => {
+    copy(id);
+    toast.success("Copied to clipboard");
+  };
+  return /* @__PURE__ */ jsx(Tooltip, { maxWidth: 260, content: id, open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxs("span", { onClick, className: clx("cursor-pointer", className), children: [
+    "#",
+    id.slice(-7)
+  ] }) });
+}
+export {
+  DisplayId as default
+};

package/.medusa/server/src/admin/components/file-upload.js

@@ -0,0 +1,116 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { ArrowDownTray } from "@medusajs/icons";
+import { clx, Text } from "@medusajs/ui";
+import { useState, useRef } from "react";
+const FileUpload = ({
+  label,
+  hint,
+  multiple = true,
+  hasError,
+  formats,
+  onUploaded
+}) => {
+  const [isDragOver, setIsDragOver] = useState(false);
+  const inputRef = useRef(null);
+  const dropZoneRef = useRef(null);
+  const handleOpenFileSelector = () => {
+    var _a;
+    (_a = inputRef.current) == null ? void 0 : _a.click();
+  };
+  const handleDragEnter = (event) => {
+    var _a;
+    event.preventDefault();
+    event.stopPropagation();
+    const files = (_a = event.dataTransfer) == null ? void 0 : _a.files;
+    if (!files) {
+      return;
+    }
+    setIsDragOver(true);
+  };
+  const handleDragLeave = (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (!dropZoneRef.current || dropZoneRef.current.contains(event.relatedTarget)) {
+      return;
+    }
+    setIsDragOver(false);
+  };
+  const handleUploaded = (files) => {
+    if (!files) {
+      return;
+    }
+    const fileList = Array.from(files);
+    const fileObj = fileList.map((file) => {
+      const id = Math.random().toString(36).substring(7);
+      const previewUrl = URL.createObjectURL(file);
+      return {
+        id,
+        url: previewUrl,
+        file
+      };
+    });
+    onUploaded(fileObj);
+  };
+  const handleDrop = (event) => {
+    var _a;
+    event.preventDefault();
+    event.stopPropagation();
+    setIsDragOver(false);
+    handleUploaded((_a = event.dataTransfer) == null ? void 0 : _a.files);
+  };
+  const handleFileChange = async (event) => {
+    handleUploaded(event.target.files);
+  };
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref: dropZoneRef,
+        type: "button",
+        onClick: handleOpenFileSelector,
+        onDrop: handleDrop,
+        onDragOver: (e) => e.preventDefault(),
+        onDragEnter: handleDragEnter,
+        onDragLeave: handleDragLeave,
+        className: clx(
+          "bg-ui-bg-component border-ui-border-strong transition-fg group flex w-full flex-col items-center gap-y-2 rounded-lg border border-dashed p-8",
+          "hover:border-ui-border-interactive focus:border-ui-border-interactive",
+          "focus:shadow-borders-focus outline-none focus:border-solid",
+          {
+            "!border-ui-border-error": hasError,
+            "!border-ui-border-interactive": isDragOver
+          }
+        ),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle group-disabled:text-ui-fg-disabled flex items-center gap-x-2", children: [
+            /* @__PURE__ */ jsx(ArrowDownTray, {}),
+            /* @__PURE__ */ jsx(Text, { children: label })
+          ] }),
+          !!hint && /* @__PURE__ */ jsx(
+            Text,
+            {
+              size: "small",
+              leading: "compact",
+              className: "text-ui-fg-muted group-disabled:text-ui-fg-disabled",
+              children: hint
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        hidden: true,
+        ref: inputRef,
+        onChange: handleFileChange,
+        type: "file",
+        accept: formats.join(","),
+        multiple
+      }
+    )
+  ] });
+};
+export {
+  FileUpload
+};

package/.medusa/server/src/admin/components/form.js

@@ -0,0 +1,151 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { InformationCircleSolid } from "@medusajs/icons";
+import { clx, Label as Label$1, Tooltip, Text, Hint as Hint$1 } from "@medusajs/ui";
+import { Slot } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/radix-ui/dist/index.mjs";
+import { createContext, forwardRef, useId, useContext } from "react";
+import { FormProvider, useFormContext, useFormState, Controller } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/react-hook-form/dist/index.esm.mjs";
+const Provider = FormProvider;
+const FormFieldContext = createContext(
+  {}
+);
+const Field = ({
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
+};
+const FormItemContext = createContext(
+  {}
+);
+const useFormField = () => {
+  const fieldContext = useContext(FormFieldContext);
+  const itemContext = useContext(FormItemContext);
+  const { getFieldState } = useFormContext();
+  const formState = useFormState({ name: fieldContext.name });
+  const fieldState = getFieldState(fieldContext.name, formState);
+  if (!fieldContext) {
+    throw new Error("useFormField should be used within a FormField");
+  }
+  const { id } = itemContext;
+  return {
+    id,
+    name: fieldContext.name,
+    formItemId: `${id}-form-item`,
+    formLabelId: `${id}-form-item-label`,
+    formDescriptionId: `${id}-form-item-description`,
+    formErrorMessageId: `${id}-form-item-message`,
+    ...fieldState
+  };
+};
+const Item = forwardRef(
+  ({ className, ...props }, ref) => {
+    const id = useId();
+    return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: clx("flex flex-col space-y-2", className),
+        ...props
+      }
+    ) });
+  }
+);
+Item.displayName = "Form.Item";
+const Label = forwardRef(
+  ({
+    className,
+    optional = false,
+    tooltip,
+    icon,
+    variant = "default",
+    ...props
+  }, ref) => {
+    const { formLabelId, formItemId } = useFormField();
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
+      /* @__PURE__ */ jsx(
+        Label$1,
+        {
+          id: formLabelId,
+          ref,
+          className: clx(
+            {
+              "text-ui-fg-subtle": variant === "subtle"
+            },
+            className
+          ),
+          htmlFor: formItemId,
+          size: "small",
+          weight: variant === "default" ? "plus" : "regular",
+          ...props
+        }
+      ),
+      tooltip && /* @__PURE__ */ jsx(Tooltip, { content: tooltip, children: /* @__PURE__ */ jsx(InformationCircleSolid, { className: "text-ui-fg-muted" }) }),
+      icon,
+      optional && /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: "(Optional)" })
+    ] });
+  }
+);
+Label.displayName = "Form.Label";
+const Control = forwardRef(({ ...props }, ref) => {
+  const {
+    error,
+    formItemId,
+    formDescriptionId,
+    formErrorMessageId,
+    formLabelId
+  } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Slot.Root,
+    {
+      ref,
+      id: formItemId,
+      "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formErrorMessageId}`,
+      "aria-invalid": !!error,
+      "aria-labelledby": formLabelId,
+      ...props
+    }
+  );
+});
+Control.displayName = "Form.Control";
+const Hint = forwardRef(({ className, ...props }, ref) => {
+  const { formDescriptionId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Hint$1,
+    {
+      ref,
+      id: formDescriptionId,
+      className,
+      ...props
+    }
+  );
+});
+Hint.displayName = "Form.Hint";
+const ErrorMessage = forwardRef(({ className, children, ...props }, ref) => {
+  const { error, formErrorMessageId } = useFormField();
+  const msg = error ? String(error == null ? void 0 : error.message) : children;
+  if (!msg || msg === "undefined") {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    Hint$1,
+    {
+      ref,
+      id: formErrorMessageId,
+      className,
+      variant: error ? "error" : "info",
+      ...props,
+      children: msg
+    }
+  );
+});
+ErrorMessage.displayName = "Form.ErrorMessage";
+const Form = Object.assign(Provider, {
+  Item,
+  Label,
+  Control,
+  Hint,
+  ErrorMessage,
+  Field
+});
+export {
+  Form
+};

package/.medusa/server/src/admin/components/handle-input.js

@@ -0,0 +1,22 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Text, Input } from "@medusajs/ui";
+import { forwardRef } from "react";
+const HandleInput = forwardRef((props, ref) => {
+  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 left-0 z-10 flex w-8 items-center justify-center border-r", children: /* @__PURE__ */ jsx(
+      Text,
+      {
+        className: "text-ui-fg-muted",
+        size: "small",
+        leading: "compact",
+        weight: "plus",
+        children: "/"
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Input, { ref, ...props, className: "pl-10" })
+  ] });
+});
+HandleInput.displayName = "HandleInput";
+export {
+  HandleInput
+};

package/.medusa/server/src/admin/components/header.js

@@ -0,0 +1,41 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { createElement } from "react";
+import { InformationCircleSolid } from "@medusajs/icons";
+import { Heading, Text, Tooltip, Button } from "@medusajs/ui";
+import { Link } from "react-router-dom";
+import { ActionMenu } from "./action-menu.js";
+const Header = ({
+  title,
+  subtitle,
+  actions = [],
+  tooltip
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: "flex px-6 py-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex justify-between w-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+        /* @__PURE__ */ jsx(Heading, { level: "h2", children: title }),
+        subtitle && /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", size: "small", children: subtitle })
+      ] }),
+      tooltip && /* @__PURE__ */ jsx(Tooltip, { content: tooltip, children: /* @__PURE__ */ jsx(InformationCircleSolid, { className: "text-ui-fg-muted" }) })
+    ] }),
+    actions.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center gap-x-2", children: actions.map((action, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
+      action.type === "button" && /* @__PURE__ */ createElement(
+        Button,
+        {
+          ...action.props,
+          size: action.props.size || "small",
+          key: index
+        },
+        /* @__PURE__ */ jsxs(Fragment, { children: [
+          action.props.children,
+          action.link && /* @__PURE__ */ jsx(Link, { ...action.link })
+        ] })
+      ),
+      action.type === "action-menu" && /* @__PURE__ */ jsx(ActionMenu, { ...action.props }),
+      action.type === "custom" && action.children
+    ] })) })
+  ] });
+};
+export {
+  Header
+};

package/.medusa/server/src/admin/components/icon-avatar.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import { clx } from "@medusajs/ui";
+const IconAvatar = ({
+  size = "small",
+  children,
+  className
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: clx(
+        "shadow-borders-base flex size-7 items-center justify-center",
+        "[&>div]:bg-ui-bg-field [&>div]:text-ui-fg-subtle [&>div]:flex [&>div]:size-6 [&>div]:items-center [&>div]:justify-center",
+        {
+          "size-7 rounded-md [&>div]:size-6 [&>div]:rounded-[4px]": size === "small",
+          "size-10 rounded-lg [&>div]:size-9 [&>div]:rounded-[6px]": size === "large",
+          "size-12 rounded-xl [&>div]:size-11 [&>div]:rounded-[10px]": size === "xlarge"
+        },
+        className
+      ),
+      children: /* @__PURE__ */ jsx("div", { children })
+    }
+  );
+};
+export {
+  IconAvatar
+};