Display transaction tags in hledger-web

hledger-web/Hledger/Web/Handler/JournalR.hs

@@ -32,6 +32,7 @@ getJournalR = do
         styleAmounts (journalCommodityStylesWith HardRounding j) $
         entriesReport rspec j
       transactionFrag = transactionFragment j
+      isVisibleTag = not . isHiddenTagName . fst
 
   defaultLayout $ do
     setTitle "päiväkirja - hledger-web"

hledger-web/static/hledger.css

@@ -163,6 +163,41 @@ ul {
     border-top: solid 2px #ddd;
 }
 
+.transactionsreport ul.tags {
+    display: block;
+}
+
+.tag {
+    display: inline-flex;
+    list-style: none;
+    align-items: center;
+    vertical-align: middle;
+    font-size: smaller;
+    text-wrap: nowrap;
+}
+
+.tag-name {
+    background-color: #ddd;
+    padding: 0 6px;
+    border: 0 solid transparent;
+    border-top-left-radius: 0.3rem;
+    border-bottom-left-radius: 0.3rem;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    max-width: 10em;
+}
+
+.tag-value {
+    background-color: #eee;
+    padding: 0 6px;
+    border: 0 solid transparent;
+    border-top-right-radius: 0.3rem;
+    border-bottom-right-radius: 0.3rem;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    max-width: 15em;
+}
+
 .transaction {
     border-bottom-style: solid;
     border-width: 1px;

hledger-web/templates/journal.hamlet

@@ -15,6 +15,16 @@ $if elem AddPermission perms
           <div>
             #{textElideRight 60 (tdescription torig)}
 
+          $if null $ filter isVisibleTag $ ttags torig
+          $else
+            <ul .tags>
+              $forall (tagName, tagValue) <- filter isVisibleTag $ ttags torig
+                <li .tag title="#{mconcat [tagName, ": ", tagValue]}">
+                  <div .tag-name>
+                    #{tagName}
+                  <div .tag-value>
+                    #{tagValue}
+
         <ul .postings>
           $forall Posting { paccount = acc, pamount = amt } <- tpostings torig
             <li .posting>