From 4ef2330ad4fbe58d2260825110e825b523b05ff8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= Date: Tue, 6 Feb 2024 14:48:19 +0100 Subject: [PATCH 1/3] Added suspense to LocationAddPage and LocationDetelePage --- app/location/[id]/add/LocationAddPage.tsx | 9 ++++++ app/location/[id]/add/page.tsx | 13 +++++++-- .../[id]/delete/LocationDeletePage.tsx | 14 +++++++++ app/location/[id]/delete/page.tsx | 17 ++++++----- app/location/[id]/edit/LocationEditPage.tsx | 2 +- app/ui/LocationDeleteForm.tsx | 29 +++++++++---------- app/ui/LocationEditForm.tsx | 4 +-- 7 files changed, 60 insertions(+), 28 deletions(-) create mode 100644 app/location/[id]/add/LocationAddPage.tsx create mode 100644 app/location/[id]/delete/LocationDeletePage.tsx diff --git a/app/location/[id]/add/LocationAddPage.tsx b/app/location/[id]/add/LocationAddPage.tsx new file mode 100644 index 0000000..ebef49f --- /dev/null +++ b/app/location/[id]/add/LocationAddPage.tsx @@ -0,0 +1,9 @@ +import { notFound } from 'next/navigation'; +import { LocationEditForm } from '@/app/ui/LocationEditForm'; +import { fetchLocationById } from '@/app/lib/actions/locationActions'; +import { YearMonth } from '@/app/lib/db-types'; +import { Main } from '@/app/ui/Main'; + +export default async function LocationAddPage({ yearMonth }: { yearMonth:YearMonth }) { + return (); +} \ No newline at end of file diff --git a/app/location/[id]/add/page.tsx b/app/location/[id]/add/page.tsx index 24abc7a..fed90e0 100644 --- a/app/location/[id]/add/page.tsx +++ b/app/location/[id]/add/page.tsx @@ -1,6 +1,15 @@ import { parseYearMonth } from '@/app/lib/format'; -import { LocationEditForm } from '@/app/ui/LocationEditForm'; +import { LocationEditFormSkeleton } from '@/app/ui/LocationEditForm'; +import LocationAddPage from './LocationAddPage'; +import { Main } from '@/app/ui/Main'; +import { Suspense } from 'react'; export default async function Page({ params:{ id } }: { params: { id:string } }) { - return (); + return ( +
+ }> + + +
+ ); } \ No newline at end of file diff --git a/app/location/[id]/delete/LocationDeletePage.tsx b/app/location/[id]/delete/LocationDeletePage.tsx new file mode 100644 index 0000000..7377733 --- /dev/null +++ b/app/location/[id]/delete/LocationDeletePage.tsx @@ -0,0 +1,14 @@ +import { notFound } from 'next/navigation'; +import { fetchLocationById } from '@/app/lib/actions/locationActions'; +import { LocationDeleteForm } from '@/app/ui/LocationDeleteForm'; + +export const LocationDeletePage = async ({ locationId }: { locationId:string }) => { + + const location = await fetchLocationById(locationId); + + if (!location) { + return(notFound()); + } + + return (); +} \ No newline at end of file diff --git a/app/location/[id]/delete/page.tsx b/app/location/[id]/delete/page.tsx index f4d8d44..6ae17d5 100644 --- a/app/location/[id]/delete/page.tsx +++ b/app/location/[id]/delete/page.tsx @@ -1,14 +1,17 @@ import { notFound } from 'next/navigation'; import { fetchLocationById } from '@/app/lib/actions/locationActions'; import { LocationDeleteForm } from '@/app/ui/LocationDeleteForm'; +import { Main } from '@/app/ui/Main'; +import { Suspense } from 'react'; +import { LocationDeletePage } from './LocationDeletePage'; export default async function Page({ params:{ id } }: { params: { id:string } }) { - const location = await fetchLocationById(id); - - if (!location) { - return(notFound()); - } - - return (); + return ( +
+ Loading...}> + + +
+ ); } \ No newline at end of file diff --git a/app/location/[id]/edit/LocationEditPage.tsx b/app/location/[id]/edit/LocationEditPage.tsx index 50d0b31..505f634 100644 --- a/app/location/[id]/edit/LocationEditPage.tsx +++ b/app/location/[id]/edit/LocationEditPage.tsx @@ -10,7 +10,7 @@ export default async function LocationEditPage({ locationId }: { locationId:stri return(notFound()); } - const result = ; + const result = ; return (result); } \ No newline at end of file diff --git a/app/ui/LocationDeleteForm.tsx b/app/ui/LocationDeleteForm.tsx index ad2f3c8..35eb104 100644 --- a/app/ui/LocationDeleteForm.tsx +++ b/app/ui/LocationDeleteForm.tsx @@ -4,7 +4,6 @@ import { FC } from "react"; import { BillingLocation } from "../lib/db-types"; import { deleteLocationById } from "../lib/actions/locationActions"; import { useFormState } from "react-dom"; -import { Main } from "./Main"; import { gotoUrl } from "../lib/actions/navigationActions"; import Link from "next/link"; @@ -23,20 +22,18 @@ export const LocationDeleteForm:FC = ({ location }) => }; return( -
-
-
-
-

- Please confirm deletion of location “{location.name}”. -

-
- - Cancel -
-
-
+
+
+
+

+ Please confirm deletion of location “{location.name}”. +

+
+ + Cancel +
+
-
- ) + + ); } diff --git a/app/ui/LocationEditForm.tsx b/app/ui/LocationEditForm.tsx index 31568d8..5dfb14c 100644 --- a/app/ui/LocationEditForm.tsx +++ b/app/ui/LocationEditForm.tsx @@ -12,10 +12,10 @@ export type LocationEditFormProps = { /** location which should be edited */ location: BillingLocation, /** year adn month at a new billing location should be assigned */ - yearMonth: undefined + yearMonth?: undefined } | { /** location which should be edited */ - location: undefined, + location?: undefined, /** year adn month at a new billing location should be assigned */ yearMonth: YearMonth } From 79e8e1279c25697410a8c30207cb1ade9db0be34 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= Date: Tue, 6 Feb 2024 15:07:52 +0100 Subject: [PATCH 2/3] BugFix: saving location did not redirect user --- app/ui/LocationEditForm.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/ui/LocationEditForm.tsx b/app/ui/LocationEditForm.tsx index 5dfb14c..9b4aa27 100644 --- a/app/ui/LocationEditForm.tsx +++ b/app/ui/LocationEditForm.tsx @@ -23,7 +23,7 @@ export type LocationEditFormProps = { export const LocationEditForm:FC = ({ location, yearMonth }) => { const initialState = { message: null, errors: {} }; - const handleAction = updateOrAddLocation.bind(null, location?._id, yearMonth); + const handleAction = updateOrAddLocation.bind(null, location?._id, location?.yearMonth ?? yearMonth); const [ state, dispatch ] = useFormState(handleAction, initialState); let { year, month } = location ? location.yearMonth : yearMonth; From 1bc12d222c15761d4e63e0926b7f56ed10a44cdd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= Date: Tue, 6 Feb 2024 15:08:09 +0100 Subject: [PATCH 3/3] updated compose file --- docker-compose-deploy.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docker-compose-deploy.yml b/docker-compose-deploy.yml index d5b5838..a39518f 100644 --- a/docker-compose-deploy.yml +++ b/docker-compose-deploy.yml @@ -9,7 +9,7 @@ networks: services: web-app: - image: utility-bills-tracker:1.7.0 + image: utility-bills-tracker:1.8.0 networks: - traefik-network - mongo-network