feat(admin-next) discounts list page (#6490)

2024-02-27 12:33:19 +01:00
parent a223566d96
commit 608c10383a
23 changed files with 683 additions and 10 deletions
@@ -0,0 +1,65 @@
+import { useMemo } from "react"
+import { ColumnDef, createColumnHelper } from "@tanstack/react-table"
+
+import type { Discount } from "@medusajs/medusa"
+
+import {
+  CodeCell,
+  CodeHeader,
+} from "../../../components/table/table-cells/discount/code-cell"
+import {
+  DescriptionHeader,
+  DescriptionCell,
+} from "../../../components/table/table-cells/discount/description-cell"
+import {
+  ValueCell,
+  ValueHeader,
+} from "../../../components/table/table-cells/discount/value-cell"
+import {
+  RedemptionCell,
+  RedemptionHeader,
+} from "../../../components/table/table-cells/discount/redemption-cell"
+import {
+  StatusHeader,
+  StatusCell,
+} from "../../../components/table/table-cells/discount/status-cell"
+
+const columnHelper = createColumnHelper<Discount>()
+
+export const useDiscountTableColumns = () => {
+  return useMemo(
+    () => [
+      columnHelper.display({
+        id: "discount",
+        header: () => <CodeHeader />,
+        cell: ({ row }) => <CodeCell discount={row.original} />,
+      }),
+      columnHelper.accessor("rule.description", {
+        header: () => <DescriptionHeader />,
+        cell: ({ row }) => <DescriptionCell discount={row.original} />,
+      }),
+
+      columnHelper.accessor("rule.value", {
+        header: () => <ValueHeader />,
+        cell: ({ row }) => (
+          <ValueCell
+            rule={row.original.rule}
+            currencyCode={row.original.regions[0]?.currency_code}
+          />
+        ),
+      }),
+      columnHelper.display({
+        id: "status",
+        header: () => <StatusHeader />,
+        cell: ({ row }) => <StatusCell discount={row.original} />,
+      }),
+      columnHelper.accessor("usage_count", {
+        header: () => <RedemptionHeader />,
+        cell: ({ row }) => (
+          <RedemptionCell redemptions={row.original.usage_count} />
+        ),
+      }),
+    ],
+    []
+  ) as ColumnDef<Discount>[]
+}
@@ -0,0 +1,51 @@
+import { useTranslation } from "react-i18next"
+import { Filter } from "../../../components/table/data-table"
+
+export const useDiscountTableFilters = () => {
+  const { t } = useTranslation()
+
+  let filters: Filter[] = [
+    { label: t("fields.createdAt"), key: "created_at" },
+    { label: t("fields.updatedAt"), key: "updated_at" },
+  ].map((f) => ({
+    key: f.key,
+    label: f.label,
+    type: "date",
+  }))
+
+  const isDisabledFilter: Filter = {
+    key: "is_disabled",
+    label: t("fields.disabled"),
+    type: "select",
+    options: [
+      {
+        label: t("fields.true"),
+        value: "true",
+      },
+      {
+        label: t("fields.false"),
+        value: "false",
+      },
+    ],
+  }
+
+  const isDynamicFilter: Filter = {
+    key: "is_dynamic",
+    label: t("fields.type"),
+    type: "select",
+    options: [
+      {
+        label: t("fields.dynamic"),
+        value: "true",
+      },
+      {
+        label: t("fields.normal"),
+        value: "false",
+      },
+    ],
+  }
+
+  filters = [...filters, isDisabledFilter, isDynamicFilter]
+
+  return filters
+}
@@ -0,0 +1,45 @@
+import { AdminGetDiscountsParams } from "@medusajs/medusa"
+
+import { useQueryParams } from "../../use-query-params"
+
+type UseDiscountTableQueryProps = {
+  prefix?: string
+  pageSize?: number
+}
+
+export const useDiscountTableQuery = ({
+  prefix,
+  pageSize = 20,
+}: UseDiscountTableQueryProps) => {
+  const queryObject = useQueryParams(
+    [
+      "offset",
+      "order",
+      "q",
+      "is_dynamic",
+      "is_disabled",
+      "created_at",
+      "updated_at",
+    ],
+    prefix
+  )
+
+  const { offset, order, q, is_dynamic, is_disabled, created_at, updated_at } =
+    queryObject
+
+  const searchParams: AdminGetDiscountsParams = {
+    limit: pageSize,
+    is_disabled: is_disabled ? is_disabled === "true" : undefined,
+    is_dynamic: is_dynamic ? is_dynamic === "true" : undefined,
+    created_at: created_at ? JSON.parse(created_at) : undefined,
+    updated_at: updated_at ? JSON.parse(updated_at) : undefined,
+    offset: offset ? Number(offset) : 0,
+    order,
+    q,
+  }
+
+  return {
+    searchParams,
+    raw: queryObject,
+  }
+}