DisconnectApp.tsx raw
1 import { UnplugIcon } from "lucide-react";
2 import { useNavigate } from "react-router";
3 import {
4 AlertDialog,
5 AlertDialogAction,
6 AlertDialogCancel,
7 AlertDialogContent,
8 AlertDialogDescription,
9 AlertDialogFooter,
10 AlertDialogHeader,
11 AlertDialogTitle,
12 AlertDialogTrigger,
13 } from "src/components/ui/alert-dialog";
14 import { Button } from "src/components/ui/button";
15 import { SUBWALLET_APPSTORE_APP_ID } from "src/constants";
16 import { useDeleteApp } from "src/hooks/useDeleteApp";
17 import { App } from "src/types";
18
19 export function DisconnectApp({
20 app,
21 onClose,
22 }: {
23 app: App;
24 onClose: () => void;
25 }) {
26 const navigate = useNavigate();
27
28 const { deleteApp, isDeleting } = useDeleteApp(app, () => {
29 navigate(
30 app.metadata?.app_store_app_id !== SUBWALLET_APPSTORE_APP_ID
31 ? "/apps?tab=connected-apps"
32 : "/sub-wallets"
33 );
34 });
35
36 // Check if this is a sub-wallet with a lightning address
37 const isSubwallet =
38 app.metadata?.app_store_app_id === SUBWALLET_APPSTORE_APP_ID;
39 const hasLightningAddress = !!app.metadata?.lud16;
40
41 return (
42 <AlertDialog open>
43 <AlertDialogTrigger asChild>
44 <Button variant="outline">
45 <UnplugIcon className="size-4" /> Disconnect
46 </Button>
47 </AlertDialogTrigger>
48 <AlertDialogContent>
49 <AlertDialogHeader>
50 <AlertDialogTitle>
51 Are you sure you want to delete this connection?
52 </AlertDialogTitle>
53 <AlertDialogDescription>
54 Connected apps will no longer be able to use this connection.
55 {app.isolated && (
56 <>
57 {" "}
58 No funds will be lost during this process, the balance will
59 remain in your wallet.
60 </>
61 )}
62 {isSubwallet && hasLightningAddress && (
63 <p className="font-medium mt-4">
64 This sub-wallet has a lightning address ({app.metadata?.lud16})
65 that will also be deleted.
66 </p>
67 )}
68 </AlertDialogDescription>
69 </AlertDialogHeader>
70 <AlertDialogFooter>
71 <AlertDialogCancel onClick={onClose}>Cancel</AlertDialogCancel>
72 <AlertDialogAction onClick={deleteApp} disabled={isDeleting}>
73 Confirm
74 </AlertDialogAction>
75 </AlertDialogFooter>
76 </AlertDialogContent>
77 </AlertDialog>
78 );
79 }
80