Adding customization flags for account page

telosnetwork · Sep 29, 2023 · 3eb5885 · 3eb5885
1 parent e753368
commit 3eb5885
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 34 deletions.
diff --git a/src/components/AccountCard.vue b/src/components/AccountCard.vue
@@ -15,6 +15,7 @@ import { useRouter } from 'vue-router';
 import { TableIndexType } from 'src/types/Api';
 import { API, UInt64 } from '@greymass/eosio';
 import { formatCurrency } from 'src/utils/string-utils';
+import ConfigManager from 'src/config/ConfigManager';
 
 const chain = getChain();
 export default defineComponent({
@@ -37,6 +38,8 @@ export default defineComponent({
         const router = useRouter();
         const store = useAntelopeStore();
 
+        const accountPageSettings = computed(() => ConfigManager.get().getCurrentChain().getUiCustomization().accountPageSettings);
+
         const createTime = ref<string>('2019-01-01T00:00:00.000');
         const createTransaction = ref<string>('');
         const creatingAccount = ref('');
@@ -369,6 +372,7 @@ export default defineComponent({
         );
 
         return {
+            accountPageSettings,
             MICRO_UNIT,
             KILO_UNIT,
             stakedCPU,
@@ -467,56 +471,56 @@ export default defineComponent({
             </div>
             <div v-if="account !== system_account" class="resources">
                 <PercentCircle
+                    v-if="!accountPageSettings.hideCpuInfo"
                     :radius="radius"
                     :fraction="cpu_used"
                     :total="cpu_max"
                     label="CPU"
                     unit="s"
                 />
                 <PercentCircle
+                    v-if="!accountPageSettings.hideNetInfo"
                     :radius="radius"
                     :fraction="net_used"
                     :total="net_max"
                     label="NET"
                     unit="kb"
                 />
                 <PercentCircle
+                    v-if="!accountPageSettings.hideRamInfo"
                     :radius="radius"
                     :fraction="ram_used"
                     :total="ram_max"
                     label="RAM"
                     unit="kb"
                 />
             </div>
-            <div v-else class="resources">
+            <div v-else-if="!accountPageSettings.hideRamInfo" class="resources">
                 <div class="usage">RAM USED: {{ ram_used }} kb</div>
             </div>
         </q-card-section>
         <q-card-section class="resources-container">
             <div class="row justify-center q-gutter-sm">
-                <div class="col-3">
+                <div v-if="isAccount" class="col-3">
                     <q-btn
-                        v-if='isAccount'
                         :disable="tokensLoading || isLoading"
-                        :label='tokensLoading ? "Loading..." : "Send"'
-                        color='primary'
+                        :label="tokensLoading ? 'Loading...' : 'Send'"
+                        color="primary"
                         class="full-width"
                         @click="openSendDialog = true"
                     />
                 </div>
-                <div class="col-3">
+                <div v-if="isAccount && !accountPageSettings.hideResourcesControl" class="col-3">
                     <q-btn
-                        v-if="isAccount"
                         :disable="tokensLoading || isLoading"
                         :label='tokensLoading ? "Loading..." : "Resources"'
                         class="full-width"
                         color="primary"
                         @click="openResourcesDialog = true"
                     />
                 </div>
-                <div class="col-3">
+                <div v-if="isAccount && !accountPageSettings.hideRexControl" class="col-3">
                     <q-btn
-                        v-if="isAccount"
                         :disable="tokensLoading || isLoading"
                         :label='tokensLoading ? "Loading..." : "Staking (REX)"'
                         class="ellipsis full-width"
@@ -549,31 +553,31 @@ export default defineComponent({
                         <td class="text-left">LIQUID (Telos native)</td>
                         <td class="text-right">{{ formatAsset(liquidNative) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideRexInfo">
                         <td class="text-left">REX staked (includes savings)</td>
                         <td class="text-right">{{ formatAsset(rexStaked) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideRexInfo">
                         <td class="text-left">REX liquid deposits</td>
                         <td class="text-right">{{ formatAsset(rexDeposits) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideCpuInfo">
                         <td class="text-left">STAKED for CPU</td>
                         <td class="text-right">{{ formatAsset(stakedCPU) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideNetInfo">
                         <td class="text-left">STAKED for NET</td>
                         <td class="text-right">{{ formatAsset(stakedNET) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideRefundingInfo">
                         <td class="text-left">REFUNDING from staking</td>
                         <td class="text-right">{{ formatAsset(stakedRefund) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideDelegatedInfo">
                         <td class="text-left">DELEGATED to others</td>
                         <td class="text-right">{{ formatAsset(delegatedToOthers) }}</td>
                     </tr>
-                    <tr>
+                    <tr v-if="!accountPageSettings.hideDelegatedInfo">
                         <td class="text-left">DELEGATED by others</td>
                         <td class="text-right">{{ formatAsset(delegatedByOthers) }}</td>
                     </tr>

diff --git a/src/components/Header.vue b/src/components/Header.vue
@@ -7,6 +7,7 @@ import ChainsMenu from 'components/ChainsMenu.vue';
 import ConfigManager, { getChain } from 'src/config/ConfigManager';
 import { useStore } from 'src/store';
 import { useRouteDataNetwork } from 'src/router';
+import { HeaderSettings } from 'src/types/UiCustomization';
 
 export default defineComponent({
     name: 'AppHeader',
@@ -18,7 +19,7 @@ export default defineComponent({
     setup() {
         const $q = useQuasar();
         const store = useStore();
-        const headerSettings = computed(() => ConfigManager.get().getCurrentChain().getUiCustomization().headerSettings);
+        const headerSettings = computed(() : HeaderSettings => ConfigManager.get().getCurrentChain().getUiCustomization().headerSettings);
 
         const account = computed(() => store.state.account.accountName);
         const isLarge = computed((): boolean => $q.screen.gt.sm);

diff --git a/src/config/BaseChain.ts b/src/config/BaseChain.ts
@@ -100,13 +100,7 @@ export default abstract class BaseChain implements Chain {
   abstract getTheme(): Theme;
 
   getUiCustomization(): UiCustomization {
-      return {
-          footerLinks: [
-              { label: 'LEGAL', url: 'https://telos.net/legal' },
-              { label: 'PRIVACY', url: 'https://telos.net/privacy-policy' },
-              { label: 'REPOSITORY', url: 'https://github.com/telosnetwork/open-block-explorer' },
-          ],
-      };
+      return baseUiConfiguration;
   }
 
   abstract getFiltersSupported(prop: string): boolean;

diff --git a/src/pages/Account.vue b/src/pages/Account.vue
@@ -9,6 +9,7 @@ import ContractTabs from 'components/contract/ContractTabs.vue';
 import { api } from 'src/api';
 import { useRoute, useRouter } from 'vue-router';
 import { useStore } from 'src/store';
+import ConfigManager from 'src/config/ConfigManager';
 
 export default defineComponent({
     name: 'AccountPage',
@@ -24,6 +25,8 @@ export default defineComponent({
         const store = useStore();
         const route = useRoute();
         const router = useRouter();
+        const accountPageSettings = computed(() => ConfigManager.get().getCurrentChain().getUiCustomization().accountPageSettings);
+
         const tab = ref<string>((route.query['tab'] as string) || 'transactions');
         const account = computed(() => (route.params.account as string) || '');
         const abi = computed(() => store.state.account.abi.abi);
@@ -47,6 +50,7 @@ export default defineComponent({
             account,
             abi,
             tokenList,
+            accountPageSettings,
         };
     },
 });
@@ -59,27 +63,27 @@ export default defineComponent({
             <AccountCard class="account-card" :account="account" :tokens="tokenList"/>
         </div>
         <q-tabs v-model="tab" class="account-view tabs" no-caps>
-            <q-tab name="transactions" label="Transactions"/>
-            <q-tab v-if="abi" name="contract" label="Contract"/>
-            <q-tab name="tokens" label="Tokens"/>
-            <q-tab name="keys" label="Keys"/>
-            <q-tab name="children" label="Children"/>
+            <q-tab v-if="!accountPageSettings.hideTransactionTab" name="transactions" label="Transactions"/>
+            <q-tab v-if="!accountPageSettings.hideContractsTab && abi" name="contract" label="Contract"/>
+            <q-tab v-if="!accountPageSettings.hideTokensTab" name="tokens" label="Tokens"/>
+            <q-tab v-if="!accountPageSettings.hideKeysTab" name="keys" label="Keys"/>
+            <q-tab v-if="!accountPageSettings.hideChildrenTab" name="children" label="Children"/>
         </q-tabs>
     </div>
     <q-tab-panels v-model="tab" class="col-12">
-        <q-tab-panel name="transactions">
+        <q-tab-panel v-if="!accountPageSettings.hideTransactionTab" name="transactions">
             <TransactionsTable :account="account" :showTransferLabel="true" :show-pagination-extras="true" />
         </q-tab-panel>
-        <q-tab-panel v-if="abi" name="contract">
+        <q-tab-panel v-if="!accountPageSettings.hideContractsTab && abi" name="contract">
             <ContractTabs/>
         </q-tab-panel>
-        <q-tab-panel name="tokens">
+        <q-tab-panel v-if="!accountPageSettings.hideTokensTab" name="tokens">
             <TokensPanel :account="account"/>
         </q-tab-panel>
-        <q-tab-panel name="keys">
+        <q-tab-panel v-if="!accountPageSettings.hideKeysTab" name="keys">
             <KeysPanel :account="account"/>
         </q-tab-panel>
-        <q-tab-panel name="children">
+        <q-tab-panel v-if="!accountPageSettings.hideChildrenTab" name="children">
             <ChildrenPanel :account="account"/>
         </q-tab-panel>
     </q-tab-panels>