mirror of
https://github.com/hansjone/dsh-im-ops.git
synced 2026-10-09 04:13:17 +08:00
83 lines
2.3 KiB
JavaScript
83 lines
2.3 KiB
JavaScript
import * as React from 'react';
|
||
|
||
import { h, isEnglish } from './i18n.js';
|
||
|
||
function messageErrorTime(value) {
|
||
try {
|
||
return new Intl.DateTimeFormat(isEnglish() ? 'en-US' : 'zh-CN', {
|
||
year: 'numeric',
|
||
month: '2-digit',
|
||
day: '2-digit',
|
||
hour: '2-digit',
|
||
minute: '2-digit',
|
||
}).format(new Date(value));
|
||
} catch {
|
||
return null;
|
||
}
|
||
}
|
||
|
||
export function ChannelListHeading({ className = '', id, title, connectionLabel }) {
|
||
const helpId = React.useId();
|
||
return h('div', { className: `${className} dim-listHeading`.trim() },
|
||
h('div', { className: 'dim-listTitle' },
|
||
h('h3', id ? { id } : null, title),
|
||
h('span', { className: 'dim-channelHelp' },
|
||
h('button', {
|
||
type: 'button',
|
||
className: 'dim-channelHelpButton',
|
||
'aria-label': '查看消息通道说明',
|
||
'aria-describedby': helpId,
|
||
}, h('span', { 'aria-hidden': 'true' }, '?')),
|
||
h('span', {
|
||
id: helpId,
|
||
className: 'dim-channelTooltip',
|
||
role: 'tooltip',
|
||
},
|
||
h('span', null, '消息通道'),
|
||
h('strong', null, connectionLabel)))));
|
||
}
|
||
|
||
export function BotStatusMeta({
|
||
className = '',
|
||
dotClassName = '',
|
||
tone,
|
||
stateLabel,
|
||
lastCheckedAt,
|
||
formatCheckedTime,
|
||
healthState,
|
||
}) {
|
||
return h('div', { className: 'dim-botHealthGroup' },
|
||
h('div', {
|
||
className: `${className} dim-botHealth`.trim(),
|
||
...(healthState ? { 'data-health': healthState } : {}),
|
||
},
|
||
h('span', {
|
||
className: `${dotClassName} dim-healthDot`.trim(),
|
||
'data-tone': tone,
|
||
}),
|
||
h('span', null, stateLabel)),
|
||
h('div', { className: 'dim-lastChecked' },
|
||
h('span', null, '最近检查'),
|
||
h('span', null, formatCheckedTime(lastCheckedAt))));
|
||
}
|
||
|
||
export function LastMessageErrorSummary({ className = '', error }) {
|
||
if (!error) return null;
|
||
const occurredAt = messageErrorTime(error.at);
|
||
return h('div', {
|
||
className: `${className} dim-cardSummary`.trim(),
|
||
role: 'status',
|
||
},
|
||
h('strong', null, '最近一条消息处理失败'),
|
||
'：',
|
||
h('span', null, error.message),
|
||
'（',
|
||
h('span', null, '错误码'),
|
||
` ${error.code} · `,
|
||
h('span', null, '参考号'),
|
||
` ${error.referenceId}`,
|
||
occurredAt ? h(React.Fragment, null,
|
||
' · ',
|
||
h('time', { dateTime: new Date(error.at).toISOString() }, occurredAt)) : null,
|
||
'）');
|
||
}
|