AYS-283 | Creating Emergency Evacuation Application Detail Page (#206)

Author: sanshigo345

src/app/(private)/admin-registration-applications/[id]/page.tsx

@@ -14,7 +14,7 @@ import {
 } from '@/components/ui/form'
 import { useForm } from 'react-hook-form'
 import { zodResolver } from '@hookform/resolvers/zod'
-import { FormSchema } from '@/modules/adminRegistrationApplications/constants/formSchema'
+import { FormSchema } from '@/modules/adminRegistrationApplications/constants/formValidationSchema'
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { useTranslation } from 'react-i18next'
 import { LoadingSpinner } from '@/components/ui/loadingSpinner'
@@ -30,6 +30,8 @@ import {
   DialogTrigger,
 } from '@/components/ui/dialog'
 import { DialogDescription } from '@radix-ui/react-dialog'
+import PrivateRoute from '@/app/hocs/isAuth'
+import { Permission } from '@/constants/permissions'
 
 const Page = ({ params }: { params: { slug: string; id: string } }) => {
   const { t } = useTranslation()
@@ -49,15 +51,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
     const fetchDetails = () => {
       getAdminRegistrationApplication(params.id)
         .then((response) => {
-          if (response.data.isSuccess) {
-            setAdminRegistrationApplicationDetails(response.data.response)
-          } else {
-            toast({
-              title: t('error'),
-              description: t('applicationError'),
-              variant: 'destructive',
-            })
-          }
+          setAdminRegistrationApplicationDetails(response.response)
         })
         .catch(() => {
           toast({
@@ -68,19 +62,21 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
         })
         .finally(() => setIsLoading(false))
     }
-
+  
     fetchDetails()
   }, [params.id, t, toast])
+  
 
   return (
+    // <PrivateRoute requiredPermissions={[Permission.APPLICATION_DETAIL]}>
     <div className="p-6 bg-white dark:bg-gray-800 rounded-md shadow-md text-black dark:text-white">
       {isLoading && <LoadingSpinner />}
       {!isLoading && adminRegistrationApplicationDetails && (
         <Form {...form}>
           <form className="space-y-6">
             <div className="flex justify-between items-center mb-6">
               <h1 className="text-2xl font-bold">
-                {t('applicationDetailsTitle')}
+                {t('adminRegistrationApplications.detailsTitle')}
               </h1>
               {adminRegistrationApplicationDetails.status === 'COMPLETED' && (
                 <div className="flex space-x-8 ml-auto">
@@ -157,7 +153,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
                     name="reason"
                     render={({ field }) => (
                       <FormItem className="sm:col-span-2">
-                        <FormLabel>{t('reason')}</FormLabel>
+                        <FormLabel>{t('adminRegistrationApplications.reason')}</FormLabel>
                         <FormControl>
                           <Input
                             {...field}
@@ -194,7 +190,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
                     name="status"
                     render={({ field }) => (
                       <FormItem className="sm:col-span-1">
-                        <FormLabel>{t('applicationStatus')}</FormLabel>
+                        <FormLabel>{t('adminRegistrationApplications.status')}</FormLabel>
                         <FormControl>
                           <Input
                             {...field}
@@ -236,7 +232,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
                     name="createdUser"
                     render={({ field }) => (
                       <FormItem className="sm:col-span-1">
-                        <FormLabel>{t('applicationCreatedUser')}</FormLabel>
+                        <FormLabel>{t('adminRegistrationApplications.createdUser')}</FormLabel>
                         <FormControl>
                           <Input
                             {...field}
@@ -255,7 +251,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
                     name="createDate"
                     render={({ field }) => (
                       <FormItem className="sm:col-span-1">
-                        <FormLabel>{t('createDate')}</FormLabel>
+                        <FormLabel>{t('adminRegistrationApplications.createdAt')}</FormLabel>
                         <FormControl>
                           <Input
                             {...field}
@@ -296,7 +292,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
                     name="updateDate"
                     render={({ field }) => (
                       <FormItem className="sm:col-span-1">
-                        <FormLabel>{t('updateDate')}</FormLabel>
+                        <FormLabel>{t('adminRegistrationApplications.updatedAt')}</FormLabel>
                         <FormControl>
                           <Input
                             {...field}
@@ -434,6 +430,7 @@ const Page = ({ params }: { params: { slug: string; id: string } }) => {
         </Form>
       )}
     </div>
+    // </PrivateRoute>
   )
 }
 

src/app/(private)/admin-registration-applications/page.tsx

@@ -81,7 +81,7 @@ const Page = () => {
         >
           <div className="flex flex-col w-full gap-4">
             <h1 className="text-2xl font-medium">
-              {t('adminRegistrationApplications')}
+              {t('adminRegistrationApplications.title')}
             </h1>
             <DataTableToolbar table={table} filterFields={filterFields} />
           </div>