#238 start adding claimable balance operations

package.json

@@ -1,7 +1,7 @@
 {
   "name": "stellarexplorer",
   "description": "Ledger explorer for the Stellar network",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "license": "Apache-2.0",
   "author": "Chris Hatch <[email protected]>",
   "homepage": "https://steexp.com",
@@ -36,7 +36,7 @@
     "react-router-bootstrap": "^0.24.4",
     "react-router-dom": "^4.2.2",
     "recompose": "^0.26.0",
-    "stellar-sdk": "^5.0.1",
+    "stellar-sdk": "^8.1.1",
     "whatwg-fetch": "2.0.3"
   },
   "devDependencies": {

src/components/Effect.js

@@ -186,34 +186,66 @@ const Thresholds = ({lowThreshold, medThreshold, highThreshold}) => (
 )
 
 const effectTypeComponentMap = {
+  sequence_bumped: SequenceBumped,
+
+  // Account Effects
   account_created: AccountCreated,
   account_removed: AccountRemoved,
   account_credited: Amount,
   account_debited: Amount,
   account_thresholds_updated: Thresholds,
   account_home_domain_updated: AccountHomeDomainUpdated,
   account_flags_updated: AccountFlagsUpdated,
-  sequence_bumped: SequenceBumped,
+
+  // Signer Effects
   signer_created: Signer,
   signer_removed: Signer,
   signer_updated: Signer,
+
+  // Trustline Effects
   trustline_created: Trustline,
   trustline_removed: AssetWrap,
   trustline_updated: Trustline,
   trustline_authorized: Trustline,
   trustline_deauthorized: Trustline,
+
+  // Trading Effects
   offer_created: Offer,
   offer_removed: Offer,
   offer_updated: Offer,
   trade: Trade,
+
+  // Data Effects
   data_created: Data,
   data_removed: Data,
   data_updated: Data,
+
+  // // Claimable Balance Effects
+  // claimable_balance_created: CreateMe,
+  // claimable_balance_claimed: CreateMe,
+  // claimable_balance_claimant_created: CreateMe,
+
+  // // Sponsorship Effects
+  // account_sponsorship_created: CreateMe,
+  // account_sponsorship_updated: CreateMe,
+  // account_sponsorship_removed: CreateMe,
+  // trustline_sponsorship_created: CreateMe,
+  // trustline_sponsorship_updated: CreateMe,
+  // trustline_sponsorship_removed: CreateMe,
+  // data_sponsorship_created: CreateMe,
+  // data_sponsorship_updated: CreateMe,
+  // data_sponsorship_removed: CreateMe,
+  // claimable_balance_sponsorship_created: CreateMe,
+  // claimable_balance_sponsorship_updated: CreateMe,
+  // claimable_balance_sponsorship_removed: CreateMe,
+  // signer_sponsorship_created: CreateMe,
+  // signer_sponsorship_updated: CreateMe,
+  // signer_sponsorship_removed: CreateMe,
 }
 
 const EffectDetails = ({effect, op}) => {
   const SubEffectComponent = effectTypeComponentMap[effect.type]
-  if (!SubEffectComponent) return <span>{effect.type}</span>
+  if (!SubEffectComponent) return <span>{effect.type} ALL: {JSON.stringify(effect)}</span>
   return <SubEffectComponent {...effect} op={op} />
 }
 

src/components/operations/ClaimClaimableBalance.js

@@ -0,0 +1,20 @@
+import React from 'react'
+import {FormattedMessage} from 'react-intl'
+
+import AccountLink from '../shared/AccountLink'
+
+const FormattedBalanceId = ({balanceId}) => balanceId.replace(/^0*/, '')
+
+const ClaimClaimableBalance = ({balanceId, claimant}) => {
+  return (
+    <FormattedMessage
+      id="operation.claimable.claim"
+      values={{
+        claimant: <AccountLink account={claimant} />,
+        balanceId: <FormattedBalanceId balanceId={balanceId} />,
+      }}
+    />
+  )
+}
+
+export default ClaimClaimableBalance

src/components/operations/Operation.js

@@ -11,6 +11,7 @@ import AccountMerge from './AccountMerge'
 import AllowTrust from './AllowTrust'
 import BumpSequence from './BumpSequence'
 import ChangeTrust from './ChangeTrust'
+import ClaimClaimableBalance from './ClaimClaimableBalance'
 import CreateAccount from './CreateAccount'
 import Inflation from './Inflation'
 import ManageData from './ManageData'
@@ -43,11 +44,21 @@ const opTypeComponentMap = {
 
   payment: Payment,
   set_options: SetOptions,
+
+  create_claimable_balance: ClaimClaimableBalance,
+
+  // TODO: handle these operation types (#238):
+
+  // claim_claimable_balance
+  // begin_sponsoring_future_reserves
+  // end_sponsoring_future_reserves
+  // revoke_sponsorship
 }
 
 const opTypes = Object.keys(opTypeComponentMap)
 
 const SubOperation = ({op}) => {
+  opTypeComponentMap[op.type] || console.log(JSON.stringify(op, null, 2))
   const SubOpComponent = opTypeComponentMap[op.type] || Unrecognized
   return <SubOpComponent {...op} />
 }

src/languages/en.json

@@ -111,6 +111,7 @@
   "operation.account.create": "Created Account {account} with balance {balance}",
   "operation.account.merge": "Account merged into {account}",
   "operation.bump": "Bumped sequence to {sequence}",
+  "operation.claimable.claim": "{claimant} claimed balance {balanceId}",
   "operation.inflation": "Inflation run",
   "operation.manage.data.remove": "Remove Key {name}",
   "operation.manage.data.set": "Set Key {name}",