From 8c054cedfc0dfd6f2261d53518dec5372834efcc Mon Sep 17 00:00:00 2001
From: Sheen Capadngan <sheensantoscapadngan@gmail.com>
Date: Wed, 5 Mar 2025 22:30:26 +0800
Subject: [PATCH] misc: added section for approval and rejections

---
 .../SecretApprovalRequestChanges.tsx          | 35 ++++++++++++++++++-
 1 file changed, 34 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx
index 56d25cbb2..aa73d7d07 100644
--- a/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx
+++ b/frontend/src/pages/secret-manager/SecretApprovalsPage/components/SecretApprovalRequest/components/SecretApprovalRequestChanges.tsx
@@ -372,7 +372,40 @@ export const SecretApprovalRequestChanges = ({
             )
           )}
         </div>
-        <div className="mt-8 flex items-center space-x-6 rounded-lg bg-mineshaft-800 px-5 py-6">
+        <div className="mt-4 flex flex-col items-center rounded-lg">
+          {secretApprovalRequestDetails?.policy?.approvers
+            .filter((requiredApprover) => reviewedUsers?.[requiredApprover.userId])
+            .map((requiredApprover) => {
+              const reviewer = reviewedUsers?.[requiredApprover.userId];
+              return (
+                <div
+                  className="mb-4 flex w-full flex-col rounded-md bg-mineshaft-800 p-6"
+                  key={`required-approver-${requiredApprover.userId}`}
+                >
+                  <div>
+                    <span className="ml-1">
+                      {`${requiredApprover.firstName || ""} ${requiredApprover.lastName || ""}`} (
+                      {requiredApprover?.email}) has{" "}
+                    </span>
+                    <span
+                      className={`${reviewer?.status === ApprovalStatus.APPROVED ? "text-green-500" : "text-red-500"}`}
+                    >
+                      {reviewer?.status === ApprovalStatus.APPROVED ? "approved" : "rejected"}
+                    </span>{" "}
+                    the request.
+                  </div>
+                  {reviewer?.comment && (
+                    <FormControl label="Comment" className="mb-0 mt-2">
+                      <TextArea value={reviewer.comment} isDisabled reSize="none">
+                        {reviewer?.comment && reviewer.comment}
+                      </TextArea>
+                    </FormControl>
+                  )}
+                </div>
+              );
+            })}
+        </div>
+        <div className="flex items-center space-x-6 rounded-lg bg-mineshaft-800 px-5 py-6">
           <SecretApprovalRequestAction
             canApprove={canApprove}
             approvalRequestId={secretApprovalRequestDetails.id}