damus.io

damus.io website
git clone git://jb55.com/damus.io
Log | Files | Refs | README | LICENSE

Step2DamusIOSVerification.tsx (3106B)

      1 import { Sparkles } from "lucide-react";
      2 import { Button } from "@/components/ui/Button";
      3 import { useIntl } from "react-intl";
      4 import Link from "next/link";
      5 import Image from "next/image";
      6 import { useEffect, useState } from "react";
      7 import { QRCodeSVG } from 'qrcode.react';
      8 import { AccountInfo, Profile, getProfile, getPurpleAccountInfo } from "@/utils/PurpleUtils";
      9 import { LNCheckout } from "./Types";
     10 
     11 export interface Step2DamusIOSVerificationProps {
     12   lnCheckout: LNCheckout
     13   setLNCheckout: (checkout: LNCheckout) => void
     14   pubkey: string | null,
     15   setPubkey: (pubkey: string | null) => void
     16   profile: Profile | undefined | null
     17   setProfile: (profile: Profile | undefined | null) => void
     18   setError: (error: string) => void
     19 }
     20 
     21 export function Step2DamusIOSVerification(props: Step2DamusIOSVerificationProps) {
     22   const intl = useIntl()
     23   const [existingAccountInfo, setExistingAccountInfo] = useState<AccountInfo | null | undefined>(undefined)  // The account info fetched from the server
     24   
     25   const step1Done = props.lnCheckout?.product_template_name != null
     26   const step2Done = props.lnCheckout?.verified_pubkey != null
     27 
     28   // MARK: - Functions
     29 
     30   const fetchProfile = async () => {
     31     if (!props.pubkey) {
     32       return
     33     }
     34     try {
     35       const profile = await getProfile(props.pubkey)
     36       props.setProfile(profile)
     37     }
     38     catch (e) {
     39       console.error(e)
     40       props.setError("Failed to get profile info from the relay. Please wait a few minutes and refresh the page. If the problem persists, please contact support.")
     41     }
     42   }
     43 
     44   const fetchAccountInfo = async () => {
     45     if (!props.pubkey) {
     46       setExistingAccountInfo(undefined)
     47       return
     48     }
     49     try {
     50       const accountInfo = await getPurpleAccountInfo(props.pubkey)
     51       setExistingAccountInfo(accountInfo)
     52     }
     53     catch (e) {
     54       console.error(e)
     55       props.setError("Failed to get account info from our servers. Please wait a few minutes and refresh the page. If the problem persists, please contact support.")
     56     }
     57   }
     58 
     59   // MARK: - Effects and hooks
     60 
     61   // Load the profile when the pubkey changes
     62   useEffect(() => {
     63     if (props.pubkey) {
     64       fetchProfile()
     65       fetchAccountInfo()
     66     }
     67   }, [props.pubkey])
     68 
     69   // MARK: - Render
     70 
     71   return (<>
     72     {props.lnCheckout && !step2Done && <>
     73       <QRCodeSVG value={"damus:purple:verify?id=" + props.lnCheckout.id} className="mt-6 w-[300px] h-[300px] max-w-full max-h-full mx-auto mb-6" />
     74       <Link href={"damus:purple:verify?id=" + props.lnCheckout.id} className="w-full md:w-auto opacity-70 hover:opacity-100 transition">
     75         <Button variant="link" className="w-full text-sm">
     76           {intl.formatMessage({ id: "purple.checkout.open-in-app", defaultMessage: "Open in Damus" })}
     77         </Button>
     78       </Link>
     79       <div className="text-white/40 text-xs text-center mt-4 mb-6">
     80         {/* TODO: Localize later */}
     81         Issues with this step? Please ensure you are running the latest Damus iOS version — or <Link href="mailto:support@damus.io" className="text-damuspink-500 underline">contact us</Link>
     82       </div>
     83     </>
     84     }
     85   </>)
     86 }