From 7fd686eda634d9d7ab813dc772963f29784b51c6 Mon Sep 17 00:00:00 2001
From: xiamiao1121 <74885998+xiamiao1121@users.noreply.github.com>
Date: Fri, 28 Jun 2024 15:36:07 +0800
Subject: [PATCH] =?UTF-8?q?feat(breadcrumb):=20=E6=94=AF=E6=8C=81=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE=E5=AD=97=E6=AE=B5=E5=88=AB=E5=90=8D(#2885)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat(search): 支持配置字段别名(#2885)

* chore: 生成变更记录文件

* feat(breadcrumb): 修改fieldNames类型

* feat(breadcrumb): 代码规范

---------

Co-authored-by: xiamiao <xiamiao@xiaomi.com>
---
 .changeset/four-pets-sparkle.md           |  5 ++++
 .changeset/soft-spies-march.md            |  5 ++++
 packages/ui/breadcrumb/src/Breadcrumb.tsx | 23 +++++++++++----
 packages/ui/breadcrumb/src/util.ts        | 34 +++++++++++++++++++++++
 4 files changed, 61 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/four-pets-sparkle.md
 create mode 100644 .changeset/soft-spies-march.md
 create mode 100644 packages/ui/breadcrumb/src/util.ts

diff --git a/.changeset/four-pets-sparkle.md b/.changeset/four-pets-sparkle.md
new file mode 100644
index 000000000..e0e473375
--- /dev/null
+++ b/.changeset/four-pets-sparkle.md
@@ -0,0 +1,5 @@
+---
+"@hi-ui/hiui": patch
+---
+
+feat(search): 支持配置字段别名
diff --git a/.changeset/soft-spies-march.md b/.changeset/soft-spies-march.md
new file mode 100644
index 000000000..f75d8ba02
--- /dev/null
+++ b/.changeset/soft-spies-march.md
@@ -0,0 +1,5 @@
+---
+"@hi-ui/breadcrumb": minor
+---
+
+feat: 支持配置字段别名
diff --git a/packages/ui/breadcrumb/src/Breadcrumb.tsx b/packages/ui/breadcrumb/src/Breadcrumb.tsx
index d12f18f2c..e19c8f34e 100644
--- a/packages/ui/breadcrumb/src/Breadcrumb.tsx
+++ b/packages/ui/breadcrumb/src/Breadcrumb.tsx
@@ -1,8 +1,9 @@
-import React, { forwardRef } from 'react'
+import React, { forwardRef, useMemo } from 'react'
 import { cx, getPrefixCls } from '@hi-ui/classname'
 import { __DEV__ } from '@hi-ui/env'
 import { BreadcrumbDataItem, BreadcrumbSizeEnum } from './types'
-import { HiBaseHTMLProps } from '@hi-ui/core'
+import { HiBaseFieldNames, HiBaseHTMLProps } from '@hi-ui/core'
+import { transformData } from './util'
 
 const _role = 'breadcrumb'
 const _prefix = getPrefixCls(_role)
@@ -17,6 +18,7 @@ export const Breadcrumb = forwardRef<HTMLUListElement | null, BreadcrumbProps>(
       role = _role,
       className,
       data,
+      fieldNames,
       separator = '/',
       onClick,
       size = 'md',
@@ -26,11 +28,16 @@ export const Breadcrumb = forwardRef<HTMLUListElement | null, BreadcrumbProps>(
   ) => {
     const cls = cx(prefixCls, `${prefixCls}--${size}`, className)
 
+    const transformedData = useMemo((): BreadcrumbDataItem[] | undefined => {
+      if (data) return transformData(data, fieldNames)
+      return data
+    }, [data, fieldNames])
+
     return (
       <ul ref={ref} role={role} className={cls} {...rest}>
-        {data?.map((item, index) => (
+        {transformedData?.map((item, index) => (
           <li key={index} className={`${prefixCls}__item`}>
-            {item.href && index !== data.length - 1 ? (
+            {item.href && index !== transformedData.length - 1 ? (
               <a
                 href={item.href}
                 target={item.target}
@@ -40,7 +47,7 @@ export const Breadcrumb = forwardRef<HTMLUListElement | null, BreadcrumbProps>(
                   }
                 }}
                 className={cx(`${prefixCls}__content`, {
-                  [`${prefixCls}__content--active`]: index === data.length - 1,
+                  [`${prefixCls}__content--active`]: index === transformedData.length - 1,
                 })}
               >
                 {item.icon}
@@ -49,7 +56,7 @@ export const Breadcrumb = forwardRef<HTMLUListElement | null, BreadcrumbProps>(
             ) : (
               <span
                 className={cx(`${prefixCls}__content`, {
-                  [`${prefixCls}__content--active`]: index === data.length - 1,
+                  [`${prefixCls}__content--active`]: index === transformedData.length - 1,
                 })}
                 onClick={(e) => {
                   if (onClick) {
@@ -79,6 +86,10 @@ export interface BreadcrumbProps extends Omit<HiBaseHTMLProps<'ul'>, 'onClick'>
    * 面包屑数据项
    */
   data?: BreadcrumbDataItem[]
+  /**
+   * 设置 data 中 title, href, target, icon  对应的 key
+   */
+  fieldNames?: HiBaseFieldNames
   /**
    * 面包屑尺寸
    */
diff --git a/packages/ui/breadcrumb/src/util.ts b/packages/ui/breadcrumb/src/util.ts
new file mode 100644
index 000000000..5ffcb2f56
--- /dev/null
+++ b/packages/ui/breadcrumb/src/util.ts
@@ -0,0 +1,34 @@
+import { HiBaseFieldNameKeys, HiBaseFieldNames } from '@hi-ui/core'
+import { BreadcrumbDataItem, BreadcrumbDataItemTargetEnum } from './types'
+import React from 'react'
+
+export const transformData = (
+  data: BreadcrumbDataItem[],
+  fieldNames?: HiBaseFieldNames
+): BreadcrumbDataItem[] => {
+  /**
+   * 转换对象
+   */
+  const getKeyFields = (node: BreadcrumbDataItem, key: HiBaseFieldNameKeys) => {
+    if (fieldNames) {
+      return node[(fieldNames[key] || key) as keyof BreadcrumbDataItem]
+    }
+    return node[key as keyof BreadcrumbDataItem]
+  }
+
+  const traverseNode = (node: BreadcrumbDataItem): BreadcrumbDataItem => {
+    const newNode: BreadcrumbDataItem = { ...node }
+
+    newNode.title = getKeyFields(newNode, 'title')
+    newNode.href = getKeyFields(newNode, 'href' as HiBaseFieldNameKeys) as string
+    newNode.icon = getKeyFields(newNode, 'icon' as HiBaseFieldNameKeys) as React.ReactNode
+    newNode.target = getKeyFields(
+      newNode,
+      'target' as HiBaseFieldNameKeys
+    ) as BreadcrumbDataItemTargetEnum
+
+    return newNode
+  }
+
+  return data.map(traverseNode)
+}