Skip to content

Commit

Permalink
feat: added "range and above" charts for address counts
Browse files Browse the repository at this point in the history
  • Loading branch information
@mistakia
mistakia committed Jun 18, 2024
1 parent dae5d29 commit 4fb333d
Show file tree
Hide file tree
Showing 3 changed files with 126 additions and 30 deletions.
14 changes: 14 additions & 0 deletions src/core/constants.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,3 +44,17 @@ export const base_range_labels = {
_000001: '0.00001 to 0.0001',
_000001_below: '<0.00001'
}

export const base_range_and_above_labels = {
_1000000: '1M and above',
_100000: '100k and above',
_10000: '10k and above',
_1000: '1k and above',
_100: '100 and above',
_10: '10 and above',
_1: '1 and above',
_01: '0.1 and above',
_001: '0.01 and above',
_0001: '0.001 and above',
_00001: '0.0001 and above'
}
114 changes: 90 additions & 24 deletions ...ews/components/ledger-chart-addresses-with-balance/ledger-chart-addresses-with-balance.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,11 @@ import { TooltipComponent, GridComponent } from 'echarts/components'
import { CanvasRenderer } from 'echarts/renderers'

import { download_csv, download_json } from '@core/utils'
import { base_range_labels } from '@core/constants'
import {
base_ranges,
base_range_labels,
base_range_and_above_labels
} from '@core/constants'
import LedgerDescriptionNotice from '@components/ledger-description-notice'

echarts.use([LineChart, TooltipComponent, GridComponent, CanvasRenderer])
Expand All @@ -18,8 +22,12 @@ export default function LedgerChartAddressesWithBalance({
isLoading,
price_history,
get_price_history,
range
range,
is_range_and_above
}) {
const labels = is_range_and_above
? base_range_and_above_labels
: base_range_labels
useEffect(() => {
if (price_history.length === 0) {
get_price_history()
Expand All @@ -28,33 +36,74 @@ export default function LedgerChartAddressesWithBalance({

const handle_download_csv = () => {
const download_data = []
data[`${range}_account_count`].forEach((item) => {
download_data.push({
range: base_range_labels[range],
date: item[0],
account_count: item[1]
if (is_range_and_above) {
const index = base_ranges.indexOf(range)
const combined_ranges = base_ranges.slice(0, index + 1)
const single_range_data = data[`${range}_account_count`]
for (let i = 0; i < single_range_data.length; i++) {
const single_range_item = single_range_data[i]
let combined_value = 0
for (let j = 0; j < combined_ranges.length; j++) {
combined_value +=
data[`${combined_ranges[j]}_account_count`][i][1] || 0
}
download_data.push({
range: labels[range],
date: single_range_item[0],
account_count: combined_value
})
}
} else {
data[`${range}_account_count`].forEach((item) => {
download_data.push({
range: labels[range],
date: item[0],
account_count: item[1]
})
})
})
}
download_csv({
headers: ['Range', 'Date', 'Account Count'],
data: download_data,
file_name: `nano-community-ledger-daily-addresses-with-balance-${base_range_labels[
file_name: `nano-community-ledger-daily-addresses-with-balance-${labels[
range
].toLowerCase()}`
})
}

const handle_download_json = () => {
const download_data = {
title: `Nano Community Ledger Daily Addresses With Balance - ${base_range_labels[range]}`,
data: data[`${range}_account_count`].map((item) => ({
date: item[0],
account_count: item[1]
}))
let download_data
if (is_range_and_above) {
const index = base_ranges.indexOf(range)
const combined_ranges = base_ranges.slice(0, index + 1)
const single_range_data = data[`${range}_account_count`]
const combined_data = single_range_data.map((single_range_item, i) => {
let combined_value = 0
for (let j = 0; j < combined_ranges.length; j++) {
combined_value +=
data[`${combined_ranges[j]}_account_count`][i][1] || 0
}
return {
date: single_range_item[0],
account_count: combined_value
}
})
download_data = {
title: `Nano Community Ledger Daily Addresses With Balance - ${labels[range]}`,
data: combined_data
}
} else {
download_data = {
title: `Nano Community Ledger Daily Addresses With Balance - ${labels[range]}`,
data: data[`${range}_account_count`].map((item) => ({
date: item[0],
account_count: item[1]
}))
}
}
download_json({
data: download_data,
file_name: `nano-community-ledger-daily-addresses-with-balance-${base_range_labels[
file_name: `nano-community-ledger-daily-addresses-with-balance-${labels[
range
].toLowerCase()}`
})
Expand All @@ -69,16 +118,35 @@ export default function LedgerChartAddressesWithBalance({
}, [price_history])

const series_data = useMemo(() => {
const combined_data = is_range_and_above
? []
: data[`${range}_account_count`].map((item) => [item[0], item[1] || null])

if (is_range_and_above) {
const index = base_ranges.indexOf(range)
const combined_ranges = base_ranges.slice(0, index + 1)
const single_range_data = data[`${range}_account_count`]
for (let i = 0; i < single_range_data.length; i++) {
const single_range_item = single_range_data[i]
let combined_value = 0
for (let j = 0; j < combined_ranges.length; j++) {
combined_value +=
data[`${combined_ranges[j]}_account_count`][i][1] || 0
}
combined_data.push([single_range_item[0], combined_value || null])
}
}

return {
name: base_range_labels[range],
name: labels[range],
type: 'line',
lineStyle: {
width: 2
},
showSymbol: false,
data: data[`${range}_account_count`].map((item) => [item[0], item[1]])
data: combined_data
}
}, [data, range])
}, [data, range, is_range_and_above])

const option = {
tooltip: {
Expand Down Expand Up @@ -146,10 +214,7 @@ export default function LedgerChartAddressesWithBalance({
<span>Description</span>
</div>
<div className='ledger__chart-section-body description'>
<p>
The number of unique addresses holding {base_range_labels[range]}{' '}
Nano.
</p>
<p>The number of unique addresses holding {labels[range]} Nano.</p>
</div>
<LedgerDescriptionNotice />
{!isLoading && (
Expand All @@ -172,5 +237,6 @@ LedgerChartAddressesWithBalance.propTypes = {
isLoading: PropTypes.bool.isRequired,
price_history: PropTypes.array.isRequired,
get_price_history: PropTypes.func.isRequired,
range: PropTypes.string
range: PropTypes.string,
is_range_and_above: PropTypes.bool
}
28 changes: 22 additions & 6 deletions src/views/pages/ledger/ledger.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,11 @@ import LedgerChartDistribution from '@components/ledger-chart-distribution'
import LedgerChartAddressesWithBalance from '@components/ledger-chart-addresses-with-balance'
import Seo from '@components/seo'
import Menu from '@components/menu'
import { base_ranges, base_range_labels } from '@core/constants'
import {
base_ranges,
base_range_labels,
base_range_and_above_labels
} from '@core/constants'

import './ledger.styl'

Expand Down Expand Up @@ -64,8 +68,8 @@ export default function LedgerPage({ load, data, isLoading }) {
<LedgerChartDistribution data={data} isLoading={isLoading} />
),
'Address Balances (Nano)': {
...base_ranges.reduce(
(acc, range) => ({
...base_ranges.reduce((acc, range) => {
const new_acc = {
...acc,
[`Addresses with Balance ${base_range_labels[range]}`]: (
<LedgerChartAddressesWithBalance
Expand All @@ -74,9 +78,21 @@ export default function LedgerPage({ load, data, isLoading }) {
range={range}
/>
)
}),
{}
)
}
if (range !== '_000001_below' && range !== '_1000000') {
new_acc[
`Addresses with Balance ${base_range_and_above_labels[range]}`
] = (
<LedgerChartAddressesWithBalance
data={data}
isLoading={isLoading}
range={range}
is_range_and_above
/>
)
}
return new_acc
}, {})
}
}
}),
Expand Down

0 comments on commit 4fb333d

Please sign in to comment.