Resolved merge conflicts

.github/workflows/build.yml

@@ -8,7 +8,7 @@ jobs:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version: 22
       - name: Install dependencies
         run: npm install -g yarn && yarn
       - name: Install Playwright Browsers

.nvmrc

@@ -1 +1 @@
-v20
+v22

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:20
+FROM node:22
 
 ENV NEXT_TELEMETRY_DISABLED 1
 ENV PORT 80

package.json

@@ -4,7 +4,7 @@
   "author": "Stellar Development Foundation <[email protected]>",
   "license": "Apache-2.0",
   "engines": {
-    "node": ">=20.0.0"
+    "node": ">=22.0.0"
   },
   "scripts": {
     "dev": "export NEXT_PUBLIC_COMMIT_HASH=$(git rev-parse --short HEAD) && next dev",
@@ -19,7 +19,7 @@
     "pre-push": "yarn lint:ts && yarn test"
   },
   "dependencies": {
-    "@creit.tech/stellar-wallets-kit": "^1.2.3",
+    "@creit.tech/stellar-wallets-kit": "^1.2.5",
     "@ledgerhq/hw-app-str": "^7.0.4",
     "@ledgerhq/hw-transport-webusb": "^6.29.4",
     "@stellar/design-system": "^2.0.0-beta.17",

src/app/(sidebar)/account/create/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { Card, Text, Button, Icon } from "@stellar/design-system";
 import { Keypair } from "@stellar/stellar-sdk";
 
@@ -9,6 +9,7 @@ import { useFriendBot } from "@/query/useFriendBot";
 import { useQueryClient } from "@tanstack/react-query";
 
 import { useIsTestingNetwork } from "@/hooks/useIsTestingNetwork";
+import { useNetworkChanged } from "@/hooks/useNetworkChanged";
 import { getNetworkHeaders } from "@/helpers/getNetworkHeaders";
 
 import { GenerateKeypair } from "@/components/GenerateKeypair";
@@ -33,8 +34,6 @@ export default function CreateAccount() {
   const IS_CUSTOM_NETWORK_WITH_HORIZON =
     network.id === "custom" && network.horizonUrl;
 
-  const networkRef = useRef(network);
-
   const resetQuery = useCallback(
     () =>
       queryClient.resetQueries({
@@ -62,14 +61,7 @@ export default function CreateAccount() {
     }
   }, [isError, isSuccess]);
 
-  useEffect(() => {
-    if (networkRef.current.id !== network.id) {
-      networkRef.current = network;
-      resetStates();
-    }
-    // Not including network and resetStates()
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [networkRef.current.id, network.id]);
+  useNetworkChanged(resetStates);
 
   const generateKeypair = () => {
     resetStates();