sevPill(r.sev) },
{ header: '유형', mono: true, render: r => {r.type} },
{ header: '유저', mono: true, render: r => {r.user} },
{ header: '탐지 시각', mono: true, render: r => {r.detected} },
{ header: '탐지 데이터', render: r => {r.data} },
{ header: '처리', align: 'right', render: r => (
onDismiss && onDismiss(r)}>무시
onAct && onAct(r)}>조치
)},
]}
rows={filtered}
empty="검토 대기 없음 — 어뷰징 자동 감지가 아직 발동되지 않았거나, 큐가 비어있습니다."
/>
);
}
// ============================================================
// 3. ACTION LOGS
// ============================================================
// [β-Phase C-2-3] hardcoded rows + 자체 state → props 인터페이스 변환.
// 비주얼 JSX 0 변경 — Select/Input/Btn/Table2/Pill/페이지네이션 디테일 100% 보존.
// rows는 Wrapper에서 매핑 (server rows → mockup display rows).
function ActionLogs({
rows = [],
action = 'all', target = 'all', search = '',
page = 1, totalPages = 1, total = 0,
onChangeAction, onChangeTarget, onChangeSearch,
onChangePage,
onCsvDownload,
}) {
return (
<>
{r.time} },
{ header: '관리자', mono: true, render: r => {r.admin} },
{ header: '액션', render: r => {r.action} },
{ header: '대상', mono: true, render: r => {r.target} },
{ header: 'IP', mono: true, render: r => {r.ip} },
{ header: '상세', render: r => {r.detail} },
]}
rows={rows}
/>
전체 {total}건 · 7일 보존
);
}
// ============================================================
// 4. TOGGLES
// ============================================================
function Toggle({ on, onChange }) {
return (
);
}
// [β-Phase C-1] 자체 state/items hardcoded → props 인터페이스 변환 (d3-C-toggles 패턴).
// 비주얼 JSX 0 변경 — Card / 메시지 박스 / Pill / Toggle / 메타 100% 보존.
// editable=true 시 메시지 박스 자리에 input + 저장 Btn.
function Toggles({ items, onToggle, onMessageChange, editable = false }) {
// editable 모드 buffer (서버 reload 전까지 input 값 보존). 정적 모드에선 미사용.
const [editingMsg, setEditingMsg] = React.useState({});
return (
{items.map((it) => {
const buffer = editingMsg[it.key];
const inputValue = buffer !== undefined ? buffer : (it.userMsg || '');
const dirty = buffer !== undefined && buffer !== (it.userMsg || '');
return (
{it.emoji}
{it.title}
{it.enabled &&
● ACTIVE}
{it.desc}
onToggle && onToggle(it.key, v)}/>
사용자 표시 메시지
{editable ? (
setEditingMsg((prev) => ({ ...prev, [it.key]: e.target.value }))}
placeholder="(미입력 시 default 메시지)"
maxLength={500}
style={{
flex: 1, padding: '10px 12px', borderRadius: 7,
background: C2.primarySofter, border: `1px solid ${C2.border}`,
fontSize: 12.5, color: C2.textSoft,
fontFamily: "'JetBrains Mono', ui-monospace, monospace",
outline: 'none',
}}
/>
{dirty && (
{
if (onMessageChange) onMessageChange(it.key, buffer);
setEditingMsg((prev) => { const next = { ...prev }; delete next[it.key]; return next; });
}}>저장
)}
) : (
{it.userMsg}
)}
{it.metaText}
);
})}
이벤트별로 어떤 채널 (Discord / Email / 둘 다) 로 알림 받을지 설정.
구독 안 된 이벤트는 default 동작 — 모든 어드민에게 디스코드 발송 가능.
환경변수
DISCORD_WEBHOOK_URL
RESEND_API_KEY
설정 필요 (미설정 시 silent skip).
{items.map((it, i) => (
{[
{ k: 'discord', label: 'Discord' },
{ k: 'email', label: 'Email' },
{ k: 'both', label: '둘 다' },
].map(ch => (
))}
onToggle && onToggle(i, v)}/>
))}
개별 사용자에게 1:1 인앱 메시지를 보냅니다. 사용자는 메인 앱 헤더의 종 배지로 받아봅니다.
피드백 회신은 피드백 인박스 → "회신" 버튼으로 자동 처리됩니다 (이 화면은 직접 발송용).