Improve component stability and user experience with safety checks

Implement robust error handling, safety checks for data structures, and state management improvements across various components to prevent runtime errors and enhance user experience.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: a71e826a-1d38-4b6e-a34f-fbf5ba1f1b25
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
This commit is contained in:
pac7
2025-10-08 19:27:31 +00:00
parent f21602b992
commit bfba3baf7e
12 changed files with 224 additions and 110 deletions

View File

@@ -67,8 +67,18 @@ export function useEntityVersions(entityType: string, entityId: string) {
// Only continue if this is still the latest request
if (currentRequestId !== requestCounterRef.current) return;
// Safety check: verify data is an array before processing
if (!Array.isArray(data)) {
if (isMountedRef.current && currentRequestId === requestCounterRef.current) {
setVersions([]);
setCurrentVersion(null);
setLoading(false);
}
return;
}
// Fetch profiles separately
const userIds = [...new Set(data?.map(v => v.changed_by).filter(Boolean) || [])];
const userIds = [...new Set(data.map(v => v.changed_by).filter(Boolean))];
const { data: profiles } = await supabase
.from('profiles')
.select('user_id, username, avatar_url')
@@ -77,8 +87,11 @@ export function useEntityVersions(entityType: string, entityId: string) {
// Check again if this is still the latest request
if (currentRequestId !== requestCounterRef.current) return;
const versionsWithProfiles = data?.map(v => {
const profile = profiles?.find(p => p.user_id === v.changed_by);
// Safety check: verify profiles array exists before filtering
const profilesArray = Array.isArray(profiles) ? profiles : [];
const versionsWithProfiles = data.map(v => {
const profile = profilesArray.find(p => p.user_id === v.changed_by);
return {
...v,
changer_profile: profile || {
@@ -90,14 +103,16 @@ export function useEntityVersions(entityType: string, entityId: string) {
// Only update state if component is still mounted and this is still the latest request
if (isMountedRef.current && currentRequestId === requestCounterRef.current) {
setVersions(versionsWithProfiles || []);
setCurrentVersion(versionsWithProfiles?.find(v => v.is_current) || null);
setVersions(versionsWithProfiles);
setCurrentVersion(versionsWithProfiles.find(v => v.is_current) || null);
setLoading(false);
}
} catch (error: any) {
console.error('Error fetching versions:', error);
if (isMountedRef.current) {
toast.error('Failed to load version history');
// Safe error message access with fallback
const errorMessage = error?.message || 'Failed to load version history';
toast.error(errorMessage);
setLoading(false);
}
}
@@ -114,12 +129,15 @@ export function useEntityVersions(entityType: string, entityId: string) {
if (error) throw error;
if (isMountedRef.current) {
setFieldHistory(data as FieldChange[] || []);
// Safety check: ensure data is an array
const fieldChanges = Array.isArray(data) ? data as FieldChange[] : [];
setFieldHistory(fieldChanges);
}
} catch (error: any) {
console.error('Error fetching field history:', error);
if (isMountedRef.current) {
toast.error('Failed to load field history');
const errorMessage = error?.message || 'Failed to load field history';
toast.error(errorMessage);
}
}
};
@@ -137,7 +155,8 @@ export function useEntityVersions(entityType: string, entityId: string) {
} catch (error: any) {
console.error('Error comparing versions:', error);
if (isMountedRef.current) {
toast.error('Failed to compare versions');
const errorMessage = error?.message || 'Failed to compare versions';
toast.error(errorMessage);
}
return null;
}
@@ -166,7 +185,8 @@ export function useEntityVersions(entityType: string, entityId: string) {
} catch (error: any) {
console.error('Error rolling back version:', error);
if (isMountedRef.current) {
toast.error('Failed to rollback version');
const errorMessage = error?.message || 'Failed to rollback version';
toast.error(errorMessage);
}
return null;
}
@@ -195,7 +215,8 @@ export function useEntityVersions(entityType: string, entityId: string) {
} catch (error: any) {
console.error('Error creating version:', error);
if (isMountedRef.current) {
toast.error('Failed to create version');
const errorMessage = error?.message || 'Failed to create version';
toast.error(errorMessage);
}
return null;
}