diff --git a/src/components/PaymentRequest/ManagePaymentRequest.jsx b/src/components/PaymentRequest/ManagePaymentRequest.jsx
index b9cc5927..55f18cf0 100644
--- a/src/components/PaymentRequest/ManagePaymentRequest.jsx
+++ b/src/components/PaymentRequest/ManagePaymentRequest.jsx
@@ -11,8 +11,8 @@ import { formatFileSize, localToUtc } from '../../utils/appUtils';
 import { defaultPaymentRequest, PaymentRequestSchema } from './PaymentRequestSchema';
 
 function ManagePaymentRequest({ closeModal, requestToEdit = null }) {
-    const {data,isLoading,isError,error:requestError}= usePaymentRequestDetail(requestToEdit)
-// const data = {}
+    const { data, isLoading, isError, error: requestError } = usePaymentRequestDetail(requestToEdit)
+    // const data = {}
 
     const { projectNames, loading: projectLoading, error, isError: isProjectError,
     } = useProjectName();
@@ -25,7 +25,7 @@ function ManagePaymentRequest({ closeModal, requestToEdit = null }) {
         loading: ExpenseLoading,
         error: ExpenseError,
     } = useExpenseCategory();
-    
+
     const schema = PaymentRequestSchema(ExpenseTypes);
     const { register, control, watch, handleSubmit, setValue, reset, formState: { errors }, } = useForm({
         resolver: zodResolver(schema),
@@ -158,6 +158,7 @@ function ManagePaymentRequest({ closeModal, requestToEdit = null }) {
                 {requestToEdit ? "Update Payment Request " : "Create Payment Request"}
             </h5>
             <form id="expenseForm" onSubmit={handleSubmit(onSubmit)}>
+                {/* Project and Category */}
                 <div className="row my-2 text-start">
                     <div className="col-md-6">
                         <Label className="form-label" required>
@@ -214,90 +215,7 @@ function ManagePaymentRequest({ closeModal, requestToEdit = null }) {
 
                 </div>
 
-                <div className="row my-2 text-start">
-                    <div className="col-md-6">
-                        <Label htmlFor="dueDate" className="form-label" required>
-                            Due To Date
-                        </Label>
-                        <DatePicker
-                            name="dueDate"
-                            control={control}
-                            minDate={new Date()}
-                            className='w-100'
-                        />
-
-                        {errors.dueDate && (
-                            <small className="danger-text">
-                                {errors.dueDate.message}
-                            </small>
-                        )}
-                    </div>
-
-                    <div className="col-md-6">
-                        <Label htmlFor="amount" className="form-label" required>
-                            Amount
-                        </Label>
-                        <input
-                            type="number"
-                            id="amount"
-                            className="form-control form-control-sm"
-                            min="1"
-                            step="0.01"
-                            inputMode="decimal"
-                            {...register("amount", { valueAsNumber: true })}
-                        />
-                        {errors.amount && (
-                            <small className="danger-text">{errors.amount.message}</small>
-                        )}
-                    </div>
-                </div>
-
-                <div className="row my-2 text-start">
-                    <div className="col-md-6">
-                        <Label htmlFor="payee" className="form-label" required>
-                            Supplier Name/Transporter Name/Other
-                        </Label>
-                        <input
-                            type="text"
-                            id="payee"
-                            className="form-control form-control-sm"
-                            {...register("payee")}
-                        />
-                        {errors.payee && (
-                            <small className="danger-text">
-                                {errors.payee.message}
-                            </small>
-                        )}
-                    </div>
-
-                    <div className="col-md-6">
-                        <Label htmlFor="currencyId" className="form-label" required>
-                            Currency
-                        </Label>
-                        <select
-                            id="currencyId"
-                            className="form-select form-select-sm"
-                            {...register("currencyId")}
-                        >
-                            <option value="">Select Currency</option>
-
-                            {currencyLoading && <option>Loading...</option>}
-
-                            {!currencyLoading &&
-                                !currencyError &&
-                                currencyData?.map((currency) => (
-                                    <option key={currency.id} value={currency.id}>
-                                        {`${currency.currencyName} (${currency.symbol})`}
-                                    </option>
-                                ))}
-                        </select>
-                        {errors.currencyId && (
-                            <small className="danger-text">{errors.currencyId.message}</small>
-                        )}
-                    </div>
-
-                </div>
-
+                {/* Title and Advance Payment  */}
                 <div className="row my-2 text-start">
                     <div className="col-md-6">
                         <Label htmlFor="title" className="form-label" required>
@@ -339,6 +257,94 @@ function ManagePaymentRequest({ closeModal, requestToEdit = null }) {
 
                 </div>
 
+
+                {/* Date and Amount */}
+                <div className="row my-2 text-start">
+                    <div className="col-md-6">
+                        <Label htmlFor="dueDate" className="form-label" required>
+                            Due To Date
+                        </Label>
+                        <DatePicker
+                            name="dueDate"
+                            control={control}
+                            minDate={new Date()}
+                            className='w-100'
+                        />
+
+                        {errors.dueDate && (
+                            <small className="danger-text">
+                                {errors.dueDate.message}
+                            </small>
+                        )}
+                    </div>
+
+                    <div className="col-md-6">
+                        <Label htmlFor="amount" className="form-label" required>
+                            Amount
+                        </Label>
+                        <input
+                            type="number"
+                            id="amount"
+                            className="form-control form-control-sm"
+                            min="1"
+                            step="0.01"
+                            inputMode="decimal"
+                            {...register("amount", { valueAsNumber: true })}
+                        />
+                        {errors.amount && (
+                            <small className="danger-text">{errors.amount.message}</small>
+                        )}
+                    </div>
+                </div>
+
+                {/* Payee and Currency  */}
+                <div className="row my-2 text-start">
+                    <div className="col-md-6">
+                        <Label htmlFor="payee" className="form-label" required>
+                            Payee(Supplier Name/Transporter Name/Other)
+                        </Label>
+                        <input
+                            type="text"
+                            id="payee"
+                            className="form-control form-control-sm"
+                            {...register("payee")}
+                        />
+                        {errors.payee && (
+                            <small className="danger-text">
+                                {errors.payee.message}
+                            </small>
+                        )}
+                    </div>
+
+                    <div className="col-md-6">
+                        <Label htmlFor="currencyId" className="form-label" required>
+                            Currency
+                        </Label>
+                        <select
+                            id="currencyId"
+                            className="form-select form-select-sm"
+                            {...register("currencyId")}
+                        >
+                            <option value="">Select Currency</option>
+
+                            {currencyLoading && <option>Loading...</option>}
+
+                            {!currencyLoading &&
+                                !currencyError &&
+                                currencyData?.map((currency) => (
+                                    <option key={currency.id} value={currency.id}>
+                                        {`${currency.currencyName} (${currency.symbol})`}
+                                    </option>
+                                ))}
+                        </select>
+                        {errors.currencyId && (
+                            <small className="danger-text">{errors.currencyId.message}</small>
+                        )}
+                    </div>
+
+                </div>                
+
+                {/* Description  */}
                 <div className="row my-2 text-start">
                     <div className="col-md-12">
                         <Label htmlFor="description" className="form-label" required>
@@ -358,6 +364,7 @@ function ManagePaymentRequest({ closeModal, requestToEdit = null }) {
                     </div>
                 </div>
 
+                {/* Upload Document  */}
                 <div className="row my-2 text-start">
                     <div className="col-md-12">
                         <Label className="form-label">