From b39e8325f887a953d382cdcd64ed242db2e79bb8 Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Thu, 6 Nov 2025 17:47:34 +0700
Subject: [PATCH] feat(FE-170): simplify action buttons in RecordingForm for
 detail view

---
 .../recording/form/RecordingForm.tsx          | 74 +++++++++----------
 1 file changed, 36 insertions(+), 38 deletions(-)

diff --git a/src/components/pages/production/recording/form/RecordingForm.tsx b/src/components/pages/production/recording/form/RecordingForm.tsx
index dc9f4865..f20d4cb5 100644
--- a/src/components/pages/production/recording/form/RecordingForm.tsx
+++ b/src/components/pages/production/recording/form/RecordingForm.tsx
@@ -2414,42 +2414,40 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
           {/* Action buttons */}
           <div className='flex flex-row justify-between gap-2 flex-wrap'>
             {/* Left side - Detail & Edit actions */}
-            {type !== 'add' && !isRecordingApproved(initialValues) && (
-              <div className='flex flex-row justify-start gap-2'>
-                {type === 'detail' && deleteRecordingClickHandler && (
-                  <Button
-                    type='button'
-                    color='error'
-                    onClick={deleteRecordingClickHandler}
-                    className='px-4'
-                  >
-                    <Icon
-                      icon='material-symbols:delete-outline-rounded'
-                      width={24}
-                      height={24}
-                      className='justify-start text-sm'
-                    />
-                    Delete
-                  </Button>
-                )}
-                {type === 'detail' && initialValues && (
-                  <Button
-                    type='button'
-                    color='warning'
-                    href={`/production/recording/detail/edit/?recordingId=${initialValues.id}`}
-                    className='px-4'
-                  >
-                    <Icon
-                      icon='material-symbols:edit-outline'
-                      width={24}
-                      height={24}
-                      className='justify-start text-sm'
-                    />
-                    Edit
-                  </Button>
-                )}
-              </div>
-            )}
+            <div className='flex flex-row justify-start gap-2'>
+              {type === 'detail' && deleteRecordingClickHandler && (
+                <Button
+                  type='button'
+                  color='error'
+                  onClick={deleteRecordingClickHandler}
+                  className='px-4'
+                >
+                  <Icon
+                    icon='material-symbols:delete-outline-rounded'
+                    width={24}
+                    height={24}
+                    className='justify-start text-sm'
+                  />
+                  Delete
+                </Button>
+              )}
+              {type === 'detail' && initialValues && (
+                <Button
+                  type='button'
+                  color='warning'
+                  href={`/production/recording/detail/edit/?recordingId=${initialValues.id}`}
+                  className='px-4'
+                >
+                  <Icon
+                    icon='material-symbols:edit-outline'
+                    width={24}
+                    height={24}
+                    className='justify-start text-sm'
+                  />
+                  Edit
+                </Button>
+              )}
+            </div>
             <div className='flex flex-row justify-end gap-2'>
               {type === 'detail' && isLayingCategory && (
                 <Button
@@ -2494,7 +2492,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                 <>
                   <Button
                     type='reset'
-                    color='neutral'
+                    color='warning'
                     className='px-4'
                     onClick={(e) => {
                       formik.handleReset(e);
@@ -2569,7 +2567,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
       </section>
 
       {/* ===== MODALS ===== */}
-      {type !== 'add' && !isRecordingApproved(initialValues) && (
+      {type === 'detail' && (
         <>
           <ConfirmationModal
             ref={deleteModal.ref}