import React from 'react';

/**
 * 全站作者名渲染（前台）：
 * - name        显示名（后端 author_name 已归一 = nickname||username，调用方负责兜底匿名/游客）
 * - uid         用户 id；showUid 时显示 #id 后缀
 * - title       自定义头衔文案（非空才渲染 chip）
 * - titleColor  头衔 chip 背景色（hex，可空 → 默认中性色）
 * - role        'admin' → 系统身份 chip「管理员」（固定系统配色）
 * - moderatorLabel 版主 chip 文案（如「版主·闲聊」）；接口未提供时留空则不渲染
 * - showUid     UID 后缀开关：帖子发布者/楼主/博客作者/个人主页恒显；
 *               评论作者/回复楼层由 show_uid_in_comments 设置控制
 *
 * 渲染 = 名字 + 系统身份 chip（管理员/版主）+ 自定义头衔 chip + UID 后缀，
 * 样式命名空间 .username-* / .title-chip（见 public/css/style.css）。
 */
export default function UserName({
  name = '',
  uid,
  title = '',
  titleColor = '',
  role = '',
  showUid = false,
  moderatorLabel = '',
  className = '',
}) {
  return (
    <span className={'username' + (className ? ' ' + className : '')}>
      <span className="username-name">{name || '匿名'}</span>
      {role === 'admin' ? <span className="username-chip username-chip-role">管理员</span> : null}
      {moderatorLabel ? <span className="username-chip username-chip-moderator">{moderatorLabel}</span> : null}
      {title ? (
        <span
          className={'username-chip title-chip' + (titleColor ? ' title-chip-colored' : '')}
          style={titleColor ? { background: titleColor } : undefined}
        >
          {title}
        </span>
      ) : null}
      {showUid && uid != null ? <span className="username-uid">#{uid}</span> : null}
    </span>
  );
}