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 } }) =>