Mina Choi
c85c577349
`backend` 옆에 `front` 가 있을 이유가 없었다. negosium 의 negodata/front 를 그대로 베꼈고 그게 왜 front 인지는 따져보지 않았다 — 근거 없이 들여온 이름이라 바로잡는다. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_019uYhHQdssRubirPirrdJJC
28 lines
1000 B
TypeScript
28 lines
1000 B
TypeScript
import {useEffect, useState} from 'react';
|
|
|
|
/** "실시간 업데이트: 오후 4:41:56" 표시. 1초마다 갱신된다. */
|
|
export function LiveClock() {
|
|
const [clock, setClock] = useState('');
|
|
|
|
useEffect(() => {
|
|
const update = () => {
|
|
const now = new Date();
|
|
const period = now.getHours() >= 12 ? '오후' : '오전';
|
|
const hours = now.getHours() % 12 || 12;
|
|
const minutes = String(now.getMinutes()).padStart(2, '0');
|
|
const seconds = String(now.getSeconds()).padStart(2, '0');
|
|
setClock(`${period} ${hours}:${minutes}:${seconds}`);
|
|
};
|
|
update();
|
|
const timer = setInterval(update, 1000);
|
|
return () => clearInterval(timer);
|
|
}, []);
|
|
|
|
return (
|
|
<span className="flex items-center gap-1.5 rounded-full border border-stone-200/80 bg-white px-2.5 py-1 text-[11px] text-stone-500 shadow-2xs">
|
|
<span className="size-1.5 animate-pulse rounded-full bg-emerald-500" />
|
|
<span>실시간 업데이트: {clock}</span>
|
|
</span>
|
|
);
|
|
}
|