feat: Improve face identification process with validation and error handling

This commit enhances the face identification process by adding validation checks for person ID and names, ensuring that users provide necessary information before proceeding. It also introduces detailed logging for better debugging and user feedback during the identification process. Additionally, error handling is improved to provide user-friendly messages in case of failures, enhancing the overall user experience.
This commit is contained in:
Tanya
2026-01-05 13:37:45 -05:00
parent 0b95cd2492
commit c69604573d
6 changed files with 59 additions and 8 deletions
+25 -4
View File
@@ -692,7 +692,19 @@ export default function Identify() {
const handleIdentify = async () => {
if (!currentFace) return
console.log('handleIdentify called', { currentFace, personId, firstName, lastName, canIdentify })
if (!currentFace) {
console.warn('handleIdentify: No current face')
return
}
// Validate that we have either a person ID or both first and last name
if (!personId && (!firstName.trim() || !lastName.trim())) {
alert('Please select an existing person or enter first name and last name.')
return
}
setBusy(true)
const trimmedFirstName = firstName.trim()
const trimmedLastName = lastName.trim()
@@ -719,7 +731,10 @@ export default function Identify() {
payload.date_of_birth = trimmedDob
}
}
console.log('Identifying face:', currentFace.id, 'with payload:', payload)
await facesApi.identify(currentFace.id, payload)
// Optimistic: remove identified faces from list
const identifiedSet = new Set([currentFace.id, ...additional])
const remaining = faces.filter((f) => !identifiedSet.has(f.id))
@@ -741,6 +756,10 @@ export default function Identify() {
}
// Don't clear form - let the useEffect handle restoring/clearing when face changes
} catch (error: any) {
console.error('Error identifying face:', error)
const errorMessage = error.response?.data?.detail || error.message || 'Failed to identify face. Please try again.'
alert(errorMessage)
} finally {
setBusy(false)
}
@@ -1378,13 +1397,15 @@ export default function Identify() {
disabled={!!personId} />
</div>
<div className="col-span-2 flex gap-2 mt-2">
<button disabled={!canIdentify || busy}
<button
type="button"
disabled={!canIdentify || busy}
onClick={handleIdentify}
className={`px-3 py-2 rounded text-white ${canIdentify && !busy ? 'bg-indigo-600 hover:bg-indigo-700' : 'bg-gray-400 cursor-not-allowed'}`}>
{busy ? 'Identifying...' : 'Identify'}
</button>
<button onClick={() => setCurrentIdx((i) => Math.max(0, i - 1))} className="px-3 py-2 rounded border">Back</button>
<button onClick={() => setCurrentIdx((i) => Math.min(faces.length - 1, i + 1))} className="px-3 py-2 rounded border">Next</button>
<button type="button" onClick={() => setCurrentIdx((i) => Math.max(0, i - 1))} className="px-3 py-2 rounded border">Back</button>
<button type="button" onClick={() => setCurrentIdx((i) => Math.min(faces.length - 1, i + 1))} className="px-3 py-2 rounded border">Next</button>
</div>
</div>
</div>