Merge remote-tracking branch 'origin/master' into feat/appcard-improv…

…ements
getAlby · Jul 11, 2024 · 0d2ea76 · 0d2ea76
2 parents e3d4f75 + 40e69a1
commit 0d2ea76
Show file tree

Hide file tree

Showing 21 changed files with 78 additions and 210 deletions.
diff --git a/alby/models.go b/alby/models.go
@@ -34,15 +34,19 @@ type AlbyLinkAccountRequest struct {
 	Renewal string `json:"renewal"`
 }
 
+type AlbyMeHub struct {
+	LatestVersion string `json:"latest_version"`
+}
 type AlbyMe struct {
-	Identifier       string `json:"identifier"`
-	NPub             string `json:"nostr_pubkey"`
-	LightningAddress string `json:"lightning_address"`
-	Email            string `json:"email"`
-	Name             string `json:"name"`
-	Avatar           string `json:"avatar"`
-	KeysendPubkey    string `json:"keysend_pubkey"`
-	SharedNode       bool   `json:"shared_node"`
+	Identifier       string    `json:"identifier"`
+	NPub             string    `json:"nostr_pubkey"`
+	LightningAddress string    `json:"lightning_address"`
+	Email            string    `json:"email"`
+	Name             string    `json:"name"`
+	Avatar           string    `json:"avatar"`
+	KeysendPubkey    string    `json:"keysend_pubkey"`
+	SharedNode       bool      `json:"shared_node"`
+	Hub              AlbyMeHub `json:"hub"`
 }
 
 type AlbyBalance struct {

diff --git a/api/api.go b/api/api.go
@@ -580,7 +580,6 @@ func (api *api) GetInfo(ctx context.Context) (*InfoResponse, error) {
 	info.AlbyAuthUrl = api.albyOAuthSvc.GetAuthUrl()
 	info.OAuthRedirect = !api.cfg.GetEnv().IsDefaultClientId()
 	info.Version = version.Tag
-	info.LatestVersion = version.GetLatestReleaseTag()
 	albyUserIdentifier, err := api.albyOAuthSvc.GetUserIdentifier()
 	if err != nil {
 		logger.Logger.WithError(err).Error("Failed to get alby user identifier")

diff --git a/api/models.go b/api/models.go
@@ -154,7 +154,6 @@ type InfoResponse struct {
 	AlbyUserIdentifier   string `json:"albyUserIdentifier"`
 	AlbyAccountConnected bool   `json:"albyAccountConnected"`
 	Version              string `json:"version"`
-	LatestVersion        string `json:"latestVersion"`
 	Network              string `json:"network"`
 }
 

diff --git a/frontend/src/assets/suggested-apps/bitcoin-connect.png b/frontend/src/assets/suggested-apps/bitcoin-connect.png
diff --git a/frontend/src/components/SidebarHint.tsx b/frontend/src/components/SidebarHint.tsx
@@ -49,6 +49,7 @@ function SidebarHint() {
   // User has funds to migrate
   if (
     hasChannelManagement &&
+    info?.backendType === "LDK" &&
     albyBalance &&
     albyBalance.sats * (1 - ALBY_SERVICE_FEE) >
       ALBY_MIN_BALANCE + 50000 /* accomodate for onchain fees */

diff --git a/frontend/src/components/SuggestedAppData.tsx b/frontend/src/components/SuggestedAppData.tsx
@@ -1,6 +1,5 @@
 import alby from "src/assets/suggested-apps/alby.png";
 import amethyst from "src/assets/suggested-apps/amethyst.png";
-import bc from "src/assets/suggested-apps/bitcoin-connect.png";
 import damus from "src/assets/suggested-apps/damus.png";
 import hablanews from "src/assets/suggested-apps/habla-news.png";
 import kiwi from "src/assets/suggested-apps/kiwi.png";
@@ -126,13 +125,6 @@ export const suggestedApps: SuggestedApp[] = [
     webLink: "https://lume.nu/",
     logo: lume,
   },
-  {
-    id: "bitcoin-connect",
-    title: "Bitcoin Connect",
-    description: "Connect to apps",
-    webLink: "https://bitcoin-connect.com/",
-    logo: bc,
-  },
   {
     id: "kiwi",
     title: "Kiwi",

diff --git a/frontend/src/components/layouts/AppLayout.tsx b/frontend/src/components/layouts/AppLayout.tsx
@@ -185,10 +185,9 @@ export default function AppLayout() {
 
   const upToDate =
     info?.version &&
-    info.latestVersion &&
+    albyMe?.hub.latest_version &&
     info.version.startsWith("v") &&
-    info.latestVersion.startsWith("v") &&
-    info.version.substring(1) >= info.latestVersion.substring(1);
+    info.version.substring(1) >= albyMe?.hub.latest_version;
 
   return (
     <>
@@ -224,7 +223,9 @@ export default function AppLayout() {
                           {upToDate ? (
                             <p>Alby Hub is up to date!</p>
                           ) : (
-                            <p>Alby Hub {info?.latestVersion} available!</p>
+                            <p>
+                              Alby Hub {albyMe?.hub.latest_version} available!
+                            </p>
                           )}
                         </TooltipContent>
                       </Tooltip>

diff --git a/frontend/src/components/ui/theme-provider.tsx b/frontend/src/components/ui/theme-provider.tsx
@@ -35,7 +35,8 @@ export function ThemeProvider({
   ...props
 }: ThemeProviderProps) {
   const [theme, setTheme] = useState<Theme>(() => {
-    return (localStorage.getItem(storageKey) as Theme) || defaultTheme;
+    const themeFromStorage = localStorage.getItem(storageKey) as Theme;
+    return Themes.includes(themeFromStorage) ? themeFromStorage : defaultTheme;
   });
 
   const [darkMode, setDarkMode] = useState<DarkMode>(() => {

diff --git a/frontend/src/lib/clipboard.ts b/frontend/src/lib/clipboard.ts
@@ -11,12 +11,15 @@ export async function copyToClipboard(content: string) {
       textArea.style.position = "absolute";
       textArea.style.opacity = "0";
       document.body.appendChild(textArea);
-      selectElement(textArea);
+      textArea.focus();
+      textArea.select();
+
       if (document.execCommand("copy")) {
         resolve(content);
       } else {
         reject();
       }
+
       textArea.remove();
     }
   });
@@ -31,13 +34,3 @@ export async function copyToClipboard(content: string) {
     });
   }
 }
-
-function selectElement(element: Element) {
-  const selection = window.getSelection();
-  if (selection) {
-    selection.removeAllRanges();
-    const range = document.createRange();
-    range.selectNode(element);
-    selection.addRange(range);
-  }
-}
diff --git a/frontend/src/screens/apps/AppCreated.tsx b/frontend/src/screens/apps/AppCreated.tsx
@@ -27,7 +27,6 @@ export default function AppCreated() {
   const queryParams = new URLSearchParams(search);
   const appId = queryParams.get("app") ?? "";
   const appstoreApp = suggestedApps.find((app) => app.id === appId);
-  console.info(appstoreApp, appId);
 
   const [timeout, setTimeout] = useState(false);
   const [isQRCodeVisible, setIsQRCodeVisible] = useState(false);

diff --git a/frontend/src/screens/channels/Channels.tsx b/frontend/src/screens/channels/Channels.tsx
@@ -363,9 +363,9 @@ export default function Channels() {
                 </DropdownMenuGroup>
               </DropdownMenuContent>
             </DropdownMenu>
-            {/* <Link to="/channels/new">
+            <Link to="/channels/outgoing">
               <Button>Open Channel</Button>
-            </Link> */}
+            </Link>
             <ExternalLink to="https://guides.getalby.com/user-guide/v/alby-account-and-browser-extension/alby-hub/liquidity/node-health">
               <TooltipProvider>
                 <Tooltip>

diff --git a/frontend/src/screens/channels/CurrentChannelOrder.tsx b/frontend/src/screens/channels/CurrentChannelOrder.tsx
@@ -356,6 +356,11 @@ function PayBitcoinChannelOrderTopup({ order }: { order: NewChannelOrder }) {
             Topup with your credit card or bank account
           </Button>
         </ExternalLink>
+        <Link to="/channels/incoming" className="w-full">
+          <Button className="w-full" variant="secondary">
+            Need receiving capacity?
+          </Button>
+        </Link>
       </div>
     </div>
   );

diff --git a/frontend/src/screens/channels/IncreaseOutgoingCapacity.tsx b/frontend/src/screens/channels/IncreaseOutgoingCapacity.tsx
@@ -1,4 +1,4 @@
-import { Box, ChevronDown, Zap } from "lucide-react";
+import { ChevronDown } from "lucide-react";
 import React, { FormEvent } from "react";
 import { Link, useNavigate } from "react-router-dom";
 import AppHeader from "src/components/AppHeader";
@@ -78,21 +78,13 @@ function NewChannelInternal({ network }: { network: Network }) {
     return _channelPeerSuggestions
       ? [
           ..._channelPeerSuggestions.filter(
-            (peer) =>
-              peer.paymentMethod !== "lightning" || peer.lspType !== "LSPS1"
+            (peer) => peer.paymentMethod !== "lightning"
           ),
           customOption,
         ]
       : undefined;
   }, [_channelPeerSuggestions, network]);
 
-  function setPaymentMethod(paymentMethod: "onchain" | "lightning") {
-    setOrder((current) => ({
-      ...current,
-      paymentMethod,
-    }));
-  }
-
   function setPublic(isPublic: boolean) {
     setOrder((current) => ({
       ...current,
@@ -131,21 +123,9 @@ function NewChannelInternal({ network }: { network: Network }) {
           host: selectedPeer.host,
         }));
       }
-      if (
-        selectedPeer.paymentMethod === "lightning" &&
-        order.paymentMethod === "lightning"
-      ) {
-        setOrder((current) => ({
-          ...current,
-          lspType: selectedPeer.lspType,
-          lspUrl: selectedPeer.lspUrl,
-        }));
-      }
     }
   }, [order.paymentMethod, selectedPeer]);
 
-  const selectedCardStyles = "border-primary border-2 font-medium";
-
   const [showAdvanced, setShowAdvanced] = React.useState(false);
 
   function onSubmit(e: FormEvent) {
@@ -219,6 +199,15 @@ function NewChannelInternal({ network }: { network: Network }) {
       <AppHeader
         title="Increase Spending Balance"
         description="Funds used to open a channel minus fees will be added to your spending balance"
+        contentRight={
+          <div className="flex items-end">
+            <Link to="/channels/incoming">
+              <Button className="w-full" variant="secondary">
+                Need receiving capacity?
+              </Button>
+            </Link>
+          </div>
+        }
       />
       <form
         onSubmit={onSubmit}
@@ -270,46 +259,10 @@ function NewChannelInternal({ network }: { network: Network }) {
         </div>
         {showAdvanced && (
           <>
-            <div className="grid gap-3">
-              <Label htmlFor="amount">Payment method</Label>
-              <div className="grid grid-cols-2 gap-3">
-                <Link
-                  to="#"
-                  onClick={() => setPaymentMethod("onchain")}
-                  className="flex-1"
-                >
-                  <div
-                    className={cn(
-                      "rounded-xl border bg-card text-card-foreground shadow p-5 flex flex-col items-center gap-3",
-                      order.paymentMethod === "onchain"
-                        ? selectedCardStyles
-                        : undefined
-                    )}
-                  >
-                    <Box className="w-4 h-4" />
-                    Onchain
-                  </div>
-                </Link>
-                <Link to="#" onClick={() => setPaymentMethod("lightning")}>
-                  <div
-                    className={cn(
-                      "rounded-xl border bg-card text-card-foreground shadow p-5 flex flex-col items-center gap-3",
-                      order.paymentMethod === "lightning"
-                        ? selectedCardStyles
-                        : undefined
-                    )}
-                  >
-                    <Zap className="w-4 h-4" />
-                    Lightning
-                  </div>
-                </Link>
-              </div>
-            </div>
             <div className="flex flex-col gap-3">
               {selectedPeer &&
-                (selectedPeer.paymentMethod === "lightning" ||
-                  (order.paymentMethod === "onchain" &&
-                    selectedPeer.pubkey === order.pubkey)) && (
+                order.paymentMethod === "onchain" &&
+                selectedPeer.pubkey === order.pubkey && (
                   <div className="grid gap-1.5">
                     <Label>Channel peer</Label>
                     <Select
@@ -378,9 +331,6 @@ function NewChannelInternal({ network }: { network: Network }) {
                 showCustomOptions={selectedPeer?.name === "Custom"}
               />
             )}
-            {order.paymentMethod === "lightning" && (
-              <NewChannelLightning order={order} setOrder={setOrder} />
-            )}
 
             <div className="mt-2 flex items-top space-x-2">
               <Checkbox
@@ -421,18 +371,6 @@ function NewChannelInternal({ network }: { network: Network }) {
   );
 }
 
-type NewChannelLightningProps = {
-  order: Partial<NewChannelOrder>;
-  setOrder(order: Partial<NewChannelOrder>): void;
-};
-
-function NewChannelLightning(props: NewChannelLightningProps) {
-  if (props.order.paymentMethod !== "lightning") {
-    throw new Error("unexpected payment method");
-  }
-  return null;
-}
-
 type NewChannelOnchainProps = {
   order: Partial<NewChannelOrder>;
   setOrder: React.Dispatch<React.SetStateAction<Partial<NewChannelOrder>>>;

diff --git a/frontend/src/screens/onboarding/MigrateAlbyFunds.tsx b/frontend/src/screens/onboarding/MigrateAlbyFunds.tsx
@@ -227,9 +227,6 @@ export default function MigrateAlbyFunds() {
             >
               Migrate Funds and Open Channel
             </LoadingButton>
-            <Link to="/channels">
-              <Button variant="link">Explore Other Options</Button>
-            </Link>
           </form>
         </>
       ) : (

diff --git a/frontend/src/screens/wallet/OnboardingChecklist.tsx b/frontend/src/screens/wallet/OnboardingChecklist.tsx
@@ -7,6 +7,8 @@ import {
   CardHeader,
   CardTitle,
 } from "src/components/ui/card";
+import { ALBY_MIN_BALANCE, ALBY_SERVICE_FEE } from "src/constants";
+import { useAlbyBalance } from "src/hooks/useAlbyBalance";
 import { useAlbyMe } from "src/hooks/useAlbyMe";
 import { useApps } from "src/hooks/useApps";
 import { useChannels } from "src/hooks/useChannels";
@@ -16,7 +18,7 @@ import { useTransactions } from "src/hooks/useTransactions";
 import { cn } from "src/lib/utils";
 
 function OnboardingChecklist() {
-  // const { data: albyBalance } = useAlbyBalance();
+  const { data: albyBalance } = useAlbyBalance();
   const { data: albyMe } = useAlbyMe();
   const { data: apps } = useApps();
   const { data: channels } = useChannels();
@@ -30,19 +32,13 @@ function OnboardingChecklist() {
     !channels ||
     !info ||
     !nodeConnectionInfo ||
-    !transactions;
+    !transactions ||
+    !albyBalance;
 
   if (isLoading) {
     return;
   }
 
-  /*const hasAlbyBalance =
-    hasChannelManagement &&
-    albyBalance &&
-    albyBalance.sats * (1 - ALBY_SERVICE_FEE) >
-      ALBY_MIN_BALANCE + 50000; // accommodate for on-chain fees
-      */
-
   const isLinked =
     albyMe &&
     nodeConnectionInfo &&
@@ -68,13 +64,21 @@ function OnboardingChecklist() {
     return;
   }
 
+  const canMigrateAlbyFundsToNewChannel =
+    hasChannelManagement &&
+    info.backendType === "LDK" &&
+    albyBalance.sats * (1 - ALBY_SERVICE_FEE) >
+      ALBY_MIN_BALANCE + 50000; /* accomodate for onchain fees */
+
   const checklistItems = [
     {
       title: "Open your first channel",
       description:
         "Establish a new Lightning channel to enable fast and low-fee Bitcoin transactions.",
       checked: hasChannel,
-      to: "/channels",
+      to: canMigrateAlbyFundsToNewChannel
+        ? "/onboarding/lightning/migrate-alby"
+        : "/channels",
     },
     {
       title: "Send or receive your first payment",