fix: UserManagementPage delete error feedback, input disable, date guard

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-10 13:11:09 +03:00
parent 4b244bf0bb
commit 769836714a
+53 -42
View File
@@ -47,7 +47,8 @@ const tdStyle = {
const formatDate = (dateStr) => {
if (!dateStr) return '—';
return new Date(dateStr).toLocaleDateString('ru-RU');
const d = new Date(dateStr);
return isNaN(d) ? '—' : d.toLocaleDateString('ru-RU');
};
const UserManagementPage = () => {
@@ -59,6 +60,7 @@ const UserManagementPage = () => {
const [confirmDeleteId, setConfirmDeleteId] = useState(null);
const [deleting, setDeleting] = useState(false);
const [deleteError, setDeleteError] = useState('');
const handleInvite = async (e) => {
e.preventDefault();
@@ -76,13 +78,14 @@ const UserManagementPage = () => {
const handleDeleteConfirm = async (userId) => {
setDeleting(true);
setDeleteError('');
try {
await deleteUser(userId);
} catch {
// deletion errors surface in the hook's error state
} finally {
setDeleting(false);
setConfirmDeleteId(null);
} catch (err) {
setDeleting(false);
setDeleteError(err?.message ?? 'Ошибка удаления');
}
};
@@ -128,6 +131,7 @@ const UserManagementPage = () => {
value={inviteEmail}
onChange={(e) => setInviteEmail(e.target.value)}
required
disabled={inviting}
style={inputStyle}
/>
<button
@@ -191,45 +195,52 @@ const UserManagementPage = () => {
<td style={tdStyle}>{formatDate(user.last_sign_in_at)}</td>
<td style={{ ...tdStyle, textAlign: 'right', whiteSpace: 'nowrap' }}>
{confirmDeleteId === user.id ? (
<span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}>
<span style={{ fontSize: '0.82rem', color: 'var(--text-muted)' }}>
Вы уверены?
<span style={{ display: 'inline-flex', flexDirection: 'column', alignItems: 'flex-end', gap: '4px' }}>
<span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}>
<span style={{ fontSize: '0.82rem', color: 'var(--text-muted)' }}>
Вы уверены?
</span>
<button
onClick={() => handleDeleteConfirm(user.id)}
disabled={deleting}
style={{
padding: '4px 10px',
background: '#ef4444',
color: '#fff',
border: 'none',
borderRadius: '5px',
fontSize: '0.78rem',
fontWeight: 700,
cursor: deleting ? 'not-allowed' : 'pointer',
opacity: deleting ? 0.7 : 1,
fontFamily: 'var(--font-heading)',
}}
>
Удалить
</button>
<button
onClick={() => { setConfirmDeleteId(null); setDeleteError(''); }}
disabled={deleting}
style={{
padding: '4px 10px',
background: 'transparent',
color: 'var(--text-muted)',
border: '1.5px solid var(--border-light)',
borderRadius: '5px',
fontSize: '0.78rem',
fontWeight: 700,
cursor: 'pointer',
fontFamily: 'var(--font-heading)',
}}
>
Отмена
</button>
</span>
<button
onClick={() => handleDeleteConfirm(user.id)}
disabled={deleting}
style={{
padding: '4px 10px',
background: '#ef4444',
color: '#fff',
border: 'none',
borderRadius: '5px',
fontSize: '0.78rem',
fontWeight: 700,
cursor: deleting ? 'not-allowed' : 'pointer',
opacity: deleting ? 0.7 : 1,
fontFamily: 'var(--font-heading)',
}}
>
Удалить
</button>
<button
onClick={() => setConfirmDeleteId(null)}
disabled={deleting}
style={{
padding: '4px 10px',
background: 'transparent',
color: 'var(--text-muted)',
border: '1.5px solid var(--border-light)',
borderRadius: '5px',
fontSize: '0.78rem',
fontWeight: 700,
cursor: 'pointer',
fontFamily: 'var(--font-heading)',
}}
>
Отмена
</button>
{deleteError && (
<span style={{ fontSize: '0.78rem', color: '#ef4444' }}>
{deleteError}
</span>
)}
</span>
) : (
<button