From f4f1b85d05f06ed3ecfe9bf625561198ae02dfc8 Mon Sep 17 00:00:00 2001
From: John <qingyi.xjh@antgroup.com>
Date: Tue, 18 Apr 2023 17:48:26 +0800
Subject: [PATCH] fix: transformLabelWithCodicon white space (#2600)

---
 packages/core-browser/src/utils/label.tsx            | 12 ++++++++++--
 .../status-bar/src/browser/status-bar.module.less    |  1 +
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/packages/core-browser/src/utils/label.tsx b/packages/core-browser/src/utils/label.tsx
index f90e3311e7..7cfa278348 100644
--- a/packages/core-browser/src/utils/label.tsx
+++ b/packages/core-browser/src/utils/label.tsx
@@ -20,7 +20,10 @@ export function transformLabelWithCodicon(
   const generateIconStyle = (icon?: string, styleProps?: CSSProperties | string) =>
     typeof styleProps === 'string' ? { className: clx(icon, styleProps) } : { className: icon, style: styleProps };
 
-  return label.split(SEPERATOR).map((e, index) => {
+  const splitLabel = label.split(SEPERATOR);
+  const length = splitLabel.length;
+
+  return splitLabel.map((e, index) => {
     if (!transformer) {
       return e;
     }
@@ -45,7 +48,12 @@ export function transformLabelWithCodicon(
     } else if (ICON_ERROR_REGX.test(e)) {
       return transformLabelWithCodicon(e.replaceAll(ICON_ERROR_REGX, ''), iconStyleProps, transformer, renderText);
     } else {
-      return isFunction(renderText) ? renderText(e, index) : <span key={`${index}-${e}`}>{e}</span>;
+      const withSeperator = e + (index === length - 1 ? '' : SEPERATOR);
+      return isFunction(renderText) ? (
+        renderText(withSeperator, index)
+      ) : (
+        <span key={`${index}-${e}`}>{withSeperator}</span>
+      );
     }
   });
 }
diff --git a/packages/status-bar/src/browser/status-bar.module.less b/packages/status-bar/src/browser/status-bar.module.less
index 218d08197a..3be3fc8f0b 100644
--- a/packages/status-bar/src/browser/status-bar.module.less
+++ b/packages/status-bar/src/browser/status-bar.module.less
@@ -71,6 +71,7 @@
 .popover_item {
   display: flex;
   align-items: center;
+  white-space: pre;
 }
 
 .popover_content,