chore: update @solidjs/router

BoltzExchange · Jan 3, 2024 · 797a6e8 · 797a6e8
1 parent bd4d3fd
commit 797a6e8
Show file tree

Hide file tree

Showing 6 changed files with 61 additions and 75 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -38,7 +38,7 @@
         "@scure/base": "^1.1.5",
         "@solid-primitives/i18n": "^2.0.0",
         "@solid-primitives/storage": "^2.1.1",
-        "@solidjs/router": "^0.9.1",
+        "@solidjs/router": "^0.10.5",
         "@vulpemventures/secp256k1-zkp": "^3.1.0",
         "bignumber.js": "^9.1.2 ",
         "bitcoinjs-lib": "^6.1.5",

diff --git a/src/index.jsx b/src/index.jsx
@@ -1,7 +1,7 @@
 /* @refresh reload */
 import "@fontsource/noto-sans";
 import "@fontsource/noto-sans/800.css";
-import { Navigate, Route, Router, Routes } from "@solidjs/router";
+import { Navigate, Route, Router } from "@solidjs/router";
 import log from "loglevel";
 import { createRoot, createSignal } from "solid-js";
 import { render } from "solid-js/web";
@@ -57,33 +57,36 @@ if ("serviceWorker" in navigator) {
 
 document.body.classList.remove("loading");
 
+const App = (props) => (
+    <>
+        <Show when={!embedded()}>
+            <Nav network={network} />
+        </Show>
+        {props.children}
+        <Show when={!embedded()}>
+            <Notification />
+            <Footer />
+        </Show>
+    </>
+);
+
 const cleanup = render(
     () => (
-        <Router>
-            <Web3SignerProvider>
-                <Show when={!embedded()}>
-                    <Nav network={network} />
-                </Show>
-                <Routes>
-                    <Route path="*" element={<Navigate href={"/404"} />} />
-                    <Route path="/404" component={NotFound} />
-                    <Route path="/" component={Hero} />
-                    <Route path="/swap" component={Create} />
-                    {/* Compatibility with link in Breez:
+        <Web3SignerProvider>
+            <Router root={App}>
+                <Route path="/" component={Hero} />
+                <Route path="/swap" component={Create} />
+                {/* Compatibility with link in Breez:
                         https://github.com/breez/breezmobile/blob/a1b0ffff902dfa2210af8fdb047b715535ff11e9/src/json/vendors.json#L30 */}
-                    <Route path="/swapbox" component={Create} />
-                    <Route path="/swap/:id" component={Pay} />
-                    <Route path="/swap/refund/:id" component={RefundStep} />
-                    <Route path="/error" component={Error} />
-                    <Route path="/refund" component={Refund} />
-                    <Route path="/history" component={History} />
-                </Routes>
-                <Show when={!embedded()}>
-                    <Notification />
-                    <Footer />
-                </Show>
-            </Web3SignerProvider>
-        </Router>
+                <Route path="/swapbox" component={Create} />
+                <Route path="/swap/:id" component={Pay} />
+                <Route path="/swap/refund/:id" component={RefundStep} />
+                <Route path="/error" component={Error} />
+                <Route path="/refund" component={Refund} />
+                <Route path="/history" component={History} />
+                <Route path="*404" component={NotFound} />
+            </Router>
+        </Web3SignerProvider>
     ),
     document.getElementById("root"),
 );

diff --git a/tests/Nav.spec.jsx b/tests/Nav.spec.jsx
@@ -8,11 +8,7 @@ describe("Nav", () => {
     test.each(["testnet", "regtest", "random"])(
         "should show network on network %s",
         async (network) => {
-            render(() => (
-                <Router>
-                    <Nav network={network} />
-                </Router>
-            ));
+            render(() => <Router root={() => <Nav network={network} />} />);
 
             const networkLabel = screen.queryAllByText(network);
             expect(networkLabel.length).toBe(1);
@@ -21,12 +17,7 @@ describe("Nav", () => {
 
     test("should not show network on mainnet", async () => {
         const network = "main";
-
-        render(() => (
-            <Router>
-                <Nav network={network} />
-            </Router>
-        ));
+        render(() => <Router root={() => <Nav network={network} />} />);
 
         const networkLabel = screen.queryAllByText(network);
         expect(networkLabel.length).toBe(0);

diff --git a/tests/components/Create.spec.tsx b/tests/components/Create.spec.tsx
@@ -25,11 +25,9 @@ describe("Create", () => {
 
     test("should render Create", async () => {
         render(() => (
-            <Router>
-                <Web3SignerProvider noFetch={true}>
-                    <Create />
-                </Web3SignerProvider>
-            </Router>
+            <Web3SignerProvider noFetch={true}>
+                <Router root={Create} />
+            </Web3SignerProvider>
         ));
         const button = await screen.findAllByText(i18n.en.create_swap);
         expect(button).not.toBeUndefined();
@@ -39,11 +37,9 @@ describe("Create", () => {
         const setReceiveAmount = vi.spyOn(signals, "setReceiveAmount");
 
         render(() => (
-            <Router>
-                <Web3SignerProvider noFetch={true}>
-                    <Create />
-                </Web3SignerProvider>
-            </Router>
+            <Web3SignerProvider noFetch={true}>
+                <Router root={Create} />
+            </Web3SignerProvider>
         ));
 
         signals.setSendAmount(BigNumber(50_000));
@@ -63,11 +59,9 @@ describe("Create", () => {
         const setReceiveAmount = vi.spyOn(signals, "setReceiveAmount");
 
         render(() => (
-            <Router>
-                <Web3SignerProvider noFetch={true}>
-                    <Create />
-                </Web3SignerProvider>
-            </Router>
+            <Web3SignerProvider noFetch={true}>
+                <Router root={Create} />
+            </Web3SignerProvider>
         ));
 
         expect(setReceiveAmount).toHaveBeenCalledWith(BigNumber(38110));
@@ -81,11 +75,9 @@ describe("Create", () => {
 
     test("should update calculated value on fee change", async () => {
         render(() => (
-            <Router>
-                <Web3SignerProvider noFetch={true}>
-                    <Create />
-                </Web3SignerProvider>
-            </Router>
+            <Web3SignerProvider noFetch={true}>
+                <Router root={Create} />
+            </Web3SignerProvider>
         ));
 
         const updateConfig = () => {
@@ -136,11 +128,9 @@ describe("Create", () => {
         ${"max"}
     `("should set $extrema amount on click", async (extrema) => {
         render(() => (
-            <Router>
-                <Web3SignerProvider noFetch={true}>
-                    <Create />
-                </Web3SignerProvider>
-            </Router>
+            <Web3SignerProvider noFetch={true}>
+                <Router root={Create} />
+            </Web3SignerProvider>
         ));
 
         const setSendAmount = vi.spyOn(signals, "setSendAmount");

diff --git a/tests/components/SwapList.spec.tsx b/tests/components/SwapList.spec.tsx
@@ -20,14 +20,16 @@ describe("SwapList", () => {
         const {
             container: { firstChild: firstChild },
         } = render(() => (
-            <Router>
-                <SwapList
-                    swapsSignal={swapsSignal}
-                    setSwapSignal={() => {
-                        return undefined;
-                    }}
-                />
-            </Router>
+            <Router
+                root={() => (
+                    <SwapList
+                        swapsSignal={swapsSignal}
+                        setSwapSignal={() => {
+                            return undefined;
+                        }}
+                    />
+                )}
+            />
         ));
 
         const childNodes = [];