From 23dea07f6e53da91f87078749f07bd95c9e65983 Mon Sep 17 00:00:00 2001
From: Vojtech Simetka <vojtech@simetka.cz>
Date: Sun, 24 Apr 2022 21:40:41 +0500
Subject: [PATCH] feat: add aditional information to the stamps overview (#349)

---
 src/pages/stamps/PostageStamp.tsx | 5 ++++-
 src/pages/stamps/StampsTable.tsx  | 9 +++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/pages/stamps/PostageStamp.tsx b/src/pages/stamps/PostageStamp.tsx
index 880e6af..4b2a36a 100644
--- a/src/pages/stamps/PostageStamp.tsx
+++ b/src/pages/stamps/PostageStamp.tsx
@@ -9,10 +9,13 @@ interface Props {
 }
 
 export function PostageStamp({ stamp, shorten }: Props): ReactElement {
+  const batchId = shorten ? stamp.batchID.slice(0, 8) : stamp.batchID
+  const label = `${batchId}${stamp.label ? ` - ${stamp.label}` : ''}`
+
   return (
     <Box p={2} width="100%">
       <Grid container justifyContent="space-between" alignItems="center" direction="row">
-        <Typography variant="subtitle2">{shorten ? stamp.batchID.slice(0, 8) : stamp.batchID}</Typography>
+        <Typography variant="subtitle2">{label}</Typography>
         <Capacity width="100px" usage={stamp.usage} />
       </Grid>
     </Box>
diff --git a/src/pages/stamps/StampsTable.tsx b/src/pages/stamps/StampsTable.tsx
index d3bfade..8df6e38 100644
--- a/src/pages/stamps/StampsTable.tsx
+++ b/src/pages/stamps/StampsTable.tsx
@@ -4,6 +4,7 @@ import ExpandableList from '../../components/ExpandableList'
 import ExpandableListItem from '../../components/ExpandableListItem'
 import ExpandableListItemKey from '../../components/ExpandableListItemKey'
 import { EnrichedPostageBatch } from '../../providers/Stamps'
+import { secondsToTimeString } from '../../utils'
 import { getHumanReadableFileSize } from '../../utils/file'
 import { PostageStamp } from './PostageStamp'
 
@@ -30,6 +31,14 @@ function StampsTable({ postageStamps }: Props): ReactElement | null {
                 )}`}
               />
               <ExpandableListItem label="Amount" value={parseInt(stamp.amount, 10).toLocaleString()} />
+              <ExpandableListItem
+                label="Expires in"
+                value={stamp.batchTTL === -1 ? 'does not expire' : `${secondsToTimeString(stamp.batchTTL)}`}
+              />
+              <ExpandableListItem label="Label" value={stamp.label} />
+              <ExpandableListItem label="Usable" value={stamp.usable ? 'yes' : 'no'} />
+              <ExpandableListItem label="Exists" value={stamp.exists ? 'yes' : 'no'} />
+              <ExpandableListItem label="Purchase Block Number" value={stamp.blockNumber} />
             </>
           }
         >