(refactor + bugfix) Improve data structure and handle empty database edge cases
Refactored months data structure from object to array for better performance and cleaner iteration. Fixed crash when availableYears array is empty by adding proper guards and fallback to current year. Changes: - MonthLocationList: Changed months prop from object to array type - HomePage: Refactored reduce logic to build array instead of object - HomePage: Added empty database handling in year selection logic - HomePage: Added early returns for invalid year params in empty DB Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -22,22 +22,22 @@ const getNextYearMonth = (yearMonth:YearMonth) => {
|
||||
} as YearMonth);
|
||||
}
|
||||
|
||||
export type MonthArray = Array<{
|
||||
yearMonth: YearMonth;
|
||||
locations: BillingLocation[];
|
||||
payedTotal: number;
|
||||
unpaidTotal: number;
|
||||
}>;
|
||||
|
||||
export interface MonthLocationListProps {
|
||||
availableYears?: number[];
|
||||
months?: {
|
||||
[key: string]: {
|
||||
yearMonth: YearMonth;
|
||||
locations: BillingLocation[];
|
||||
payedTotal: number;
|
||||
unpaidTotal: number;
|
||||
};
|
||||
};
|
||||
availableYears: number[];
|
||||
months: MonthArray;
|
||||
userSettings?: UserSettings | null;
|
||||
}
|
||||
|
||||
export const MonthLocationList:React.FC<MonthLocationListProps > = ({
|
||||
availableYears,
|
||||
months,
|
||||
months: activeYearMonths,
|
||||
userSettings,
|
||||
}) => {
|
||||
|
||||
@@ -93,7 +93,7 @@ export const MonthLocationList:React.FC<MonthLocationListProps > = ({
|
||||
}
|
||||
}, [search, router, t]);
|
||||
|
||||
if(!availableYears || !months) {
|
||||
if(availableYears.length === 0 || activeYearMonths.length === 0) {
|
||||
const currentYearMonth:YearMonth = {
|
||||
year: new Date().getFullYear(),
|
||||
month: new Date().getMonth() + 1
|
||||
@@ -107,8 +107,6 @@ export const MonthLocationList:React.FC<MonthLocationListProps > = ({
|
||||
</>)
|
||||
};
|
||||
|
||||
const monthsArray = Object.entries(months);
|
||||
|
||||
// when the month is toggled, update the URL
|
||||
// and set the the new expandedMonth
|
||||
const handleMonthToggle = (yearMonth:YearMonth) => {
|
||||
@@ -123,10 +121,10 @@ export const MonthLocationList:React.FC<MonthLocationListProps > = ({
|
||||
}
|
||||
|
||||
return(<>
|
||||
<AddMonthButton yearMonth={getNextYearMonth(monthsArray[0][1].locations[0].yearMonth)} />
|
||||
<AddMonthButton yearMonth={getNextYearMonth(activeYearMonths[0].locations[0].yearMonth)} />
|
||||
{
|
||||
monthsArray.map(([monthKey, { yearMonth, locations, unpaidTotal, payedTotal }], monthIx) =>
|
||||
<MonthCard yearMonth={yearMonth} key={`month-${monthKey}`} unpaidTotal={unpaidTotal} payedTotal={payedTotal} currency={userSettings?.currency} expanded={ yearMonth.month === expandedMonth } onToggle={handleMonthToggle} >
|
||||
activeYearMonths.map(({ yearMonth, locations, unpaidTotal, payedTotal }, monthIx) =>
|
||||
<MonthCard yearMonth={yearMonth} key={`month-${yearMonth.year}-${yearMonth.month}`} unpaidTotal={unpaidTotal} payedTotal={payedTotal} currency={userSettings?.currency} expanded={ yearMonth.month === expandedMonth } onToggle={handleMonthToggle} >
|
||||
{
|
||||
yearMonth.month === expandedMonth ?
|
||||
locations.map((location, ix) => <LocationCard key={`location-${location._id}`} location={location} currency={userSettings?.currency} />)
|
||||
|
||||
Reference in New Issue
Block a user