feat(explorer): add issuesignatures tx view (#2867)

apps/explorer/src/app/components/txs/details/tx-details-wrapper.tsx

@@ -20,6 +20,7 @@ import { TxDetailsLiquidityCancellation } from './tx-liquidity-cancel';
 import { TxDetailsDataSubmission } from './tx-data-submission';
 import { TxProposalVote } from './tx-proposal-vote';
 import { TxDetailsProtocolUpgrade } from './tx-details-protocol-upgrade';
+import { TxDetailsIssueSignatures } from './tx-issue-signatures';
 
 interface TxDetailsWrapperProps {
   txData: BlockExplorerTransactionResult | undefined;
@@ -67,6 +68,8 @@ function getTransactionComponent(txData?: BlockExplorerTransactionResult) {
 
   // These come from https://github.com/vegaprotocol/vega/blob/develop/core/txn/command.go#L72-L98
   switch (txData.type) {
+    case 'Issue Signatures':
+      return TxDetailsIssueSignatures;
     case 'Submit Order':
       return TxDetailsOrder;
     case 'Submit Oracle Data':

apps/explorer/src/app/components/txs/details/tx-generic.tsx

@@ -11,8 +11,7 @@ interface TxDetailsGenericProps {
 }
 
 /**
- * If there is not yet a custom component for a transaction, just display
- * the basic details. This allows someone to view the decoded transaction.
+ * A node is
  */
 export const TxDetailsGeneric = ({
   txData,

apps/explorer/src/app/components/txs/details/tx-issue-signatures.tsx

@@ -0,0 +1,77 @@
+import { t } from '@vegaprotocol/react-helpers';
+import type { BlockExplorerTransactionResult } from '../../../routes/types/block-explorer-response';
+import type { TendermintBlocksResponse } from '../../../routes/blocks/tendermint-blocks-response';
+import { TxDetailsShared } from './shared/tx-details-shared';
+import { TableRow, TableCell, TableWithTbody } from '../../table';
+
+import type { components } from '../../../../types/explorer';
+import {
+  EthExplorerLink,
+  EthExplorerLinkTypes,
+} from '../../links/eth-explorer-link/eth-explorer-link';
+import { NodeLink } from '../../links';
+
+type Command = components['schemas']['v1IssueSignatures'];
+
+const kind: Record<components['schemas']['v1NodeSignatureKind'], string> = {
+  NODE_SIGNATURE_KIND_UNSPECIFIED: 'Unspecified',
+  NODE_SIGNATURE_KIND_ASSET_NEW: 'New asset',
+  NODE_SIGNATURE_KIND_ASSET_WITHDRAWAL: 'Asset withdrawal',
+  NODE_SIGNATURE_KIND_ASSET_UPDATE: ' Asset update',
+  NODE_SIGNATURE_KIND_ERC20_MULTISIG_SIGNER_ADDED: 'Multisig signer added',
+  NODE_SIGNATURE_KIND_ERC20_MULTISIG_SIGNER_REMOVED: 'Multisig signer removed',
+};
+
+interface TxDetailsGenericProps {
+  txData: BlockExplorerTransactionResult | undefined;
+  pubKey: string | undefined;
+  blockData: TendermintBlocksResponse | undefined;
+}
+
+/**
+ * If there is not yet a custom component for a transaction, just display
+ * the basic details. This allows someone to view the decoded transaction.
+ */
+export const TxDetailsIssueSignatures = ({
+  txData,
+  pubKey,
+  blockData,
+}: TxDetailsGenericProps) => {
+  if (!txData) {
+    return <>{t('Awaiting Block Explorer transaction details')}</>;
+  }
+
+  const cmd: Command = txData.command;
+  const k = cmd.kind ? kind[cmd.kind] : null;
+
+  return (
+    <TableWithTbody className="mb-8">
+      <TxDetailsShared txData={txData} pubKey={pubKey} blockData={blockData} />
+      {k ? (
+        <TableRow modifier="bordered">
+          <TableCell>{t('Kind')}</TableCell>
+          <TableCell>{k}</TableCell>
+        </TableRow>
+      ) : null}
+      {cmd.submitter ? (
+        <TableRow modifier="bordered">
+          <TableCell>{t('ETH key')}</TableCell>
+          <TableCell>
+            <EthExplorerLink
+              id={cmd.submitter}
+              type={EthExplorerLinkTypes.address}
+            />
+          </TableCell>
+        </TableRow>
+      ) : null}
+      {cmd.validatorNodeId ? (
+        <TableRow modifier="bordered">
+          <TableCell>{t('Validator')}</TableCell>
+          <TableCell>
+            <NodeLink id={cmd.validatorNodeId} />
+          </TableCell>
+        </TableRow>
+      ) : null}
+    </TableWithTbody>
+  );
+};