@medusajs/loyalty-plugin 0.0.7-preview.5 → 0.0.7-preview.6

package/.medusa/server/src/admin/index.js

@@ -23874,421 +23874,157 @@ const GiftCardExpirationForm = ({ giftCard }) => {
 const schema$1 = objectType({
   expires_at: dateType().nullish()
 });
-const StoreCreditAccountBalanceSection = ({
-  storeCreditAccount
-}) => {
-  if (!storeCreditAccount || typeof storeCreditAccount.balance === "undefined") {
-    return;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "grid grid-cols-2 gap-x-2 px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-x-3", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-ui-tag-green-icon h-8 w-1 rounded-full" }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "plus", size: "small", className: "text-ui-fg-subtle", children: "Current Balance" }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ui.Text,
-        {
-          weight: "plus",
-          size: "xlarge",
-          className: "tabular-nums text-ui-fg-base",
-          children: formatAmount(
-            storeCreditAccount.balance,
-            storeCreditAccount.currency_code
-          )
-        }
-      )
-    ] })
-  ] }) });
+const columnHelper$7 = createColumnHelper();
+const useGiftCardProductsTableColumns = () => {
+  return React.useMemo(
+    () => [
+      columnHelper$7.display({
+        id: "product",
+        header: () => /* @__PURE__ */ jsxRuntime.jsx(ProductHeader, {}),
+        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(ProductCell, { product: row.original })
+      }),
+      columnHelper$7.accessor("sales_channels", {
+        header: () => /* @__PURE__ */ jsxRuntime.jsx(SalesChannelHeader, {}),
+        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(SalesChannelsCell, { salesChannels: row.original.sales_channels })
+      }),
+      columnHelper$7.accessor("variants", {
+        header: () => /* @__PURE__ */ jsxRuntime.jsx(VariantHeader, {}),
+        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(VariantCell, { variants: row.original.variants })
+      }),
+      columnHelper$7.accessor("status", {
+        header: () => /* @__PURE__ */ jsxRuntime.jsx(ProductStatusHeader, {}),
+        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(ProductStatusCell, { status: row.original.status })
+      })
+    ],
+    []
+  );
 };
-const StoreCreditAccountDetailsSection = ({
-  storeCreditAccount
+const useGiftCardProductsFilters = () => {
+  const dateFilterOptions = useDataTableDateFilters$1();
+  return React.useMemo(() => {
+    return [...dateFilterOptions];
+  }, [dateFilterOptions]);
+};
+const useGiftCardProductsTableQuery = ({
+  prefix,
+  pageSize = 20
 }) => {
-  if (!storeCreditAccount || typeof storeCreditAccount.balance === "undefined") {
-    return;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "flex justify-between gap-x-2 px-6 py-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      ui.Text,
-      {
-        weight: "plus",
-        size: "xlarge",
-        className: "text-ui-fg-base flex gap-x-4",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(CreditCardIcon, { className: "inline" }),
-            " "
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle", children: [
-              storeCreditAccount.currency_code.toUpperCase(),
-              " Account"
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ui-fg-base", children: /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Text,
-              {
-                weight: "regular",
-                size: "small",
-                className: "text-ui-fg-base flex gap-x-4",
-                children: /* @__PURE__ */ jsxRuntime.jsx(DisplayId, { id: storeCreditAccount.id })
-              }
-            ) })
-          ] })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-x-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-      ActionMenu,
+  const queryObject = useQueryParams(
+    ["offset", "customer_id", "created_at", "updated_at"],
+    prefix
+  );
+  const { offset: offset2, created_at, updated_at, customer_id, ...rest } = queryObject;
+  const searchParams = {
+    limit: pageSize,
+    offset: offset2 ? Number(offset2) : 0,
+    created_at: created_at ? JSON.parse(created_at) : void 0,
+    updated_at: updated_at ? JSON.parse(updated_at) : void 0,
+    customer_id: customer_id ? JSON.parse(customer_id) : void 0,
+    ...rest
+  };
+  return searchParams;
+};
+const PAGE_SIZE$3 = 10;
+function GiftCardProductsTable() {
+  const queryParams = useGiftCardProductsTableQuery({
+    pageSize: PAGE_SIZE$3
+  });
+  const {
+    products: giftCardProducts,
+    isPending,
+    count: count2
+  } = useProducts({
+    ...queryParams,
+    is_giftcard: true,
+    order: queryParams.order ?? "-created_at"
+  });
+  const columns = useGiftCardProductsTableColumns();
+  const filters = useGiftCardProductsFilters();
+  return /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsx(
+      DataTable,
       {
-        groups: [
+        data: giftCardProducts,
+        getRowId: (row) => row.id,
+        columns,
+        filters,
+        isLoading: isPending,
+        pageSize: PAGE_SIZE$3,
+        rowCount: count2,
+        enableSearch: false,
+        heading: "Gift Card Products",
+        actions: [
           {
-            actions: [
-              {
-                icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CreditCard, {}),
-                label: "Credit the account",
-                to: "credit"
-              }
-            ]
+            label: "Create",
+            to: "create"
           }
-        ]
+        ],
+        rowHref: (row) => `${row.id}`,
+        emptyState: {
+          empty: {
+            heading: "No gift card products found",
+            description: "Create a new gift card product to get started."
+          },
+          filtered: {
+            heading: "No results found",
+            description: "No gift card products match your filter criteria."
+          }
+        }
       }
-    ) })
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
+  ] });
+}
+const GiftCardProductsPage = () => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductsTable, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Toaster, {})
   ] });
 };
-function StoreCreditAccountCustomerSection({
-  customerId
-}) {
-  const { customer, isPending } = useCustomer(customerId, void 0, {
-    enabled: !!customerId
+const config = adminSdk.defineRouteConfig({
+  label: "Gift Card Products"
+});
+const PRICE_PREFERENCES_QUERY_KEY = "price-preferences";
+const pricePreferencesQueryKeys = queryKeysFactory(
+  PRICE_PREFERENCES_QUERY_KEY
+);
+const usePricePreferences = (query, options) => {
+  const { data, ...rest } = reactQuery.useQuery({
+    queryFn: () => sdk.admin.pricePreference.list(query),
+    queryKey: pricePreferencesQueryKeys.list(query),
+    ...options
   });
-  if (isPending || !customer) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "p-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Header$5, { title: "Customer" }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      SidebarLink,
-      {
-        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.User, {}),
-        labelKey: customer.email || "N/A",
-        descriptionKey: !customer.first_name && !customer.last_name ? "N/A" : `${customer.first_name} ${customer.last_name}`,
-        to: `/customers/${customer.id}`
-      },
-      customer.id
-    )
-  ] });
-}
-function StoreCreditAccountCodeSection({ code }) {
-  if (!code) {
-    return null;
+  return { ...data, ...rest };
+};
+const REGIONS_QUERY_KEY = "regions";
+const regionsQueryKeys = queryKeysFactory(REGIONS_QUERY_KEY);
+const useRegions = (query, options) => {
+  const { data, ...rest } = reactQuery.useQuery({
+    queryFn: () => sdk.admin.region.list(query),
+    queryKey: regionsQueryKeys.list(query),
+    ...options
+  });
+  return { ...data, ...rest };
+};
+const consoleLogger = {
+  type: "logger",
+  log(args) {
+    this.output("log", args);
+  },
+  warn(args) {
+    this.output("warn", args);
+  },
+  error(args) {
+    this.output("error", args);
+  },
+  output(type, args) {
+    if (console && console[type]) console[type].apply(console, args);
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "p-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Header$5, { title: "Account Code" }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-4 px-6 mb-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(icons.Share, { className: "inline" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ui-fg-subtle text-sm", children: code })
-    ] })
-  ] });
-}
-const StoreCreditAccountPage = () => {
-  const { id } = reactRouterDom.useParams();
-  const { store_credit_account: storeCreditAccount } = useStoreCreditAccount(
-    id
-  );
-  if (!storeCreditAccount) {
-    return;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
-    TwoColumnLayout,
-    {
-      firstCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          StoreCreditAccountDetailsSection,
-          {
-            storeCreditAccount
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(TransactionsTable, { id: storeCreditAccount.id })
-      ] }),
-      secondCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          StoreCreditAccountBalanceSection,
-          {
-            storeCreditAccount
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(StoreCreditAccountCodeSection, { code: storeCreditAccount.code }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          StoreCreditAccountCustomerSection,
-          {
-            customerId: storeCreditAccount.customer_id
-          }
-        )
-      ] })
-    }
-  ) });
-};
-const Note = () => {
-  const { id } = reactRouterDom.useParams();
-  const {
-    store_credit_account: storeCreditAccount,
-    isPending,
-    isError,
-    error
-  } = useStoreCreditAccount(id, {});
-  if (isError) {
-    throw error;
-  }
-  const isReady = !isPending && !!storeCreditAccount;
-  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Credit store credit account" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Credit the store credit account" }) })
-    ] }),
-    isReady && /* @__PURE__ */ jsxRuntime.jsx(StoreCreditAccountCreditForm, { storeCreditAccount })
-  ] });
-};
-const StoreCreditAccountCreditForm = ({
-  storeCreditAccount
-}) => {
-  const form = useForm({
-    defaultValues: {
-      amount: {
-        float: 0,
-        value: ""
-      },
-      note: ""
-    },
-    resolver: t(schema)
-  });
-  const { mutateAsync, isPending } = useCreditStoreCreditAccount(
-    storeCreditAccount.id
-  );
-  const { handleSuccess } = useRouteModal();
-  const onSubmit = form.handleSubmit(async (data) => {
-    if (data.amount.float <= 0) {
-      form.setError("amount", { message: "Amount must be greater than 0" });
-      return;
-    }
-    await mutateAsync(
-      { amount: data.amount.float, note: data.note },
-      {
-        onSuccess: () => handleSuccess(),
-        onError: (error) => ui.toast.error(error.message)
-      }
-    );
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    KeyboundForm,
-    {
-      className: "flex flex-1 flex-col overflow-hidden",
-      onSubmit,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Form$2.Field,
-            {
-              control: form.control,
-              name: "amount",
-              render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Amount" }),
-                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.CurrencyInput,
-                  {
-                    min: 0,
-                    placeholder: "0",
-                    value: field.value.value,
-                    onValueChange: (_value, _name, values) => {
-                      field.onChange({
-                        value: values == null ? void 0 : values.value,
-                        float: (values == null ? void 0 : values.float) || null
-                      });
-                    },
-                    symbol: currencies[storeCreditAccount.currency_code.toUpperCase()].symbol_native,
-                    code: storeCreditAccount.currency_code.toUpperCase()
-                  }
-                ) }),
-                /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
-              ] })
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Form$2.Field,
-            {
-              control: form.control,
-              name: "note",
-              render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Note" }),
-                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Textarea, { ...field }) }),
-                /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
-              ] })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
-        ] }) })
-      ]
-    }
-  ) });
-};
-const schema = objectType({
-  note: stringType(),
-  amount: objectType({
-    float: numberType(),
-    value: stringType()
-  })
-});
-const columnHelper$7 = createColumnHelper();
-const useGiftCardProductsTableColumns = () => {
-  return React.useMemo(
-    () => [
-      columnHelper$7.display({
-        id: "product",
-        header: () => /* @__PURE__ */ jsxRuntime.jsx(ProductHeader, {}),
-        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(ProductCell, { product: row.original })
-      }),
-      columnHelper$7.accessor("sales_channels", {
-        header: () => /* @__PURE__ */ jsxRuntime.jsx(SalesChannelHeader, {}),
-        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(SalesChannelsCell, { salesChannels: row.original.sales_channels })
-      }),
-      columnHelper$7.accessor("variants", {
-        header: () => /* @__PURE__ */ jsxRuntime.jsx(VariantHeader, {}),
-        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(VariantCell, { variants: row.original.variants })
-      }),
-      columnHelper$7.accessor("status", {
-        header: () => /* @__PURE__ */ jsxRuntime.jsx(ProductStatusHeader, {}),
-        cell: ({ row }) => /* @__PURE__ */ jsxRuntime.jsx(ProductStatusCell, { status: row.original.status })
-      })
-    ],
-    []
-  );
-};
-const useGiftCardProductsFilters = () => {
-  const dateFilterOptions = useDataTableDateFilters$1();
-  return React.useMemo(() => {
-    return [...dateFilterOptions];
-  }, [dateFilterOptions]);
-};
-const useGiftCardProductsTableQuery = ({
-  prefix,
-  pageSize = 20
-}) => {
-  const queryObject = useQueryParams(
-    ["offset", "customer_id", "created_at", "updated_at"],
-    prefix
-  );
-  const { offset: offset2, created_at, updated_at, customer_id, ...rest } = queryObject;
-  const searchParams = {
-    limit: pageSize,
-    offset: offset2 ? Number(offset2) : 0,
-    created_at: created_at ? JSON.parse(created_at) : void 0,
-    updated_at: updated_at ? JSON.parse(updated_at) : void 0,
-    customer_id: customer_id ? JSON.parse(customer_id) : void 0,
-    ...rest
-  };
-  return searchParams;
-};
-const PAGE_SIZE$3 = 10;
-function GiftCardProductsTable() {
-  const queryParams = useGiftCardProductsTableQuery({
-    pageSize: PAGE_SIZE$3
-  });
-  const {
-    products: giftCardProducts,
-    isPending,
-    count: count2
-  } = useProducts({
-    ...queryParams,
-    is_giftcard: true,
-    order: queryParams.order ?? "-created_at"
-  });
-  const columns = useGiftCardProductsTableColumns();
-  const filters = useGiftCardProductsFilters();
-  return /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsx(
-      DataTable,
-      {
-        data: giftCardProducts,
-        getRowId: (row) => row.id,
-        columns,
-        filters,
-        isLoading: isPending,
-        pageSize: PAGE_SIZE$3,
-        rowCount: count2,
-        enableSearch: false,
-        heading: "Gift Card Products",
-        actions: [
-          {
-            label: "Create",
-            to: "create"
-          }
-        ],
-        rowHref: (row) => `${row.id}`,
-        emptyState: {
-          empty: {
-            heading: "No gift card products found",
-            description: "Create a new gift card product to get started."
-          },
-          filtered: {
-            heading: "No results found",
-            description: "No gift card products match your filter criteria."
-          }
-        }
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
-  ] });
-}
-const GiftCardProductsPage = () => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductsTable, {}),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Toaster, {})
-  ] });
-};
-const config = adminSdk.defineRouteConfig({
-  label: "Gift Card Products"
-});
-const PRICE_PREFERENCES_QUERY_KEY = "price-preferences";
-const pricePreferencesQueryKeys = queryKeysFactory(
-  PRICE_PREFERENCES_QUERY_KEY
-);
-const usePricePreferences = (query, options) => {
-  const { data, ...rest } = reactQuery.useQuery({
-    queryFn: () => sdk.admin.pricePreference.list(query),
-    queryKey: pricePreferencesQueryKeys.list(query),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-const REGIONS_QUERY_KEY = "regions";
-const regionsQueryKeys = queryKeysFactory(REGIONS_QUERY_KEY);
-const useRegions = (query, options) => {
-  const { data, ...rest } = reactQuery.useQuery({
-    queryFn: () => sdk.admin.region.list(query),
-    queryKey: regionsQueryKeys.list(query),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-const consoleLogger = {
-  type: "logger",
-  log(args) {
-    this.output("log", args);
-  },
-  warn(args) {
-    this.output("warn", args);
-  },
-  error(args) {
-    this.output("error", args);
-  },
-  output(type, args) {
-    if (console && console[type]) console[type].apply(console, args);
-  }
-};
-class Logger {
-  constructor(concreteLogger) {
-    let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
-    this.init(concreteLogger, options);
+};
+class Logger {
+  constructor(concreteLogger) {
+    let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+    this.init(concreteLogger, options);
   }
   init(concreteLogger) {
     let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
@@ -36477,474 +36213,738 @@ const PRODUCT_CREATE_FORM_DEFAULTS = {
       value: "100",
       prices: {}
     }
-  ],
-  enable_variants: true,
-  media: [],
-  categories: [],
-  collection_id: "",
-  shipping_profile_id: "",
-  description: "",
-  handle: "",
-  height: "",
-  hs_code: "",
-  length: "",
-  material: "",
-  mid_code: "",
-  origin_country: "",
-  subtitle: "",
-  title: "",
-  type_id: "",
-  weight: "",
-  width: ""
-};
-const PAGE_SIZE$2 = 50;
-const GiftCardProductSalesChannelStackedModal = ({
-  form
-}) => {
-  const { getValues, setValue: setValue2 } = form;
-  const { setIsOpen, getIsOpen } = useStackedModal();
-  const [rowSelection, setRowSelection] = React.useState(
-    {}
-  );
-  const [state, setState] = React.useState([]);
-  const searchParams = useSalesChannelTableQuery({
-    pageSize: PAGE_SIZE$2,
-    prefix: SC_STACKED_MODAL_ID
+  ],
+  enable_variants: true,
+  media: [],
+  categories: [],
+  collection_id: "",
+  shipping_profile_id: "",
+  description: "",
+  handle: "",
+  height: "",
+  hs_code: "",
+  length: "",
+  material: "",
+  mid_code: "",
+  origin_country: "",
+  subtitle: "",
+  title: "",
+  type_id: "",
+  weight: "",
+  width: ""
+};
+const PAGE_SIZE$2 = 50;
+const GiftCardProductSalesChannelStackedModal = ({
+  form
+}) => {
+  const { getValues, setValue: setValue2 } = form;
+  const { setIsOpen, getIsOpen } = useStackedModal();
+  const [rowSelection, setRowSelection] = React.useState(
+    {}
+  );
+  const [state, setState] = React.useState([]);
+  const searchParams = useSalesChannelTableQuery({
+    pageSize: PAGE_SIZE$2,
+    prefix: SC_STACKED_MODAL_ID
+  });
+  const { sales_channels, count: count2, isLoading, isError, error } = useSalesChannels(
+    searchParams,
+    { placeholderData: reactQuery.keepPreviousData }
+  );
+  const open = getIsOpen(SC_STACKED_MODAL_ID);
+  React.useEffect(() => {
+    if (!open) {
+      return;
+    }
+    const salesChannels = getValues("sales_channels");
+    if (salesChannels) {
+      setState(
+        salesChannels.map((channel) => ({
+          id: channel.id,
+          name: channel.name
+        }))
+      );
+      setRowSelection(
+        salesChannels.reduce(
+          (acc, channel) => ({
+            ...acc,
+            [channel.id]: true
+          }),
+          {}
+        )
+      );
+    }
+  }, [open, getValues]);
+  const onRowSelectionChange = (state2) => {
+    const ids2 = Object.keys(state2);
+    const addedIdsSet = new Set(
+      ids2.filter((id) => state2[id] && !rowSelection[id])
+    );
+    let addedSalesChannels = [];
+    if (addedIdsSet.size > 0) {
+      addedSalesChannels = (sales_channels == null ? void 0 : sales_channels.filter((channel) => addedIdsSet.has(channel.id))) ?? [];
+    }
+    setState((prev) => {
+      const filteredPrev = prev.filter((channel) => state2[channel.id]);
+      return Array.from(/* @__PURE__ */ new Set([...filteredPrev, ...addedSalesChannels]));
+    });
+    setRowSelection(state2);
+  };
+  const handleAdd = () => {
+    setValue2("sales_channels", state, {
+      shouldDirty: true,
+      shouldTouch: true
+    });
+    setIsOpen(SC_STACKED_MODAL_ID, false);
+  };
+  const filters = useSalesChannelTableFilters();
+  const columns = useColumns$2();
+  const emptyState = useSalesChannelTableEmptyState();
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(StackedFocusModal.Content, { className: "flex flex-col overflow-hidden", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Header, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Body, { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
+      DataTable,
+      {
+        data: sales_channels,
+        columns,
+        filters,
+        emptyState,
+        rowCount: count2,
+        pageSize: PAGE_SIZE$2,
+        getRowId: (row) => row.id,
+        rowSelection: {
+          state: rowSelection,
+          onRowSelectionChange
+        },
+        isLoading,
+        layout: "fill",
+        prefix: SC_STACKED_MODAL_ID
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", onClick: handleAdd, type: "button", children: "Save" })
+    ] }) })
+  ] });
+};
+const columnHelper$3 = ui.createDataTableColumnHelper();
+const useColumns$2 = () => {
+  const base = useSalesChannelTableColumns();
+  return React.useMemo(() => [columnHelper$3.select(), ...base], [base]);
+};
+const GiftCardProductCreateOrganizeForm = ({
+  form
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(StackedFocusModal, { id: SC_STACKED_MODAL_ID, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateOrganizationSection, { form }),
+    /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductSalesChannelStackedModal, { form })
+  ] });
+};
+const GiftCardProductCreateDetailsForm = ({
+  form
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center p-16", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Header, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-8", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateFormGeneral, { form, children: /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateFormMedia, { form }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
+      /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateOrganizeForm, { form }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
+      /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateFormDenominations, { form })
+    ] })
+  ] }) });
+};
+const Header = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Create Gift Card Product" }) });
+};
+const SAVE_DRAFT_BUTTON = "save-draft-button";
+const GiftCardProductCreateForm = ({
+  defaultChannel,
+  regions,
+  store,
+  pricePreferences
+}) => {
+  const [tab, setTab] = React.useState(
+    "details"
+    /* DETAILS */
+  );
+  const [tabState, setTabState] = React.useState({
+    [
+      "details"
+      /* DETAILS */
+    ]: "in-progress",
+    [
+      "prices"
+      /* PRICES */
+    ]: "not-started"
+  });
+  const { handleSuccess } = useRouteModal();
+  const form = useForm({
+    defaultValues: {
+      ...PRODUCT_CREATE_FORM_DEFAULTS,
+      sales_channels: defaultChannel ? [{ id: defaultChannel.id, name: defaultChannel.name }] : []
+    },
+    resolver: t(ProductCreateSchema)
+  });
+  const { mutateAsync, isPending } = useCreateProduct();
+  const regionsCurrencyMap = React.useMemo(() => {
+    if (!(regions == null ? void 0 : regions.length)) {
+      return {};
+    }
+    return regions.reduce((acc, reg) => {
+      acc[reg.id] = reg.currency_code;
+      return acc;
+    }, {});
+  }, [regions]);
+  const handleSubmit = form.handleSubmit(async (values, e2) => {
+    var _a;
+    let isDraftSubmission = false;
+    if ((e2 == null ? void 0 : e2.nativeEvent) instanceof SubmitEvent) {
+      const submitter = (_a = e2 == null ? void 0 : e2.nativeEvent) == null ? void 0 : _a.submitter;
+      isDraftSubmission = submitter.dataset.name === SAVE_DRAFT_BUTTON;
+    }
+    const media = values.media || [];
+    const payload = { ...values, media: void 0 };
+    let uploadedMedia = [];
+    try {
+      if (media.length) {
+        const thumbnailReq = media.find((m) => m.isThumbnail);
+        const otherMediaReq = media.filter((m) => !m.isThumbnail);
+        const fileReqs = [];
+        if (thumbnailReq) {
+          fileReqs.push(
+            sdk.admin.upload.create({ files: [thumbnailReq.file] }).then((r) => r.files.map((f2) => ({ ...f2, isThumbnail: true })))
+          );
+        }
+        if (otherMediaReq == null ? void 0 : otherMediaReq.length) {
+          fileReqs.push(
+            sdk.admin.upload.create({
+              files: otherMediaReq.map((m) => m.file)
+            }).then((r) => r.files.map((f2) => ({ ...f2, isThumbnail: false })))
+          );
+        }
+        uploadedMedia = (await Promise.all(fileReqs)).flat();
+      }
+    } catch (error) {
+      if (error instanceof Error) {
+        ui.toast.error(error.message);
+      }
+    }
+    await mutateAsync(
+      normalizeProductFormValues({
+        ...payload,
+        media: uploadedMedia,
+        status: isDraftSubmission ? "draft" : "published",
+        regionsCurrencyMap
+      }),
+      {
+        onSuccess: (data) => {
+          ui.toast.success(
+            `Product ${data.product.title} was successfully created.`
+          );
+          handleSuccess(`../${data.product.id}`);
+        },
+        onError: (error) => {
+          ui.toast.error(error.message);
+        }
+      }
+    );
   });
-  const { sales_channels, count: count2, isLoading, isError, error } = useSalesChannels(
-    searchParams,
-    { placeholderData: reactQuery.keepPreviousData }
-  );
-  const open = getIsOpen(SC_STACKED_MODAL_ID);
-  React.useEffect(() => {
-    if (!open) {
+  const onNext = async (currentTab) => {
+    const valid = await form.trigger();
+    if (!valid) {
       return;
     }
-    const salesChannels = getValues("sales_channels");
-    if (salesChannels) {
-      setState(
-        salesChannels.map((channel) => ({
-          id: channel.id,
-          name: channel.name
-        }))
-      );
-      setRowSelection(
-        salesChannels.reduce(
-          (acc, channel) => ({
-            ...acc,
-            [channel.id]: true
-          }),
-          {}
-        )
+    if (currentTab === "details") {
+      setTab(
+        "prices"
+        /* PRICES */
       );
     }
-  }, [open, getValues]);
-  const onRowSelectionChange = (state2) => {
-    const ids2 = Object.keys(state2);
-    const addedIdsSet = new Set(
-      ids2.filter((id) => state2[id] && !rowSelection[id])
-    );
-    let addedSalesChannels = [];
-    if (addedIdsSet.size > 0) {
-      addedSalesChannels = (sales_channels == null ? void 0 : sales_channels.filter((channel) => addedIdsSet.has(channel.id))) ?? [];
-    }
-    setState((prev) => {
-      const filteredPrev = prev.filter((channel) => state2[channel.id]);
-      return Array.from(/* @__PURE__ */ new Set([...filteredPrev, ...addedSalesChannels]));
-    });
-    setRowSelection(state2);
-  };
-  const handleAdd = () => {
-    setValue2("sales_channels", state, {
-      shouldDirty: true,
-      shouldTouch: true
-    });
-    setIsOpen(SC_STACKED_MODAL_ID, false);
   };
-  const filters = useSalesChannelTableFilters();
-  const columns = useColumns$2();
-  const emptyState = useSalesChannelTableEmptyState();
-  if (isError) {
-    throw error;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(StackedFocusModal.Content, { className: "flex flex-col overflow-hidden", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Header, {}),
-    /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Body, { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
-      DataTable,
+  React.useEffect(() => {
+    const currentState = { ...tabState };
+    if (tab === "details") {
+      currentState[
+        "details"
+        /* DETAILS */
+      ] = "in-progress";
+    }
+    if (tab === "prices") {
+      currentState[
+        "details"
+        /* DETAILS */
+      ] = "completed";
+      currentState[
+        "prices"
+        /* PRICES */
+      ] = "in-progress";
+    }
+    setTabState({ ...currentState });
+  }, [tab]);
+  return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    KeyboundForm,
+    {
+      onKeyDown: (e2) => {
+        if (e2.key === "Enter") {
+          if (e2.target instanceof HTMLTextAreaElement && !(e2.metaKey || e2.ctrlKey)) {
+            return;
+          }
+          e2.preventDefault();
+          if (e2.metaKey || e2.ctrlKey) {
+            if (tab !== "prices") {
+              e2.preventDefault();
+              e2.stopPropagation();
+              onNext(tab);
+              return;
+            }
+            handleSubmit();
+          }
+        }
+      },
+      onSubmit: handleSubmit,
+      className: "flex h-full flex-col",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.ProgressTabs,
+          {
+            value: tab,
+            onValueChange: async (tab2) => {
+              const valid = await form.trigger();
+              if (!valid) {
+                return;
+              }
+              setTab(tab2);
+            },
+            className: "flex h-full flex-col overflow-hidden",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "-my-2 w-full border-l", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.ProgressTabs.List, { className: "justify-start-start flex w-full items-center", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.ProgressTabs.Trigger,
+                  {
+                    status: tabState[
+                      "details"
+                      /* DETAILS */
+                    ],
+                    value: "details",
+                    className: "max-w-[200px] truncate",
+                    children: "Details"
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.ProgressTabs.Trigger,
+                  {
+                    status: tabState[
+                      "prices"
+                      /* PRICES */
+                    ],
+                    value: "prices",
+                    className: "max-w-[200px] truncate",
+                    children: "Prices"
+                  }
+                )
+              ] }) }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal.Body, { className: "size-full overflow-hidden", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.ProgressTabs.Content,
+                  {
+                    className: "size-full overflow-y-auto",
+                    value: "details",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateDetailsForm, { form })
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.ProgressTabs.Content,
+                  {
+                    className: "size-full overflow-y-auto",
+                    value: "prices",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(
+                      GiftCardProductCreateDenominationsForm,
+                      {
+                        form,
+                        store,
+                        regions,
+                        pricePreferences
+                      }
+                    )
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              "data-name": SAVE_DRAFT_BUTTON,
+              size: "small",
+              type: "submit",
+              isLoading: isPending,
+              className: "whitespace-nowrap",
+              children: "Save as draft"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { tab, next: onNext, isLoading: isPending })
+        ] }) })
+      ]
+    }
+  ) });
+};
+const PrimaryButton = ({ tab, next, isLoading }) => {
+  if (tab === "prices") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Button,
       {
-        data: sales_channels,
-        columns,
-        filters,
-        emptyState,
-        rowCount: count2,
-        pageSize: PAGE_SIZE$2,
-        getRowId: (row) => row.id,
-        rowSelection: {
-          state: rowSelection,
-          onRowSelectionChange
-        },
+        "data-name": "publish-button",
+        type: "submit",
+        variant: "primary",
+        size: "small",
         isLoading,
-        layout: "fill",
-        prefix: SC_STACKED_MODAL_ID
+        children: "Publish"
+      },
+      "submit-button"
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ui.Button,
+    {
+      type: "button",
+      variant: "primary",
+      size: "small",
+      onClick: () => next(tab),
+      children: "Continue"
+    },
+    "next-button"
+  );
+};
+const GiftCardProductCreate = () => {
+  const {
+    store,
+    isPending: isStorePending,
+    isError: isStoreError,
+    error: storeError
+  } = useStore$2({
+    fields: "+default_sales_channel"
+  });
+  const {
+    sales_channel,
+    isPending: isSalesChannelPending,
+    isError: isSalesChannelError,
+    error: salesChannelError
+  } = useSalesChannel(store == null ? void 0 : store.default_sales_channel_id, {
+    enabled: !!(store == null ? void 0 : store.default_sales_channel_id)
+  });
+  const {
+    regions,
+    isPending: isRegionsPending,
+    isError: isRegionsError,
+    error: regionsError
+  } = useRegions({ limit: 9999 });
+  const {
+    price_preferences,
+    isPending: isPricePreferencesPending,
+    isError: isPricePreferencesError,
+    error: pricePreferencesError
+  } = usePricePreferences({
+    limit: 9999
+  });
+  const ready = !!store && !isStorePending && !!regions && !isRegionsPending && !!sales_channel && !isSalesChannelPending && !!price_preferences && !isPricePreferencesPending;
+  if (isStoreError) {
+    throw storeError;
+  }
+  if (isRegionsError) {
+    throw regionsError;
+  }
+  if (isSalesChannelError) {
+    throw salesChannelError;
+  }
+  if (isPricePreferencesError) {
+    throw pricePreferencesError;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Create Gift Card Product" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Create a new gift card product" }) }),
+    ready && /* @__PURE__ */ jsxRuntime.jsx(
+      GiftCardProductCreateForm,
+      {
+        defaultChannel: sales_channel,
+        store,
+        pricePreferences: price_preferences,
+        regions
       }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", onClick: handleAdd, type: "button", children: "Save" })
-    ] }) })
+    )
   ] });
 };
-const columnHelper$3 = ui.createDataTableColumnHelper();
-const useColumns$2 = () => {
-  const base = useSalesChannelTableColumns();
-  return React.useMemo(() => [columnHelper$3.select(), ...base], [base]);
+const StoreCreditAccountBalanceSection = ({
+  storeCreditAccount
+}) => {
+  if (!storeCreditAccount || typeof storeCreditAccount.balance === "undefined") {
+    return;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "grid grid-cols-2 gap-x-2 px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-x-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-ui-tag-green-icon h-8 w-1 rounded-full" }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "plus", size: "small", className: "text-ui-fg-subtle", children: "Current Balance" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ui.Text,
+        {
+          weight: "plus",
+          size: "xlarge",
+          className: "tabular-nums text-ui-fg-base",
+          children: formatAmount(
+            storeCreditAccount.balance,
+            storeCreditAccount.currency_code
+          )
+        }
+      )
+    ] })
+  ] }) });
 };
-const GiftCardProductCreateOrganizeForm = ({
-  form
+const StoreCreditAccountDetailsSection = ({
+  storeCreditAccount
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(StackedFocusModal, { id: SC_STACKED_MODAL_ID, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateOrganizationSection, { form }),
-    /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductSalesChannelStackedModal, { form })
+  if (!storeCreditAccount || typeof storeCreditAccount.balance === "undefined") {
+    return;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "flex justify-between gap-x-2 px-6 py-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      ui.Text,
+      {
+        weight: "plus",
+        size: "xlarge",
+        className: "text-ui-fg-base flex gap-x-4",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(CreditCardIcon, { className: "inline" }),
+            " "
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle", children: [
+              storeCreditAccount.currency_code.toUpperCase(),
+              " Account"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ui-fg-base", children: /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Text,
+              {
+                weight: "regular",
+                size: "small",
+                className: "text-ui-fg-base flex gap-x-4",
+                children: /* @__PURE__ */ jsxRuntime.jsx(DisplayId, { id: storeCreditAccount.id })
+              }
+            ) })
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-x-4", children: /* @__PURE__ */ jsxRuntime.jsx(
+      ActionMenu,
+      {
+        groups: [
+          {
+            actions: [
+              {
+                icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CreditCard, {}),
+                label: "Credit the account",
+                to: "credit"
+              }
+            ]
+          }
+        ]
+      }
+    ) })
   ] });
 };
-const GiftCardProductCreateDetailsForm = ({
-  form
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center p-16", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Header, {}),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-8", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateFormGeneral, { form, children: /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateFormMedia, { form }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
-      /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateOrganizeForm, { form }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
-      /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateFormDenominations, { form })
+function StoreCreditAccountCustomerSection({
+  customerId
+}) {
+  const { customer, isPending } = useCustomer(customerId, void 0, {
+    enabled: !!customerId
+  });
+  if (isPending || !customer) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Header$5, { title: "Customer" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      SidebarLink,
+      {
+        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.User, {}),
+        labelKey: customer.email || "N/A",
+        descriptionKey: !customer.first_name && !customer.last_name ? "N/A" : `${customer.first_name} ${customer.last_name}`,
+        to: `/customers/${customer.id}`
+      },
+      customer.id
+    )
+  ] });
+}
+function StoreCreditAccountCodeSection({ code }) {
+  if (!code) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Header$5, { title: "Account Code" }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-4 px-6 mb-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(icons.Share, { className: "inline" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ui-fg-subtle text-sm", children: code })
     ] })
-  ] }) });
+  ] });
+}
+const StoreCreditAccountPage = () => {
+  const { id } = reactRouterDom.useParams();
+  const { store_credit_account: storeCreditAccount } = useStoreCreditAccount(
+    id
+  );
+  if (!storeCreditAccount) {
+    return;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    TwoColumnLayout,
+    {
+      firstCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          StoreCreditAccountDetailsSection,
+          {
+            storeCreditAccount
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(TransactionsTable, { id: storeCreditAccount.id })
+      ] }),
+      secondCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          StoreCreditAccountBalanceSection,
+          {
+            storeCreditAccount
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(StoreCreditAccountCodeSection, { code: storeCreditAccount.code }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          StoreCreditAccountCustomerSection,
+          {
+            customerId: storeCreditAccount.customer_id
+          }
+        )
+      ] })
+    }
+  ) });
 };
-const Header = () => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Create Gift Card Product" }) });
+const Note = () => {
+  const { id } = reactRouterDom.useParams();
+  const {
+    store_credit_account: storeCreditAccount,
+    isPending,
+    isError,
+    error
+  } = useStoreCreditAccount(id, {});
+  if (isError) {
+    throw error;
+  }
+  const isReady = !isPending && !!storeCreditAccount;
+  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Credit store credit account" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Credit the store credit account" }) })
+    ] }),
+    isReady && /* @__PURE__ */ jsxRuntime.jsx(StoreCreditAccountCreditForm, { storeCreditAccount })
+  ] });
 };
-const SAVE_DRAFT_BUTTON = "save-draft-button";
-const GiftCardProductCreateForm = ({
-  defaultChannel,
-  regions,
-  store,
-  pricePreferences
+const StoreCreditAccountCreditForm = ({
+  storeCreditAccount
 }) => {
-  const [tab, setTab] = React.useState(
-    "details"
-    /* DETAILS */
-  );
-  const [tabState, setTabState] = React.useState({
-    [
-      "details"
-      /* DETAILS */
-    ]: "in-progress",
-    [
-      "prices"
-      /* PRICES */
-    ]: "not-started"
-  });
-  const { handleSuccess } = useRouteModal();
   const form = useForm({
     defaultValues: {
-      ...PRODUCT_CREATE_FORM_DEFAULTS,
-      sales_channels: defaultChannel ? [{ id: defaultChannel.id, name: defaultChannel.name }] : []
+      amount: {
+        float: 0,
+        value: ""
+      },
+      note: ""
     },
-    resolver: t(ProductCreateSchema)
+    resolver: t(schema)
   });
-  const { mutateAsync, isPending } = useCreateProduct();
-  const regionsCurrencyMap = React.useMemo(() => {
-    if (!(regions == null ? void 0 : regions.length)) {
-      return {};
-    }
-    return regions.reduce((acc, reg) => {
-      acc[reg.id] = reg.currency_code;
-      return acc;
-    }, {});
-  }, [regions]);
-  const handleSubmit = form.handleSubmit(async (values, e2) => {
-    var _a;
-    let isDraftSubmission = false;
-    if ((e2 == null ? void 0 : e2.nativeEvent) instanceof SubmitEvent) {
-      const submitter = (_a = e2 == null ? void 0 : e2.nativeEvent) == null ? void 0 : _a.submitter;
-      isDraftSubmission = submitter.dataset.name === SAVE_DRAFT_BUTTON;
-    }
-    const media = values.media || [];
-    const payload = { ...values, media: void 0 };
-    let uploadedMedia = [];
-    try {
-      if (media.length) {
-        const thumbnailReq = media.find((m) => m.isThumbnail);
-        const otherMediaReq = media.filter((m) => !m.isThumbnail);
-        const fileReqs = [];
-        if (thumbnailReq) {
-          fileReqs.push(
-            sdk.admin.upload.create({ files: [thumbnailReq.file] }).then((r) => r.files.map((f2) => ({ ...f2, isThumbnail: true })))
-          );
-        }
-        if (otherMediaReq == null ? void 0 : otherMediaReq.length) {
-          fileReqs.push(
-            sdk.admin.upload.create({
-              files: otherMediaReq.map((m) => m.file)
-            }).then((r) => r.files.map((f2) => ({ ...f2, isThumbnail: false })))
-          );
-        }
-        uploadedMedia = (await Promise.all(fileReqs)).flat();
-      }
-    } catch (error) {
-      if (error instanceof Error) {
-        ui.toast.error(error.message);
-      }
+  const { mutateAsync, isPending } = useCreditStoreCreditAccount(
+    storeCreditAccount.id
+  );
+  const { handleSuccess } = useRouteModal();
+  const onSubmit = form.handleSubmit(async (data) => {
+    if (data.amount.float <= 0) {
+      form.setError("amount", { message: "Amount must be greater than 0" });
+      return;
     }
     await mutateAsync(
-      normalizeProductFormValues({
-        ...payload,
-        media: uploadedMedia,
-        status: isDraftSubmission ? "draft" : "published",
-        regionsCurrencyMap
-      }),
+      { amount: data.amount.float, note: data.note },
       {
-        onSuccess: (data) => {
-          ui.toast.success(
-            `Product ${data.product.title} was successfully created.`
-          );
-          handleSuccess(`../${data.product.id}`);
-        },
-        onError: (error) => {
-          ui.toast.error(error.message);
-        }
+        onSuccess: () => handleSuccess(),
+        onError: (error) => ui.toast.error(error.message)
       }
     );
   });
-  const onNext = async (currentTab) => {
-    const valid = await form.trigger();
-    if (!valid) {
-      return;
-    }
-    if (currentTab === "details") {
-      setTab(
-        "prices"
-        /* PRICES */
-      );
-    }
-  };
-  React.useEffect(() => {
-    const currentState = { ...tabState };
-    if (tab === "details") {
-      currentState[
-        "details"
-        /* DETAILS */
-      ] = "in-progress";
-    }
-    if (tab === "prices") {
-      currentState[
-        "details"
-        /* DETAILS */
-      ] = "completed";
-      currentState[
-        "prices"
-        /* PRICES */
-      ] = "in-progress";
-    }
-    setTabState({ ...currentState });
-  }, [tab]);
-  return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
     KeyboundForm,
     {
-      onKeyDown: (e2) => {
-        if (e2.key === "Enter") {
-          if (e2.target instanceof HTMLTextAreaElement && !(e2.metaKey || e2.ctrlKey)) {
-            return;
-          }
-          e2.preventDefault();
-          if (e2.metaKey || e2.ctrlKey) {
-            if (tab !== "prices") {
-              e2.preventDefault();
-              e2.stopPropagation();
-              onNext(tab);
-              return;
-            }
-            handleSubmit();
-          }
-        }
-      },
-      onSubmit: handleSubmit,
-      className: "flex h-full flex-col",
+      className: "flex flex-1 flex-col overflow-hidden",
+      onSubmit,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          ui.ProgressTabs,
-          {
-            value: tab,
-            onValueChange: async (tab2) => {
-              const valid = await form.trigger();
-              if (!valid) {
-                return;
-              }
-              setTab(tab2);
-            },
-            className: "flex h-full flex-col overflow-hidden",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "-my-2 w-full border-l", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.ProgressTabs.List, { className: "justify-start-start flex w-full items-center", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.ProgressTabs.Trigger,
-                  {
-                    status: tabState[
-                      "details"
-                      /* DETAILS */
-                    ],
-                    value: "details",
-                    className: "max-w-[200px] truncate",
-                    children: "Details"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.ProgressTabs.Trigger,
-                  {
-                    status: tabState[
-                      "prices"
-                      /* PRICES */
-                    ],
-                    value: "prices",
-                    className: "max-w-[200px] truncate",
-                    children: "Prices"
-                  }
-                )
-              ] }) }) }),
-              /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal.Body, { className: "size-full overflow-hidden", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.ProgressTabs.Content,
-                  {
-                    className: "size-full overflow-y-auto",
-                    value: "details",
-                    children: /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductCreateDetailsForm, { form })
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  ui.ProgressTabs.Content,
-                  {
-                    className: "size-full overflow-y-auto",
-                    value: "prices",
-                    children: /* @__PURE__ */ jsxRuntime.jsx(
-                      GiftCardProductCreateDenominationsForm,
-                      {
-                        form,
-                        store,
-                        regions,
-                        pricePreferences
-                      }
-                    )
+        /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Form$2.Field,
+            {
+              control: form.control,
+              name: "amount",
+              render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Amount" }),
+                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.CurrencyInput,
+                  {
+                    min: 0,
+                    placeholder: "0",
+                    value: field.value.value,
+                    onValueChange: (_value, _name, values) => {
+                      field.onChange({
+                        value: values == null ? void 0 : values.value,
+                        float: (values == null ? void 0 : values.float) || null
+                      });
+                    },
+                    symbol: currencies[storeCreditAccount.currency_code.toUpperCase()].symbol_native,
+                    code: storeCreditAccount.currency_code.toUpperCase()
                   }
-                )
+                ) }),
+                /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
               ] })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Button,
+            Form$2.Field,
             {
-              "data-name": SAVE_DRAFT_BUTTON,
-              size: "small",
-              type: "submit",
-              isLoading: isPending,
-              className: "whitespace-nowrap",
-              children: "Save as draft"
+              control: form.control,
+              name: "note",
+              render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Note" }),
+                /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Textarea, { ...field }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
+              ] })
             }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { tab, next: onNext, isLoading: isPending })
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
         ] }) })
       ]
     }
   ) });
 };
-const PrimaryButton = ({ tab, next, isLoading }) => {
-  if (tab === "prices") {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      ui.Button,
-      {
-        "data-name": "publish-button",
-        type: "submit",
-        variant: "primary",
-        size: "small",
-        isLoading,
-        children: "Publish"
-      },
-      "submit-button"
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    ui.Button,
-    {
-      type: "button",
-      variant: "primary",
-      size: "small",
-      onClick: () => next(tab),
-      children: "Continue"
-    },
-    "next-button"
-  );
-};
-const GiftCardProductCreate = () => {
-  const {
-    store,
-    isPending: isStorePending,
-    isError: isStoreError,
-    error: storeError
-  } = useStore$2({
-    fields: "+default_sales_channel"
-  });
-  const {
-    sales_channel,
-    isPending: isSalesChannelPending,
-    isError: isSalesChannelError,
-    error: salesChannelError
-  } = useSalesChannel(store == null ? void 0 : store.default_sales_channel_id, {
-    enabled: !!(store == null ? void 0 : store.default_sales_channel_id)
-  });
-  const {
-    regions,
-    isPending: isRegionsPending,
-    isError: isRegionsError,
-    error: regionsError
-  } = useRegions({ limit: 9999 });
-  const {
-    price_preferences,
-    isPending: isPricePreferencesPending,
-    isError: isPricePreferencesError,
-    error: pricePreferencesError
-  } = usePricePreferences({
-    limit: 9999
-  });
-  const ready = !!store && !isStorePending && !!regions && !isRegionsPending && !!sales_channel && !isSalesChannelPending && !!price_preferences && !isPricePreferencesPending;
-  if (isStoreError) {
-    throw storeError;
-  }
-  if (isRegionsError) {
-    throw regionsError;
-  }
-  if (isSalesChannelError) {
-    throw salesChannelError;
-  }
-  if (isPricePreferencesError) {
-    throw pricePreferencesError;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Create Gift Card Product" }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Create a new gift card product" }) }),
-    ready && /* @__PURE__ */ jsxRuntime.jsx(
-      GiftCardProductCreateForm,
-      {
-        defaultChannel: sales_channel,
-        store,
-        pricePreferences: price_preferences,
-        regions
-      }
-    )
-  ] });
-};
+const schema = objectType({
+  note: stringType(),
+  amount: objectType({
+    float: numberType(),
+    value: stringType()
+  })
+});
 const productStatusColor = (status) => {
   switch (status) {
     case "draft":
@@ -37392,34 +37392,181 @@ const useFilters = () => {
     return [];
   }, [dateFilters]);
 };
-const ProductDetail = () => {
+const ProductDetail = () => {
+  const { id } = reactRouterDom.useParams();
+  const { product, isLoading, isError, error } = useProduct(id);
+  if (isLoading || !product) {
+    return;
+  }
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      TwoColumnLayout,
+      {
+        firstCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ProductGeneralSection, { product }),
+          /* @__PURE__ */ jsxRuntime.jsx(ProductVariantSection, { product }),
+          /* @__PURE__ */ jsxRuntime.jsx(JsonViewSection, { data: product })
+        ] }),
+        secondCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ProductSalesChannelSection, { product }),
+          /* @__PURE__ */ jsxRuntime.jsx(ProductMediaSection, { product })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
+  ] });
+};
+const EditProductSchema$1 = objectType({
+  denominations: arrayType(
+    objectType({
+      id: stringType().optional(),
+      value: stringType().min(1),
+      prices: recordType(stringType(), optionalFloat).optional()
+    })
+  ).min(1)
+});
+const GiftCardProductEditDenominationsForm = ({
+  product
+}) => {
+  var _a;
+  const { handleSuccess } = useRouteModal();
+  const form = useForm({
+    defaultValues: {
+      denominations: (_a = product.variants) == null ? void 0 : _a.map((variant) => ({
+        id: variant.id,
+        value: variant.title
+      }))
+    },
+    resolver: t(EditProductSchema$1)
+  });
+  const { mutateAsync, isPending } = useUpdateProduct(product.id);
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const optionValues = data.denominations.map(
+      (denomination) => denomination.value
+    );
+    const options = [
+      {
+        title: "denomination",
+        values: optionValues
+      }
+    ];
+    await mutateAsync(
+      {
+        options,
+        variants: data.denominations.map((denomination) => ({
+          id: denomination.id,
+          title: denomination.value,
+          manage_inventory: false,
+          options: {
+            denomination: denomination.value
+          }
+        }))
+      },
+      {
+        onSuccess: () => {
+          ui.toast.success(`Denominations updated successfully`);
+          handleSuccess();
+        },
+        onError: (e2) => {
+          ui.toast.error(e2.message);
+        }
+      }
+    );
+  });
+  const {
+    fields: denominationsFields,
+    append: addDenomination,
+    remove: removeDenomination
+  } = useFieldArray({
+    name: "denominations",
+    control: form.control
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    KeyboundForm,
+    {
+      onSubmit: handleSubmit,
+      className: "flex flex-1 flex-col overflow-hidden",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-y-6", children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-2", children: [
+          denominationsFields.map((denominationField, index) => {
+            return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
+                    Form$2.Field,
+                    {
+                      control: form.control,
+                      name: `denominations.${index}.value`,
+                      render: ({ field }) => {
+                        return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { className: "w-full", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field, placeholder: "100" }) }),
+                          /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
+                        ] });
+                      }
+                    },
+                    denominationField.id
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center rounded-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
+                    ui.Button,
+                    {
+                      size: "small",
+                      variant: "secondary",
+                      type: "button",
+                      className: "rounded-full p-0 ml-4",
+                      onClick: () => {
+                        removeDenomination(index);
+                      },
+                      children: /* @__PURE__ */ jsxRuntime.jsx(icons.XCircleSolid, { className: "rounded-full" })
+                    }
+                  ) })
+                ]
+              },
+              denominationField.id
+            );
+          }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              size: "small",
+              variant: "secondary",
+              type: "button",
+              className: "w-full",
+              onClick: () => {
+                addDenomination({ value: "", prices: {} });
+              },
+              children: "Add denomination"
+            }
+          ),
+          form.formState.errors.denominations && /* @__PURE__ */ jsxRuntime.jsx(ui.Alert, { variant: "error", children: "Please add at least one denomination." })
+        ] }) }) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
+        ] }) })
+      ]
+    }
+  ) });
+};
+const GiftCardProductEdit$1 = () => {
   const { id } = reactRouterDom.useParams();
-  const { product, isLoading, isError, error } = useProduct(id);
-  if (isLoading || !product) {
-    return;
-  }
+  const { product, isLoading, isError, error } = useProduct(id, {});
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      TwoColumnLayout,
-      {
-        firstCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(ProductGeneralSection, { product }),
-          /* @__PURE__ */ jsxRuntime.jsx(ProductVariantSection, { product }),
-          /* @__PURE__ */ jsxRuntime.jsx(JsonViewSection, { data: product })
-        ] }),
-        secondCol: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(ProductSalesChannelSection, { product }),
-          /* @__PURE__ */ jsxRuntime.jsx(ProductMediaSection, { product })
-        ] })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
+  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit gift cards denominations" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { className: "sr-only", children: "Edit the gift card denominations" })
+    ] }),
+    !isLoading && product && /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductEditDenominationsForm, { product })
   ] });
 };
-const EditProductSchema$1 = objectType({
+const EditProductSchema = objectType({
   status: enumType(["draft", "published", "proposed", "rejected"]),
   title: stringType().min(1),
   subtitle: stringType().optional(),
@@ -37438,7 +37585,7 @@ const GiftCardProductEditForm = ({
       handle: product.handle || "",
       description: product.description || ""
     },
-    resolver: t(EditProductSchema$1)
+    resolver: t(EditProductSchema)
   });
   const { mutateAsync, isPending } = useUpdateProduct(product.id);
   const handleSubmit = form.handleSubmit(async (data) => {
@@ -37579,7 +37726,7 @@ const GiftCardProductEditForm = ({
     }
   ) });
 };
-const GiftCardProductEdit$1 = () => {
+const GiftCardProductEdit = () => {
   const { id } = reactRouterDom.useParams();
   const { product, isLoading, isError, error } = useProduct(id, {});
   if (isError) {
@@ -37593,153 +37740,6 @@ const GiftCardProductEdit$1 = () => {
     !isLoading && product && /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductEditForm, { product })
   ] });
 };
-const EditProductSchema = objectType({
-  denominations: arrayType(
-    objectType({
-      id: stringType().optional(),
-      value: stringType().min(1),
-      prices: recordType(stringType(), optionalFloat).optional()
-    })
-  ).min(1)
-});
-const GiftCardProductEditDenominationsForm = ({
-  product
-}) => {
-  var _a;
-  const { handleSuccess } = useRouteModal();
-  const form = useForm({
-    defaultValues: {
-      denominations: (_a = product.variants) == null ? void 0 : _a.map((variant) => ({
-        id: variant.id,
-        value: variant.title
-      }))
-    },
-    resolver: t(EditProductSchema)
-  });
-  const { mutateAsync, isPending } = useUpdateProduct(product.id);
-  const handleSubmit = form.handleSubmit(async (data) => {
-    const optionValues = data.denominations.map(
-      (denomination) => denomination.value
-    );
-    const options = [
-      {
-        title: "denomination",
-        values: optionValues
-      }
-    ];
-    await mutateAsync(
-      {
-        options,
-        variants: data.denominations.map((denomination) => ({
-          id: denomination.id,
-          title: denomination.value,
-          manage_inventory: false,
-          options: {
-            denomination: denomination.value
-          }
-        }))
-      },
-      {
-        onSuccess: () => {
-          ui.toast.success(`Denominations updated successfully`);
-          handleSuccess();
-        },
-        onError: (e2) => {
-          ui.toast.error(e2.message);
-        }
-      }
-    );
-  });
-  const {
-    fields: denominationsFields,
-    append: addDenomination,
-    remove: removeDenomination
-  } = useFieldArray({
-    name: "denominations",
-    control: form.control
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    KeyboundForm,
-    {
-      onSubmit: handleSubmit,
-      className: "flex flex-1 flex-col overflow-hidden",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-y-6", children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-2", children: [
-          denominationsFields.map((denominationField, index) => {
-            return /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
-                    Form$2.Field,
-                    {
-                      control: form.control,
-                      name: `denominations.${index}.value`,
-                      render: ({ field }) => {
-                        return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { className: "w-full", children: [
-                          /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field, placeholder: "100" }) }),
-                          /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
-                        ] });
-                      }
-                    },
-                    denominationField.id
-                  ),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center rounded-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
-                    ui.Button,
-                    {
-                      size: "small",
-                      variant: "secondary",
-                      type: "button",
-                      className: "rounded-full p-0 ml-4",
-                      onClick: () => {
-                        removeDenomination(index);
-                      },
-                      children: /* @__PURE__ */ jsxRuntime.jsx(icons.XCircleSolid, { className: "rounded-full" })
-                    }
-                  ) })
-                ]
-              },
-              denominationField.id
-            );
-          }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Button,
-            {
-              size: "small",
-              variant: "secondary",
-              type: "button",
-              className: "w-full",
-              onClick: () => {
-                addDenomination({ value: "", prices: {} });
-              },
-              children: "Add denomination"
-            }
-          ),
-          form.formState.errors.denominations && /* @__PURE__ */ jsxRuntime.jsx(ui.Alert, { variant: "error", children: "Please add at least one denomination." })
-        ] }) }) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
-        ] }) })
-      ]
-    }
-  ) });
-};
-const GiftCardProductEdit = () => {
-  const { id } = reactRouterDom.useParams();
-  const { product, isLoading, isError, error } = useProduct(id, {});
-  if (isError) {
-    throw error;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit gift cards denominations" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { className: "sr-only", children: "Edit the gift card denominations" })
-    ] }),
-    !isLoading && product && /* @__PURE__ */ jsxRuntime.jsx(GiftCardProductEditDenominationsForm, { product })
-  ] });
-};
 const EditProductMediaForm = ({ product }) => {
   const [selection, setSelection] = React.useState({});
   const { handleSuccess } = useRouteModal();
@@ -38668,22 +38668,22 @@ const routeModule = {
       ]
     },
     {
-      Component: StoreCreditAccountPage,
-      path: "/store-credit-accounts/:id",
+      Component: GiftCardProductsPage,
+      path: "/gift-cards/gift-card-products",
       children: [
         {
-          Component: Note,
-          path: "/store-credit-accounts/:id/credit"
+          Component: GiftCardProductCreate,
+          path: "/gift-cards/gift-card-products/create"
         }
       ]
     },
     {
-      Component: GiftCardProductsPage,
-      path: "/gift-cards/gift-card-products",
+      Component: StoreCreditAccountPage,
+      path: "/store-credit-accounts/:id",
       children: [
         {
-          Component: GiftCardProductCreate,
-          path: "/gift-cards/gift-card-products/create"
+          Component: Note,
+          path: "/store-credit-accounts/:id/credit"
         }
       ]
     },
@@ -38693,11 +38693,11 @@ const routeModule = {
       children: [
         {
           Component: GiftCardProductEdit$1,
-          path: "/gift-cards/gift-card-products/:id/edit"
+          path: "/gift-cards/gift-card-products/:id/denominations"
         },
         {
           Component: GiftCardProductEdit,
-          path: "/gift-cards/gift-card-products/:id/denominations"
+          path: "/gift-cards/gift-card-products/:id/edit"
         }
       ]
     },
@@ -38717,18 +38717,18 @@ const routeModule = {
 };
 const menuItemModule = {
   menuItems: [
-    {
-      label: config$1.label,
-      icon: config$1.icon,
-      path: "/store-credit-accounts",
-      nested: void 0
-    },
     {
       label: config$2.label,
       icon: config$2.icon,
       path: "/gift-cards",
       nested: void 0
     },
+    {
+      label: config$1.label,
+      icon: config$1.icon,
+      path: "/store-credit-accounts",
+      nested: void 0
+    },
     {
       label: config.label,
       icon: void 0,