diff --git a/app/lib/billActions.ts b/app/lib/billActions.ts index 08b6792..c66add7 100644 --- a/app/lib/billActions.ts +++ b/app/lib/billActions.ts @@ -150,6 +150,7 @@ export async function updateOrAddBill(locationId: string, billId?:string, prevSt } export async function gotoHome() { + revalidatePath('/'); redirect('/'); } diff --git a/app/page.tsx b/app/page.tsx index 83f5481..48523cb 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -4,8 +4,9 @@ import { AddMonthButton } from './ui/AddMonthButton'; import { AddLocationButton } from './ui/AddLocationButton'; import clientPromise from './lib/mongodb'; import { BillingLocation } from './lib/db-types'; +import { PageFooter } from './ui/PageFooter'; -const calcNextYearMonth = (yearMonth: number) => { +const getNextYearMonth = (yearMonth:number) => { return(yearMonth % 100 === 12 ? yearMonth + 89 : yearMonth + 1); } @@ -20,30 +21,42 @@ export const Page = async () => { .limit(20) .toArray(); + // if the database is in it's initial state, show the add location button for the current month + if(locations.length === 0) { + const currentYearMonth = new Date().getFullYear() * 100 + new Date().getMonth() + 1; + return ( +
+ + + +
+ ); + } + return (
- + { locations.map((location, ix, array) => { return ( <> { - location.yearMonth !== array[0].yearMonth && location.yearMonth !== array[ix-1].yearMonth ? : null - } - { - // show month title if it's the first location in the month - ix === 0 || location.yearMonth !== array[ix-1].yearMonth ? : null + // show month title above the first LocationCard in the month + ix === 0 || location.yearMonth !== array[ix-1].yearMonth ? + : null } + { + // show AddLocationButton as a last item in the firts month + location.yearMonth === array[0].yearMonth && location.yearMonth !== array[ix+1]?.yearMonth ? + : null + } ) }) } -

Docs

-

tailwindcss.com

-

heroicons.com

-

daisyui.com

+
); } diff --git a/app/ui/AddLocationButton.tsx b/app/ui/AddLocationButton.tsx index b3cceef..fbf0737 100644 --- a/app/ui/AddLocationButton.tsx +++ b/app/ui/AddLocationButton.tsx @@ -3,7 +3,7 @@ import { PlusCircleIcon } from "@heroicons/react/24/outline"; export interface AddLocationButtonProps { /** year month at which the new billing location should be addes */ - yyyymm: string + yyyymm: number } export const AddLocationButton:React.FC = ({yyyymm}) => diff --git a/app/ui/AddMonthButton.tsx b/app/ui/AddMonthButton.tsx index cee605f..dc62ed8 100644 --- a/app/ui/AddMonthButton.tsx +++ b/app/ui/AddMonthButton.tsx @@ -2,10 +2,10 @@ import { PlusCircleIcon } from "@heroicons/react/24/outline"; import React from "react"; export interface AddMonthButtonProps { - yearMonth: number; + nextYearMonth: number; } -export const AddMonthButton:React.FC = ({ yearMonth }) => - +export const AddMonthButton:React.FC = ({ nextYearMonth }) => + diff --git a/app/ui/PageFooter.tsx b/app/ui/PageFooter.tsx new file mode 100644 index 0000000..5cc62a6 --- /dev/null +++ b/app/ui/PageFooter.tsx @@ -0,0 +1,8 @@ +import React from "react"; + +export const PageFooter:React.FC = () => <> +

Docs

+

tailwindcss.com

+

heroicons.com

+

daisyui.com

+