diff --git a/src/views/pages/ledger/ledger.js b/src/views/pages/ledger/ledger.js
index 26c8b360..80fa38b5 100644
--- a/src/views/pages/ledger/ledger.js
+++ b/src/views/pages/ledger/ledger.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef } from 'react'
+import React, { useState, useEffect, useRef, useMemo } from 'react'
import PropTypes from 'prop-types'
import List from '@mui/material/List'
import ListItem from '@mui/material/ListItem'
@@ -38,47 +38,50 @@ export default function LedgerPage({ load, data, isLoading }) {
const [menu_open, set_menu_open] = useState(false)
const filter_input_ref = useRef(null)
- const categories = {
- Addresses: {
- 'Address Counts': (
-
- )
- },
- Blocks: {
- 'Block Counts':
- },
- Transactions: {
- 'Value Transferred': (
-
- ),
- 'Transfer Volume': (
-
- ),
- 'Transfer Amounts': (
-
- )
- },
- Distribution: {
- 'Address Supply Distribution': (
-
- ),
- 'Address Balances (Nano)': {
- ...base_ranges.reduce(
- (acc, range) => ({
- ...acc,
- [`Addresses with Balance ${base_range_labels[range]}`]: (
-
- )
- }),
- {}
+ const categories = useMemo(
+ () => ({
+ Addresses: {
+ 'Address Counts': (
+
)
+ },
+ Blocks: {
+ 'Block Counts':
+ },
+ Transactions: {
+ 'Value Transferred': (
+
+ ),
+ 'Transfer Volume': (
+
+ ),
+ 'Transfer Amounts': (
+
+ )
+ },
+ Distribution: {
+ 'Address Supply Distribution': (
+
+ ),
+ 'Address Balances (Nano)': {
+ ...base_ranges.reduce(
+ (acc, range) => ({
+ ...acc,
+ [`Addresses with Balance ${base_range_labels[range]}`]: (
+
+ )
+ }),
+ {}
+ )
+ }
}
- }
- }
+ }),
+ [data, isLoading]
+ )
useEffect(() => {
load()
@@ -107,21 +110,7 @@ export default function LedgerPage({ load, data, isLoading }) {
}
set_filtered_categories(result)
- }
-
- if (filter_text.length && !previous_filter_text.current.length) {
- set_cached_open_categories({ ...open_categories })
- }
-
- if (filter_text.length === 0 && previous_filter_text.current.length) {
- set_open_categories(cached_open_categories)
- }
-
- previous_filter_text.current = filter_text
- }, [filter_text])
- useEffect(() => {
- if (filter_text.length > 0) {
// Uncollapse all categories and their children when filtering
const all_open_categories = Object.keys(categories).reduce((acc, key) => {
const category = categories[key]
@@ -136,7 +125,17 @@ export default function LedgerPage({ load, data, isLoading }) {
}, {})
set_open_categories(all_open_categories)
}
- }, [filtered_categories, categories, filter_text])
+
+ if (filter_text.length && !previous_filter_text.current.length) {
+ set_cached_open_categories({ ...open_categories })
+ }
+
+ if (filter_text.length === 0 && previous_filter_text.current.length) {
+ set_open_categories(cached_open_categories)
+ }
+
+ previous_filter_text.current = filter_text
+ }, [filter_text, categories])
useEffect(() => {
if (menu_open) {