From 76ddedf6528969035caaf5f52c44ca8878e558dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= Date: Thu, 4 Jan 2024 15:38:58 +0100 Subject: [PATCH] =?UTF-8?q?Bill=20Edit=20Form:=20dovr=C5=A1en=20fetch?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/bills/[id]/edit/not-found.tsx | 18 +++++++++++++++++ app/bills/[id]/edit/page.tsx | 32 +++++++++++++++++++++++++++++++ app/lib/db-types.ts | 4 ++-- app/page.tsx | 4 ++-- app/ui/BillBadge.tsx | 11 ++++++++--- app/ui/BillEditForm.tsx | 18 ++++++++++------- app/ui/LocationCard.tsx | 4 ++-- 7 files changed, 75 insertions(+), 16 deletions(-) create mode 100644 app/bills/[id]/edit/not-found.tsx create mode 100644 app/bills/[id]/edit/page.tsx diff --git a/app/bills/[id]/edit/not-found.tsx b/app/bills/[id]/edit/not-found.tsx new file mode 100644 index 0000000..2475d26 --- /dev/null +++ b/app/bills/[id]/edit/not-found.tsx @@ -0,0 +1,18 @@ +import Link from 'next/link'; +import { FaceFrownIcon } from '@heroicons/react/24/outline'; + +export default function NotFound() { + return ( +
+ +

404 Bill Not Found

+

Could not find the requested Bill.

+ + Go Back + +
+ ); +} \ No newline at end of file diff --git a/app/bills/[id]/edit/page.tsx b/app/bills/[id]/edit/page.tsx new file mode 100644 index 0000000..185a625 --- /dev/null +++ b/app/bills/[id]/edit/page.tsx @@ -0,0 +1,32 @@ +import { Location } from '@/app/lib/db-types'; +import clientPromise from '@/app/lib/mongodb'; +import { BillEditForm } from '@/app/ui/BillEditForm'; +import { ObjectId } from 'mongodb'; +import { notFound } from 'next/navigation'; + +const fetchBillById = async (locationID:string, billID:string) => { + const client = await clientPromise; + const db = client.db("rezije"); + + // find a location with the given locationID + const billLocation = await db.collection("lokacije").findOne({ _id: locationID }) + // find a bill with the given billID + return(billLocation?.bills.find(({ _id }) => _id.toString() === billID)) +} + +export default async function Page({ params:{ id } }: { params: { id:string } }) { + + const [invoiceID, billID] = id.split('-'); + + const bill = await fetchBillById(invoiceID, billID); + + if (!bill) { + console.log('Bill not found'); + notFound(); + } + return ( +
+ +
+ ); +} \ No newline at end of file diff --git a/app/lib/db-types.ts b/app/lib/db-types.ts index 6d83665..5c8506a 100644 --- a/app/lib/db-types.ts +++ b/app/lib/db-types.ts @@ -1,7 +1,7 @@ import { ObjectId } from "mongodb"; export interface Location { - id: ObjectId; + _id: string; name: string; bills: Bill[]; /** the value is encoded as yyyymm (i.e. 202301) */ @@ -9,7 +9,7 @@ export interface Location { }; export interface Bill { - id: ObjectId; + _id: ObjectId; name: string; paid: boolean; document?: string|null; diff --git a/app/page.tsx b/app/page.tsx index 22e9c0d..30897fc 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -28,11 +28,11 @@ export const Page = async () => { return ( <> { - location.yearMonth !== array[0].yearMonth && location.yearMonth !== array[ix-1].yearMonth ? : null + 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 + ix === 0 || location.yearMonth !== array[ix-1].yearMonth ? : null } diff --git a/app/ui/BillBadge.tsx b/app/ui/BillBadge.tsx index dc40be7..79b8f72 100644 --- a/app/ui/BillBadge.tsx +++ b/app/ui/BillBadge.tsx @@ -1,9 +1,14 @@ import { FC } from "react" -import { Bill } from "../lib/db-types" +import { Bill, Location } from "@/app/lib/db-types" +import Link from "next/link" +import { ObjectId } from "mongodb"; export interface BillBadgeProps { + locationId: ObjectId, bill: Bill }; -export const BillBadge:FC = ({bill: { name, paid }}) => -
{name}
\ No newline at end of file +export const BillBadge:FC = ({ locationId, bill: { _id: billId, name, paid }}) => + + {name} +; \ No newline at end of file diff --git a/app/ui/BillEditForm.tsx b/app/ui/BillEditForm.tsx index c8e05dc..1546144 100644 --- a/app/ui/BillEditForm.tsx +++ b/app/ui/BillEditForm.tsx @@ -1,22 +1,26 @@ import { Cog8ToothIcon, DocumentIcon, TrashIcon } from "@heroicons/react/24/outline"; import { Bill } from "../lib/db-types"; import { FC } from "react"; +import { ObjectId } from "mongodb"; export interface BillEditFormProps { + invoiceID: string, bill: Bill } -export const BillEditForm:FC = ({ bill: { name, description, paid } }) => +export const BillEditForm:FC = ({ bill: { name, paid } }) =>
- - - - - 2023-22-12 document GSKG račun za 2023.pdf - + + { + // + // + // + // 2023-22-12 document GSKG račun za 2023.pdf + // + }