-
{map(renderSpec)(specs)}
+
+
-
- {map(renderTabNav)(tabNav)}
-
- {eq(0, tab) && }
- {eq(1, tab) && }
- {eq(2, tab) && }
+
+
+
{map(renderSpec)(specs)}
+
+ {map(renderTabNav)(tabNav)}
+
+ {tabs[tab]}
);
};
diff --git a/src/v2/components/Accounts/Detail/styles.js b/src/v2/components/Accounts/Detail/styles.js
index 5c561d36..eae862b2 100644
--- a/src/v2/components/Accounts/Detail/styles.js
+++ b/src/v2/components/Accounts/Detail/styles.js
@@ -40,4 +40,7 @@ export default makeStyles(theme => ({
indicator: {
display: 'none',
},
+ loader: {
+ marginTop: 40,
+ },
}));
diff --git a/src/v2/stores/accounts/detail.js b/src/v2/stores/accounts/detail.js
index 6610a09d..d0f936a9 100644
--- a/src/v2/stores/accounts/detail.js
+++ b/src/v2/stores/accounts/detail.js
@@ -1,8 +1,14 @@
import {action, flow, observable, decorate} from 'mobx';
import {apiGetAccountDetail} from 'v2/api/accounts';
+import {LAMPORT_SOL_RATIO} from 'v2/constants';
+
+const extendAccountInfo = (account = {}) => ({
+ ...account,
+ balance: ((account.lamports || 0) * LAMPORT_SOL_RATIO).toFixed(8),
+});
class Store {
- isLoading = false;
+ isLoading = true;
accountId = null;
accountView = {};
accountInfo = {};
@@ -13,16 +19,12 @@ class Store {
this.setLoading(true);
this.accountId = accountId;
- if (this.accountInfo.pubkey) {
- return this.accountInfo;
- }
-
const res = yield apiGetAccountDetail({accountId});
-
+ const {accountInfo, programAccounts, timestamp} = res.data;
this.accountView = res.data;
- this.accountInfo = res.data.accountInfo;
- this.programAccounts.replace(res.data.programAccounts);
- this.timestamp = res.data.timestamp;
+ this.accountInfo = extendAccountInfo(accountInfo);
+ this.programAccounts.replace(programAccounts);
+ this.timestamp = timestamp;
this.setLoading(false);
return res;
@@ -35,6 +37,7 @@ class Store {
decorate(Store, {
setLoading: action.bound,
+ init: action.bound,
isLoading: observable,
accountInfo: observable,
programAccounts: observable,