From 2be8575afb9a9ab1b93fc584360feb9ba729b4b8 Mon Sep 17 00:00:00 2001
From: zeppi <jessopb@gmail.com>
Date: Fri, 5 Mar 2021 14:24:26 -0500
Subject: [PATCH] display signing channel for tips

---
 ui/component/transactionListTable/view.jsx    |  6 ++---
 .../transactionListTableItem/index.js         | 17 ++++++++++++++
 .../view.jsx}                                 | 22 ++++++++++++++-----
 3 files changed, 36 insertions(+), 9 deletions(-)
 create mode 100644 ui/component/transactionListTableItem/index.js
 rename ui/component/{transactionListTable/internal/txo-list-item.jsx => transactionListTableItem/view.jsx} (80%)

diff --git a/ui/component/transactionListTable/view.jsx b/ui/component/transactionListTable/view.jsx
index e131e6bed..6d7a686e3 100644
--- a/ui/component/transactionListTable/view.jsx
+++ b/ui/component/transactionListTable/view.jsx
@@ -1,14 +1,14 @@
 // @flow
 import * as MODALS from 'constants/modal_types';
 import React from 'react';
-import TxoListItem from './internal/txo-list-item';
+import TxoListItem from 'component/transactionListTableItem';
 import Spinner from 'component/spinner';
 import LbcSymbol from 'component/common/lbc-symbol';
 
 type Props = {
   emptyMessage: ?string,
   loading: boolean,
-  openModal: (id: string, { tx: Txo, cb: string => void }) => void,
+  openModal: (id: string, { tx: Txo, cb: (string) => void }) => void,
   rewards: {},
   txos: Array<Txo>,
 };
@@ -16,7 +16,7 @@ type Props = {
 function TransactionListTable(props: Props) {
   const { emptyMessage, rewards, loading, txos } = props;
   const REVOCABLE_TYPES = ['channel', 'stream', 'repost', 'support', 'claim'];
-  function revokeClaim(tx: any, cb: string => void) {
+  function revokeClaim(tx: any, cb: (string) => void) {
     props.openModal(MODALS.CONFIRM_CLAIM_REVOKE, { tx, cb });
   }
 
diff --git a/ui/component/transactionListTableItem/index.js b/ui/component/transactionListTableItem/index.js
new file mode 100644
index 000000000..8cbc1fb93
--- /dev/null
+++ b/ui/component/transactionListTableItem/index.js
@@ -0,0 +1,17 @@
+import { connect } from 'react-redux';
+import { doOpenModal } from 'redux/actions/app';
+import { makeSelectClaimForClaimId } from 'lbry-redux';
+import TransactionListTableItem from './view';
+
+const select = (state, props) => {
+  const claimId = props.txo && props.txo.signing_channel && props.txo.signing_channel.channel_id;
+  return {
+    signingChannel: makeSelectClaimForClaimId(claimId)(state),
+  };
+};
+
+const perform = (dispatch) => ({
+  openModal: (modal, props) => dispatch(doOpenModal(modal, props)),
+});
+
+export default connect(select, perform)(TransactionListTableItem);
diff --git a/ui/component/transactionListTable/internal/txo-list-item.jsx b/ui/component/transactionListTableItem/view.jsx
similarity index 80%
rename from ui/component/transactionListTable/internal/txo-list-item.jsx
rename to ui/component/transactionListTableItem/view.jsx
index a91383b40..3c25633e9 100644
--- a/ui/component/transactionListTable/internal/txo-list-item.jsx
+++ b/ui/component/transactionListTableItem/view.jsx
@@ -9,6 +9,7 @@ import Button from 'component/button';
 import Spinner from 'component/spinner';
 import { toCapitalCase } from 'util/string';
 import { buildURI, parseURI, TXO_LIST as TXO, ABANDON_STATES } from 'lbry-redux';
+import UriIndicator from 'component/uriIndicator';
 
 type Props = {
   txo: Txo,
@@ -17,13 +18,14 @@ type Props = {
   reward: ?{
     reward_title: string,
   },
+  signingChannel: ChannelClaim,
 };
 
 type State = {
   abandonState: string,
 };
 
-class TxoListItem extends React.PureComponent<Props, State> {
+class TransactionListTableItem extends React.PureComponent<Props, State> {
   constructor() {
     super();
     this.state = { abandonState: ABANDON_STATES.READY };
@@ -66,11 +68,11 @@ class TxoListItem extends React.PureComponent<Props, State> {
   }
 
   abandonClaim() {
-    this.props.revokeClaim(this.props.txo, abandonState => this.setState({ abandonState }));
+    this.props.revokeClaim(this.props.txo, (abandonState) => this.setState({ abandonState }));
   }
 
   render() {
-    const { reward, txo, isRevokeable } = this.props;
+    const { reward, txo, isRevokeable, signingChannel } = this.props;
 
     const {
       amount,
@@ -85,7 +87,9 @@ class TxoListItem extends React.PureComponent<Props, State> {
     } = txo;
 
     const isLbryViewReward =
-      txo.signing_channel && txo.signing_channel.channel_id === '74562a01e5836c04040b80bf1f4d685fec02cc90';
+      txo.signing_channel &&
+      (txo.signing_channel.channel_id === '74562a01e5836c04040b80bf1f4d685fec02cc90' ||
+        txo.signing_channel.channel_id === '7d0b0f83a195fd1278e1944ddda4cda8d9c01a56');
     const name = txoListName;
     const isMinus = (type === 'support' || type === 'payment' || type === 'other') && isMyInput && !isMyOutput;
     const isTip = type === 'support' && ((isMyInput && !isMyOutput) || (!isMyInput && isMyOutput));
@@ -138,7 +142,13 @@ class TxoListItem extends React.PureComponent<Props, State> {
         <td>
           {forClaim && <Button button="link" navigate={uri} label={claimName} disabled={!date} />}
           {!forClaim && reward && <span>{reward.reward_title}</span>}
-          {isLbryViewReward && <span className="help--inline">{__('%SITE_NAME% view reward', { SITE_NAME })}</span>}
+          {isLbryViewReward && <div className="table__item-label">{__('%SITE_NAME% view reward', { SITE_NAME })}</div>}
+          {isTip && signingChannel && !isLbryViewReward && (
+            <div className="table__item-label">
+              <UriIndicator uri={signingChannel && signingChannel.permanent_url} link />
+            </div>
+          )}
+          {isTip && !signingChannel && !isLbryViewReward && <div className="table__item-label">Anonymous</div>}
         </td>
 
         <td>
@@ -157,4 +167,4 @@ class TxoListItem extends React.PureComponent<Props, State> {
   }
 }
 
-export default TxoListItem;
+export default TransactionListTableItem;