@medusajs/dashboard 2.12.3-snapshot-20251216185234 → 2.12.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@medusajs/dashboard",
-  "version": "2.12.3-snapshot-20251216185234",
+  "version": "2.12.3",
   "scripts": {
     "generate:static": "node ./scripts/generate-currencies.js && prettier --write ./src/lib/currencies.ts",
     "dev": "../../../node_modules/.bin/vite",
@@ -46,10 +46,10 @@
     "@dnd-kit/utilities": "^3.2.2",
     "@hookform/error-message": "^2.0.1",
     "@hookform/resolvers": "3.4.2",
-    "@medusajs/admin-shared": "2.12.3-snapshot-20251216185234",
-    "@medusajs/icons": "2.12.3-snapshot-20251216185234",
-    "@medusajs/js-sdk": "2.12.3-snapshot-20251216185234",
-    "@medusajs/ui": "4.0.31-snapshot-20251216185234",
+    "@medusajs/admin-shared": "2.12.3",
+    "@medusajs/icons": "2.12.3",
+    "@medusajs/js-sdk": "2.12.3",
+    "@medusajs/ui": "4.0.31",
     "@radix-ui/react-dialog": "1.1.4",
     "@radix-ui/react-dismissable-layer": "1.1.4",
     "@tanstack/react-query": "5.64.2",
@@ -80,10 +80,10 @@
     "zod": "3.25.76"
   },
   "devDependencies": {
-    "@medusajs/admin-shared": "2.12.3-snapshot-20251216185234",
-    "@medusajs/admin-vite-plugin": "2.12.3-snapshot-20251216185234",
-    "@medusajs/types": "2.12.3-snapshot-20251216185234",
-    "@medusajs/ui-preset": "2.12.3-snapshot-20251216185234"
+    "@medusajs/admin-shared": "2.12.3",
+    "@medusajs/admin-vite-plugin": "2.12.3",
+    "@medusajs/types": "2.12.3",
+    "@medusajs/ui-preset": "2.12.3"
   },
   "packageManager": "yarn@3.2.1"
 }

package/src/components/data-grid/hooks/use-data-grid-cell.tsx

@@ -128,6 +128,7 @@ export const useDataGridCell = <TData, TValue>({
         case "number":
           return numberCharacterRegex.test(key)
         case "text":
+        case "multiline-text":
           return textCharacterRegex.test(key)
         default:
           // KeyboardEvents should not be forwareded to other types of cells

package/src/components/data-grid/hooks/use-data-grid-form-handlers.tsx

@@ -228,6 +228,7 @@ export function convertArrayToPrimitive(
     case "boolean":
       return values.map(convertToBoolean)
     case "text":
+    case "multiline-text":
       return values.map(covertToString)
     default:
       throw new Error(`Unsupported target type "${type}".`)

package/src/components/data-grid/hooks/use-data-grid-keydown-event.tsx

@@ -211,7 +211,22 @@ export const useDataGridKeydownEvent = <
     [rangeEnd, matrix, getSelectionValues, setSelectionValues, execute]
   )
 
-  const handleSpaceKeyTextOrNumber = useCallback(
+  const handleSpaceKeyText = useCallback(
+    (anchor: DataGridCoordinates) => {
+      const field = matrix.getCellField(anchor)
+      const input = queryTool?.getInput(anchor)
+
+      if (!field || !input) {
+        return
+      }
+
+      createSnapshot(anchor)
+      input.focus()
+    },
+    [matrix, queryTool, createSnapshot]
+  )
+
+  const handleSpaceKeyNumber = useCallback(
     (anchor: DataGridCoordinates) => {
       const field = matrix.getCellField(anchor)
       const input = queryTool?.getInput(anchor)
@@ -303,10 +318,12 @@ export const useDataGridKeydownEvent = <
         case "togglable-number":
           handleSpaceKeyTogglableNumber(anchor)
           break
-        case "number":
         case "text":
         case "multiline-text":
-          handleSpaceKeyTextOrNumber(anchor)
+          handleSpaceKeyText(anchor)
+          break
+        case "number":
+          handleSpaceKeyNumber(anchor)
           break
       }
     },
@@ -315,7 +332,8 @@ export const useDataGridKeydownEvent = <
       isEditing,
       matrix,
       handleSpaceKeyBoolean,
-      handleSpaceKeyTextOrNumber,
+      handleSpaceKeyText,
+      handleSpaceKeyNumber,
       handleSpaceKeyTogglableNumber,
     ]
   )

package/src/dashboard-app/routes/get-route.map.tsx

@@ -1857,6 +1857,10 @@ export function getRouteMap({
                   lazy: () =>
                     import("../../routes/translations/translations-edit"),
                 },
+                {
+                  path: "add-locales",
+                  lazy: () => import("../../routes/translations/add-locales"),
+                },
               ],
             },
             ...(settingsRoutes?.[0]?.children || []),

package/src/hooks/api/translations.tsx

@@ -229,6 +229,15 @@ export const useTranslations = (
   return { ...data, ...rest }
 }
 
+const referenceInvalidationKeysMap = new Map<string, QueryKey>([
+  ["product", productsQueryKeys.lists()],
+  ["product_variant", productVariantQueryKeys.lists()],
+  ["product_category", categoriesQueryKeys.lists()],
+  ["product_collection", collectionsQueryKeys.lists()],
+  ["product_type", productTypesQueryKeys.lists()],
+  ["product_tag", productTagsQueryKeys.lists()],
+])
+
 export const useBatchTranslations = (
   reference: string,
   options?: UseMutationOptions<
@@ -237,30 +246,30 @@ export const useBatchTranslations = (
     HttpTypes.AdminBatchTranslations
   >
 ) => {
-  const referenceInvalidationKeysMap = new Map<string, QueryKey>([
-    ["product", productsQueryKeys.lists()],
-    ["product_variant", productVariantQueryKeys.lists()],
-    ["product_category", categoriesQueryKeys.lists()],
-    ["product_collection", collectionsQueryKeys.lists()],
-    ["product_type", productTypesQueryKeys.lists()],
-    ["product_tag", productTagsQueryKeys.lists()],
-  ])
-
-  return useMutation({
+  const mutation = useMutation({
     mutationFn: (payload: HttpTypes.AdminBatchTranslations) =>
       sdk.admin.translation.batch(payload),
-    onSuccess: (data, variables, context) => {
+    ...options,
+  })
+
+  /**
+   * Useful to call the invalidation separately from the batch request and await the refetch finishes.
+   */
+  const invalidateQueries = async () => {
+    await Promise.all([
       queryClient.invalidateQueries({
         queryKey: referenceInvalidationKeysMap.get(reference),
-      })
+      }),
       queryClient.invalidateQueries({
         queryKey: translationStatisticsQueryKeys.lists(),
-      })
+      }),
+    ])
+  }
 
-      options?.onSuccess?.(data, variables, context)
-    },
-    ...options,
-  })
+  return {
+    ...mutation,
+    invalidateQueries,
+  }
 }
 
 export const useTranslationSettings = (

package/src/i18n/translations/en.json

@@ -2514,7 +2514,6 @@
       "manage": "Manage translations",
       "manageLocales": "Manage locales"
     },
-    "title": "Translation domains",
     "subtitle": "Manage translations of your data in Medusa",
     "list": {
       "metrics": "{{translated}} of {{total}} fields translated"
@@ -2538,7 +2537,7 @@
     "completion": {
       "heading": "Translated fields",
       "translated": "Translated",
-      "toTranslate": "To be translated",
+      "toTranslate": "Missing",
       "footer": "Languages"
     }
   },

package/src/i18n/translations/es.json

@@ -2477,7 +2477,7 @@
     "completion": {
       "heading": "Textos traducidos",
       "translated": "Traducidos",
-      "toTranslate": "Por traducir",
+      "toTranslate": "Faltantes",
       "footer": "Idiomas"
     }
   },

package/src/routes/translations/add-locales/add-locales.tsx

@@ -0,0 +1,29 @@
+import { RouteFocusModal } from "../../../components/modals/route-focus-modal"
+import { useStore } from "../../../hooks/api"
+import { useFeatureFlag } from "../../../providers/feature-flag-provider"
+import { useNavigate } from "react-router-dom"
+import { AddLocalesForm } from "../../store/store-add-locales/components/add-locales-form/add-locales-form"
+
+export const TranslationsAddLocales = () => {
+  const isEnabled = useFeatureFlag("translation")
+  const navigate = useNavigate()
+
+  if (!isEnabled) {
+    navigate(-1)
+    return null
+  }
+
+  const { store, isPending, isError, error } = useStore()
+
+  const ready = !!store && !isPending
+
+  if (isError) {
+    throw error
+  }
+
+  return (
+    <RouteFocusModal>
+      {ready && <AddLocalesForm store={store} />}
+    </RouteFocusModal>
+  )
+}

package/src/routes/translations/add-locales/index.tsx

@@ -0,0 +1 @@
+export { TranslationsAddLocales as Component } from "./add-locales"

package/src/routes/translations/translation-list/components/active-locales-section/active-locales-section.tsx

@@ -1,9 +1,16 @@
 import { PencilSquare, Language } from "@medusajs/icons"
-import { Container, Heading, IconButton, InlineTip, Text } from "@medusajs/ui"
+import {
+  Container,
+  Heading,
+  IconButton,
+  InlineTip,
+  Text,
+  Tooltip,
+} from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 import { IconAvatar } from "../../../../../components/common/icon-avatar"
 import { HttpTypes } from "@medusajs/types"
-import { useCallback } from "react"
+import { useCallback, useState } from "react"
 import { useNavigate } from "react-router-dom"
 
 type ActiveLocalesSectionProps = {
@@ -15,9 +22,10 @@ export const ActiveLocalesSection = ({
 }: ActiveLocalesSectionProps) => {
   const { t } = useTranslation()
   const navigate = useNavigate()
+  const [isHovered, setIsHovered] = useState(false)
 
   const handleManageLocales = useCallback(() => {
-    navigate("/settings/store/locales")
+    navigate("/settings/translations/add-locales")
   }, [navigate])
 
   const renderLocales = useCallback(() => {
@@ -37,26 +45,43 @@ export const ActiveLocalesSection = ({
   return (
     <Container className="flex flex-col p-0">
       <div className="flex items-center justify-between px-6 py-4">
-        <Heading>{t("translations.activeLocales.heading")}</Heading>
+        <Heading level="h2">{t("translations.activeLocales.heading")}</Heading>
         <IconButton variant="transparent" onClick={handleManageLocales}>
           <PencilSquare></PencilSquare>
         </IconButton>
       </div>
       <div className="px-1 pb-1">
         {hasLocales ? (
-          <Container className="bg-ui-bg-component flex items-center gap-x-4 px-6 py-2">
-            <IconAvatar>
-              <Language />
-            </IconAvatar>
-            <div className="flex flex-col">
-              <Text size="small" weight="plus">
-                {t("translations.activeLocales.subtitle")}
-              </Text>
-              <Text className="text-ui-fg-subtle" size="small">
-                {renderLocales()}
-              </Text>
-            </div>
-          </Container>
+          <Tooltip
+            open={isHovered}
+            content={
+              <div className="flex flex-col gap-y-1 p-1">
+                {locales.map((locale) => (
+                  <Text key={locale.code} size="small" weight="plus">
+                    {locale.name}
+                  </Text>
+                ))}
+              </div>
+            }
+          >
+            <Container
+              className="bg-ui-bg-component border-r-1 flex items-center gap-x-4 px-[19px] py-2"
+              onMouseEnter={() => setIsHovered(true)}
+              onMouseLeave={() => setIsHovered(false)}
+            >
+              <IconAvatar className="border-ui-border-base border">
+                <Language />
+              </IconAvatar>
+              <div className="flex flex-col">
+                <Text size="small" weight="plus">
+                  {t("translations.activeLocales.subtitle")}
+                </Text>
+                <Text className="text-ui-fg-subtle" size="small">
+                  {renderLocales()}
+                </Text>
+              </div>
+            </Container>
+          </Tooltip>
         ) : (
           <InlineTip label="Tip">
             {t("translations.activeLocales.noLocalesTip")}

package/src/routes/translations/translation-list/components/translation-list-section/translation-list-section.tsx

@@ -33,7 +33,11 @@ export const TranslationListSection = ({
           <Link
             to={`/settings/translations/edit?reference=${entity.reference}`}
           >
-            <Button variant="secondary" size="small" disabled={!hasLocales}>
+            <Button
+              variant="secondary"
+              size="small"
+              disabled={!hasLocales || !entity.totalCount}
+            >
               Edit
             </Button>
           </Link>