
This commit introduces several new components to enhance the list detail functionality: - **CostSummaryDialog.vue**: A modal for displaying cost summaries, including total costs, user balances, and a detailed breakdown of expenses. - **ExpenseSection.vue**: A section for managing and displaying expenses, featuring loading states, error handling, and collapsible item details. - **ItemsList.vue**: A component for rendering and managing a list of items with drag-and-drop functionality, including a new item input field. - **ListItem.vue**: A detailed item component that supports editing, deleting, and displaying item statuses. - **OcrDialog.vue**: A modal for handling OCR file uploads and displaying extracted items. - **SettleShareModal.vue**: A modal for settling shares among users, allowing input of settlement amounts. - **Error handling utility**: A new utility function for extracting user-friendly error messages from API responses. These additions aim to improve user interaction and streamline the management of costs and expenses within the application.
31 lines
1.5 KiB
TypeScript
31 lines
1.5 KiB
TypeScript
// Helper to extract user-friendly error messages from API responses
|
|
export const getApiErrorMessage = (err: unknown, fallbackMessageKey: string, t: (key: string, ...args: any[]) => string): string => {
|
|
if (err && typeof err === 'object') {
|
|
// Check for FastAPI/DRF-style error response
|
|
if ('response' in err && err.response && typeof err.response === 'object' && 'data' in err.response && err.response.data) {
|
|
const errorData = err.response.data as any; // Type assertion for easier access
|
|
if (typeof errorData.detail === 'string') {
|
|
return errorData.detail;
|
|
}
|
|
if (typeof errorData.message === 'string') { // Common alternative
|
|
return errorData.message;
|
|
}
|
|
// FastAPI validation errors often come as an array of objects
|
|
if (Array.isArray(errorData.detail) && errorData.detail.length > 0) {
|
|
const firstError = errorData.detail[0];
|
|
if (typeof firstError.msg === 'string' && typeof firstError.type === 'string') {
|
|
return firstError.msg; // Simpler: just the message
|
|
}
|
|
}
|
|
if (typeof errorData === 'string') { // Sometimes data itself is the error string
|
|
return errorData;
|
|
}
|
|
}
|
|
// Standard JavaScript Error object
|
|
if (err instanceof Error && err.message) {
|
|
return err.message;
|
|
}
|
|
}
|
|
// Fallback to a translated message
|
|
return t(fallbackMessageKey);
|
|
};
|