diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8d4466e5b..88044bb75 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -52,6 +52,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#404](https://github.com/alleslabs/celatone-frontend/pull/404) Use internal navigate instead of app link for block navigation
 - [#396](https://github.com/alleslabs/celatone-frontend/pull/396) Refactor useConfig, disable wasm related tabs on the public project page
 - [#392](https://github.com/alleslabs/celatone-frontend/pull/392) Refactor proposal table and fix empty state of the proposal list table
 - [#374](https://github.com/alleslabs/celatone-frontend/pull/374) Remove testnet, mainnet concepts and use permission from params
diff --git a/src/lib/pages/block-details/components/BlockDetailsTop.tsx b/src/lib/pages/block-details/components/BlockDetailsTop.tsx
index 8c05813a8..ffc2c021f 100644
--- a/src/lib/pages/block-details/components/BlockDetailsTop.tsx
+++ b/src/lib/pages/block-details/components/BlockDetailsTop.tsx
@@ -7,8 +7,7 @@ import {
   Button,
 } from "@chakra-ui/react";
 
-import { useLCDEndpoint } from "lib/app-provider";
-import { AppLink } from "lib/components/AppLink";
+import { useInternalNavigate, useLCDEndpoint } from "lib/app-provider";
 import { CopyLink } from "lib/components/CopyLink";
 import { DotSeparator } from "lib/components/DotSeparator";
 import { CustomIcon } from "lib/components/icon";
@@ -31,6 +30,7 @@ interface BlockDetailsTopProps {
 export const BlockDetailsTop = ({ blockData }: BlockDetailsTopProps) => {
   const block = Number(blockData.height);
   const lcdEndpoint = useLCDEndpoint();
+  const navigate = useInternalNavigate();
   const openLcdPage = () =>
     openNewTab(
       `${lcdEndpoint}/cosmos/base/tendermint/v1beta1/blocks/${blockData.height}`
@@ -54,19 +54,27 @@ export const BlockDetailsTop = ({ blockData }: BlockDetailsTopProps) => {
           </Flex>
           <Flex gap={2}>
             {!disablePrevious && (
-              <AppLink href={`/block/${block - 1}`}>
-                <StyledIconButton
-                  icon={<CustomIcon name="chevron-left" />}
-                  variant="ghost-gray"
-                />
-              </AppLink>
-            )}
-            <AppLink href={`/block/${block + 1}`}>
               <StyledIconButton
-                icon={<CustomIcon name="chevron-right" />}
+                icon={<CustomIcon name="chevron-left" />}
                 variant="ghost-gray"
+                onClick={() =>
+                  navigate({
+                    pathname: "/blocks/[height]",
+                    query: { height: block - 1 },
+                  })
+                }
               />
-            </AppLink>
+            )}
+            <StyledIconButton
+              icon={<CustomIcon name="chevron-right" />}
+              variant="ghost-gray"
+              onClick={() =>
+                navigate({
+                  pathname: "/blocks/[height]",
+                  query: { height: block + 1 },
+                })
+              }
+            />
             <Button
               variant="ghost-gray"
               padding={2}