Skip to content

Commit ca5fd8f

Browse files
xdeqxdeq
authored
Merge pull request #37 from celenium-io/fixes-after-review
Fixes after review
2 parents 654eeb8 + 562139b commit ca5fd8f

File tree

14 files changed

+212
-897
lines changed

14 files changed

+212
-897
lines changed

‎components/OgImage/RollupImage.vue‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
<script setup>
2+
/** Services */
3+
import { getNamespaceID, formatBytes } from "@/services/utils"
4+
5+
defineOptions({
6+
inheritAttrs: false,
7+
})
8+
9+
const props = defineProps({
10+
title: String,
11+
rollup: Object,
12+
})
13+
14+
const bgStyles = computed(() => {
15+
return {
16+
style: {
17+
position: "absolute",
18+
top: "0",
19+
left: "0",
20+
filter: "grayscale(1)",
21+
opacity: "0.05",
22+
},
23+
}
24+
})
25+
</script>
26+
27+
<template>
28+
<div class="w-full h-full" :style="{ background: '#111111', padding: '100px 120px', fontFamily: 'IBM+Plex+Mono' }">
29+
<img src="/img/bg.png" v-bind="bgStyles" />
30+
31+
<div :style="{ height: '100%', display: 'flex', flexDirection: 'column', gap: '40px' }">
32+
<div :style="{ display: 'flex', alignItems: 'center' }">
33+
<span :style="{ fontSize: '70px', color: 'rgba(255,255,255, 0.9)' }">rollup</span>
34+
</div>
35+
36+
<span :style="{ fontSize: '46px', color: 'rgba(255,255,255, 0.9)' }">
37+
{{ rollup.name }}
38+
</span>
39+
40+
<div :style="{ display: 'flex', flexDirection: 'column', gap: '24px' }">
41+
<div :style="{ display: 'flex', gap: '12px' }">
42+
<span :style="{ fontSize: '40px', color: 'rgba(255,255,255, 0.3)' }">Size: </span>
43+
<span :style="{ fontSize: '40px', color: 'rgba(255,255,255, 0.6)' }">{{ formatBytes(rollup.size) }} </span>
44+
</div>
45+
<div :style="{ display: 'flex', gap: '12px' }">
46+
<span :style="{ fontSize: '40px', color: 'rgba(255,255,255, 0.3)' }">Blobs: </span>
47+
<span :style="{ fontSize: '40px', color: 'rgba(255,255,255, 0.6)' }">{{ rollup.blobs_count }} </span>
48+
</div>
49+
</div>
50+
</div>
51+
</div>
52+
</template>

‎components/OgImage/ValidatorImage.vue‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
<script setup>
2+
/** Services */
3+
import { splitAddress } from "@/services/utils"
4+
5+
defineOptions({
6+
inheritAttrs: false,
7+
})
8+
9+
const props = defineProps({
10+
title: String,
11+
validator: Object,
12+
})
13+
14+
const bgStyles = computed(() => {
15+
return {
16+
style: {
17+
position: "absolute",
18+
top: "0",
19+
left: "0",
20+
filter: "grayscale(1)",
21+
opacity: "0.05",
22+
},
23+
}
24+
})
25+
</script>
26+
27+
<template>
28+
<div class="w-full h-full" :style="{ background: '#111111', padding: '100px 120px', fontFamily: 'IBM+Plex+Mono' }">
29+
<img src="/img/bg.png" v-bind="bgStyles" />
30+
31+
<div :style="{ height: '100%', display: 'flex', flexDirection: 'column', gap: '40px' }">
32+
<div :style="{ display: 'flex', alignItems: 'center' }">
33+
<span :style="{ fontSize: '70px', color: 'rgba(255,255,255, 0.9)' }">validator</span>
34+
<span :style="{ fontSize: '70px', color: 'rgba(255,255,255, 0.3)' }">('</span>
35+
<span :style="{ fontSize: '70px', color: '#FF8351' }">
36+
{{ splitAddress(validator.address) }}
37+
</span>
38+
<span :style="{ fontSize: '70px', color: 'rgba(255,255,255, 0.3)' }">')</span>
39+
</div>
40+
41+
<span :style="{ fontSize: '46px', color: 'rgba(255,255,255, 0.9)' }">
42+
{{ validator.moniker }}
43+
</span>
44+
45+
<div :style="{ display: 'flex', flexDirection: 'column', gap: '24px' }">
46+
<div v-if="validator.website" :style="{ display: 'flex', gap: '12px' }">
47+
<span :style="{ fontSize: '40px', color: 'rgba(255,255,255, 0.6)' }">{{ validator.website }} </span>
48+
</div>
49+
</div>
50+
</div>
51+
</div>
52+
</template>

‎components/cmd/CommandMenu.vue‎

Lines changed: 58 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -307,6 +307,18 @@ const rawQuickCommandsActions = [
307307
router.push(`/block/${height}`)
308308
},
309309
},
310+
{
311+
type: "command:input",
312+
icon: "validator",
313+
title: "Open Validator..",
314+
subtitle: "Command",
315+
placeholder: "Type validator moniker...",
316+
runText: "Run Command",
317+
318+
callback: (id) => {
319+
router.push(`/validator/${id}`)
320+
},
321+
},
310322
{
311323
type: "command:input",
312324
icon: "namespace",
@@ -838,6 +850,10 @@ const searchAction = {
838850
router.push(`/rollup/${data.value[0].result.slug}`)
839851
break
840852
853+
case "validator":
854+
router.push(`/validator/${data.value[0].result.id}`)
855+
break
856+
841857
default:
842858
break
843859
}
@@ -859,7 +875,7 @@ const autocompleteGroup = computed(() => {
859875
})
860876
861877
const debouncedSearch = useDebounceFn(async (e) => {
862-
const UNSUPPORTED_ENTITIES = ["validator"]
878+
const UNSUPPORTED_ENTITIES = [""]
863879
864880
const { data } = await search(searchTerm.value.trim())
865881
if (!data.value.length) return
@@ -869,39 +885,52 @@ const debouncedSearch = useDebounceFn(async (e) => {
869885
amp.track("showAutocomplete", { count: filteredResults.length, firstType: filteredResults[0].type })
870886
871887
autocompleteActions.value = []
888+
let title
889+
let routerLink
872890
for (let i = 0; i < Math.min(3, filteredResults.length); i++) {
891+
switch (filteredResults[i].type) {
892+
case "tx":
893+
title = filteredResults[i].result.hash
894+
routerLink = `/tx/${filteredResults[i].result.hash}`
895+
break
896+
897+
case "block":
898+
title = filteredResults[i].result.hash
899+
routerLink = `/block/${filteredResults[i].result.height}`
900+
break
901+
902+
case "namespace":
903+
title = filteredResults[i].result.hash
904+
routerLink = `/namespace/${filteredResults[i].result.namespace_id}`
905+
break
906+
907+
case "address":
908+
title = filteredResults[i].result.hash
909+
routerLink = `/address/${filteredResults[i].result.hash}`
910+
break
911+
912+
case "rollup":
913+
title = filteredResults[i].result.name
914+
routerLink = `/rollup/${filteredResults[i].result.slug}`
915+
break
916+
917+
case "validator":
918+
title = filteredResults[i].result.moniker ? filteredResults[i].result.moniker : filteredResults[i].result.address
919+
routerLink = `/validator/${filteredResults[i].result.id}`
920+
break
921+
922+
default:
923+
break
924+
}
873925
autocompleteActions.value.push({
874926
id: id(),
875927
type: "callback",
876928
icon: filteredResults[i].type,
877-
title: filteredResults[i].result.hash ? filteredResults[i].result.hash : filteredResults[i].result.name,
929+
title: title,
878930
subtitle: filteredResults[i].type.charAt(0).toUpperCase() + filteredResults[i].type.slice(1),
879931
runText: "Open",
880932
callback: () => {
881-
switch (filteredResults[i].type) {
882-
case "tx":
883-
router.push(`/tx/${filteredResults[i].result.hash}`)
884-
break
885-
886-
case "block":
887-
router.push(`/block/${filteredResults[i].result.height}`)
888-
break
889-
890-
case "namespace":
891-
router.push(`/namespace/${filteredResults[i].result.namespace_id}`)
892-
break
893-
894-
case "address":
895-
router.push(`/address/${filteredResults[i].result.hash}`)
896-
break
897-
898-
case "rollup":
899-
router.push(`/rollup/${filteredResults[i].result.slug}`)
900-
break
901-
902-
default:
903-
break
904-
}
933+
router.push(routerLink)
905934
},
906935
})
907936
}
@@ -1204,7 +1233,9 @@ const onKeydown = (e) => {
12041233
watch(
12051234
() => searchTerm.value,
12061235
() => {
1207-
if (searchTerm.value.length > 2 && !mode.value) {
1236+
if (searchTerm.value.length < 3 && !mode.value) {
1237+
autocompleteActions.value = []
1238+
} else if (searchTerm.value.length > 2 && !mode.value) {
12081239
debouncedSearch()
12091240
}
12101241

‎components/cmd/Item.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const props = defineProps({
1818
<Flex align="center" gap="8" :class="$style.left">
1919
<Icon :name="action.icon" size="12" color="primary" :class="$style.icon" />
2020

21-
<Text size="13" weight="500" color="primary" :class="$style.title">
21+
<Text size="13" weight="500" height="13" color="primary" :class="$style.title">
2222
{{ action.title }}
2323
</Text>
2424
</Flex>

‎components/modules/address/AddressOverview.vue‎

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -427,12 +427,6 @@ const handleOpenQRModal = () => {
427427
View Raw Address
428428
</Flex>
429429
</DropdownItem>
430-
<DropdownItem @click="handleViewRawTransactions">
431-
<Flex align="center" gap="8">
432-
<Icon name="tx" size="12" color="secondary" />
433-
View Raw Transactions
434-
</Flex>
435-
</DropdownItem>
436430
</template>
437431
</Dropdown>
438432
</Flex>
@@ -513,7 +507,7 @@ const handleOpenQRModal = () => {
513507
<Flex direction="column" justify="center" :class="[$style.tables, isRefetching && $style.disabled]">
514508
<Flex v-if="activeTab === 'transactions'" wrap="wrap" align="center" gap="8" :class="$style.filters">
515509
<Popover :open="isStatusPopoverOpen" @on-close="onStatusPopoverClose" width="200">
516-
<Button @click="handleOpenStatusPopover" type="secondary" size="mini" :disabled="!transactions.length">
510+
<Button @click="handleOpenStatusPopover" type="secondary" size="mini" :disabled="!transactions.length && !hasActiveFilters">
517511
<Icon name="plus-circle" size="12" color="tertiary" />
518512
<Text color="secondary">Status</Text>
519513
@@ -551,7 +545,7 @@ const handleOpenQRModal = () => {
551545
</Popover>
552546
553547
<Popover :open="isMessageTypePopoverOpen" @on-close="onMessageTypePopoverClose" width="250">
554-
<Button @click="handleOpenMessageTypePopover" type="secondary" size="mini" :disabled="!transactions.length">
548+
<Button @click="handleOpenMessageTypePopover" type="secondary" size="mini" :disabled="!transactions.length && !hasActiveFilters">
555549
<Icon name="plus-circle" size="12" color="tertiary" />
556550
<Text color="secondary">Message Type</Text>
557551
@@ -644,9 +638,12 @@ const handleOpenQRModal = () => {
644638
645639
<Flex v-else direction="column" align="center" justify="center" gap="8" :class="$style.empty">
646640
<Text size="13" weight="600" color="secondary" align="center"> No transactions </Text>
647-
<Text size="12" weight="500" height="160" color="tertiary" align="center" style="max-width: 220px">
641+
<Text v-if="page === 1" size="12" weight="500" height="160" color="tertiary" align="center" style="max-width: 220px">
648642
This address did not signed any transactions
649643
</Text>
644+
<Text v-else size="12" weight="500" height="160" color="tertiary" align="center" style="max-width: 220px">
645+
This address did not signed any more transactions
646+
</Text>
650647
</Flex>
651648
</template>
652649
@@ -676,11 +673,11 @@ const handleOpenQRModal = () => {
676673
</Flex>
677674
678675
<!-- Pagination -->
679-
<Flex v-if="transactions.length" align="center" gap="6" :class="$style.pagination">
680-
<Button @click="page = 1" type="secondary" size="mini" :disabled="page === 1 || transactions.length !== 10">
676+
<Flex v-if="transactions.length || page !== 1" align="center" gap="6" :class="$style.pagination">
677+
<Button @click="page = 1" type="secondary" size="mini" :disabled="page === 1">
681678
<Icon name="arrow-left-stop" size="12" color="primary" />
682679
</Button>
683-
<Button type="secondary" @click="handlePrev" size="mini" :disabled="page === 1 || transactions.length !== 10">
680+
<Button type="secondary" @click="handlePrev" size="mini" :disabled="page === 1">
684681
<Icon name="arrow-left" size="12" color="primary" />
685682
</Button>
686683

‎components/modules/namespace/NamespaceCharts.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -315,7 +315,7 @@ onBeforeUnmount(() => {
315315

316316
<Flex justify="between" gap="32" :class="$style.data">
317317
<Flex direction="column" gap="20" wide>
318-
<Text size="13" weight="600" color="primary">Storage Usage</Text>
318+
<Text size="13" weight="600" color="primary">DA Usage</Text>
319319

320320
<Flex ref="chartWrapperEl" direction="column" :class="$style.chart_wrapper">
321321
<Flex direction="column" justify="between" :class="[$style.axis, $style.y]">

‎components/modules/rollup/RollupCharts.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -315,7 +315,7 @@ onBeforeUnmount(() => {
315315

316316
<Flex justify="between" gap="32" :class="$style.data">
317317
<Flex direction="column" gap="20" wide>
318-
<Text size="13" weight="600" color="primary">Storage Usage</Text>
318+
<Text size="13" weight="600" color="primary">DA Usage</Text>
319319

320320
<Flex ref="chartWrapperEl" direction="column" :class="$style.chart_wrapper">
321321
<Flex direction="column" justify="between" :class="[$style.axis, $style.y]">

0 commit comments

Comments
 (0)