From 272bed12b28763b6f51b97012a4533ab17a561ae Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Wed, 6 Mar 2024 10:11:18 +0700
Subject: validation step approval

---
 src/lib/transaction/components/stepper.jsx | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

(limited to 'src/lib/transaction/components/stepper.jsx')

diff --git a/src/lib/transaction/components/stepper.jsx b/src/lib/transaction/components/stepper.jsx
index 54243946..bc3f6fd8 100644
--- a/src/lib/transaction/components/stepper.jsx
+++ b/src/lib/transaction/components/stepper.jsx
@@ -15,9 +15,9 @@ import Image from 'next/image';
 
 const StepApproval = ({ layer, status }) => {
   const steps = [
-    { title: 'Indoteknik', description: 'Contact Info', layer_approval: 1 },
-    { title: 'Manager', description: 'Date & Time', layer_approval: 2 },
-    { title: 'Director', description: 'Select Rooms', layer_approval: 3 },
+    { title: 'Indoteknik', layer_approval: 1 },
+    { title: 'Manager', layer_approval: 2 },
+    { title: 'Director', layer_approval: 3 },
   ];
   const { activeStep } = useSteps({
     index: layer,
@@ -28,7 +28,7 @@ const StepApproval = ({ layer, status }) => {
       {steps.map((step, index) => (
         <Step key={index}>
           <StepIndicator>
-            { layer === step.layer_approval && status === 'cancel' ? (
+            {layer === step.layer_approval && status === 'cancel' ? (
               <StepStatus
                 complete={
                   <Image
@@ -53,8 +53,17 @@ const StepApproval = ({ layer, status }) => {
 
           <Box flexShrink='0'>
             <StepTitle className='md:text-xs'>{step.title}</StepTitle>
-            <StepDescription className='md:text-[8px]'>{step.description}</StepDescription>
+            {layer > step.layer_approval && (
+              <StepDescription className='md:text-[8px]'>Approved</StepDescription>
+            )}
+            {layer === step.layer_approval && status === 'cancel' && (
+              <StepDescription className='md:text-[8px]'>Rejected</StepDescription>
+            )}
+            {layer < step.layer_approval && (
+              <StepDescription className='md:text-[8px]'>Pending</StepDescription>
+            )}
           </Box>
+          <StepSeparator _horizontal={{ ml: '0' }} />
         </Step>
       ))}
     </Stepper>
-- 
cgit v1.2.3

