feat:생성 이력 새로고침 버튼 추가

- 생성 이력 제목 옆에 새로고침 아이콘 버튼 추가
- 클릭 시 스피너 회전 애니메이션 + 이력 목록 갱신

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
김보곤
2026-02-15 14:57:22 +09:00
parent e4d8dbddb3
commit bdcd2cad31

View File

@@ -638,12 +638,14 @@ className="bg-indigo-600 text-white px-8 py-3 rounded-lg font-medium hover:bg-in
const [loading, setLoading] = useState(true);
const [checked, setChecked] = useState(new Set());
const [deleting, setDeleting] = useState(false);
const [refreshing, setRefreshing] = useState(false);
const fetchHistory = () => {
const fetchHistory = (isRefresh = false) => {
if (isRefresh) setRefreshing(true);
api('/video/veo3/history')
.then(data => { setHistory(data.data || []); setChecked(new Set()); })
.catch(() => {})
.finally(() => setLoading(false));
.finally(() => { setLoading(false); setRefreshing(false); });
};
useEffect(() => { fetchHistory(); }, []);
@@ -725,7 +727,19 @@ className="bg-indigo-600 text-white px-8 py-3 rounded-lg font-medium hover:bg-in
return (
<div className="mt-12">
<div className="flex items-center justify-between mb-4">
<h3 className="text-lg font-bold text-gray-700">생성 이력</h3>
<div className="flex items-center gap-2">
<h3 className="text-lg font-bold text-gray-700">생성 이력</h3>
<button
onClick={() => fetchHistory(true)}
disabled={refreshing}
className="p-1.5 text-gray-400 hover:text-indigo-600 hover:bg-indigo-50 rounded-lg transition-colors disabled:opacity-50"
title="새로고침"
>
<svg className={`w-4 h-4 ${refreshing ? 'animate-spin' : ''}`} fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
</svg>
</button>
</div>
{checked.size > 0 && (
<button
onClick={handleDelete}