From 775b4a7de980e698a3600d1c40b4aefaee3898d6 Mon Sep 17 00:00:00 2001
From: sam-keen <samuel.kleinmann@gmail.com>
Date: Tue, 15 Mar 2022 14:49:10 +0000
Subject: [PATCH] Added display strings for tx order type

---
 .../components/txs/tx-order-type/index.tsx    | 39 +++++++++++++++++++
 .../components/txs/txs-per-block/index.tsx    |  5 ++-
 2 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 apps/explorer/src/app/components/txs/tx-order-type/index.tsx

diff --git a/apps/explorer/src/app/components/txs/tx-order-type/index.tsx b/apps/explorer/src/app/components/txs/tx-order-type/index.tsx
new file mode 100644
index 000000000..2ac5d89b0
--- /dev/null
+++ b/apps/explorer/src/app/components/txs/tx-order-type/index.tsx
@@ -0,0 +1,39 @@
+interface TxOrderTypeProps {
+  orderType: string;
+  className?: string;
+}
+
+interface StringMap {
+  [key: string]: string;
+}
+
+// Using https://github.com/vegaprotocol/protos/blob/e0f646ce39aab1fc66a9200ceec0262306d3beb3/commands/transaction.go#L93 as a reference
+const displayString: StringMap = {
+  OrderSubmission: 'Order Submission',
+  OrderCancellation: 'Order Cancellation',
+  OrderAmendment: 'Order Amendment',
+  VoteSubmission: 'Vote Submission',
+  WithdrawSubmission: 'Withdraw Submission',
+  LiquidityProvisionSubmission: 'Liquidity Provision',
+  LiquidityProvisionCancellation: 'Liquidity Cancellation',
+  LiquidityProvisionAmendment: 'Liquidity Amendment',
+  ProposalSubmission: 'Governance Proposal',
+  AnnounceNode: 'Node Announcement',
+  NodeVote: 'Node Vote',
+  NodeSignature: 'Node Signature',
+  ChainEvent: 'Chain Event',
+  OracleDataSubmission: 'Oracle Data',
+  DelegateSubmission: 'Delegation',
+  UndelegateSubmission: 'Undelegation',
+  KeyRotateSubmission: 'Key Rotation',
+  StateVariableProposal: 'State Variable Proposal',
+  Transfer: 'Transfer',
+  CancelTransfer: 'Cancel Transfer',
+  ValidatorHeartbeat: 'Validator Heartbeat',
+};
+
+export const TxOrderType = ({ orderType, className }: TxOrderTypeProps) => {
+  return (
+    <span className={className}>{displayString[orderType] || orderType}</span>
+  );
+};
diff --git a/apps/explorer/src/app/components/txs/txs-per-block/index.tsx b/apps/explorer/src/app/components/txs/txs-per-block/index.tsx
index 07af94457..3d6c518aa 100644
--- a/apps/explorer/src/app/components/txs/txs-per-block/index.tsx
+++ b/apps/explorer/src/app/components/txs/txs-per-block/index.tsx
@@ -5,6 +5,7 @@ import { DATA_SOURCES } from '../../../config';
 import { Link } from 'react-router-dom';
 import { RenderFetched } from '../../render-fetched';
 import { TruncateInline } from '../../truncate/truncate';
+import { TxOrderType } from '../tx-order-type';
 
 interface TxsPerBlockProps {
   blockHeight: string | undefined;
@@ -62,7 +63,9 @@ export const TxsPerBlock = ({ blockHeight }: TxsPerBlockProps) => {
                         className="font-mono"
                       />
                     </td>
-                    <td>{Type}</td>
+                    <td>
+                      <TxOrderType orderType={Type} />
+                    </td>
                   </tr>
                 );
               })}