feat: remove dependency on webhooks. refactor looking up the current …

…user. create wallet as part of createUser callback of next-auth.

@types/graphql.d.ts

@@ -5,6 +5,7 @@ declare module '*/customer.graphql' {
   export const CreateCustomer: DocumentNode;
 export const CreateCustomerWallet: DocumentNode;
 export const GetCustomerWallet: DocumentNode;
+export const GetCustomerTreasury: DocumentNode;
 
   export default defaultDocument;
 }

README.md

@@ -74,8 +74,6 @@ HOLAPLEX_API_ENDPOINT=https://api.holaplex.com/graphql
 # https://docs.holaplex.dev/api
 HOLAPLEX_AUTH_TOKEN=
 # https://docs.holaplex.dev/hub/For%20Developers/webhooks-overview
-HOLAPLEX_WEBHOOK_SECRET=
-# https://docs.holaplex.dev/hub/Guides/creating-a-project
 HOLAPLEX_PROJECT_ID=
 # https://docs.holaplex.dev/hub/Guides/creating-drops
 HOLAPLEX_DROP_ID=

docker-compose.yaml

@@ -7,6 +7,6 @@ services:
     ports:
       - 5432:5432
     volumes: 
-      - hub-starter-mint:/var/lib/postgresql/data
+      - hub-starter:/var/lib/postgresql/data
 volumes:
-  hub-starter-mint:
+  hub-starter:

package.json

@@ -26,23 +26,23 @@
     "@next/font": "13.1.6",
     "@prisma/client": "^4.9.0",
     "@types/node": "18.13.0",
-    "@types/react-dom": "18.0.10",
     "@types/react": "18.0.27",
+    "@types/react-dom": "18.0.10",
+    "async-wait-until": "^2.0.12",
     "clsx": "^1.2.1",
     "graphql": "^16.6.0",
     "http-proxy": "^1.18.1",
     "install": "^0.13.0",
     "micro": "^10.0.1",
+    "next": "13.1.6",
     "next-auth": "^4.19.2",
     "next-plugin-graphql": "^0.0.2",
-    "next": "13.1.6",
     "npm": "^9.6.1",
     "prisma": "^4.9.0",
     "ramda": "^0.28.0",
-    "react-dom": "18.2.0",
-    "react-spinners": "^0.13.8",
     "react": "^18.2.0",
-    "svix": "^0.81.0"
+    "react-dom": "18.2.0",
+    "react-spinners": "^0.13.8"
   },
   "devDependencies": {
     "@graphql-codegen/cli": "^2.16.4",

src/app/App.tsx

@@ -4,6 +4,7 @@ import { ApolloProvider } from "@apollo/client";
 import api from "@/modules/api";
 import MeProvider from "@/providers/MeProvider";
 import { User } from "@/graphql.types";
+
 export default function App({
   children,
   me,
@@ -13,7 +14,7 @@ export default function App({
 }) {
   return (
     <ApolloProvider client={api}>
-      <MeProvider hydrate={me}>{children}</MeProvider>
+      <MeProvider me={me}>{children}</MeProvider>
     </ApolloProvider>
   );
 }

src/app/Home.tsx

@@ -1,7 +1,7 @@
 "use client";
 import Image from "next/image";
-import { useState } from "react";
-import { Drop as DropType, Maybe, Collection, Holder } from "@/graphql.types";
+import { useMemo } from "react";
+import { Holder } from "@/graphql.types";
 import { shorten } from "../modules/wallet";
 import { MintDrop } from "@/mutations/mint.graphql";
 import { useApolloClient, useMutation, useQuery } from "@apollo/client";
@@ -27,9 +27,11 @@ export default function Home({ session }: HomeProps) {
   const dropQuery = useQuery(GetDrop);
   const collection = dropQuery.data?.drop.collection;
   const metadataJson = collection?.metadataJson;
-  const holder = collection?.holders?.find(
-    (holder: Holder) => holder.address === me?.wallet?.address
-  );
+  const holder = useMemo(() => {
+    return collection?.holders?.find(
+      (holder: Holder) => holder.address === me?.wallet?.address
+    );
+  }, [collection?.holders, me?.wallet]);
   const owns = pipe(isNil, not)(holder);
   const [mint, { loading }] = useMutation<MintData>(MintDrop, {
     awaitRefetchQueries: true,
@@ -79,11 +81,21 @@ export default function Home({ session }: HomeProps) {
           {dropQuery.loading ? (
             <div className="w-full aspect-square rounded-lg bg-contrast animate-pulse" />
           ) : (
-            <img
-              src={metadataJson?.image as string}
-              alt={metadataJson?.name as string}
-              className="w-full object-contain rounded-lg"
-            />
+            <div className="relative w-full aspect-square rounded-log overflow-hidden flex justify-center items-center">
+              <BounceLoader
+                className={clsx(
+                  "z-10 transition",
+                  loading ? "opacity-100" : "opacity-0"
+                )}
+                color="#fff"
+                size={80}
+              />
+              <img
+                src={metadataJson?.image as string}
+                alt={metadataJson?.name as string}
+                className="absolute top-0 left-0 right-0 bottom-0 object-cover"
+              />
+            </div>
           )}
         </div>
         <div className="col-span-12 md:col-span-6">
@@ -129,19 +141,10 @@ export default function Home({ session }: HomeProps) {
                   />
 
                   <div className="flex flex-col gap-1 justify-between">
-                    {me?.wallet ? (
-                      <>
-                        <span className="text-gray-300 text-xs">
-                          Wallet connected
-                        </span>
-                        <span>{shorten(me?.wallet?.address as string)}</span>
-                      </>
-                    ) : (
-                      <>
-                        <div className="h-4 w-24 rounded-md bg-contrast animate-pulse" />
-                        <div className="h-6 w-16 rounded-md bg-contrast animate-pulse" />
-                      </>
-                    )}
+                    <span className="text-gray-300 text-xs">
+                      Wallet connected
+                    </span>
+                    <span>{shorten(me?.wallet?.address as string)}</span>
                   </div>
                 </div>
                 {owns ? (