Merge pull request #29 from celo-org/18-send-to-minipay

feat: send to minipay

packages/react-app/components/Header.tsx

@@ -56,11 +56,17 @@ export default function Header() {
                                 </div>
                                 <div className="hidden sm:ml-6 sm:flex sm:space-x-8">
                                     <a
-                                        href="#"
+                                        href="/"
                                         className="inline-flex items-center border-b-2 border-black px-1 pt-1 text-sm font-medium text-gray-900"
                                     >
                                         Send cUSD
                                     </a>
+                                    <a
+                                        href="/noncusd"
+                                        className="inline-flex items-center border-black px-1 pt-1 text-sm font-medium text-gray-900"
+                                    >
+                                        nonCUSD
+                                    </a>
                                 </div>
                             </div>
                             <div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
@@ -85,6 +91,13 @@ export default function Header() {
                             >
                                 Send cUSD
                             </Disclosure.Button>
+                            <Disclosure.Button
+                                as="a"
+                                href="/noncusd"
+                                className="block border-l-4 border-black py-2 pl-3 pr-4 text-base font-medium text-black"
+                            >
+                                nonCUSD
+                            </Disclosure.Button>
                             {/* Add here your custom menu elements */}
                         </div>
                     </Disclosure.Panel>

packages/react-app/pages/api/socialconnect/lookup.ts

@@ -65,7 +65,8 @@ export default async function lookup(
                  * But SocialConnect allows looking up under other issuers just need their address.
                  */
                 let issuerAddresses = [
-                    "0x7888612486844Bb9BE598668081c59A9f7367FBc",
+                    // "0x7888612486844Bb9BE598668081c59A9f7367FBc",
+                    "0xDF7d8B197EB130cF68809730b0D41999A830c4d7",
                 ];
 
                 let lookupResponse: LookupResponse = await issuer.lookup(

packages/react-app/pages/api/socialconnect/register.ts

@@ -20,7 +20,7 @@ export default async function register(
     switch (req.method) {
         case "POST":
             try {
-                let { identifier, account } = JSON.parse(req.body);
+                let { identifier, account } = req.body;
 
                 let wallet = new Wallet(
                     process.env.ISSUER_PRIVATE_KEY as string,

packages/react-app/pages/index.tsx

@@ -1,16 +1,15 @@
 import { useState } from "react";
 import { encodeFunctionData, isAddress, parseEther } from "viem";
 import { useAccount, usePublicClient, useWalletClient } from "wagmi";
-import FederatedAttestationsAbi from "../abi/FederatedAttestation";
 import stableTokenAbi from "../abi/StableToken";
 import toast from "react-hot-toast";
 import type { LookupResponse } from "./api/socialconnect/lookup";
 import { FA_PROXY_ADDRESS, STABLE_TOKEN_ADDRESS } from "@/utils/constants";
 import { celo, celoAlfajores } from "viem/chains";
 import Button from "@/components/Button";
 
-// const ISSUER_ADDRESS = "0xDF7d8B197EB130cF68809730b0D41999A830c4d7";
-const ISSUER_ADDRESS = "0x7888612486844Bb9BE598668081c59A9f7367FBc";
+const ISSUER_ADDRESS = "0xDF7d8B197EB130cF68809730b0D41999A830c4d7";
+// const ISSUER_ADDRESS = "0x7888612486844Bb9BE598668081c59A9f7367FBc";
 
 export const E164_REGEX = /^\+[1-9][0-9]{1,14}$/;
 
@@ -59,26 +58,16 @@ export default function Home() {
                 id: resolvingToast,
                 duration: 2000,
             });
-
-            console.error(lookupResponse.error);
         } else {
-            let { obfuscatedId } = lookupResponse;
+            let { accounts, obfuscatedId } = lookupResponse;
 
             try {
-                let resolvedAddress = (await publicClient.readContract({
-                    address: FA_PROXY_ADDRESS,
-                    abi: FederatedAttestationsAbi,
-                    functionName: "lookupAttestations",
-                    args: [obfuscatedId, [ISSUER_ADDRESS]],
-                })) as string[][];
-
-                if (resolvedAddress[1].length) {
+                if (accounts.length) {
                     toast.success("Address found", { id: resolvingToast });
+                    setResolvedReceiverAddress(accounts[0]);
                 } else {
                     toast.error("No address found", { id: resolvingToast });
                 }
-
-                setResolvedReceiverAddress(resolvedAddress[1][0]);
             } catch (error: any) {
                 if ("message" in error) {
                     toast.error(error.message, {
@@ -89,6 +78,7 @@ export default function Home() {
                 }
             } finally {
                 setResolvingAddress(false);
+                setIdentifier("");
             }
         }
     }

packages/react-app/pages/noncusd.tsx

@@ -0,0 +1,55 @@
+import Button from "@/components/Button";
+import { useState } from "react";
+import toast from "react-hot-toast";
+import { parseEther } from "viem";
+import { useAccount, usePublicClient, useWalletClient } from "wagmi";
+
+export default function nonCUSD() {
+    const publicClient = usePublicClient();
+    const { isConnected } = useAccount();
+    const { data: walletClient } = useWalletClient();
+    const [transferValue, setTransferValue] = useState("");
+    const [receiver, setReceiver] = useState<string>("");
+
+    async function sendCelo() {
+        try {
+            await walletClient?.sendTransaction({
+                to: receiver as `0x${string}`,
+                value: parseEther(transferValue),
+            });
+        } catch (e) {
+            toast.error("Something went wrong!");
+        }
+    }
+
+    return (
+        <div className="w-screen flex flex-col justify-center items-center gap-y-4">
+            <p>Send non-CUSD assets</p>
+            {isConnected ? (
+                <>
+                    <input
+                        className="text-[48px] bg-gypsum outline-none text-center"
+                        type="number"
+                        value={transferValue}
+                        onChange={({ target }) =>
+                            setTransferValue(target.value)
+                        }
+                        placeholder="0"
+                    />
+                    <p className="font-bold">Celo</p>
+                    <div className="flex items-center gap-x-4">
+                        <span>To:</span>
+                        <input
+                            value={receiver}
+                            onChange={({ target }) => setReceiver(target.value)}
+                            className="text-[16px] w-[250px] bg-gypsum border-b-2 outline-none"
+                        />
+                    </div>
+                    <Button onClick={sendCelo} title="Send" />
+                </>
+            ) : (
+                <p>Please connect wallet first</p>
+            )}
+        </div>
+    );
+}

packages/react-app/utils/SocialConnect.ts

@@ -73,12 +73,16 @@ export class SocialConnectIssuer {
                 )
             ).wait();
 
+            console.log(approvalTxReceipt);
+
             const odisPaymentTxReceipt = (
                 await this.odisPaymentsContract.payInCUSD(
                     this.wallet.address,
                     ONE_CENT_CUSD // TODO we should increase by more
                 )
             ).wait();
+
+            console.log(odisPaymentTxReceipt);
         }
     }
 
@@ -152,12 +156,13 @@ export class SocialConnectIssuer {
             plaintextId,
             identifierType
         );
+        console.log(obfuscatedId);
         const attestations =
             await this.federatedAttestationsContract.lookupAttestations(
                 obfuscatedId,
                 issuerAddresses
             );
-
+        console.log(attestations);
         return {
             accounts: attestations.accounts as string[], // TODO typesafety
             obfuscatedId,