Skip to content

Commit 3961d55

Browse files
kajosephkajoseph
committed
Merge branch 'add-lazy-load' of github.com:lanchana/bitcore
2 parents f1efdbe + fcfe6e4 commit 3961d55

File tree

8 files changed

+143
-57
lines changed

8 files changed

+143
-57
lines changed

‎packages/insight/package-lock.json

+48-8
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/insight/package.json

+4-3
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
"dependencies": {
2828
"@reduxjs/toolkit": "2.3.0",
2929
"assert": "2.1.0",
30-
"axios": "0.21.1",
30+
"axios": "1.7.9",
3131
"bitcore-lib": "^10.0.23",
3232
"bitcore-lib-cash": "^10.0.23",
3333
"bitcore-lib-doge": "^10.0.21",
@@ -40,6 +40,7 @@
4040
"process": "0.11.10",
4141
"qrcode.react": "3.0.1",
4242
"react": "18.1.0",
43+
"react-app-rewired": "2.2.1",
4344
"react-copy-to-clipboard": "5.1.0",
4445
"react-dom": "18.1.0",
4546
"react-infinite-scroll-component": "6.1.0",
@@ -55,10 +56,10 @@
5556
"swr": "1.3.0",
5657
"url": "0.11.4",
5758
"vm-browserify": "1.1.2",
58-
"web-vitals": "2.1.4",
59-
"react-app-rewired": "2.2.1"
59+
"web-vitals": "2.1.4"
6060
},
6161
"devDependencies": {
62+
"@babel/plugin-proposal-private-property-in-object": "7.21.11",
6263
"@testing-library/jest-dom": "5.16.4",
6364
"@testing-library/react": "13.0.1",
6465
"@testing-library/user-event": "13.5.0",

‎packages/insight/src/App.tsx

+5-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import React, {useEffect} from 'react';
22
import {BrowserRouter} from 'react-router-dom';
33
import {SWRConfig} from 'swr';
44
import {fetcher} from './api/api';
@@ -13,7 +13,10 @@ import nProgress from 'nprogress';
1313
function App() {
1414
const theme = useAppSelector(({APP}) => APP.theme);
1515
const colorScheme = theme === 'dark' ? BitPayDarkTheme : BitPayLightTheme;
16-
nProgress.configure({showSpinner: false});
16+
17+
useEffect(() => {
18+
nProgress.configure({showSpinner: false});
19+
}, []);
1720

1821
return (
1922
<ThemeProvider theme={colorScheme}>

‎packages/insight/src/Routing.tsx

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import React, {lazy, Suspense} from 'react';
2+
import {Navigate, Route, Routes} from 'react-router-dom';
3+
import Home from './pages';
4+
const Blocks = lazy(() => import('./pages/blocks'));
5+
const Block = lazy(() => import('./pages/block'));
6+
const TransactionHash = lazy(() => import('./pages/transaction'));
7+
const Address = lazy(() => import('./pages/address'));
8+
const Search = lazy(() => import('./pages/search'));
9+
10+
function Routing() {
11+
return (
12+
<Suspense>
13+
<Routes>
14+
<Route path='/' element={<Home />} />
15+
<Route path='/:currency/:network/blocks' element={<Blocks />} />
16+
<Route path='/:currency/:network/block/:block' element={<Block />} />
17+
<Route path='/:currency/:network/tx/:tx' element={<TransactionHash />} />
18+
<Route path='/:currency/:network/address/:address' element={<Address />} />
19+
<Route path='/search' element={<Search />} />
20+
{/* 404 redirect to home page */}
21+
<Route path='*' element={<Navigate to='/' />} />
22+
</Routes>
23+
</Suspense>
24+
);
25+
}
26+
27+
export default Routing;

‎packages/insight/src/components/body.tsx

+2-17
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,11 @@
11
import React from 'react';
2-
import {Routes, Route, Navigate} from 'react-router-dom';
32
import Layout from './layout';
4-
import Home from '../pages';
5-
import Blocks from '../pages/blocks';
6-
import Block from '../pages/block';
7-
import TransactionHash from '../pages/transaction';
8-
import Address from '../pages/address';
9-
import Search from '../pages/search';
3+
import Routing from '../Routing';
104

115
function Body() {
126
return (
137
<Layout>
14-
<Routes>
15-
<Route path='/' element={<Home />} />
16-
<Route path='/:currency/:network/blocks' element={<Blocks />} />
17-
<Route path='/:currency/:network/block/:block' element={<Block />} />
18-
<Route path='/:currency/:network/tx/:tx' element={<TransactionHash />} />
19-
<Route path='/:currency/:network/address/:address' element={<Address />} />
20-
<Route path='/search' element={<Search />} />
21-
{/* 404 redirect to home page */}
22-
<Route path='*' element={<Navigate to='/' />} />
23-
</Routes>
8+
<Routing />
249
</Layout>
2510
);
2611
}

‎packages/insight/src/components/copy-text.tsx

+36-17
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,17 @@ import TickSvg from '../assets/images/tick.svg';
88
const CopyImg = styled(motion.div)`
99
margin: auto 0.25rem;
1010
display: inline-block;
11+
width: 12px;
12+
height: 12px;
13+
position: relative;
14+
`;
15+
16+
const IconImage = styled(motion.img)`
17+
position: absolute;
18+
top: 0;
19+
left: 0;
20+
width: 100%;
21+
height: 100%;
1122
`;
1223

1324
interface CopyTextProps {
@@ -49,25 +60,33 @@ const CopyText: FC<CopyTextProps> = ({text}) => {
4960
};
5061

5162
return (
52-
<AnimatePresence>
53-
{copied ? (
54-
<CopyImg key='tick' variants={copyAnime} exit='exit' initial='initial' animate='animate'>
55-
<img src={TickSvg} width={12} height={12} alt='tick' />
56-
</CopyImg>
57-
) : (
58-
<CopyToClipboard text={text} onCopy={() => onClickCopy()}>
59-
<CopyImg
60-
key='copy'
63+
<CopyImg>
64+
<AnimatePresence mode={'wait'}>
65+
{copied ? (
66+
<IconImage
67+
key='tick'
68+
src={TickSvg}
69+
alt='tick'
6170
variants={copyAnime}
62-
whileHover='whileHover'
63-
exit='exit'
6471
initial='initial'
65-
animate='animate'>
66-
<img src={CopySvg} width={12} height={12} alt='copy' />
67-
</CopyImg>
68-
</CopyToClipboard>
69-
)}
70-
</AnimatePresence>
72+
animate='animate'
73+
exit='exit'
74+
/>
75+
) : (
76+
<CopyToClipboard text={text} onCopy={() => onClickCopy()}>
77+
<IconImage
78+
key='copy'
79+
src={CopySvg}
80+
alt='copy'
81+
variants={copyAnime}
82+
initial='initial'
83+
animate='animate'
84+
whileHover='whileHover'
85+
/>
86+
</CopyToClipboard>
87+
)}
88+
</AnimatePresence>
89+
</CopyImg>
7190
);
7291
};
7392

‎packages/insight/src/index.tsx

+20-9
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,19 @@ import React from 'react';
22
import ReactDOM from 'react-dom/client';
33
import App from './App';
44
import {Provider} from 'react-redux';
5-
// import reportWebVitals from './reportWebVitals';
65
import {store} from './store';
76

8-
const initialURL = window.location.href;
9-
if (initialURL.includes('/#/')) {
10-
window.location.href = initialURL.replace('/#/', '/');
11-
} else {
7+
// Handle redirection for hash-based URLs
8+
const handleURLRedirection = () => {
9+
const initialURL = window.location.href;
10+
if (initialURL.includes('/#/')) {
11+
window.location.href = initialURL.replace('/#/', '/');
12+
return true;
13+
}
14+
return false;
15+
};
16+
17+
const initializeApp = () => {
1218
const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
1319
root.render(
1420
<React.StrictMode>
@@ -17,9 +23,14 @@ if (initialURL.includes('/#/')) {
1723
</Provider>
1824
</React.StrictMode>,
1925
);
26+
};
2027

21-
// If you want to start measuring performance in your app, pass a function
22-
// to log results (for example: reportWebVitals(console.log))
23-
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
24-
// reportWebVitals();
28+
if (!handleURLRedirection()) {
29+
// Initialize the app only if redirection is not needed
30+
initializeApp();
2531
}
32+
33+
// If you want to start measuring performance in your app, pass a function
34+
// to log results (for example: reportWebVitals(console.log))
35+
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
36+
// reportWebVitals();

‎packages/insight/src/pages/transaction.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -195,7 +195,7 @@ const TransactionHash: React.FC = () => {
195195
message={`This transaction was replaced by another transaction that ${
196196
transaction.chain === 'ETH'
197197
? 'used the same nonce'
198-
: "spent some of it's inputs"
198+
: 'spent some of it\'s inputs'
199199
}.`}
200200
type={'error'}
201201
/>

0 commit comments

Comments
 (0)