From 34a5bc882f58f208d837b805df9ce1ce401bb99e Mon Sep 17 00:00:00 2001
From: Roland <33993199+rolznz@users.noreply.github.com>
Date: Fri, 31 Jan 2025 12:08:18 +0700
Subject: [PATCH] fix: new connection deeplink flow (#1009)
* fix: use browser router in http mode
* fix: update links to not use hash router
* fix: add redirect from hash router url
* fix: return nostrWalletConnectUrl in nwc connection success event and message
* fix: include relay url and wallet pubkey in app created messages instead of full NWC url
* chore: remove broken check
---
api/api.go | 2 ++
api/models.go | 2 ++
frontend/src/App.tsx | 10 ++++++++--
frontend/src/components/SuggestedAppData.tsx | 8 ++++----
frontend/src/main.tsx | 19 +++++++++++++------
frontend/src/screens/apps/AppCreated.tsx | 15 +++++++++------
frontend/src/types.ts | 2 ++
7 files changed, 40 insertions(+), 18 deletions(-)
diff --git a/api/api.go b/api/api.go
index 84e09d47b..77d4ac760 100644
--- a/api/api.go
+++ b/api/api.go
@@ -104,6 +104,8 @@ func (api *api) CreateApp(createAppRequest *CreateAppRequest) (*CreateAppRespons
responseBody.Name = createAppRequest.Name
responseBody.Pubkey = app.AppPubkey
responseBody.PairingSecret = pairingSecretKey
+ responseBody.WalletPubkey = *app.WalletPubkey
+ responseBody.RelayUrl = relayUrl
lightningAddress, err := api.albyOAuthSvc.GetLightningAddress()
if err != nil {
diff --git a/api/models.go b/api/models.go
index 8f68613ce..f0d510ac9 100644
--- a/api/models.go
+++ b/api/models.go
@@ -153,6 +153,8 @@ type CreateAppResponse struct {
PairingUri string `json:"pairingUri"`
PairingSecret string `json:"pairingSecretKey"`
Pubkey string `json:"pairingPublicKey"`
+ RelayUrl string `json:"relayUrl"`
+ WalletPubkey string `json:"walletPubkey"`
Id uint `json:"id"`
Name string `json:"name"`
ReturnTo string `json:"returnTo"`
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index a6b4094eb..23f44e30b 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,4 +1,8 @@
-import { RouterProvider, createHashRouter } from "react-router-dom";
+import {
+ RouterProvider,
+ createBrowserRouter,
+ createHashRouter,
+} from "react-router-dom";
import { ThemeProvider } from "src/components/ui/theme-provider";
@@ -6,8 +10,10 @@ import { Toaster } from "src/components/ui/toaster";
import { TouchProvider } from "src/components/ui/tooltip";
import { useInfo } from "src/hooks/useInfo";
import routes from "src/routes.tsx";
+import { isHttpMode } from "src/utils/isHttpMode";
-const router = createHashRouter(routes);
+const createRouterFunc = isHttpMode() ? createBrowserRouter : createHashRouter;
+const router = createRouterFunc(routes);
function App() {
const { data: info } = useInfo();
diff --git a/frontend/src/components/SuggestedAppData.tsx b/frontend/src/components/SuggestedAppData.tsx
index acdc93948..0c695059b 100644
--- a/frontend/src/components/SuggestedAppData.tsx
+++ b/frontend/src/components/SuggestedAppData.tsx
@@ -429,7 +429,7 @@ export const suggestedApps: SuggestedApp[] = [
4. Click{" "}
Connect to BTCPay Server
@@ -506,7 +506,7 @@ export const suggestedApps: SuggestedApp[] = [
4. Click{" "}
Connect to LNbits
@@ -585,7 +585,7 @@ export const suggestedApps: SuggestedApp[] = [
4. Click{" "}
Connect to Coracle
@@ -657,7 +657,7 @@ export const suggestedApps: SuggestedApp[] = [
3. Click{" "}
Connect to Nostter
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
index a5485e4be..cf3ea5dcb 100644
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -1,11 +1,18 @@
import React from "react";
import ReactDOM from "react-dom/client";
import App from "src/App.tsx";
-import "src/index.css";
import "src/fonts.css";
+import "src/index.css";
+import { isHttpMode } from "src/utils/isHttpMode";
-ReactDOM.createRoot(document.getElementById("root")!).render(
-
-
-
-);
+// redirect hash router links to browser router links
+// TODO: remove after 2026-01-01
+if (isHttpMode() && window.location.href.indexOf("/#/") > -1) {
+ window.location.href = window.location.href.replace("/#/", "/");
+} else {
+ ReactDOM.createRoot(document.getElementById("root")!).render(
+
+
+
+ );
+}
diff --git a/frontend/src/screens/apps/AppCreated.tsx b/frontend/src/screens/apps/AppCreated.tsx
index e329c9062..2d90c7aad 100644
--- a/frontend/src/screens/apps/AppCreated.tsx
+++ b/frontend/src/screens/apps/AppCreated.tsx
@@ -56,12 +56,14 @@ function AppCreatedInternal() {
}, [app?.lastEventAt, navigate, toast]);
useEffect(() => {
- if (appstoreApp) {
- return;
- }
// dispatch a success event which can be listened to by the opener or by the app that embedded the webview
// this gives those apps the chance to know the user has enabled the connection
- const nwcEvent = new CustomEvent("nwc:success", { detail: {} });
+ const nwcEvent = new CustomEvent("nwc:success", {
+ detail: {
+ relayUrl: createAppResponse.relayUrl,
+ walletPubkey: createAppResponse.walletPubkey,
+ },
+ });
window.dispatchEvent(nwcEvent);
// notify the opener of the successful connection
@@ -69,12 +71,13 @@ function AppCreatedInternal() {
window.opener.postMessage(
{
type: "nwc:success",
- payload: { success: true },
+ relayUrl: createAppResponse.relayUrl,
+ walletPubkey: createAppResponse.walletPubkey,
},
"*"
);
}
- }, [appstoreApp]);
+ }, [createAppResponse.relayUrl, createAppResponse.walletPubkey]);
if (!createAppResponse) {
return ;
diff --git a/frontend/src/types.ts b/frontend/src/types.ts
index 5a103f36f..c10953be9 100644
--- a/frontend/src/types.ts
+++ b/frontend/src/types.ts
@@ -201,6 +201,8 @@ export interface CreateAppResponse {
pairingUri: string;
pairingPublicKey: string;
pairingSecretKey: string;
+ relayUrl: string;
+ walletPubkey: string;
returnTo: string;
}