feat: use toploader on search input submit

src/app/(home)/_components/ChartBox/index.tsx

@@ -5,7 +5,7 @@ import { useState } from 'react';
 import { daysFilter } from './Chart.helper';
 import dynamic from 'next/dynamic';
 
-const Chart = dynamic(() => import('./Chart'), {
+const Chart = dynamic(() => import('./Chart.tsx').then((mod) => mod.default), {
   ssr: false,
 });
 

src/app/statistics/_components/SankeyChartBox/index.tsx

@@ -4,9 +4,12 @@ import { PropsType } from './SankeyChartBox.type';
 import React from 'react';
 import { barChartColors } from '../ChartBarBox/ChartBarBox.helper';
 
-const SankeyChart = dynamic(() => import('./SankeyChart'), {
-  ssr: false,
-});
+const SankeyChart = dynamic(
+  () => import('./SankeyChart.tsx').then((mod) => mod.default),
+  {
+    ssr: false,
+  },
+);
 
 function SankeyChartBox(props: PropsType) {
   const { topSourcePath, blockchainDataMap } = props;

src/components/common/SearchBox/SearchInput.tsx

@@ -1,10 +1,12 @@
 'use client';
 
-import { useRouter } from 'next/navigation';
 import { FormEvent, MouseEvent, useEffect, useRef, useState } from 'react';
 import { Button } from '../Button';
 import { CloseIcon, PasteIcon, SearchIcon } from 'src/components/icons';
 import { PropTypes } from './SearchInput.type';
+import { useRouter } from 'nextjs-toploader/app';
+import { usePathname } from 'next/navigation';
+
 const BLUR_DELAY = 300;
 
 function SearchInput(props: PropTypes) {
@@ -13,6 +15,7 @@ function SearchInput(props: PropTypes) {
   const [isFocused, setIsFocused] = useState(false);
   const [isFirefox, setIsFirefox] = useState(false);
   const router = useRouter();
+  const pathname = usePathname();
   const inputRef = useRef<HTMLInputElement | null>(null);
   const onSubmit = (
     e: FormEvent<HTMLFormElement> | MouseEvent<HTMLButtonElement>,
@@ -30,7 +33,7 @@ function SearchInput(props: PropTypes) {
     setIsFocused(false);
 
     setQuery('');
-  }, [router]);
+  }, [pathname]);
 
   const handlePaste = async (event: MouseEvent<HTMLDivElement>) => {
     setIsFocused(true);

tsconfig.json

@@ -1,15 +1,16 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2022",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "noEmit": true,
     "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "node",
+    "module": "node16",
+    "moduleResolution": "Node16",
+    "allowImportingTsExtensions": true,
     "resolveJsonModule": true,
     "isolatedModules": true,
     "baseUrl": "./",