refactor(FE): Move error alert to top of purchase forms

src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx

@@ -352,6 +352,12 @@ const PurchaseOrderAcceptApprovalForm = ({
       onSubmit={formik.handleSubmit}
       className='w-full flex flex-col gap-6'
     >
+      {purchaseOrderFormErrorMessage && (
+        <div role='alert' className='alert alert-error'>
+          <Icon icon='material-symbols:error-outline' width={24} height={24} />
+          <span>{purchaseOrderFormErrorMessage}</span>
+        </div>
+      )}
       <div className='w-full'>
         <h2 className='text-lg font-semibold mb-4'>
           {type === 'add'
@@ -748,17 +754,6 @@ const PurchaseOrderAcceptApprovalForm = ({
             </Button>
           </div>
         </div>
-
-        {purchaseOrderFormErrorMessage && (
-          <div role='alert' className='alert alert-error'>
-            <Icon
-              icon='material-symbols:error-outline'
-              width={24}
-              height={24}
-            />
-            <span>{purchaseOrderFormErrorMessage}</span>
-          </div>
-        )}
       </div>
     </form>
   );

src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx

@@ -656,6 +656,16 @@ const PurchaseOrderStaffApprovalForm = ({
         onSubmit={formik.handleSubmit}
         className='w-full flex flex-col gap-6'
       >
+        {purchaseOrderFormErrorMessage && (
+          <div role='alert' className='alert alert-error'>
+            <Icon
+              icon='material-symbols:error-outline'
+              width={24}
+              height={24}
+            />
+            <span>{purchaseOrderFormErrorMessage}</span>
+          </div>
+        )}
         <div className='w-full'>
           <h2 className='text-lg font-semibold mb-4'>
             {type === 'add'
@@ -1170,17 +1180,6 @@ const PurchaseOrderStaffApprovalForm = ({
               </Button>
             </div>
           </div>
-
-          {purchaseOrderFormErrorMessage && (
-            <div role='alert' className='alert alert-error'>
-              <Icon
-                icon='material-symbols:error-outline'
-                width={24}
-                height={24}
-              />
-              <span>{purchaseOrderFormErrorMessage}</span>
-            </div>
-          )}
         </div>
       </form>
 

src/components/pages/purchase/form/request/PurchaseRequestForm.tsx

@@ -491,6 +491,16 @@ const PurchaseRequestForm = ({
           onReset={formik.handleReset}
           className='w-full mt-8 flex flex-col gap-6'
         >
+          {purchaseRequestFormErrorMessage && (
+            <div role='alert' className='alert alert-error'>
+              <Icon
+                icon='material-symbols:error-outline'
+                width={24}
+                height={24}
+              />
+              <span>{purchaseRequestFormErrorMessage}</span>
+            </div>
+          )}
           {/* Basic Info Card */}
           <Card
             title='Informasi Purchase Request'
@@ -935,17 +945,6 @@ const PurchaseRequestForm = ({
               </div>
             )}
           </div>
-
-          {purchaseRequestFormErrorMessage && (
-            <div role='alert' className='alert alert-error'>
-              <Icon
-                icon='material-symbols:error-outline'
-                width={24}
-                height={24}
-              />
-              <span>{purchaseRequestFormErrorMessage}</span>
-            </div>
-          )}
         </form>
       </section>