@medusajs/loyalty-plugin 0.0.1

package/.medusa/server/src/admin/routes/gift-card-products/_id_/media/page.js

@@ -0,0 +1,28 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useParams } from "react-router-dom";
+import "../../../../components/modals/route-drawer/route-drawer.js";
+import { RouteFocusModal } from "../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react";
+import "../../../../components/modals/route-modal-provider/route-modal-context.js";
+import "../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+import { useProduct } from "../../../../hooks/api/products.js";
+import { ProductMediaView } from "./components/product-media-view/product-media-view.js";
+const ProductMedia = () => {
+  const { id } = useParams();
+  const { product, isLoading, isError, error } = useProduct(id);
+  const ready = !isLoading && product;
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxs(RouteFocusModal, { children: [
+    /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Product media" }) }),
+    /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit product media" }) }),
+    ready && /* @__PURE__ */ jsx(ProductMediaView, { product })
+  ] });
+};
+export {
+  ProductMedia,
+  ProductMedia as default
+};

package/.medusa/server/src/admin/routes/gift-card-products/_id_/page.js

@@ -0,0 +1,40 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useParams, Outlet } from "react-router-dom";
+import { JsonViewSection } from "../../../components/json-view-section.js";
+import { TwoColumnLayout } from "../../../components/layouts/two-column.js";
+import { useProduct } from "../../../hooks/api/products.js";
+import { ProductGeneralSection } from "./components/product-general-section.js";
+import { ProductMediaSection } from "./components/product-media-section.js";
+import { ProductSalesChannelSection } from "./components/product-sales-channel-section.js";
+import { ProductVariantSection } from "./components/product-variant-section.js";
+const ProductDetail = () => {
+  const { id } = useParams();
+  const { product, isLoading, isError, error } = useProduct(id);
+  if (isLoading || !product) {
+    return;
+  }
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      TwoColumnLayout,
+      {
+        firstCol: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(ProductGeneralSection, { product }),
+          /* @__PURE__ */ jsx(ProductVariantSection, { product }),
+          /* @__PURE__ */ jsx(JsonViewSection, { data: product })
+        ] }),
+        secondCol: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(ProductSalesChannelSection, { product }),
+          /* @__PURE__ */ jsx(ProductMediaSection, { product })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx(Outlet, {})
+  ] });
+};
+export {
+  ProductDetail,
+  ProductDetail as default
+};

package/.medusa/server/src/admin/routes/gift-card-products/_id_/prices/components/prices-edit.js

@@ -0,0 +1,121 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { zodResolver } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/@hookform/resolvers/zod/dist/zod.mjs";
+import { Button } from "@medusajs/ui";
+import { useMemo } from "react";
+import { useForm } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/react-hook-form/dist/index.esm.mjs";
+import * as zod from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/zod/lib/index.mjs";
+import { KeyboundForm } from "../../../../../components/keybound-form.js";
+import "../../../../../components/modals/route-drawer/route-drawer.js";
+import { RouteFocusModal } from "../../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react-router-dom";
+import "../../../../../components/modals/route-modal-provider/route-modal-context.js";
+import { useRouteModal } from "../../../../../components/modals/route-modal-provider/use-route-modal.js";
+import "../../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+import { useUpdateProductVariantsBatch } from "../../../../../hooks/api/products.js";
+import { useRegions } from "../../../../../hooks/api/regions.js";
+import { castNumber } from "../../../../../utils/validations.js";
+import { VariantPricingForm } from "./variant-pricing-form.js";
+const UpdateDenominationPricesSchema = zod.object({
+  variants: zod.array(
+    zod.object({
+      prices: zod.record(zod.string(), zod.string().or(zod.number()).optional()).optional()
+    })
+  )
+});
+const PricingEdit = ({
+  product,
+  variantId
+}) => {
+  var _a;
+  const { handleSuccess } = useRouteModal();
+  const { mutateAsync, isPending } = useUpdateProductVariantsBatch(product.id);
+  const { regions } = useRegions({ limit: 9999 });
+  const regionsCurrencyMap = useMemo(() => {
+    if (!(regions == null ? void 0 : regions.length)) {
+      return {};
+    }
+    return regions.reduce((acc, reg) => {
+      acc[reg.id] = reg.currency_code;
+      return acc;
+    }, {});
+  }, [regions]);
+  const variants = variantId ? (_a = product.variants) == null ? void 0 : _a.filter((v) => v.id === variantId) : product.variants;
+  const form = useForm({
+    defaultValues: {
+      variants: variants == null ? void 0 : variants.map((variant) => ({
+        title: variant.title,
+        prices: variant.prices.reduce((acc, price) => {
+          var _a2;
+          if ((_a2 = price.rules) == null ? void 0 : _a2.region_id) {
+            acc[price.rules.region_id] = price.amount;
+          } else {
+            acc[price.currency_code] = price.amount;
+          }
+          return acc;
+        }, {})
+      }))
+    },
+    resolver: zodResolver(UpdateDenominationPricesSchema, {})
+  });
+  const handleSubmit = form.handleSubmit(async (values) => {
+    const reqData = values.variants.map((variant, ind) => {
+      var _a2;
+      return {
+        id: (_a2 = variants == null ? void 0 : variants[ind]) == null ? void 0 : _a2.id,
+        prices: Object.entries(variant.prices || {}).filter(
+          ([_, value]) => value !== "" && typeof value !== "undefined"
+          // deleted cells
+        ).map(([currencyCodeOrRegionId, value]) => {
+          var _a3, _b, _c, _d, _e, _f;
+          const regionId = currencyCodeOrRegionId.startsWith("reg_") ? currencyCodeOrRegionId : void 0;
+          const currencyCode = currencyCodeOrRegionId.startsWith("reg_") ? regionsCurrencyMap[regionId] : currencyCodeOrRegionId;
+          let existingId = void 0;
+          if (regionId) {
+            existingId = (_c = (_b = (_a3 = variants == null ? void 0 : variants[ind]) == null ? void 0 : _a3.prices) == null ? void 0 : _b.find(
+              (p) => p.rules["region_id"] === regionId
+            )) == null ? void 0 : _c.id;
+          } else {
+            existingId = (_f = (_e = (_d = variants == null ? void 0 : variants[ind]) == null ? void 0 : _d.prices) == null ? void 0 : _e.find(
+              (p) => p.currency_code === currencyCode && Object.keys(p.rules ?? {}).length === 0
+            )) == null ? void 0 : _f.id;
+          }
+          const amount = castNumber(value);
+          return {
+            id: existingId,
+            currency_code: currencyCode,
+            amount,
+            ...regionId ? { rules: { region_id: regionId } } : {}
+          };
+        })
+      };
+    });
+    await mutateAsync(reqData, {
+      onSuccess: () => {
+        handleSuccess("..");
+      }
+    });
+  });
+  return /* @__PURE__ */ jsx(RouteFocusModal.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { onSubmit: handleSubmit, className: "flex size-full flex-col", children: [
+    /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
+    /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx(VariantPricingForm, { form }) }),
+    /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-end gap-x-2", children: [
+      /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          variant: "primary",
+          size: "small",
+          isLoading: isPending,
+          children: "Save"
+        }
+      )
+    ] }) })
+  ] }) });
+};
+export {
+  PricingEdit,
+  UpdateDenominationPricesSchema
+};

package/.medusa/server/src/admin/routes/gift-card-products/_id_/prices/components/variant-pricing-form.js

@@ -0,0 +1,72 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useWatch } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/react-hook-form/dist/index.esm.mjs";
+import { DataGrid } from "../../../../../components/data-grid/data-grid.js";
+import { createDataGridHelper } from "../../../../../components/data-grid/helpers/create-data-grid-column-helper.js";
+import { createDataGridPriceColumns } from "../../../../../components/data-grid/helpers/create-data-grid-price-columns.js";
+import "../../../../../components/modals/route-drawer/route-drawer.js";
+import "../../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react-router-dom";
+import "../../../../../components/modals/route-modal-provider/route-modal-context.js";
+import { useRouteModal } from "../../../../../components/modals/route-modal-provider/use-route-modal.js";
+import "../../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+import { usePricePreferences } from "../../../../../hooks/api/price-preferences.js";
+import { useRegions } from "../../../../../hooks/api/regions.js";
+import { useStore } from "../../../../../hooks/api/store.js";
+const VariantPricingForm = ({ form }) => {
+  const { store } = useStore();
+  const { regions } = useRegions({ limit: 9999 });
+  const { price_preferences: pricePreferences } = usePricePreferences({});
+  const { setCloseOnEscape } = useRouteModal();
+  const columns = useVariantPriceGridColumns({
+    currencies: store == null ? void 0 : store.supported_currencies,
+    regions,
+    pricePreferences
+  });
+  const variants = useWatch({
+    control: form.control,
+    name: "variants"
+  });
+  return /* @__PURE__ */ jsx(
+    DataGrid,
+    {
+      columns,
+      data: variants,
+      state: form,
+      onEditingChange: (editing) => setCloseOnEscape(!editing)
+    }
+  );
+};
+const columnHelper = createDataGridHelper();
+const useVariantPriceGridColumns = ({
+  currencies = [],
+  regions = [],
+  pricePreferences = []
+}) => {
+  return useMemo(() => {
+    return [
+      columnHelper.column({
+        id: "Title",
+        header: "Title",
+        cell: (context) => {
+          const entity = context.row.original;
+          return /* @__PURE__ */ jsx(DataGrid.ReadonlyCell, { context, children: /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center gap-x-2 overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "truncate", children: entity.title }) }) });
+        },
+        disableHiding: true
+      }),
+      ...createDataGridPriceColumns({
+        currencies: currencies.map((c) => c.currency_code),
+        regions,
+        pricePreferences,
+        getFieldName: (context, value) => {
+          return `variants.${context.row.index}.prices.${value}`;
+        }
+      })
+    ];
+  }, [currencies, regions, pricePreferences]);
+};
+export {
+  VariantPricingForm
+};

package/.medusa/server/src/admin/routes/gift-card-products/_id_/prices/page.js

@@ -0,0 +1,23 @@
+import { jsx } from "react/jsx-runtime";
+import { useParams } from "react-router-dom";
+import "../../../../components/modals/route-drawer/route-drawer.js";
+import { RouteFocusModal } from "../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react";
+import "../../../../components/modals/route-modal-provider/route-modal-context.js";
+import "../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+import { useProduct } from "../../../../hooks/api/products.js";
+import { PricingEdit } from "./components/prices-edit.js";
+const ProductPrices = () => {
+  const { id, variant_id } = useParams();
+  const { product, isLoading, isError, error } = useProduct(id);
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx(RouteFocusModal, { children: !isLoading && product && /* @__PURE__ */ jsx(PricingEdit, { product, variantId: variant_id }) });
+};
+export {
+  ProductPrices,
+  ProductPrices as default
+};

package/.medusa/server/src/admin/routes/gift-card-products/_id_/sales-channels/components/edit-sales-channel-form.js

@@ -0,0 +1,123 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createDataTableColumnHelper, Button } from "@medusajs/ui";
+import { useState, useEffect, useMemo } from "react";
+import * as zod from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/zod/lib/index.mjs";
+import { zodResolver } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/@hookform/resolvers/zod/dist/zod.mjs";
+import { keepPreviousData } from "@tanstack/react-query";
+import { useForm } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/react-hook-form/dist/index.esm.mjs";
+import { DataTable } from "../../../../../components/data-table.js";
+import { useSalesChannelTableColumns } from "../../../../../components/data-table/helpers/sales-channels/use-sales-channel-table-columns.js";
+import { useSalesChannelTableEmptyState } from "../../../../../components/data-table/helpers/sales-channels/use-sales-channel-table-empty-state.js";
+import { useSalesChannelTableFilters } from "../../../../../components/data-table/helpers/sales-channels/use-sales-channel-table-filters.js";
+import { useSalesChannelTableQuery } from "../../../../../components/data-table/helpers/sales-channels/use-sales-channel-table-query.js";
+import "../../../../../components/modals/route-drawer/route-drawer.js";
+import { RouteFocusModal } from "../../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react-router-dom";
+import "../../../../../components/modals/route-modal-provider/route-modal-context.js";
+import { useRouteModal } from "../../../../../components/modals/route-modal-provider/use-route-modal.js";
+import "../../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+import { useUpdateProduct } from "../../../../../hooks/api/products.js";
+import { useSalesChannels } from "../../../../../hooks/api/sales-channels.js";
+const EditSalesChannelsSchema = zod.object({
+  sales_channels: zod.array(zod.string()).optional()
+});
+const PAGE_SIZE = 50;
+const PREFIX = "sc";
+const EditSalesChannelsForm = ({
+  product
+}) => {
+  var _a, _b;
+  const { handleSuccess } = useRouteModal();
+  const form = useForm({
+    defaultValues: {
+      sales_channels: ((_a = product.sales_channels) == null ? void 0 : _a.map((sc) => sc.id)) ?? []
+    },
+    resolver: zodResolver(EditSalesChannelsSchema)
+  });
+  const { setValue } = form;
+  const initialState = ((_b = product.sales_channels) == null ? void 0 : _b.reduce((acc, curr) => {
+    acc[curr.id] = true;
+    return acc;
+  }, {})) ?? {};
+  const [rowSelection, setRowSelection] = useState(initialState);
+  useEffect(() => {
+    const ids = Object.keys(rowSelection);
+    setValue("sales_channels", ids, {
+      shouldDirty: true,
+      shouldTouch: true
+    });
+  }, [rowSelection, setValue]);
+  const searchParams = useSalesChannelTableQuery({
+    pageSize: PAGE_SIZE,
+    prefix: PREFIX
+  });
+  const { sales_channels, count, isLoading, isError, error } = useSalesChannels(
+    {
+      ...searchParams
+    },
+    {
+      placeholderData: keepPreviousData
+    }
+  );
+  const filters = useSalesChannelTableFilters();
+  const emptyState = useSalesChannelTableEmptyState();
+  const columns = useColumns();
+  const { mutateAsync, isPending: isMutating } = useUpdateProduct(product.id);
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const arr = data.sales_channels ?? [];
+    const sales_channels2 = arr.map((id) => {
+      return {
+        id
+      };
+    });
+    await mutateAsync(
+      {
+        sales_channels: sales_channels2
+      },
+      {
+        onSuccess: () => {
+          handleSuccess();
+        }
+      }
+    );
+  });
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx(RouteFocusModal.Form, { form, children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
+    /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
+    /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        data: sales_channels,
+        columns,
+        getRowId: (row) => row.id,
+        rowCount: count,
+        isLoading,
+        filters,
+        rowSelection: {
+          state: rowSelection,
+          onRowSelectionChange: setRowSelection
+        },
+        autoFocusSearch: true,
+        layout: "fill",
+        emptyState,
+        prefix: PREFIX
+      }
+    ) }),
+    /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+      /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
+      /* @__PURE__ */ jsx(Button, { size: "small", isLoading: isMutating, onClick: handleSubmit, children: "Save" })
+    ] }) })
+  ] }) });
+};
+const columnHelper = createDataTableColumnHelper();
+const useColumns = () => {
+  const columns = useSalesChannelTableColumns();
+  return useMemo(() => [columnHelper.select(), ...columns], [columns]);
+};
+export {
+  EditSalesChannelsForm
+};

package/.medusa/server/src/admin/routes/gift-card-products/_id_/sales-channels/page.js

@@ -0,0 +1,23 @@
+import { jsx } from "react/jsx-runtime";
+import { useParams } from "react-router-dom";
+import "../../../../components/modals/route-drawer/route-drawer.js";
+import { RouteFocusModal } from "../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react";
+import "../../../../components/modals/route-modal-provider/route-modal-context.js";
+import "../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+import { useProduct } from "../../../../hooks/api/products.js";
+import { EditSalesChannelsForm } from "./components/edit-sales-channel-form.js";
+const ProductSalesChannels = () => {
+  const { id } = useParams();
+  const { product, isLoading, isError, error } = useProduct(id);
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx(RouteFocusModal, { children: !isLoading && product && /* @__PURE__ */ jsx(EditSalesChannelsForm, { product }) });
+};
+export {
+  ProductSalesChannels,
+  ProductSalesChannels as default
+};

package/.medusa/server/src/admin/routes/gift-card-products/components/gift-card-product-create-form/general-form-section.js

@@ -0,0 +1 @@
+

package/.medusa/server/src/admin/routes/gift-card-products/components/gift-card-product-create-form/gift-card-product-create-denominations-form.js

@@ -0,0 +1,98 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useWatch } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/react-hook-form/dist/index.esm.mjs";
+import { DataGrid } from "../../../../components/data-grid/data-grid.js";
+import { createDataGridHelper } from "../../../../components/data-grid/helpers/create-data-grid-column-helper.js";
+import { createDataGridPriceColumns } from "../../../../components/data-grid/helpers/create-data-grid-price-columns.js";
+import "../../../../components/modals/route-drawer/route-drawer.js";
+import "../../../../components/modals/route-focus-modal/route-focus-modal.js";
+import "react-router-dom";
+import "../../../../components/modals/route-modal-provider/route-modal-context.js";
+import { useRouteModal } from "../../../../components/modals/route-modal-provider/use-route-modal.js";
+import "../../../../components/modals/stacked-drawer/stacked-drawer.js";
+import "../../../../components/modals/stacked-focus-modal/stacked-focus-modal.js";
+import "../../../../components/modals/stacked-modal-provider/stacked-modal-context.js";
+const GiftCardProductCreateDenominationsForm = ({
+  form,
+  regions,
+  store,
+  pricePreferences
+}) => {
+  const { setCloseOnEscape } = useRouteModal();
+  const currencyCodes = useMemo(
+    () => {
+      var _a;
+      return ((_a = store == null ? void 0 : store.supported_currencies) == null ? void 0 : _a.map((c) => c.currency_code)) || [];
+    },
+    [store]
+  );
+  const denominations = useWatch({
+    control: form.control,
+    name: "denominations",
+    defaultValue: []
+  });
+  const columns = useColumns({
+    denominations,
+    currencies: currencyCodes,
+    regions,
+    pricePreferences
+  });
+  const variantData = useMemo(() => {
+    const ret = [];
+    denominations.forEach((v, i) => {
+      ret.push({ ...v, originalIndex: i });
+    });
+    return ret;
+  }, [denominations]);
+  return /* @__PURE__ */ jsx("div", { className: "flex size-full flex-col divide-y overflow-hidden", children: /* @__PURE__ */ jsx(
+    DataGrid,
+    {
+      columns,
+      data: variantData,
+      state: form,
+      onEditingChange: (editing) => setCloseOnEscape(!editing)
+    }
+  ) });
+};
+const columnHelper = createDataGridHelper();
+const useColumns = ({
+  denominations = [],
+  currencies = [],
+  regions = [],
+  pricePreferences = []
+}) => {
+  return useMemo(
+    () => [
+      columnHelper.column({
+        id: "denominations",
+        header: () => /* @__PURE__ */ jsx("div", { className: "flex size-full items-center overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "truncate", children: "Denomination" }) }),
+        cell: (context) => {
+          return /* @__PURE__ */ jsx(DataGrid.ReadonlyCell, { context, children: context.row.original.value });
+        },
+        disableHiding: true
+      }),
+      columnHelper.column({
+        id: "sku",
+        name: "SKU",
+        header: "SKU",
+        field: (context) => `denominations.${context.row.original.originalIndex}.sku`,
+        type: "text",
+        cell: (context) => {
+          return /* @__PURE__ */ jsx(DataGrid.TextCell, { context });
+        }
+      }),
+      ...createDataGridPriceColumns({
+        currencies,
+        regions,
+        pricePreferences,
+        getFieldName: (context, value) => {
+          return `denominations.${context.row.original.originalIndex}.prices.${value}`;
+        }
+      })
+    ],
+    [currencies, regions, denominations, pricePreferences]
+  );
+};
+export {
+  GiftCardProductCreateDenominationsForm
+};

package/.medusa/server/src/admin/routes/gift-card-products/components/gift-card-product-create-form/gift-card-product-create-details-form.js

@@ -0,0 +1,28 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Divider, Heading } from "@medusajs/ui";
+import { GiftCardProductCreateFormDenominations } from "./gift-card-product-create-form-denominations.js";
+import { GiftCardProductCreateFormGeneral } from "./gift-card-product-create-form-general.js";
+import { GiftCardProductCreateFormMedia } from "./gift-card-product-create-form-media.js";
+import { GiftCardProductCreateOrganizeForm } from "./gift-card-product-create-form-organize.js";
+const GiftCardProductCreateDetailsForm = ({
+  form
+}) => {
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center p-16", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", children: [
+    /* @__PURE__ */ jsx(Header, {}),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
+      /* @__PURE__ */ jsx(GiftCardProductCreateFormGeneral, { form }),
+      /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
+      /* @__PURE__ */ jsx(GiftCardProductCreateFormMedia, { form }),
+      /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
+      /* @__PURE__ */ jsx(GiftCardProductCreateOrganizeForm, { form }),
+      /* @__PURE__ */ jsx(Divider, {}),
+      /* @__PURE__ */ jsx(GiftCardProductCreateFormDenominations, { form })
+    ] })
+  ] }) });
+};
+const Header = () => {
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsx(Heading, { children: "Create Gift Card Product" }) });
+};
+export {
+  GiftCardProductCreateDetailsForm
+};

package/.medusa/server/src/admin/routes/gift-card-products/components/gift-card-product-create-form/gift-card-product-create-form-denominations.js

@@ -0,0 +1,96 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { MinusMini } from "@medusajs/icons";
+import { Text, Input, Button, Alert } from "@medusajs/ui";
+import { useFieldArray } from "/Users/oliverjuhl/Desktop/medusa/loyalty-plugin/node_modules/react-hook-form/dist/index.esm.mjs";
+import { Form } from "../../../../components/form.js";
+const GiftCardProductCreateFormDenominations = ({
+  form
+}) => {
+  const {
+    fields: denominationsFields,
+    append: addDenomination,
+    remove: removeDenomination
+  } = useFieldArray({
+    name: "denominations",
+    control: form.control
+  });
+  return /* @__PURE__ */ jsxs("div", { id: "variants", className: "grid grid-cols-1 gap-y-6 md:grid-cols-2", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(
+        Text,
+        {
+          className: "txt-compact-small-plus text-ui-fg-base",
+          weight: "regular",
+          children: "Denominations"
+        }
+      ),
+      /* @__PURE__ */ jsx(Text, { className: "txt-small text-ui-fg-muted", children: "Denominations are the different values that can be selected for the gift card product." })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-6", children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
+      denominationsFields.map((denominationField, index) => {
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center justify-between shadow-elevation-card-rest bg-ui-bg-component transition-fg rounded-md px-4 py-2",
+            children: [
+              /* @__PURE__ */ jsx(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: `denominations.${index}.value`,
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsxs(Form.Item, { className: "w-full", children: [
+                      /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
+                        Input,
+                        {
+                          ...field,
+                          placeholder: "100",
+                          required: true,
+                          type: "number",
+                          min: 0
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx(Form.ErrorMessage, {})
+                    ] });
+                  }
+                },
+                denominationField.id
+              ),
+              /* @__PURE__ */ jsx("div", { className: "flex items-center rounded-xl", children: /* @__PURE__ */ jsx(
+                Button,
+                {
+                  size: "small",
+                  variant: "secondary",
+                  type: "button",
+                  className: "rounded-full bg-red-500 text-white p-0 ml-4 hover:bg-red-600",
+                  onClick: () => {
+                    removeDenomination(index);
+                  },
+                  children: /* @__PURE__ */ jsx(MinusMini, { className: "rounded-full" })
+                }
+              ) })
+            ]
+          },
+          denominationField.id
+        );
+      }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          type: "button",
+          className: "w-full",
+          onClick: () => {
+            addDenomination({ value: "", sku: "", prices: {} });
+          },
+          children: "Add denomination"
+        }
+      ),
+      form.formState.errors.denominations && /* @__PURE__ */ jsx(Alert, { variant: "error", children: "Please add at least one denomination." })
+    ] }) }) })
+  ] });
+};
+export {
+  GiftCardProductCreateFormDenominations
+};