LowReceivingCapacityAlert.tsx raw
1 import { AlertTriangleIcon } from "lucide-react";
2 import { Link } from "react-router";
3 import {
4 Alert,
5 AlertDescription,
6 AlertTitle,
7 } from "src/components/ui/alert.tsx";
8
9 export default function LowReceivingCapacityAlert() {
10 return (
11 <Alert variant="warning">
12 <AlertTriangleIcon className="h-4 w-4" />
13 <AlertTitle>Low receiving capacity</AlertTitle>
14 <AlertDescription className="inline">
15 You likely won't be able to receive payments until you{" "}
16 <Link className="underline" to="/wallet/send">
17 spend
18 </Link>
19 ,{" "}
20 <Link className="underline" to="/wallet/swap?type=out">
21 swap out funds
22 </Link>
23 , or{" "}
24 <Link className="underline" to="/channels/incoming">
25 increase your receiving capacity.
26 </Link>
27 </AlertDescription>
28 </Alert>
29 );
30 }
31