Skip to content

Commit adab5ff

Browse files
authored
Merge pull request #150 from celenium-io/tvl-select-datasource
Tvl select datasource
2 parents c760d3a + ba7b806 commit adab5ff

File tree

18 files changed

+352
-215
lines changed

18 files changed

+352
-215
lines changed

assets/icons.json

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

components/Feed.vue

Lines changed: 28 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { getRankCategory } from "@/services/constants/rollups"
1010
import Tooltip from "@/components/ui/Tooltip.vue"
1111
1212
/** API */
13-
import { fetchPriceSeries, fetchTVS } from "@/services/api/stats"
13+
import { fetchPriceSeries, fetchSummary, fetchTVS } from "@/services/api/stats"
1414
1515
/** Store */
1616
import { useAppStore } from "@/store/app.store"
@@ -21,8 +21,6 @@ const activityStore = useActivityStore()
2121
const head = computed(() => appStore.lastHead)
2222
const currentPrice = computed(() => appStore.currentPrice)
2323
24-
const totalSupply = computed(() => head.value.total_supply / 1_000_000)
25-
const totalSupplyUSD = computed(() => totalSupply.value * currentPrice.value?.close)
2624
const totalFees = computed(() => head.value.total_fee / 1_000_000)
2725
const totalFeesUSD = computed(() => totalFees.value * currentPrice.value?.close)
2826
const topRollup = computed(() => {
@@ -46,6 +44,9 @@ const price = reactive({
4644
side: null,
4745
})
4846
const tvs = computed(() => appStore.tvs)
47+
const txCount24h = ref(0)
48+
const bytesInBlocks24h = ref(0)
49+
4950
onMounted(async () => {
5051
const dataSeries = await fetchPriceSeries({ from: parseInt(DateTime.now().minus({ days: 3 }).ts / 1_000) })
5152
series.value = dataSeries
@@ -65,6 +66,15 @@ onMounted(async () => {
6566
appStore.tvs = _tvs.value
6667
}
6768
69+
const startTime = parseInt(DateTime.now().minus({ days: 1 }).toSeconds())
70+
const params = {
71+
table: "block_stats",
72+
func: "sum",
73+
from: startTime,
74+
}
75+
txCount24h.value = await fetchSummary({ ...params, column: "tx_count" })
76+
bytesInBlocks24h.value = await fetchSummary({ ...params, column: "bytes_in_block" })
77+
6878
isLoading.value = false
6979
})
7080
</script>
@@ -112,35 +122,12 @@ onMounted(async () => {
112122
113123
<div :class="$style.dot" />
114124
</template>
115-
116-
<Tooltip>
117-
<Flex align="center" gap="6" :class="$style.stat">
118-
<Icon name="tx" size="12" color="secondary" :class="$style.icon" />
119-
<Flex align="center" gap="4">
120-
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">Txs:</Text>
121-
122-
<Text v-if="head.total_tx" size="12" weight="600" noWrap :class="$style.value">{{
123-
abbreviate(head.total_tx)
124-
}}</Text>
125-
<Skeleton v-else w="40" h="12" />
126-
</Flex>
127-
</Flex>
128-
129-
<template #content>
130-
<Flex align="center" justify="between" gap="8">
131-
<Text size="12" weight="500" color="tertiary">Total Txs:</Text>
132-
<Text size="12" weight="600" color="secondary"> {{ comma(head.total_tx) }} </Text>
133-
</Flex>
134-
</template>
135-
</Tooltip>
136-
137-
<div :class="$style.dot" />
138-
125+
139126
<Tooltip>
140127
<Flex align="center" gap="6" :class="$style.stat">
141128
<Icon name="coins" size="12" color="secondary" :class="$style.icon" />
142129
<Flex align="center" gap="4">
143-
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">TVS:</Text>
130+
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">Current TVS:</Text>
144131
145132
<Text v-if="!isLoading" size="12" weight="600" noWrap :class="$style.value">
146133
{{ abbreviate(tvs, 2) }} USD
@@ -161,21 +148,21 @@ onMounted(async () => {
161148
162149
<Tooltip>
163150
<Flex align="center" gap="6" :class="$style.stat">
164-
<Icon name="namespace" size="12" color="secondary" :class="$style.icon" />
151+
<Icon name="tx" size="12" color="secondary" :class="$style.icon" />
165152
<Flex align="center" gap="4">
166-
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">Blobs Size:</Text>
153+
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">Txs:</Text>
167154
168-
<Text v-if="head.total_blobs_size" size="12" weight="600" noWrap :class="$style.value">{{
169-
formatBytes(head.total_blobs_size)
155+
<Text v-if="!isLoading" size="12" weight="600" noWrap :class="$style.value">{{
156+
abbreviate(txCount24h)
170157
}}</Text>
171158
<Skeleton v-else w="40" h="12" />
172159
</Flex>
173160
</Flex>
174161
175162
<template #content>
176163
<Flex align="center" justify="between" gap="8">
177-
<Text size="12" weight="500" color="tertiary">Total Blobs Size:</Text>
178-
<Text size="12" weight="600" color="secondary"> {{ comma(head.total_blobs_size) }} Bytes </Text>
164+
<Text size="12" weight="500" color="tertiary">24h Tx Count:</Text>
165+
<Text size="12" weight="600" color="secondary"> {{ comma(txCount24h) }} </Text>
179166
</Flex>
180167
</template>
181168
</Tooltip>
@@ -184,21 +171,21 @@ onMounted(async () => {
184171
185172
<Tooltip>
186173
<Flex align="center" gap="6" :class="$style.stat">
187-
<Icon name="tag" size="12" color="secondary" :class="$style.icon" />
174+
<Icon name="block" size="12" color="secondary" :class="$style.icon" />
188175
<Flex align="center" gap="4">
189-
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">Fees:</Text>
176+
<Text size="12" weight="500" color="tertiary" noWrap :class="$style.key">Bytes In Blocks:</Text>
190177
191-
<Text v-if="head.total_fee" size="12" weight="600" noWrap :class="$style.value">
192-
{{ abbreviate(parseInt(totalFees)) }} TIA
193-
</Text>
178+
<Text v-if="!isLoading" size="12" weight="600" noWrap :class="$style.value">{{
179+
formatBytes(bytesInBlocks24h)
180+
}}</Text>
194181
<Skeleton v-else w="40" h="12" />
195182
</Flex>
196183
</Flex>
197184
198185
<template #content>
199186
<Flex align="center" justify="between" gap="8">
200-
<Text size="12" weight="500" color="tertiary">Total Fees:</Text>
201-
<Text size="12" weight="600" color="secondary"> {{ abbreviate(totalFeesUSD) }} USD </Text>
187+
<Text size="12" weight="500" color="tertiary">24h Bytes In Blocks:</Text>
188+
<Text size="12" weight="600" color="secondary"> {{ comma(bytesInBlocks24h) }} Bytes </Text>
202189
</Flex>
203190
</template>
204191
</Tooltip>

components/data/BlocksTimeline/BlocksTimelineTable.vue

Lines changed: 14 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,12 @@
33
import { DateTime } from "luxon"
44
55
/** UI */
6+
import AmountInCurrency from "@/components/AmountInCurrency.vue"
67
import Button from "@/components/ui/Button.vue"
78
import Tooltip from "@/components/ui/Tooltip.vue"
8-
import AmountInCurrency from "@/components/AmountInCurrency.vue"
9+
10+
/** Components */
11+
import BlocksFeed from "@/components/modules/stats/BlocksFeed.vue"
912
1013
/** Services */
1114
import { comma, formatBytes, shortHex, space } from "@/services/utils"
@@ -199,6 +202,8 @@ watch(
199202
</Flex>
200203
</Flex>
201204
205+
<BlocksFeed :pause="isPaused" :class="$style.blocks_feed" />
206+
202207
<Flex gap="4" :class="$style.content">
203208
<Flex direction="column" gap="16" wide :class="$style.table">
204209
<Flex v-if="!isPaused" align="center" justify="center" gap="6" :class="$style.status">
@@ -519,46 +524,6 @@ watch(
519524
<Text v-else size="12" weight="600" color="tertiary" align="center" :class="$style.empty_state"> No blobs </Text>
520525
</Flex>
521526
522-
<!-- <Flex direction="column" gap="12">
523-
<Flex align="center" justify="between">
524-
<Text size="12" weight="600" color="tertiary">Namespaces</Text>
525-
<Text size="12" weight="600" color="secondary">
526-
{{ preview.namespaces?.length > 3 ? "3 /" : "" }} {{ preview.namespaces?.length }}
527-
</Text>
528-
</Flex>
529-
530-
<Text
531-
v-if="preview.isLoadingNamespaces"
532-
size="12"
533-
weight="600"
534-
color="tertiary"
535-
align="center"
536-
:class="$style.empty_state"
537-
>
538-
Loading namespaces..
539-
</Text>
540-
<Flex v-else-if="preview.namespaces?.length" direction="column" gap="8">
541-
<NuxtLink v-for="ns in preview.namespaces.slice(0, 3)" :to="`/namespace/${ns.namespace_id}`">
542-
<Outline wide height="32" padding="8" radius="6">
543-
<Flex align="center" justify="between" wide>
544-
<Flex align="center" gap="8">
545-
<Icon name="namespace" size="12" color="secondary" />
546-
547-
<Text size="13" weight="600" color="primary" mono class="overflow_ellipsis" style="max-width: 250px">
548-
{{ $getDisplayName('namespaces', ns.namespace_id) }}
549-
</Text>
550-
</Flex>
551-
552-
<Text size="12" weight="600" color="tertiary">{{ formatBytes(ns.size) }}</Text>
553-
</Flex>
554-
</Outline>
555-
</NuxtLink>
556-
</Flex>
557-
<Text v-else size="12" weight="600" color="tertiary" align="center" :class="$style.empty_state">
558-
No namespaces
559-
</Text>
560-
</Flex> -->
561-
562527
<Flex direction="column" gap="16">
563528
<Text size="12" weight="600" color="secondary">Details</Text>
564529
@@ -605,6 +570,14 @@ watch(
605570
padding: 0 12px;
606571
}
607572
573+
.blocks_feed {
574+
height: 120px;
575+
576+
border-radius: 4px 4px 4px 4px;
577+
578+
padding: 12px 18px;
579+
}
580+
608581
.status {
609582
background: linear-gradient(var(--op-8), var(--op-5));
610583
border-radius: 6px;

components/modules/block/BlockOverview.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -395,7 +395,7 @@ const handleViewRawTransactions = () => {
395395
color="secondary"
396396
style="text-transform: capitalize"
397397
>
398-
{{ DateTime.now().plus({ seconds: secondsToSelectedBlock }).toRelativeCalendar() }}
398+
~ {{ DateTime.now().plus({ seconds: secondsToSelectedBlock }).setLocale("en").toFormat("TT dd LLL yyyy") }}
399399
</Text>
400400
</Flex>
401401

@@ -458,7 +458,7 @@ const handleViewRawTransactions = () => {
458458
<BadgeValue :text="block?.hash ?? ''" />
459459
</Flex>
460460

461-
<Flex direction="column" gap="16">
461+
<Flex v-if="block" direction="column" gap="16">
462462
<Text size="12" weight="600" color="secondary">Details</Text>
463463

464464
<Flex align="center" justify="between">

components/modules/block/UpcomingBlockCard.vue

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -209,11 +209,21 @@ onBeforeUnmount(() => {
209209
<Text size="12" weight="600" color="tertiary">
210210
The block {{ status === STATUS_MAP.Arrived ? "arrived" : "arrives" }}
211211
</Text>
212-
<Text size="12" weight="600" color="secondary">
213-
{{
214-
status === STATUS_MAP.Arriving ? "soon" : DateTime.now().plus({ seconds: secondsToSelectedBlock }).toRelative()
215-
}}
216-
</Text>
212+
<Tooltip>
213+
<Text size="12" weight="600" color="secondary">
214+
{{
215+
status === STATUS_MAP.Arriving ? "soon" : DateTime.now().plus({ seconds: secondsToSelectedBlock }).setLocale("en").toRelative()
216+
}}
217+
</Text>
218+
219+
<template #content>
220+
<Text size="12" weight="600" color="secondary">
221+
{{
222+
status === STATUS_MAP.Arriving ? "soon" : DateTime.now().plus({ seconds: secondsToSelectedBlock }).setLocale("en").toFormat("TT dd LLL yyyy")
223+
}}
224+
</Text>
225+
</template>
226+
</Tooltip>
217227
</Flex>
218228
<Flex align="center" justify="between">
219229
<Text size="12" weight="600" color="tertiary"> Current height </Text>

0 commit comments

Comments
 (0)