From e61ee669af2f800999b016a35b9f58e92bebb31e Mon Sep 17 00:00:00 2001
From: Usame Algan <5880855+usame-algan@users.noreply.github.com>
Date: Fri, 25 Oct 2024 17:18:10 +0200
Subject: [PATCH] feat: Show Proposal chip for unsigned transactions in the
 queue (#4422)

---
 .../transactions/TxSummary/index.tsx          | 13 +++++---
 .../proposers/components/TxProposalChip.tsx   | 32 +++++++++++++++++++
 2 files changed, 41 insertions(+), 4 deletions(-)
 create mode 100644 src/features/proposers/components/TxProposalChip.tsx

diff --git a/src/components/transactions/TxSummary/index.tsx b/src/components/transactions/TxSummary/index.tsx
index 3763d60fb8..1b786f7e42 100644
--- a/src/components/transactions/TxSummary/index.tsx
+++ b/src/components/transactions/TxSummary/index.tsx
@@ -1,3 +1,4 @@
+import TxProposalChip from '@/features/proposers/components/TxProposalChip'
 import StatusLabel from '@/features/swap/components/StatusLabel'
 import useIsExpiredSwap from '@/features/swap/hooks/useIsExpiredSwap'
 import { Box } from '@mui/material'
@@ -74,10 +75,14 @@ const TxSummary = ({ item, isConflictGroup, isBulkGroup }: TxSummaryProps): Reac
 
       {isQueue && executionInfo && (
         <Box gridArea="confirmations">
-          <TxConfirmations
-            submittedConfirmations={executionInfo.confirmationsSubmitted}
-            requiredConfirmations={executionInfo.confirmationsRequired}
-          />
+          {executionInfo.confirmationsSubmitted > 0 ? (
+            <TxConfirmations
+              submittedConfirmations={executionInfo.confirmationsSubmitted}
+              requiredConfirmations={executionInfo.confirmationsRequired}
+            />
+          ) : (
+            <TxProposalChip />
+          )}
         </Box>
       )}
 
diff --git a/src/features/proposers/components/TxProposalChip.tsx b/src/features/proposers/components/TxProposalChip.tsx
new file mode 100644
index 0000000000..ee77076164
--- /dev/null
+++ b/src/features/proposers/components/TxProposalChip.tsx
@@ -0,0 +1,32 @@
+import { Chip, SvgIcon, Tooltip, Typography } from '@mui/material'
+import InfoIcon from '@/public/images/notifications/info.svg'
+
+const TxProposalChip = () => {
+  return (
+    <Tooltip title="This transaction was created by a Proposer. Reject or confirm it to proceed.">
+      <span>
+        <Chip
+          sx={{ backgroundColor: 'background.main', color: 'primary.light' }}
+          size="small"
+          label={
+            <Typography
+              variant="caption"
+              fontWeight="bold"
+              display="flex"
+              alignItems="center"
+              justifyContent="center"
+              gap={0.7}
+            >
+              <SvgIcon component={InfoIcon} inheritViewBox fontSize="small" />
+              <Typography variant="caption" fontWeight="bold">
+                Proposal
+              </Typography>
+            </Typography>
+          }
+        />
+      </span>
+    </Tooltip>
+  )
+}
+
+export default TxProposalChip