Merge branch 'next' into governance-tx-flow

liquity · Dec 17, 2024 · a668607 · a668607
2 parents 30addf1 + ef789e0
commit a668607
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 22 deletions.
diff --git a/frontend/app/src/comps/ProtocolStats/ProtocolStats.tsx b/frontend/app/src/comps/ProtocolStats/ProtocolStats.tsx
@@ -13,6 +13,7 @@ import { AnchorTextButton, HFlex, shortenAddress, TokenIcon } from "@liquity2/ui
 import { blo } from "blo";
 import * as dn from "dnum";
 import Image from "next/image";
+import Link from "next/link";
 
 const DISPLAYED_PRICES = ["LQTY", "BOLD", "ETH"] as const;
 
@@ -57,30 +58,41 @@ export function ProtocolStats() {
             />
           ))}
           {account.address && (
-            <AnchorTextButton
+            <Link
               id="footer-account-button"
               href={`/account?address=${account.address}`}
-              label={
-                <HFlex gap={4} alignItems="center">
-                  <Image
-                    alt=""
-                    width={16}
-                    height={16}
-                    src={blo(account.address)}
-                    className={css({
-                      borderRadius: "50%",
-                    })}
-                  />
+              passHref
+              legacyBehavior
+              scroll={true}
+            >
+              <AnchorTextButton
+                label={
+                  <HFlex gap={4} alignItems="center">
+                    <Image
+                      alt=""
+                      width={16}
+                      height={16}
+                      src={blo(account.address)}
+                      className={css({
+                        borderRadius: "50%",
+                      })}
+                    />
 
-                  <HFlex gap={8}>
-                    <span>{shortenAddress(account.address, 3)}</span>
+                    {shortenAddress(account.address, 3)}
                   </HFlex>
-                </HFlex>
-              }
-              className={css({
-                color: "content",
-              })}
-            />
+                }
+                className={css({
+                  color: "content",
+                  borderRadius: 4,
+                  _focusVisible: {
+                    outline: "2px solid token(colors.focused)",
+                  },
+                  _active: {
+                    translate: "0 1px",
+                  },
+                })}
+              />
+            </Link>
           )}
         </HFlex>
       </div>

diff --git a/frontend/app/src/screens/LoanScreen/LoanScreen.tsx b/frontend/app/src/screens/LoanScreen/LoanScreen.tsx
@@ -184,7 +184,10 @@ export function LoanScreen() {
                           if (!loan.data) {
                             return;
                           }
-                          const id = getPrefixedTroveId(loan.data.collIndex, loan.data.troveId);
+                          const id = getPrefixedTroveId(
+                            loan.data.collIndex,
+                            loan.data.troveId,
+                          );
                           router.push(
                             `/loan/${TABS[index].id}?id=${id}`,
                             { scroll: false },

diff --git a/frontend/app/src/screens/StakeScreen/StakeScreen.tsx b/frontend/app/src/screens/StakeScreen/StakeScreen.tsx
@@ -57,7 +57,7 @@ export function StakeScreen() {
           }))}
           selected={TABS.findIndex(({ id }) => id === action)}
           onSelect={(index) => {
-            router.push(`/stake/${TABS[index].id}`);
+            router.push(`/stake/${TABS[index].id}`, { scroll: false });
           }}
         />