the-open-agent · hsluoyz · Jul 4, 2026 · Jul 4, 2026
diff --git a/web/src/AnalysisListPage.js b/web/src/AnalysisListPage.js
@@ -17,6 +17,7 @@ import {Avatar, Card, Col, Row, Space, Spin, Typography} from "antd";
 import * as StoreBackend from "./backend/StoreBackend";
 import * as AnalysisBackend from "./backend/AnalysisBackend";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import WordCloudChart from "./WordCloudChart";
 import BreadcrumbBar from "./common/BreadcrumbBar";
 import i18next from "i18next";
@@ -91,7 +92,7 @@ class AnalysisListPage extends Component {
                     <Space>
                       <Avatar src={store.avatar || Setting.getDefaultAiAvatar()} size={24} />
                       <span>{store.displayName || store.name}</span>
-                      <span style={{fontWeight: "normal", color: "#999", fontSize: "12px"}}>{store.owner}</span>
+                      <UserLabel user={store.owner} account={this.props.account} showAvatar={false} nameStyle={{fontWeight: "normal", color: "#999", fontSize: "12px"}} />
                     </Space>
                   }
                   extra={

diff --git a/web/src/ChatListPage.js b/web/src/ChatListPage.js
@@ -18,10 +18,10 @@ import {Button, Popconfirm, Space, Switch, Table, Tag, Tooltip} from "antd";
 import moment from "moment";
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as ChatBackend from "./backend/ChatBackend";
 import * as ProviderBackend from "./backend/ProviderBackend";
 import i18next from "i18next";
-import * as Conf from "./Conf";
 import * as MessageBackend from "./backend/MessageBackend";
 import ChatBox from "./ChatBox";
 import {renderText} from "./ChatMessageRender";
@@ -382,11 +382,7 @@ class ChatListPage extends BaseListPage {
             return text;
           }
 
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${Conf.AuthConfig.organizationName}/${text}`)}>
-              {text}
-            </a>
-          );
+          return <UserLabel user={text} account={this.props.account} size={22} />;
         },
       },
       {

diff --git a/web/src/CommentListPage.js b/web/src/CommentListPage.js
@@ -17,6 +17,7 @@ import {Link} from "react-router-dom";
 import {Button, Popconfirm, Table, Tooltip} from "antd";
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as CommentBackend from "./backend/CommentBackend";
 import i18next from "i18next";
 import {DeleteOutlined, EditOutlined} from "@ant-design/icons";
@@ -57,6 +58,7 @@ class CommentListPage extends BaseListPage {
         width: "120px",
         sorter: (a, b) => a.owner.localeCompare(b.owner),
         ...this.getColumnSearchProps("owner"),
+        render: (text) => (text && !text.startsWith("u-") ? <UserLabel user={text} account={this.props.account} size={22} /> : text),
       },
       {
         title: i18next.t("general:Name"),

diff --git a/web/src/FileListPage.js b/web/src/FileListPage.js
@@ -17,7 +17,7 @@ import {Link} from "react-router-dom";
 import {Button, Image, Popconfirm, Table, Tooltip, Upload} from "antd";
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
-import * as Conf from "./Conf";
+import UserLabel from "./common/UserLabel";
 import * as FileBackend from "./backend/FileBackend";
 import * as StorageProviderBackend from "./backend/StorageProviderBackend";
 import * as ProviderBackend from "./backend/ProviderBackend";
@@ -156,11 +156,7 @@ class FileListPage extends BaseListPage {
           if (!text || text.startsWith("u-")) {
             return text;
           }
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${Conf.AuthConfig.organizationName}/${text}`)}>
-              {text}
-            </a>
-          );
+          return <UserLabel user={text} account={this.props.account} size={22} />;
         },
       },
       {

diff --git a/web/src/MessageListPage.js b/web/src/MessageListPage.js
@@ -18,11 +18,11 @@ import {Button, Popconfirm, Popover, Switch, Table, Tag, Tooltip} from "antd";
 import BaseListPage from "./BaseListPage";
 import {ThemeDefault} from "./Conf";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as MessageBackend from "./backend/MessageBackend";
 import * as ProviderBackend from "./backend/ProviderBackend";
 import moment from "moment";
 import i18next from "i18next";
-import * as Conf from "./Conf";
 import {DeleteOutlined, EditOutlined, EyeOutlined} from "@ant-design/icons";
 import VectorTooltip from "./VectorTooltip";
 
@@ -314,11 +314,7 @@ class MessageListPage extends BaseListPage {
             return text;
           }
 
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${Conf.AuthConfig.organizationName}/${text}`)}>
-              {text}
-            </a>
-          );
+          return <UserLabel user={text} account={this.props.account} size={22} />;
         },
       },
       {
@@ -371,16 +367,7 @@ class MessageListPage extends BaseListPage {
             return text;
           }
 
-          let userId = text;
-          if (!userId.includes("/")) {
-            userId = `${record.organization}/${userId}`;
-          }
-
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${userId}`)}>
-              {text}
-            </a>
-          );
+          return <UserLabel user={text} account={this.props.account} size={22} />;
         },
       },
       {

diff --git a/web/src/RecordListPage.js b/web/src/RecordListPage.js
@@ -17,6 +17,7 @@ import {Link} from "react-router-dom";
 import {Alert, Button, Popconfirm, Popover, Switch, Table, Tooltip, Typography} from "antd";
 import moment from "moment";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as RecordBackend from "./backend/RecordBackend";
 import * as ProviderBackend from "./backend/ProviderBackend";
 import i18next from "i18next";
@@ -321,11 +322,7 @@ class RecordListPage extends BaseListPage {
         sorter: true,
         ...this.getColumnSearchProps("user"),
         render: (text, record, index) => {
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${record.organization}/${record.user}`)}>
-              {text}
-            </a>
-          );
+          return <UserLabel user={text} account={this.props.account} size={22} />;
         },
       },
       {

diff --git a/web/src/ResourceListPage.js b/web/src/ResourceListPage.js
@@ -18,6 +18,7 @@ import {DeleteOutlined, UploadOutlined} from "@ant-design/icons";
 import copy from "copy-to-clipboard";
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as ResourceBackend from "./backend/ResourceBackend";
 import i18next from "i18next";
 
@@ -111,6 +112,7 @@ class ResourceListPage extends BaseListPage {
         width: "120px",
         sorter: true,
         ...this.getColumnSearchProps("user"),
+        render: (text) => (text && !text.startsWith("u-") ? <UserLabel user={text} account={this.props.account} size={22} /> : text),
       },
       {
         title: i18next.t("general:Category"),

diff --git a/web/src/ScaleListPage.js b/web/src/ScaleListPage.js
@@ -10,6 +10,7 @@ import {DeleteOutlined, EditOutlined} from "@ant-design/icons";
 import moment from "moment";
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as ScaleBackend from "./backend/ScaleBackend";
 import i18next from "i18next";
 
@@ -90,6 +91,7 @@ class ScaleListPage extends BaseListPage {
         width: "90px",
         sorter: (a, b) => (a.owner || "").localeCompare(b.owner || ""),
         ...this.getColumnSearchProps("owner"),
+        render: (text) => (text && !text.startsWith("u-") ? <UserLabel user={text} account={this.props.account} size={22} /> : text),
       },
       {
         title: i18next.t("general:Name"),

diff --git a/web/src/SessionListPage.js b/web/src/SessionListPage.js
@@ -14,6 +14,7 @@
 
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import i18next from "i18next";
 import {Button, Popconfirm, Table, Tag, Tooltip} from "antd";
 import React from "react";
@@ -56,13 +57,7 @@ class SessionListPage extends BaseListPage {
         fixed: "left",
         sorter: (a, b) => a.name.localeCompare(b.name),
         ...this.getColumnSearchProps("name"),
-        render: (text, session, index) => {
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${session.owner}/${session.name}`)}>
-              {text}
-            </a>
-          );
-        },
+        render: (text) => (text && !text.startsWith("u-") ? <UserLabel user={text} account={this.props.account} size={22} /> : text),
       },
       {
         title: i18next.t("general:Organization"),

diff --git a/web/src/StoreHubAgentDetail.js b/web/src/StoreHubAgentDetail.js
@@ -23,6 +23,7 @@ import i18next from "i18next";
 import CommentArea from "./comment/CommentArea";
 import FileTree from "./FileTree";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 
 const {Text, Title} = Typography;
 
@@ -39,9 +40,8 @@ function renderForkDisabledReason(favoriteStatus) {
   return "";
 }
 
-function renderHeader(store, onStartChat, onFork, forking, favoriteStatus, starLoading, watchLoading, onToggleFavorite) {
+function renderHeader(store, account, onStartChat, onFork, forking, favoriteStatus, starLoading, watchLoading, onToggleFavorite) {
   const initials = (store.displayName || store.name || "?")[0].toUpperCase();
-  const authorName = store.author || store.owner;
   const status = favoriteStatus || {};
   const forkDisabledReason = renderForkDisabledReason(status);
   const isForked = Boolean(store.forkedFromOwner && store.forkedFromName);
@@ -59,12 +59,16 @@ function renderHeader(store, onStartChat, onFork, forking, favoriteStatus, starL
         <div style={{display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 12, flexWrap: "wrap", marginBottom: 6}}>
           <div style={{minWidth: 0}}>
             <Title level={3} style={{margin: 0, wordBreak: "break-word"}}>
-              <Text type="secondary" style={{fontSize: 20, fontWeight: 400}}>{store.owner} / </Text>
+              <UserLabel user={store.owner} account={account} showAvatar={false} nameStyle={{fontSize: 20, fontWeight: 400, color: "var(--ant-color-text-secondary)"}} />
+              <Text type="secondary" style={{fontSize: 20, fontWeight: 400}}> / </Text>
               {store.displayName || store.name}
             </Title>
             <div style={{display: "flex", alignItems: "center", gap: 8, flexWrap: "wrap"}}>
               <Text type="secondary" style={{fontSize: 14}}>
-                {i18next.t("store:By")} <strong>{authorName}</strong>
+                {i18next.t("store:By")}{" "}
+                {store.author
+                  ? <strong>{store.author}</strong>
+                  : <UserLabel user={store.owner} account={account} showAvatar={false} strong />}
               </Text>
               {isForked ? (
                 <Tag icon={<ForkOutlined />} color="blue" style={{margin: 0}}>
@@ -120,9 +124,9 @@ function renderHeader(store, onStartChat, onFork, forking, favoriteStatus, starL
   );
 }
 
-function renderAbout(store) {
+function renderAbout(store, account) {
   const rows = [
-    [i18next.t("general:Owner"), store.owner],
+    [i18next.t("general:Owner"), <UserLabel key="owner" user={store.owner} account={account} showAvatar={false} />],
     [i18next.t("store:Forked from"), store.forkedFromOwner && store.forkedFromName ? `${store.forkedFromOwner}/${store.forkedFromName}` : ""],
     [i18next.t("general:Author"), store.author],
     [i18next.t("store:Affiliation"), store.affiliation],
@@ -221,7 +225,7 @@ function renderOverview(account, store, onStoreUpdate, onRefresh) {
         </div>
       </Col>
       <Col xs={24} lg={8}>
-        {renderAbout(store)}
+        {renderAbout(store, account)}
       </Col>
     </Row>
   );
@@ -272,7 +276,7 @@ function StoreHubAgentDetail({account, store, activeTab, activeSub, canManage, o
 
   return (
     <div style={{padding: "24px 32px", maxWidth: 1280, margin: "0 auto"}}>
-      {renderHeader(store, onStartChat, onFork, forking, favoriteStatus, starLoading, watchLoading, onToggleFavorite)}
+      {renderHeader(store, account, onStartChat, onFork, forking, favoriteStatus, starLoading, watchLoading, onToggleFavorite)}
       <Tabs
         activeKey={activeTab}
         items={tabItems}

diff --git a/web/src/StoreHubDrawer.js b/web/src/StoreHubDrawer.js
@@ -16,6 +16,7 @@ import React from "react";
 import {Avatar, Button, Divider, Drawer, Tag, Tooltip, Typography} from "antd";
 import {CommentOutlined, CopyOutlined, LinkOutlined, RobotOutlined} from "@ant-design/icons";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import i18next from "i18next";
 
 const {Text, Paragraph} = Typography;
@@ -36,7 +37,7 @@ export function getChatUrl(store) {
 //   onStartChat – (store) => void
 //   onCopyLink  – (store) => void
 //   onViewAgent – (store) => void
-function StoreHubDrawer({store, visible, onClose, onStartChat, onCopyLink, onViewAgent}) {
+function StoreHubDrawer({store, visible, onClose, onStartChat, onCopyLink, onViewAgent, account}) {
   if (!store) {
     return null;
   }
@@ -87,7 +88,10 @@ function StoreHubDrawer({store, visible, onClose, onStartChat, onCopyLink, onVie
             {store.displayName || store.name}
           </div>
           <Text type="secondary" style={{fontSize: 13}}>
-            {i18next.t("store:By")} {authorName}
+            {i18next.t("store:By")}{" "}
+            {store.author
+              ? authorName
+              : <UserLabel user={store.owner} account={account} showAvatar={false} nameStyle={{fontSize: 13}} />}
           </Text>
           {store.affiliation ? (
             <div style={{fontSize: 12, color: "var(--ant-color-text-tertiary)", marginTop: 2}}>

diff --git a/web/src/StoreHubPage.js b/web/src/StoreHubPage.js
@@ -19,6 +19,7 @@ import * as StoreBackend from "./backend/StoreBackend";
 import * as Setting from "./Setting";
 import i18next from "i18next";
 import StoreHubDrawer, {getChatUrl} from "./StoreHubDrawer";
+import UserLabel from "./common/UserLabel";
 
 const {Text, Paragraph} = Typography;
 
@@ -325,8 +326,11 @@ class StoreHubPage extends React.Component {
                   </Tooltip>
                 ) : null}
               </div>
-              <Text type="secondary" style={{fontSize: 12}}>
-                {i18next.t("store:By")} {authorName}
+              <Text type="secondary" style={{fontSize: 12}} onClick={(e) => e.stopPropagation()}>
+                {i18next.t("store:By")}{" "}
+                {store.author
+                  ? authorName
+                  : <UserLabel user={store.owner} account={this.props.account} showAvatar={false} nameStyle={{fontSize: 12}} />}
               </Text>
               {store.affiliation ? (
                 <div style={{fontSize: 11, color: "var(--ant-color-text-tertiary)", marginTop: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap"}}>
@@ -448,6 +452,7 @@ class StoreHubPage extends React.Component {
           </>
         )}
         <StoreHubDrawer
+          account={this.props.account}
           store={selectedStore}
           visible={drawerVisible}
           onClose={() => this.closeDrawer()}

diff --git a/web/src/StoreListPage.js b/web/src/StoreListPage.js
@@ -18,6 +18,7 @@ import {Avatar, Button, Popconfirm, Switch, Table, Tag, Tooltip} from "antd";
 import moment from "moment";
 import BaseListPage from "./BaseListPage";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 import * as StoreBackend from "./backend/StoreBackend";
 import i18next from "i18next";
 import * as Conf from "./Conf";
@@ -280,11 +281,7 @@ class StoreListPage extends BaseListPage {
             return text;
           }
 
-          return (
-            <a target="_blank" rel="noreferrer" href={Setting.getMyProfileUrl(this.props.account).replace("/account", `/users/${Conf.AuthConfig.organizationName}/${text}`)}>
-              {text}
-            </a>
-          );
+          return <UserLabel user={text} account={this.props.account} size={22} />;
         },
       },
       {

diff --git a/web/src/UsageTable.js b/web/src/UsageTable.js
@@ -16,6 +16,7 @@ import React from "react";
 import {Table, Tag} from "antd";
 import i18next from "i18next";
 import * as Setting from "./Setting";
+import UserLabel from "./common/UserLabel";
 
 const UsageTable = ({data, account}) => {
   let columns = [
@@ -24,6 +25,7 @@ const UsageTable = ({data, account}) => {
       dataIndex: "user",
       key: "user",
       width: "12%",
+      render: (text) => (text && !text.startsWith("u-") ? <UserLabel user={text} account={account} size={22} /> : text),
     },
     {
       title: i18next.t("general:Chats"),

diff --git a/web/src/backend/UserBackend.js b/web/src/backend/UserBackend.js
@@ -32,9 +32,16 @@ function fetchUserInfo(name) {
       if (res.status === "ok" && res.data) {
         return res.data;
       }
+      // Unresolved (e.g. not signed in yet, or a transient error) — drop the
+      // cache entry so a later lookup retries instead of being stuck rendering
+      // the raw username for the rest of the page's lifetime.
+      userInfoCache.delete(name);
       return {name};
     })
-    .catch(() => ({name}));
+    .catch(() => {
+      userInfoCache.delete(name);
+      return {name};
+    });
 }
 
 // getUserInfo returns a Promise that resolves to {name, displayName, avatar}.