fix(dashboard): Add Breadcrumb components (#10079)

**What**
- Adds Breadcrumb component to all routes that needs breadcrumbs.
- The Breadcrumb components use a combination of loader data and useQuery to ensure that the displayed value is kept up to date if the underlying data is changed via a mutation.
- Also fixes a couple of places where the breadcrumb was not setup correctly.

Resolves CMRC-688

packages/admin/dashboard/src/routes/api-key-management/api-key-management-detail/breadcrumb.tsx

@@ -0,0 +1,24 @@
+import { HttpTypes } from "@medusajs/types"
+import { UIMatch } from "react-router-dom"
+
+import { useApiKey } from "../../../hooks/api"
+
+type ApiKeyManagementDetailBreadcrumbProps =
+  UIMatch<HttpTypes.AdminApiKeyResponse>
+
+export const ApiKeyManagementDetailBreadcrumb = (
+  props: ApiKeyManagementDetailBreadcrumbProps
+) => {
+  const { id } = props.params || {}
+
+  const { api_key } = useApiKey(id!, {
+    initialData: props.data,
+    enabled: Boolean(id),
+  })
+
+  if (!api_key) {
+    return null
+  }
+
+  return <span>{api_key.title}</span>
+}

packages/admin/dashboard/src/routes/api-key-management/api-key-management-detail/index.ts

@@ -1,2 +1,3 @@
 export { ApiKeyManagementDetail as Component } from "./api-key-management-detail"
+export { ApiKeyManagementDetailBreadcrumb as Breadcrumb } from "./breadcrumb"
 export { apiKeyLoader as loader } from "./loader"

packages/admin/dashboard/src/routes/api-key-management/api-key-management-detail/loader.ts

@@ -1,6 +1,5 @@
 import { LoaderFunctionArgs } from "react-router-dom"
 
-import { HttpTypes } from "@medusajs/types"
 import { apiKeysQueryKeys } from "../../../hooks/api/api-keys"
 import { sdk } from "../../../lib/client"
 import { queryClient } from "../../../lib/query-client"
@@ -14,8 +13,5 @@ export const apiKeyLoader = async ({ params }: LoaderFunctionArgs) => {
   const id = params.id
   const query = apiKeyDetailQuery(id!)
 
-  return (
-    queryClient.getQueryData<HttpTypes.AdminApiKeyResponse>(query.queryKey) ??
-    (await queryClient.fetchQuery(query))
-  )
+  return queryClient.ensureQueryData(query)
 }