@medusajs/dashboard 2.12.3-preview-20251217120154 → 2.12.3-preview-20251217123836

package/src/hooks/use-infinite-list.tsx

@@ -0,0 +1,92 @@
+import { FetchError } from "@medusajs/js-sdk"
+import { PaginatedResponse } from "@medusajs/types"
+import {
+  QueryKey,
+  UseInfiniteQueryOptions,
+  InfiniteData,
+  useInfiniteQuery,
+} from "@tanstack/react-query"
+
+/**
+ * Generic hook for infinite queries with pagination support.
+ *
+ * @template TResponse - The response type that must include count, offset, and limit
+ * @template TParams - The query parameters type (offset and limit will be handled internally)
+ * @template TError - The error type (defaults to FetchError)
+ * @template TQueryKey - The query key type (defaults to QueryKey)
+ *
+ * @param config - Configuration object
+ * @param config.queryKey - Function or array that generates the query key
+ * @param config.queryFn - Function that fetches data with offset and limit
+ * @param config.query - Query parameters (offset is ignored, limit is optional)
+ * @param config.options - Additional options for useInfiniteQuery
+ *
+ * @example
+ * ```ts
+ * const { data, fetchNextPage, hasNextPage } = useInfiniteList({
+ *   queryKey: (params) => productVariantQueryKeys.list(params),
+ *   queryFn: async (params) => sdk.admin.productVariant.list(params),
+ *   query: { status: "published" },
+ * })
+ * ```
+ */
+export const useInfiniteList = <
+  TResponse extends PaginatedResponse<unknown>,
+  TParams extends { offset?: number; limit?: number } = {
+    offset?: number
+    limit?: number
+  },
+  TError = FetchError,
+  TQueryKey extends QueryKey = QueryKey
+>({
+  queryKey,
+  queryFn,
+  query,
+  options,
+}: {
+  queryKey: ((params: Omit<TParams, "limit">) => TQueryKey) | TQueryKey
+  queryFn: (params: TParams) => Promise<TResponse>
+  query?: TParams
+  options?: Omit<
+    UseInfiniteQueryOptions<
+      TResponse,
+      TError,
+      InfiniteData<TResponse, number>,
+      TResponse,
+      TQueryKey,
+      number
+    >,
+    "queryKey" | "queryFn" | "initialPageParam" | "getNextPageParam"
+  >
+}) => {
+  const { limit = 50, offset: _, ..._query } = query ?? {}
+  const resolvedQueryKey =
+    typeof queryKey === "function"
+      ? queryKey(_query as Omit<TParams, "limit">)
+      : queryKey
+  const infiniteQueryKey =
+    resolvedQueryKey[resolvedQueryKey.length - 1] === "__infinite"
+      ? resolvedQueryKey
+      : ([...resolvedQueryKey, "__infinite"] as unknown as TQueryKey)
+
+  return useInfiniteQuery<
+    TResponse,
+    TError,
+    InfiniteData<TResponse, number>,
+    TQueryKey,
+    number
+  >({
+    // Infinite queries must not share the exact same queryKey as non-infinite queries,
+    // since the cached data shape differs (InfiniteData<T> vs T).
+    queryKey: infiniteQueryKey,
+    queryFn: ({ pageParam = 0 }) => {
+      return queryFn({ ..._query, limit, offset: pageParam } as TParams)
+    },
+    initialPageParam: 0,
+    getNextPageParam: (lastPage) => {
+      const moreItemsExist = lastPage.count > lastPage.offset + lastPage.limit
+      return moreItemsExist ? lastPage.offset + lastPage.limit : undefined
+    },
+    ...options,
+  })
+}

package/src/i18n/translations/$schema.json

@@ -38,6 +38,9 @@
         "search": {
           "type": "string"
         },
+        "original": {
+          "type": "string"
+        },
         "of": {
           "type": "string"
         },
@@ -104,6 +107,9 @@
         "removed": {
           "type": "string"
         },
+        "remaining": {
+          "type": "string"
+        },
         "admin": {
           "type": "string"
         },
@@ -191,6 +197,7 @@
         "apply",
         "range",
         "search",
+        "original",
         "of",
         "results",
         "pages",
@@ -213,6 +220,7 @@
         "modified",
         "added",
         "removed",
+        "remaining",
         "admin",
         "store",
         "details",
@@ -381,6 +389,12 @@
         "save": {
           "type": "string"
         },
+        "saveChanges": {
+          "type": "string"
+        },
+        "saveAndClose": {
+          "type": "string"
+        },
         "saveAsDraft": {
           "type": "string"
         },
@@ -513,7 +527,9 @@
       },
       "required": [
         "save",
+        "saveChanges",
         "saveAsDraft",
+        "saveAndClose",
         "copy",
         "copied",
         "duplicate",
@@ -9328,6 +9344,112 @@
       ],
       "additionalProperties": false
     },
+    "translations": {
+      "type": "object",
+      "properties": {
+        "domain": {
+          "type": "string"
+        },
+        "subtitle": {
+          "type": "string"
+        },
+        "list": {
+          "type": "object",
+          "properties": {
+            "metrics": {
+              "type": "string"
+            }
+          },
+          "required": ["metrics"]
+        },
+        "actions": {
+          "type": "object",
+          "properties": {
+            "manageLocales": {
+              "type": "string"
+            },
+            "manage": {
+              "type": "string"
+            }
+          },
+          "required": ["manageLocales", "manage"]
+        },
+        "edit": {
+          "type": "object",
+          "properties": {
+            "successToast": {
+              "type": "string"
+            },
+            "unsavedChanges": {
+              "type": "object",
+              "properties": {
+                "title": {
+                  "type": "string"
+                },
+                "description": {
+                  "type": "string"
+                }
+              },
+              "required": ["title", "description"]
+            }
+          },
+          "required": ["successToast", "unsavedChanges"]
+        },
+        "bulk": {
+          "type": "object",
+          "properties": {
+            "header": {
+              "type": "string"
+            },
+            "mainColumn": {
+              "type": "string"
+            }
+          },
+          "required": ["header"]
+        },
+        "activeLocales": {
+          "type": "object",
+          "properties": {
+            "heading": {
+              "type": "string"
+            },
+            "subtitle": {
+              "type": "string"
+            },
+            "noLocalesTip": {
+              "type": "string"
+            }
+          },
+          "required": ["heading", "subtitle", "noLocalesTip"]
+        },
+        "completion": {
+          "type": "object",
+          "properties": {
+            "heading": {
+              "type": "string"
+            },
+            "translated": {
+              "type": "string"
+            },
+            "toTranslate": {
+              "type": "string"
+            },
+            "footer": {
+              "type": "string"
+            }
+          },
+          "required": ["heading", "translated", "toTranslate", "footer"]
+        }
+      },
+      "required": [
+        "domain",
+        "actions",
+        "subtitle",
+        "bulk",
+        "completion",
+        "edit"
+      ]
+    },
     "store": {
       "type": "object",
       "properties": {

package/src/i18n/translations/en.json

@@ -11,6 +11,7 @@
     "apply": "Apply",
     "range": "Range",
     "search": "Search",
+    "original": "Original",
     "of": "of",
     "results": "results",
     "pages": "pages",
@@ -33,6 +34,7 @@
     "modified": "Modified",
     "added": "Added",
     "removed": "Removed",
+    "remaining": "Left",
     "admin": "Admin",
     "store": "Store",
     "details": "Details",
@@ -99,7 +101,9 @@
   },
   "actions": {
     "save": "Save",
+    "saveChanges": "Save changes",
     "saveAsDraft": "Save as draft",
+    "saveAndClose": "Save and close",
     "copy": "Copy",
     "copied": "Copied",
     "duplicate": "Duplicate",
@@ -2504,6 +2508,40 @@
     "deleteUserSuccess": "User {{name}} deleted successfully",
     "invite": "Invite"
   },
+  "translations": {
+    "domain": "Translations",
+    "actions": {
+      "manage": "Manage translations",
+      "manageLocales": "Manage locales"
+    },
+    "title": "Translation domains",
+    "subtitle": "Manage translations of your data in Medusa",
+    "list": {
+      "metrics": "{{translated}} of {{total}} fields translated"
+    },
+    "edit": {
+      "successToast": "Translations updated successfully",
+      "unsavedChanges": {
+        "title": "Unsaved translations",
+        "description": "Don't lose your work. You have changes that haven't been saved yet"
+      }
+    },
+    "bulk": {
+      "header": "Translations Bulk Editor",
+      "mainColumn": "Locale"
+    },
+    "activeLocales": {
+      "heading": "Languages",
+      "subtitle": "Activated translations",
+      "noLocalesTip": "Configure at least one locale to start translating your data"
+    },
+    "completion": {
+      "heading": "Translated fields",
+      "translated": "Translated",
+      "toTranslate": "Missing",
+      "footer": "Languages"
+    }
+  },
   "store": {
     "domain": "Store",
     "manageYourStoresDetails": "Manage your store's details",

package/src/i18n/translations/es.json

@@ -11,6 +11,7 @@
     "apply": "Aplicar",
     "range": "Rango",
     "search": "Buscar",
+    "original": "Original",
     "of": "de",
     "results": "resultados",
     "pages": "páginas",
@@ -33,6 +34,7 @@
     "modified": "Modificado",
     "added": "Agregado",
     "removed": "Eliminado",
+    "remaining": "Restantes",
     "admin": "Administrador",
     "store": "Tienda",
     "details": "Detalles",
@@ -120,7 +122,9 @@
   },
   "actions": {
     "save": "Guardar",
+    "saveChanges": "Guardar cambios",
     "saveAsDraft": "Guardar como borrador",
+    "saveAndClose": "Guardar y cerrar",
     "copy": "Copiar",
     "copied": "Copiado",
     "duplicate": "Duplicar",
@@ -2443,6 +2447,40 @@
     "deleteUserSuccess": "Usuario {{name}} eliminado correctamente",
     "invite": "Invitar"
   },
+  "translations": {
+    "domain": "Traducciones",
+    "list": {
+      "metrics": "{{translated}} de {{total}} textos traducidos"
+    },
+    "actions": {
+      "manage": "Gestionar traducciones",
+      "manageLocales": "Gestionar idiomas"
+    },
+    "title": "Traducción de dominios",
+    "subtitle": "Gestiona las traducciones de tus datos en Medusa",
+    "bulk": {
+      "header": "Editor de Traducciones en Masa",
+      "locale": "Idioma"
+    },
+    "edit": {
+      "successToast": "Traducciones actualizadas exitosamente",
+      "unsavedChanges": {
+        "title": "Traducciones sin guardar",
+        "description": "No pierdas tu trabajo. Tienes cambios que no han sido guardados aún"
+      }
+    },
+    "activeLocales": {
+      "heading": "Idiomas",
+      "subtitle": "Traducciones activas",
+      "noLocalesTip": "Configura al menos un idioma para empezar a traducir tu información"
+    },
+    "completion": {
+      "heading": "Textos traducidos",
+      "translated": "Traducidos",
+      "toTranslate": "Faltantes",
+      "footer": "Idiomas"
+    }
+  },
   "store": {
     "domain": "Tienda",
     "manageYourStoresDetails": "Gestiona los detalles de tu tienda",

package/src/routes/categories/category-detail/components/category-general-section/category-general-section.tsx

@@ -1,10 +1,11 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
 import { Container, Heading, StatusBadge, Text } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { useDeleteProductCategoryAction } from "../../../common/hooks/use-delete-product-category-action"
 import { getIsActiveProps, getIsInternalProps } from "../../../common/utils"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 type CategoryGeneralSectionProps = {
   category: HttpTypes.AdminProductCategory
@@ -14,6 +15,7 @@ export const CategoryGeneralSection = ({
   category,
 }: CategoryGeneralSectionProps) => {
   const { t } = useTranslation()
+  const isTranslationsEnabled = useFeatureFlag("translation")
 
   const activeProps = getIsActiveProps(category.is_active, t)
   const internalProps = getIsInternalProps(category.is_internal, t)
@@ -44,6 +46,19 @@ export const CategoryGeneralSection = ({
                   },
                 ],
               },
+              ...(isTranslationsEnabled
+                ? [
+                    {
+                      actions: [
+                        {
+                          label: t("translations.actions.manage"),
+                          to: `/settings/translations/edit?reference=product_category&reference_id=${category.id}`,
+                          icon: <GlobeEurope />,
+                        },
+                      ],
+                    },
+                  ]
+                : []),
               {
                 actions: [
                   {

package/src/routes/categories/category-list/components/category-list-table/category-list-table.tsx

@@ -1,4 +1,4 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { AdminProductCategoryResponse } from "@medusajs/types"
 import { Button, Container, Heading, Text } from "@medusajs/ui"
 import { keepPreviousData } from "@tanstack/react-query"
@@ -14,6 +14,7 @@ import { useDataTable } from "../../../../../hooks/use-data-table"
 import { useDeleteProductCategoryAction } from "../../../common/hooks/use-delete-product-category-action"
 import { useCategoryTableColumns } from "./use-category-table-columns"
 import { useCategoryTableQuery } from "./use-category-table-query"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 const PAGE_SIZE = 20
 
@@ -105,6 +106,7 @@ const CategoryRowActions = ({
   category: AdminProductCategoryResponse["product_category"]
 }) => {
   const { t } = useTranslation()
+  const isTranslationsEnabled = useFeatureFlag("translation")
   const handleDelete = useDeleteProductCategoryAction(category)
 
   return (
@@ -119,6 +121,19 @@ const CategoryRowActions = ({
             },
           ],
         },
+        ...(isTranslationsEnabled
+          ? [
+              {
+                actions: [
+                  {
+                    icon: <GlobeEurope />,
+                    label: t("translations.actions.manage"),
+                    to: `/settings/translations/edit?reference=product_category&reference_id=${category.id}`,
+                  },
+                ],
+              },
+            ]
+          : []),
         {
           actions: [
             {

package/src/routes/collections/collection-detail/components/collection-general-section/collection-general-section.tsx

@@ -1,10 +1,11 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
 import { Container, Heading, Text, usePrompt } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { useDeleteCollection } from "../../../../../hooks/api/collections"
 import { useNavigate } from "react-router-dom"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 type CollectionGeneralSectionProps = {
   collection: HttpTypes.AdminCollection
@@ -16,6 +17,7 @@ export const CollectionGeneralSection = ({
   const { t } = useTranslation()
   const prompt = usePrompt()
   const navigate = useNavigate()
+  const isTranslationsEnabled = useFeatureFlag("translation")
 
   const { mutateAsync } = useDeleteCollection(collection.id!)
 
@@ -52,6 +54,19 @@ export const CollectionGeneralSection = ({
                 },
               ],
             },
+            ...(isTranslationsEnabled
+              ? [
+                  {
+                    actions: [
+                      {
+                        label: t("translations.actions.manage"),
+                        to: `/settings/translations/edit?reference=product_collection&reference_id=${collection.id}`,
+                        icon: <GlobeEurope />,
+                      },
+                    ],
+                  },
+                ]
+              : []),
             {
               actions: [
                 {

package/src/routes/collections/collection-list/components/collection-list-table/collection-row-actions.tsx

@@ -1,10 +1,11 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
 import { usePrompt } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { useDeleteCollection } from "../../../../../hooks/api/collections"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 export const CollectionRowActions = ({
   collection,
@@ -13,6 +14,7 @@ export const CollectionRowActions = ({
 }) => {
   const { t } = useTranslation()
   const prompt = usePrompt()
+  const isTranslationsEnabled = useFeatureFlag("translation")
 
   const { mutateAsync } = useDeleteCollection(collection.id!)
 
@@ -47,6 +49,19 @@ export const CollectionRowActions = ({
             },
           ],
         },
+        ...(isTranslationsEnabled
+          ? [
+              {
+                actions: [
+                  {
+                    icon: <GlobeEurope />,
+                    label: t("translations.actions.manage"),
+                    to: `/settings/translations/edit?reference=product_collection&reference_id=${collection.id}`,
+                  },
+                ],
+              },
+            ]
+          : []),
         {
           actions: [
             {

package/src/routes/product-tags/product-tag-detail/components/product-tag-general-section/product-tag-general-section.tsx

@@ -1,9 +1,10 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
 import { Container, Heading } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { useDeleteProductTagAction } from "../../../common/hooks/use-delete-product-tag-action"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 type ProductTagGeneralSectionProps = {
   productTag: HttpTypes.AdminProductTag
@@ -14,6 +15,7 @@ export const ProductTagGeneralSection = ({
 }: ProductTagGeneralSectionProps) => {
   const { t } = useTranslation()
   const handleDelete = useDeleteProductTagAction({ productTag })
+  const isTranslationsEnabled = useFeatureFlag("translation")
 
   return (
     <Container className="flex items-center justify-between">
@@ -32,6 +34,19 @@ export const ProductTagGeneralSection = ({
               },
             ],
           },
+          ...(isTranslationsEnabled
+            ? [
+                {
+                  actions: [
+                    {
+                      label: t("translations.actions.manage"),
+                      to: `/settings/translations/edit?reference=product_tag&reference_id=${productTag.id}`,
+                      icon: <GlobeEurope />,
+                    },
+                  ],
+                },
+              ]
+            : []),
           {
             actions: [
               {

package/src/routes/product-tags/product-tag-list/components/product-tag-list-table/product-tag-list-table.tsx

@@ -1,4 +1,4 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
 import { Button, Container, Heading } from "@medusajs/ui"
 import { keepPreviousData } from "@tanstack/react-query"
@@ -16,6 +16,7 @@ import { useProductTagTableQuery } from "../../../../../hooks/table/query"
 import { useDataTable } from "../../../../../hooks/use-data-table"
 import { useDeleteProductTagAction } from "../../../common/hooks/use-delete-product-tag-action"
 import { productTagListLoader } from "../../loader"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 const PAGE_SIZE = 20
 
@@ -88,6 +89,7 @@ const ProductTagRowActions = ({
 }) => {
   const { t } = useTranslation()
   const handleDelete = useDeleteProductTagAction({ productTag })
+  const isTranslationsEnabled = useFeatureFlag("translation")
 
   return (
     <ActionMenu
@@ -101,6 +103,19 @@ const ProductTagRowActions = ({
             },
           ],
         },
+        ...(isTranslationsEnabled
+          ? [
+              {
+                actions: [
+                  {
+                    icon: <GlobeEurope />,
+                    label: t("translations.actions.manage"),
+                    to: `/settings/translations/edit?reference=product_tag&reference_id=${productTag.id}`,
+                  },
+                ],
+              },
+            ]
+          : []),
         {
           actions: [
             {

package/src/routes/product-types/product-type-detail/components/product-type-general-section/product-type-general-section.tsx

@@ -1,9 +1,10 @@
-import { PencilSquare, Trash } from "@medusajs/icons"
+import { GlobeEurope, PencilSquare, Trash } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
 import { Container, Heading } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { useDeleteProductTypeAction } from "../../../common/hooks/use-delete-product-type-action"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 type ProductTypeGeneralSectionProps = {
   productType: HttpTypes.AdminProductType
@@ -17,6 +18,7 @@ export const ProductTypeGeneralSection = ({
     productType.id,
     productType.value
   )
+  const isTranslationsEnabled = useFeatureFlag("translation")
 
   return (
     <Container className="flex items-center justify-between">
@@ -32,6 +34,19 @@ export const ProductTypeGeneralSection = ({
               },
             ],
           },
+          ...(isTranslationsEnabled
+            ? [
+                {
+                  actions: [
+                    {
+                      label: t("translations.actions.manage"),
+                      to: `/settings/translations/edit?reference=product_type&reference_id=${productType.id}`,
+                      icon: <GlobeEurope />,
+                    },
+                  ],
+                },
+              ]
+            : []),
           {
             actions: [
               {